テックアカデミー8日目の学び(Lesson5〜6)

前回でも書きましたが、テックアカデミーの教材はテキストを読み進めるタイプなので、知識の定着に苦しむところがあります。

一個一個躓いたら手を止めるやり方では、深みにハマっていくと感じたため、今回はザーッと目を通して、とりあえず次に進める感じで取り組みました。一旦ここで学習内容を振り返りたいと思います。

Lesson5の内容

Photoshopを使ってデザインカンプの制作方法を学びながら、超基本的な操作について習得できます。

＜習得できたこと＞
・ガイドを作成
・レイヤーグループを作成
・画像の埋め込み配置
・クリッピングマスクの作成
・文字入力の方法や拡大・縮小
・レイヤーからの画像アセットの生成
など

このあたりはテキスト通りに書かれていることをそのままやればできるようになっています。（作業画面のキャプチャもあってわかりやすいです。）

「レイヤーからの画像アセットの生成」については知らなかったので勉強になりました。

このレッスンのゴールは「ポートフォリオのデザインカンプが完成していること」なのですが、提出する課題の内容は、「ポートフォリオのデザインカンプ完成版ファイルをダウンロードして、計７箇所の写真を差し替えて提出」というものだったので、その課題だけ済ませて、次に進むことにしました。

Lesson6の内容

HTML・CSSコーディングの基本を学習します。
先に言いますと、ここの章は2/10チャプター読んだところでギブアップし、先にLesson7にスキップすることにしました。（笑）

＜ギブアップ理由＞
要素やプロパティの解説がずらずらと書かれているものをただひたすら読んで理解していく、、、といった感じなので、これがとてもしんどいのです。

私はテックアカデミーを開始する前に、ProgateでHTML & CSS初級編を終わらせていたので、事前知識が入っている部分についてはスラスラ読めますが、テキスト内容の4/5ぐらいはProgateでは学習していない内容だったため、書いてあることを読んでも初心者には理解が追いつきません。。。

また、Progateのように演習の場がなく、このレッスンでは自分で一からコードを書き出すことはありません。その代わりページに埋め込まれたJS Binの画面で表示されているコードに、 自由に変更を加えて HTML/CSSの動作を確認していくことはできますが、私はうまく活用できませんでした。。。

＜工夫してよかったこと＞
そこで、とりあえずわからないと思ったこと、気になったことはページ上にあるメンタリングメモ機能にダーッと書き出しながら進めることにしました。

例えばこんな感じに

<link rel="stylesheet" href="./css/style.css">のhrefってなに？
<img src="./images/image.jpg" alt="サンプル写真">のaltってなに？
<a href〜>と<link rel〜>はどう違うの？

わからない。と思ったことを書き出しながら進めると、あとでまとめて調べる方が効率的だし、どこがわからないのかがわからない、という状態にならない分、整理されるので良いと思いました。この方法は今後も使っていこうと思います。

しかし、読んでる途中で寝落ちしてしまうほど捗らなかったのでw
とりあえず次のLesson7にいくことにしました！
（カリキュラムを確認してみたところ、ここ飛ばしてもLesson8くらいまでは支障なさそうだったため）