駆け出しエンジニアのためのポートフォリオ戦略
「ひまじんプログラマーが始まりました今日もまさか始まるとは本当に思ってたすいません本当に思ってたすいませんはいというわけでこのラジオは駆け出し違うわ中級エンジニアと駆け出しエンジニアが送る駆け出しエンジニアをキャリアアップさせようとするラジオになってますややこしいややこしいちょっとなんか文言変えた方がいいかもしれないはいはいというわけで今日はなんかじゅんぺいくんが違うはい自己紹介だはいはい自己紹介でしたのりですかいちですじゅんぺいですどういう流れ」
「よろしくお願いしますはい、じゃあどうぞお悩み相談のオーナーということで僕がまだエンジニア成り立てということで今何をしてるかっていうところでざっくり言うとポートフォリオ作りに今重きを置いてるんですねで、本当に有名サイトの真似みたいな感じで一応作ろうかな」
「感じなんですけどただそのポートフォリオ作りをするっていう時にそもそもなんで作った方がいいのか良くないのかどのレベルのものを作ればいいのかやっぱりまだわからないんですねあんまりクリアじゃないのでそこらへんをのりさんにちょっと」
「見てると思うポートフォリオ先輩そうですね採用とかやってるんで僕死ぬほどポートフォリオ見てきてるんですよマジでさ僕とかだとポートフォリオなしで就職してるんでマジでもうポートフォリオ作る機会ないです多分もうって言っちゃったからそのまま文章に繋げちゃったじゃんだからすごいいいなと思っていい話してあげてくださいよポートフォリオについてじゃあ」
「まずちょっとそのポートフォリオ何に使うためのポートフォリオですかなんかこうやっぱり後々転職したいとかってやっぱり考えてるんですけどそうなった時にもちろん必要それ以前にまずは今このSESで派遣されるにあたって相手会社から引き抜いてもらえるように作ってるっていう状況どっちかというと」
「作らされてるにちょっと近いような状況なんでなんでなんで現場に出るためにポートフォリオあった方が有利だからそこでおっと言わせるものを作りたいということですね同じ立場の人間が今僕がサーバーサイドでやってるんですけど10月から始まってそのメンツが今16人いるんですよその中で現状の要は」
「スキルシート、履歴書みたいなのが結構みんな同じようなもので、そこで差をつけるためにポートフォリオ作りをみんなそれぞれしていくわけです。なるほど、そういう世界なんだ。そういう世界です。なのでどういうポートフォリオとかが受けるのか。要は転職みたいな状況に似てますよね。なるほどね、でも今作れる…」
「技術とかも考えた方がいいもんねそうですねGoogle検索エンジンをより良くするアプリ作りましたってやればいいじゃんって言ったら元も子もないですよねざっくりのりさんとかかいさんとかパッとポートフォリオ出された時こういうポートフォリオだったらちょっとおってなるなとかっていうのはあります?まず見た目はこだわらなくていいと思うそれサーバーサイドだから」
「だからそこはもう完全にCSSフレームワーク使ってしまえるはいはいはいもしこいつすごい情報キャッチしてるのかなって思われるCSSフレームワークは」
「多分テイルウィンドーCSSとかだと思う具体名出てきたなるほどブートストラップ使ってるとちょっとなんか前世代感を感じるかもしれないへーそうなんだなんか最近テイルウィンドーの方がすごい来てると思う僕もなんかブートストラップ見たらまあブートストラップだよねって思うぐらいだけど別にマイナス印象ではないけどそうなんですねいやまあ別にどっちでもいいっちゃいいんだけど」
「でもそこは自分でコーディングするみたいな努力はそんなしなくていいと思うそれはそうですねなるほど若干そうですね今その」
「某フリマサイトの真似をして作ってるんですけどブートストラップゴリゴリで作ってるわけですゴリってるちょっと嫌だなとは思いつつもサーバー沿いなのでそこに時間かけてらんないなと思っていい考え方ですねゴリゴリでやっちゃってるんですよねそこは最悪別にそれは良いですね」
「ちなみに提出するときってさどんな形で提出するんですか?提出とかないんですよ何回?ないですひたすら自分で作って履歴書みたいなのに追加していくあとは相手の企業さんと顔合わせという名説をするときに自分がよりよく説明できるようにという感じですねで言うと」
「アプリケーションの出来もそうなんだけど単純にコミット数多いとねおってなると思うへーそうなんだ多分だけどそのポートフォリオとか見てコミット数500とか超えてたらこいつめっちゃやってんなって思うへーあとGitHubにとりあえず草生やしまくれっていうあーなるほど500ってなかなかすごいですね」
「でもなんかたまにいるよその採用とかで見てると本当に一部だけどなんか5、600ぐらいその1個のプロダクトでいってるとこいつ一体ポートフォリオにどんだけ作ってきたの?みたいな感じするもんなるほどだいたいそれぐらいやってる人はやっぱりできるはいはいうん」
「コミットも一人でやってるから全作りして1コミットも極端なこと言えばできるじゃないですかそんなコミットしてたらねダメだよそれは1個ポイントになるってことですよねちゃんと作業の区切りをつけてというか1機能ごとだとか」
「そういう修正の一個区切りでしっかりとコミットできることでこいつはGitの使い方を分かってるな感を出せるというかそうそうそうそうなるほど一個一個のコミットメッセージきれいだったらそれもさらにプラスだと思うけどねとりあえず見た時にまずコミット数見てこれめっちゃやってるなと思ったらとりあえずそのコミット履歴開いてどんな作業してんだろうとか見るもん」
「じゃああれなんですね修正っていうメッセージダメなんですね修正ダメやっちゃうけどあーやってる気をつけよう修正途中とかやっちゃうあそこ一応マークダウンですよねマークダウンマークダウンじゃなかったでしたっけリットのコミットのとこマークダウン方式で書けなかったでしょ」
「いやーちょっとねあんまそんなガッツリ書いたことないな一言で終わるからGitコミットコマンドをそのまま打つと開くやつだとあれマークダウンなんだ俺も一行とかしか書いたことないから基本一行で書くからあんまこう装飾しないから」
「内容がパッと見てわかるぐらいの一文書いてあってとりあえずたくさん草生やしたほうがいいたくさん草生やしまくってコミット数まずめっちゃつけとくとそれだけでまずちょっとプラスになりますねやっぱGitちゃんと見に行ってるんだよねGit見ちゃうね正直アプリケーションばって見てもわからんだいたいクラットアプリじゃんはいクラットアプリCreateLeaveUpdateDelete」
「基本機能だけが付いたアプリケーションばっかだから正直アプリケーションの表見ても綺麗か汚いかしか思わなくてどっちかっていうとコード見たいなと思っちゃうエンジニア目線だとそっちなんですね見た目というよりは結構その」
「コードの変数名の付け方というか書き方とかから結構実力出ますもんね出るね次にその後コード見ていくんだけどコード見るときまずは普通みんなそうだと思うけどコントローラー見ますねコントローラー見てそのアプリがどれだけ複雑なのかどうかとか結構見ますね」
「それ複雑なのを見てそれは何を見たいですかシンプルなのがいいのか複雑なのがいいのか僕の時採用目線なんであれなんですけどちゃんと自分でロジック考えて作っているのかどうか見ると言うと本当にただのポートフォリオ用の簡単なウェブサイトとかだとマジでシンプルな例えば一覧表示だったら」
「モデル呼び出して全件取得してビューに渡して表示しておしまいとかシンプルすぎてちょっとね何できるか読めない当たり前基本だからそれ見せられてそうそうそうそうじゃあ何がいいんですかおい年会年会ロジック部分ちゃんとやってるかとかなんかねオリジナルアプリそのなんだろうなんかの模写じゃなくてオリジナルでなんか作ろうとしてる人は結構その辺のロジックが」
「書き方は全然綺麗じゃないんだけどすごいなんかがっつり書いてるイメージがあってじゃああれなんすかねひょっとしたらポートフォリオ作るにしてもアプリケーションになんかのコンセプトがあって例えばTwitter的なやつを作るだったら大」
「大工向けのツイッターを作りますって言って大工さんは作業中開くことが多いだろうからボタンが大きいようにしとくとかそういうペルソナに刺さるような独自ロジックというかそういう工夫があるみたいなといいみたいな話なんですかねそうそうそうそう具体例が足らないけど一覧もただの一覧じゃなくてすごい複雑な検索とか載せたらいいかもね」
「例えば価格で検索できて他のタグとかでも検索できてあと名前とかでも検索できてかつそれが複合で検索できるみたいななるほどとかってやっておくとそれだけでちょっとデータベースの接続複雑になるんでちょっと難しそうですね普通にそういうのできるとちょっと嬉しいなと思うね」
「嬉しいんだへー今の段階だと綺麗なコードとかはそんなに求められないと思ううんうんうん例えばなんかロジックをもっと別のクラスに置いてコントローラー薄くするとかあとなんだろうねガードセッツ使うとかガードセッツっていうのはガードセッツ」
「条件分岐とかでこの条件の時は処理しないみたいなやつを早めにif文で分岐させてリターンしちゃうそれがオード説って言うんですねそういうのとかメソッド細かく分けてるかとかそこまでぶっちゃけ期待はしてないかもリーダブルコード的な観点ってことですねなるほど複雑なロジックを実装してると」
「少しプラスになると思いますね自分で考えてちゃんとやってるっていうのがポイント高いコードを作るのが目的だけじゃなくてお客さんの要望を自分で理解してアウトプットできるよっていうところのアピールになるかもしれないですねそうそうそうそうあと背伸びしてやってほしいのはAPIでやってほしいなっていうなるほどどういうことですか単純に何でしょう」
「コントローラーで変数作ってそれをビューに渡すんじゃなくてそのままJSON返しちゃってクライアント側で使えるようにしておくみたいなちょっと難しいですねですよねなんでしょうそんなもん例えばだけどHTMLとかってさいろんなデータがすでに埋め込み済みになってるわけじゃんだけどAPIってデータだけ返すからそのデータを使って別のサイトが新しくサイト作ったりできるわけですよAPIを使うと」
「そのAPIを作ってるとちょっとねワンランク上になりますそのAPIを作る?他のサイトでもデータ使えるようにしておくみたいなはいはいはいあのGoogleマップみたいなああいう機能を作っておくねあのGoogleマップを自分のサイトでも見れるようにしておいたGoogleのその機能を自分で作るってことですねそうそうそう例えばフリマサイトならさそのフリマの商品情報だけを返すAPIとかね」
「作ってみるとかAPIかAPIなんかやっぱ最近めっちゃ増えてると思う聞きますね結構その話し顔合わせの案件とかでそのRESTAPI作ったことありますか?RESTねREST大事だわそうなんですかRESTの定義が4つに当てはまるAPIみたいなあれって結構初心者目線で言うとだいぶ分かりづらいんですか?」
「だいぶわかりづらい調べててもちょっと固い言葉で結構書いてある感じするんですよね4つこれ当たり前バレストAPIですどんなAPIになるんですか?ベストAPIはURLとHTTPのメソッドでどんな作業をするかを想像できる設計みたいな感じで」
「要するに例えばユーザーズっていうリソースがあったとまずデータのことをリソースって言ったりするんですよレストとかだとユーザーズっていうリソースがありましたとそこに対してゲットリクエストを送っていればゲットって取得するって意味じゃないですかだからユーザーの一覧情報が取れますよねってのが想像できますと次そのユーザーズにスラッシュ1って書いてあってIDで」
「それがゲットだったらユーザーの中のID1を取得しますよみたいなこれもまたURLとメソッドで何するか分かるじゃないですかメソッド他にもいくつかあってポストポストは新規作成ですとユーザーズっていうところにポスト送信してれば新しいユーザーを一件作りますよっていうあと2つ代表的なところと更新更新はよくプットとかパッチっていう」
「使われるんだけどユーザーズの1番に対してputメソッドを送りますよってなったらユーザーの1番を更新しますよでdeleteはdeleteメソッドをユーザーズの1番に送れば削除できますよってこれって全部メソッドとURLの組み合わせでどんな処理するかってのが分かりますよねとそれに持ち取った設計をrestって言うからって言うなるほどこれのメリットで言うと」
「めっちゃシンプルに作れると分かりやすい知らん人が見てもこういうことねって分かる例えばそのユーザーの下にブログっていうリソースがひも付いてたとするじゃないですかユーザースラッシュ1スラッシュブログみたいな感じでリソース新しくネストして作ってあげればそれに対してさらにゲットでやったりとかポストで作ったりとかっていう感じで設計できるんで」
「非常にアプリケーションがシンプルになりやすくて一斉を風靡したアーキテクチャーって感じですねしてます進行権それに対抗するためにグラフQLっていう新しいスタイルが出てきたんだけどでもRESTの方が多分全然使われてるやってる人が多いですからねやったことある人もやってる人も多いから現場でそれが使われるですよね」
「さっきの5パターンを網羅してればぶっちゃけレストっちゃレストって感じするなるほどそれをやって作ったことがあるってなると流行ってもいますしとりあえずルーティング見てレスト通りになってたら合格って感じ合格そこまでいける逆にそうじゃない人いるんですね」
「いるよたまにネストしてるとぐちゃぐちゃになったりするそうなんだ勉強になりますそうじゃないやつ作ったことなかったわ俺の初期のポートフォリオとかそうじゃないよ大変作んのなんならURLじゃないしねファイルをパスで指定してるみたいな感じだったへーそうなんだなるほどなちょっとポイント高いのかちょっと頑張ってみますレストちゃんと喋れたら強いかも」
「ほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほうほう」
「バックエンドが終わるはいコミットをまず細かくしろはい毎日草生やすいコントローラーにちょっと複雑な実装しろはいURL設計はRESTではいRESTフルなAPIで有力ですねプラスアルファでそのAPIってところがはい有力だこれができてたら君は引き抜かれる引き抜かれるまあ安心できますね安心できるね他なんかあるかな」
「いや今段階そんなもんじゃないですか?てかそんだけできたら十分ですよできてない人でも全然いいと思うんでいいというかまあ物によりますけどもちろんまあでもまあしょうがないなというか別に多分現場行って1から10まで作ることってなくて大きいアプリの一部を作ることになると思うのでそのレストとかは多分決まってないんですよもともとこうなりますとだから知ってるとちゃんとわかってるなって思うし知らんかったらここから教えるか」
「なんでまあもちろん知ってる人と知らない人いたら知ってる人の方がもう強いそりゃだしもう基本だしなるほどそうねあと同期いるんだよね同期います相互レビューした方がいいほうへー」
「あのー多分最初の例えば現場に行くじゃないですかはいってなるとその現場ですでに動いてるコードを読まなきゃいけないんですよはいはいその負荷が結構やばいからあの今のうちになんかもうちょい小さい他の人が書いたコードっていうのを読んだ方がいいと思うへーいやめっちゃ大事大事だよいや全く思いつかなかったけどめっちゃ大事ですそれめっちゃ大事だよこれなるほどだいたいコード人のやつ読むの大変だもん」
「大変確かにでそこでお互いにコードレビューしてお互いの良いところも吸収できるしあと人のコード読むっていう機会もあるのでそれをやるといいと思いますめっちゃいいと思いますそれうん」
「4人とかでチームで開発してたして研修でやってたんですけど同じチームで同じものを作ってるんですけどそれでも他の人のコードを読むのはまだ大変だったんでそれなおさら大変ですよね現場はさらに大変ってことですよねボリュームが違うからね現場のコードってあるといいこと聞きましたそうだから人のコードを読んでくださいわかりました読んで」
「いっぱい勉強するいっぱい勉強するいろいろあったなと思いましたいっぱい勉強するとそれはまあ聞き返してくださいそうだね聞き返してねいいところですかねじゅんぺいが入ったからこそのトークができて俺は嬉しいですそうですいい話聞けました僕もよかったよかったそんな感じでちょっとポートフォリオブラッシュアップしていきますしていってくださいはいじゃあしめの言葉を僕ですかじゃあお願いします僕ですねはいということでえー」
「生後5ヶ月目に向けていっぱい駆け出してたくさんの情報をキャッチアップしてやっていきたいと思いますパンクしない程度に楽しむぐらい楽しむぐらいはい本日は以上ですか以上ですまた次回お会いしましょうイマジンプラグラマーではメールを募集していますトークテーマ、悩み、要望などなど何でも募集中です」
「宛先はそれではまた次回」
