【TechAcademy】WEBデザインコース 25日目「続・コーディング地獄」

どもでっす！TechAcademy WEBデザインコース25日目が終了っす。
作業時間は8時間ぐらいです。

結局、Lesson12は完成しませんでした…..。

ハマりにハマりました、なかなかコーディングが思うように進まず苦しかったっす。
何でもかんでもは上手くい訳ないので耐え時、踏ん張り時です。
少しでも先に進めるよう一歩ずつ進んで行きます。

今日やったこと
1. Lesson12
2. サイト分析
つまずき備忘録
1. つまずいた原因【flexきちんと扱えていない問題】
2. 解決策【基本の記事を読みまくる＆手を動かす】
参考にした記事
第7回メンタリング
明日のやることリスト
まとめ

今日やったこと

Lesson12【下層ページに着手】
サイト分析
~~chot.design「Photoshop入門」~~
~~読書＆ストレッチ~~
第7回メンタリング

今日はつまずきが恐ろしく長引いて日々のタスクを消化するに至りませんでした。
「サイト分析」は先日できなかったのでこの記事を書く直前にしあげました。
Lesson12でえらく足踏みしておりますが、スキルアップのためにもがんばります。

Lesson12

今日はずっと最下層のページの中間部分を作成していました。

つまりハマったってことです。
どれだけの時間が吸い込まれていったことか考えるだけで恐ろしくなります。

原因はflexboxの書き方がおかしかった＆使いこなせていないこれに尽きると思います。
「なんとなく」でflexboxをつかってきて「できる」と勘違いしていました。

このLesson12が終わったら基礎部分の習得をしようと思います。
詳細はつまづき備忘録にて！

サイト分析

久しぶりにギャラリーサイト「https://muuuuu.org/」から、サイト1件を分析しました。

TNER（トナー）| 仙台のシェアオフィス | 借りながら貸せる賃貸

TNER（トナー）は仙台二日町にあるシェアオフィス、アパートメント、レンタルスペース、イベントスペースの複合賃貸施設です。また、特徴として賃貸スペースの一部の場所やある時間を別の人に二次利用することをTNER（トナー）としてサポートしています。借りながら貸せる新しい賃貸TNER（トナー）の公式サイトです。

派手な機能はありませんでしたが、視認性の高い文字・デザインとモノトーンベースの配色、各要素配置を一捻りしてモダンな印象のサイトが構築されていました。

ポイントとしては見出しの文字の一部を反転させたりと遊び心を至るトコロに見る事ができ、ユーザーを飽きさせない仕組み。

ワ多ナベ

めちゃイケてました！例えるなら、、、、、コンクリート打ちっ放し家屋のようなイメージ！

突然現れた伝説のロックスター

相変わらず貧素な語彙力。

つまずき備忘録

つまずいた原因【flexきちんと扱えていない問題】

僕の癖として上手くいかない箇所が出現した場合、ネットで調べるよりも前に手当り次第に当てはまりそうなものを所構わず書きまくるというものがあります。

今日はこの癖のせいで時間を無駄に消費してしまい、負のコーディングループにガンガンはまり気力まで失ってしまいました。

具体的な原因を挙げるとすれば「代表的なプロパティや値のみしか頭に入れられていなかった事」と「なんとなくで使えてしまっていたこと」この２つにあると思います。

解決策【基本の記事を読みまくる＆手を動かす】

それぞれの子要素に幅・余白が設定されているか、デベロッパーツールで確認
SP・PCでの「構造・仕組み・動き」それぞれをしっかり把握して整理
チートシートで必要な指定を探し、当てはめていく
https://www.webcreatorbox.com/tech/css-flexbox-cheat-sheet

ワ多ナベ

前回も「flexちゃん」にやられたのでしっかり勉強し直します。
「やばい」と思ったときこそ冷静に対処ですな！