アルカナに入社しました/GraphQLについて // 第61回社内勉強会 #sa_study

はじめまして、2020年4月よりアルカナに新卒入社致しました、赤堀です。

入社するや否や緊急事態宣言が発令されリモートワークになった故、出社日数わずか3日、先輩方の顔と名前も一致しきらないまま3ヶ月の研修期間を終えました。。。

 

今回の勉強会では改めて自己紹介と研修期間に制作した研修課題について発表しつつレビューを頂きました。

（人前で自分のコードを晒すと言うこの上ない羞恥プレイ。控えめに言って地獄。）

 

とりあえず自己紹介↓

 

ざっくりエンジニアとしての経歴をお話しすると、学生時代にデザイン会社などでWebサイトの制作をしていました。

プログラミング言語に関しては、C++を大学の授業で少し、Reactを短期のオンライン講座で少し学んだことはあったのですが、どちらもわけわからんと思っており苦手意識あり。。

そんな中でまずはLaravelでInstagram風のSNSを制作しました。

完成物がこんな感じ↓

　　　　

結論から言うととても楽しかったです！

ああ、ちゃんとプログラム書いてる。。

そして、書いたコードでちゃんとシステムが動いてる。。。

と言うマークアップ系の言語とは一味違った楽しさを知ることができました。

（なんだかんだでHTML,CSS書いてる時はそれはそれで楽しかったのだけど。）

 

機能としては

○タイムライン表示

○投稿機能（投稿編集/削除）

○Like機能

○フォロー機能

○コメント機能（コメント編集/削除）

○検索機能

○アクティビティ表示

などを実装しました。

 

続いてReactを用いたフロント部分の実装を試みました。

 

APIってなんや。

どうやってLaravelに繋ぎこむんや。。

ディレクトリ構造どうすりゃええんや。。。

そもそもJSの書き方わからん。。。。

 

ってな感じで序盤結構苦しみましたが、先輩方の手厚いサポートもありなんんとか完成。

 

最終課題ではReduxフレームワークを取り入れた開発を行いました。

Reduxに関してはまず概念を理解するのに苦戦。

書籍やら記事やら読んでも何をしてるのか、何のメリットがあるのかよくわからん。。。

チュートリアルをやってみて何とか掴み始め、書いていくうちにメリットも何となくわかってきました。

（いまだにきちんと理解しきれている自信はない）

 

実際の勉強会では以下のような質問やコメントがありました。

Q.フォロー機能は複数のページに設置されており、同じ関数を繰り返し使うことになるが、Controllerの記述をすっきりさせるためにはどうしたら良いか。

↪︎A1.Serviceの考え方を取り入れ、同じ関数を一つの関数にまとめる。わかりやすい関数名（ex.followFromActivity）を使用し、関数実行後に元のページにリダイレクトするように、$requestにURLのデータを持たせておく。

↪︎A2.そもそもLaravelで設計すべき部分ではない！フロントの記述でどうにかすべき。

 

Q.CSS設計はどうなっているか。

↪︎A.基本的にBEMの設計手法で組み立て、ボタンなど繰り返し使うが微妙にスタイルを変えたいパーツはOOCSSの設計手法を取り入れました。

 

Q.Likeした後、動きがカクつく（画面遷移している）？

↪︎A.Laravelのみの実装ではForm送信後にページ遷移するため、カクついてしまう。Reactを取り入れた方では画面遷移がなく、カクつかない。

 

などなど、他にもいくつか質問やコメントをいただいたり、逆に自分から質問したりもしました。

 

研修期間全体を通して思ったことはやはり実際に手を動かして開発して見ることが成長への近道だと言うこと。

もちろん本読んだりチュートリアルやったりする時間も大事ですが、自分は先に手を動かして後から知識を入れる方が合っているなーと思いました。

 

そして日々手厚いサポートをしてくださった先輩方（特に仏のように優しくサポートしてくださった深澤さん、毎日デイリーに参加して見守って下さったノブさん）に厚く御礼申し上げたいと思います。多谢🙏

 

続いて、ノブさんの発表です!

---