Contents
はじめに
こんばんは、プログラミングスクールに通いながら、未経験でITエンジニア転職を目指しているごんにんごんです。
先日、初めて模写コーディングなるものに挑戦してみました。
そのときの所感や模写コーディングのやり方は、以下記事をご覧ください。
そして、1日11時間のスクールの合間を見つけ、模写コーディングの第2回をやってみたので、その結果を…
CafeのHomePage
どうでしょう、HTML/CSS勉強歴の浅い私でも、こんな素敵なページが作れるんだと驚きました。
…実は、自力で一から要素を組み立てて作ったのではなく、こちら▼の動画(約1時間半)を倣って作ってみたのです。
この動画、レイアウトの構成から、要素ひとつひとつの記述まで、丁寧に指導してくれるので、初めて模写コーディングやられる方にはおすすめです。
「コードを見よう見まねで書いたら、そら同じ出来になるわい」とツッコミがあると思いますが、私にとって効果は大きかったです。
私の所属しているプログラミングクールでは、HTML/CSSに関する実践がほとんどありません。RailsとJavaScriptを使ったWebアプリケーションの実装課題を行っているのですが、予めViewファイルは配布され、サーバーサイドの構築メインで進んでいきます。
そのため、模写コーディングをやることで、自分の知らない書き方を学べたり、HTML/CSSのレイアウトを考えるプロセスを手を動かしながら体験できるので、少なからず経験値になります。成功体験!!!
次回の模写コーディングでは、極力自分の力で、作品を作り上げたいと考えてます。目標 : 〜今週日曜まで
前置きが長くなりましたが、ここから本題です。私が模写コーディングを始めたのは、以下2つの理由からでした。
❶ HTMLCSSへの理解を深めまくる
❷ ポートフォリオの実績として掲載するプログラミングスクールの転職カリキュラムで、未経験からエンジニアに転職するならば、書類選考の段階で経験者と競い合うことになるので、差をつけるために実績を積んでポートフォリオを作り上げようといったことを言ってたこともあり、特に❷が模写コーディングに取り組む原動力になっているのです。
ただ、これまで営業・製品開発しか経験のない私は、そもそもポートフォリオが何者なのか掴めていません。
- ポートフォリオは転職活動でどう使われているんだろう??
- これから模写コーディングを続けていくとして、どのレベルまで必要なんだろう??
などなど、時間を作って挑戦するからには、理解して、目標を定めたいと思ったので調べてみました。
エンジニアがポートフォリオを作る理由
ポートフォリオとは一言で言うと、自分の技術力を表した資料と理解してます。
ITエンジニア転職の面接(書類選考も?)では、履歴書や職務経歴書に加えてポートフォリオを求められるようですね。
さらに、ポートフォリオは企業側、応募側双方にメリットがあるとのことです。
企業側のメリット
- ポートフォリオを見れば、この人がどの程度やれるのかある程度わかる。
- ポートフォリオのURLにアクセスするだけで、実力をチェックできる。
応募側のメリット
- 一度ポートフォリオを作れば、他の企業にも引用できて効率的。
- ポートフォリオの内容次第で、独自性を伝えられる。
エンジニア未経験転職のポートフォリオとは
私のようなITエンジニア未経験者は、どのようなポートフォリオを作ればよいのでしょうか。
そこで、hoshilogさんの初心者がやりがちなやってはいけないポートフォリオを参考にすることにします。
1. 凝った演出を作ってしまいがち。
「面接官」が見るページだから、ちゃんと作らなきゃ!と意気込んでしまう気持ち、すごくわかります。
レスポンシブデザインに憧れて、入れてみたいなと思っています。
しかし、HTML/CSSの学習に充てられる時間は、1日11時間のスクールが終わった後、もしくは土日しかありません。
さらに最終課題やオリジナルアプリ制作が控えているので、現実的に大きく時間は割けないでしょう…
また、もし演出を実現できたとしても、、、
- 実装した演出が、「ユーザーのストレス」になっているかもしれない
と書かれてましたが、これはすごく刺さりました。確かに実務経験が無いので、Webページを見るユーザーの立場・視点がわからないのは、その通りです。分からないなりに、ユーザー視点を意識しなきゃですね。
2. 見づらい、レイアウト崩れ(スマホ/タブレット)
ポートフォリオがちゃんとPCで表示されることを確認して提出したけど、面接官がタブレットで確認したところレイアウトがバラバラになっちゃった。
こういうことが起こるようです。カリキュラムで学んだメディアクエリとブレークポイントを、wordpressのポートフォリオサイトでも実装することを忘れないようにします。
やってはいけないを踏まえて、私のポートフォリオの方針
ユーザー視点でシンプルに実績を見せる
- 自分がこの記事を読んだとき、直感的に操作できるか : ユーザビリティ
- 不必要なリンクは貼っていないか : アクセシビリティ
- 自分の言葉で話せる実績を上から順に2〜3つ載せる
発信力をアピールする
面接では7,8割の確率でアウトプットはしているか?という質問があるそうです。
口頭で答える且つ私のアウトプットをポートフォリオで見せる。
私のアウトプット
- twitter プログラミングスクールの学びを1日平均7件(30日間で＊＊件発信)
- wordpress 記事更新を週２〜3件(30日間で＊＊件発信)
まとめ
ポートフォリオの骨子が少しだけ固まった気がします。
「プレゼン資料の見た目調整に時間をかけすぎて、中身がすっかすか」という前職の苦い経験に似ていると思うので、シンプルだけど中身を充実できるよう、引き続き取り組んでいきます!!!
ではでは。