TECH CAMP大阪の80期（2020年６月22日〜）としてプログラミングを学ぶ体験談です。これから受講する方や考えている方の参考になれば幸いです。
33日が経ち、応用カリキュラムも終盤に入っています。
前：TECH CAMP体験記⑳ 32日目 こんなミスに気を付けろ！Ajax
次：TECH CAMP体験記㉒ 35日目 折り返し地点
勉強内容
カリキュラムに沿って勉強を進めています。
基礎カリキュラムは
・チャットアプリの非同期通信化
チャットアプリの非同期通信化
非同期通信って聞き慣れない言葉ですが、ざっくり言うと
「一部分だけを更新させる通信」
です。よくわからない感じですが、身の回りには非同期通信があふれています。
LINEを例に見てみましょう。
メッセージを送信したら、メッセージだけがニョッキっと出てきた。画面の他の部分は変化なし。
この必要な部分だけを変更させるのが非同期通信です。
これだけを見ると簡単そうですが、その裏にはいろいろな苦労があるのです💦
・メッセージデータの受け渡し方を変える（JSON）
・メッセージの表示方法を変える（appendやbuildHTML）
・送信したら、画面の一番下に移るようにする（animateやscrollHeight）
・画面がスクロールできるようにする（overflow: scroll）
・送信したら入力ボックスを空白に戻す（reset()）
・送信ボタンを連続で押せるようにする（'disabled', false）
・送信失敗した時にわかるようにする（.failや alert）
とまぁ、こんだけあるわけです。
普段目にするあの機能の裏にはいろいろな工夫があるわけなんです。慣れたらパパッと作れるのかもでしょうが、素人には大作業です。
苦労したこと
見本のコードとクラス名が違うと混乱
JSでHTMLを記述する部分があるのですが、見本のコードと自分のコードでクラス名が違うと混乱します。
例えば見本のコードが
見本のJS「メッセージAはここに配置！」
メッセージA「ラジャー！」
とあるのをそのままマネして
自分のJS「メッセージAはここに配置！」
メッセージその１「それ誰っスか？オイラそんな名前じゃねえっス」
となるわけです。他にもクラスの数が違うとどこに指示を出すかが見えにくくなります。これはチームの皆さんも非常に苦労されていました。難しいポイントです。
見本のコードが途中からなくなる
見本に甘えるなっ❗️
と言われたらそれまでですが、、、😅
途中から見本のコードがなくなり、自分で考えてコードを書くことになります。
ですが、それまでと比べると作業の難易度はかなり穏やかです。今までのカリキュラムを見返せばできる内容なので、先ほどのクラス名や数が違う問題と比べると突破しやすい部分でしょう。
コードレビュー依頼
一連の作業が終わり動作確認をしたら、メンターさんにコードレビューを依頼します。コードに不具合はないか、余計な記述がないかをチェックしてもらいます。ここでLGTMをもらってから次のカリキュラムに進むことになります。
さて、結果は、、、
だめ✖
あちゃ〜😓
とはいっても、余計な記述を削除してください、というものでした。
変更点があった時に、変更前の記述がわかるようにコメントアウト状態にしていたのです。その部分は不要だから消してね。ということでした。
そして不要部分を削除し、再びコードレビューを依頼します。
数分後
LGTM
やったね😆
今までもそうでしたが、LGTMをもらわないと進めない部分は難関の関所です。ですが、そこを超えるとしばらくは難易度も緩やかな場所が現れます。こういった難しいポイントは気分もまいってきますが、焦らずに落ち着いて取り組むことが大事だと思います。
LGTMは何回いただいても嬉しいもの😆
成功体験が増えます😌
TECH CAMPの受講料を最大２万円お得にする方法はこちら
前：TECH CAMP体験記⑳ 32日目 こんなミスに気を付けろ！Ajax
次：TECH CAMP体験記㉒ 35日目 折り返し地点
とりあえず土日も進めて、チャットアプリの最終提出を目指します💪