テックキャンプ短期転職コース卒業後の振り返り

2020年6月30日 09:13

4/20にキックオフしてから７０日間が経過しました。
今回は進捗管理表を元に、どのような学習を行っていたのかを
振り返っていきます。
受講検討中の方の判断材料になれば幸いです。

4/20(キックオフ）〜1週間

PC：mac
開発環境：ローカル開発
ターミナル/VScode/Sequel Pro
＊AWS(Cloud9)での開発はイナズマコースだけのようです。

１．HTML/CSSの基礎を学び、サイトの表紙を作りました。
２．Rubyを使い、映画レビューアプリの作成
３．Ruby on Rails(フレームワーク)を使いメモアプリ作成
こんな感じ → https://note.com/john01/m/m53f92953322f
４．Railsでブログアプリ作成
５．RailsでTwitterのようなアプリを作成
６．金曜日に中間テスト（HTML/CSS/Ruby/Rails)

Progateやドットインストールでこの辺りの基礎を抑えておけば
スタートダッシュ切れると思います。
カリキュラムがとても丁寧で質問もできるので、エラーに苦しむこともありません。一字一句飛ばさずに読み進めていけば必ず自己解決できるカリキュラムになっていると思いました。

中間テストは０点でした。
Rubyはメソッドや引数を使ってアプリを作る　←ここで時間使いました。
HTML/CSSは例題に沿ったマークアップ（模写）←回答にHTMLを貼る(^◇^;)
Railsはエラー問題　←たどり着けなかった

〜２週間

中間テストから自分の苦手分野を克服する復習期間です。
本試験に合格（７０点以上）しないと応用カリキュラムに進めないので
しっかり復習していきます。
ただ、復習用の課題や模試も用意されているので、丁寧に実施すれば問題なく合格できると思います。
4/29(水)に本試験に合格できたので2週間以内に応用カリキュラムに晋ことができました。

個人進捗管理表に進捗度が表示されますが130％位だったと思います。
進める人はどんどん進んだ方がいいです。

そして応用カリキュラムからは質問方法が変更されます。
今までは即ビデオ通話で質問できましたが
応用からは仮説、検証を繰り返し自分なりの考えをまとめたシートを
提出した後に通話となります。

例えばこんな質問をしていました。

【質問の箇所】
応用カリキュラム
【質問の種類】
実装の相談(エラーが出る/思い通りの表示ができない)
【質問の内容】
■ 解決したいこと
タブスイッチをクリックすることによって
画面表示を切り替えたいのですが
jQuery.Deferred exception: tabSwich is not defined ReferenceError: tabSwich is not defined
というエラーが出てしまい
画面が変化しません。
■ 調べた内容とそこから立てた仮説
調査１．エラー内容を言語使用サイトMDNで調べたところ
宣言されていない関数が呼ばれていることがわかりました。
tabs.click(tabSwich);
調査２．tabSwichファンクションの外側から呼び出すことはできるのか疑問に思いQiitaを使用し、検索したところ
関数の内側からしか呼べないことが判明したので以下の作業を行ました。
■ 仮説を元に行った作業内容
①function tabSwich内にtabs.click(tabSwich);を移動
結果：エラーは消えたが、画面の変化なし
②let tabs = $('.menu_item');の変数定義を
function tabSwich内に移動
上記２つの操作を行っても解決しませんでした。

今見ると、何やっていたのか、どう解決したのか覚えていませんが
仮説検証をすることにより、質問シート作成中に解決した！
なんてこともありました。
面倒ですが、今後必ず役に立つ『言語化力』が爆上がりします。

〜3週間

一通り応用カリキュラムの流れを理解し、実際にアプリを作っていきます。
今までと違う点はメンターさんのLGTMが出なければ先に進めない！

＊LGTM（"Looks Good To Me”）自分的にはOKだよ

１．データベース設計
２．haml/sassを使ってマークアップ
３．ログイン機能実装
４．メッセージ送信機能実装
５．単体テスト＆統合テスト

haml/sassはHTMLとCSSの上位互換というイメージです。

HTMLでヘッダーを作成

<div class="header">
   <div class="header-left">
     TOP PAGE
   </div>
   <div class="header-right">
     <div class="header-right__user">
       test
     </div>
     <div class="header-right__login">
       login
     </div>
   </div>
 </div>

hamlでヘッダーを作成

.header
 .header-left
   TOP PAGE
 .header-right
   .header-right__user
     test
   .header-right__login
     login

このように記述量が少なくなります。
ただ、コードを書く速度はEmmetを使っていればそんなに差はないかなという印象でした。

HTML：コードが長くなると、終了タグの位置がどこかわからなくなる。
haml：インデントで親子関係が構築されるので便利な反面シビア

Sassに関しては今まで通りの使い方もできてプログラム的な書き方もできるのでこちらは完全な上位互換だと思いました。

〜１ヶ月

１．JavaScript/jQueryの復習
２．非同期通信（Ajax）
３．インクリメンタルサーチ
４．自動更新機能
５．応用カリキュラム終了報告

ここからjQueryを使った実装が始まります。
最初何もわからずコードが読めなかったので
ProgateのjQueryを受けて、自分で練習ファイルを作ってから
こちらの実装に臨みました。

２〜４の実装は結構大変でしたが、なんとか乗り切り
1週間早く終了報告することができました。
アプリ名：chat-space

1ヶ月間の振り返りと感想でした。
ここまで読んでいただきありがとうございます。

この記事が気に入ったらサポートをしてみませんか？