デザインカンプからのコーディング【練習】

デザインカンプからのコーディング練習で、作業も大詰めを迎えるころ、ピクセルパーフェクトを目指して デザインと見比べて細かな調整をしていくと思います。 コーディングの練習をここまでしてきて、少しずつ慣れてきましたが、中級編 […]

しょーごさんのコーディング課題【中級編】に取り組んでいる最中は、ブラウザのタブを開きすぎたり、どこからどこまで作業を終えているのか分かりにくかったりしていました。作業のしづらさも覚えてストレスも感じていました。なかなか作 […]

毎回、コーディングする時にどんなクラス名にしようか迷ってしまいます。 とりあえず、皆さんがつけているクラス名を参考にしながら、できるだけ分かりやすいクラス名をつけていこうと思います。 今回のコーディング課題【中級Ex編】 […]

前回の記事でFLOCSS設計思想に基づいて、CSS設計を行っていくという話をしました。そちらで参考サイトの方は、命名規則をBEMMindBEMdingで行っているとのことでしたので、早速調べてみました。 下記サイトが分か […]

前回のコーディング課題【中級編】では、初めて設計思想というものを導入し、メジャーなBEMに基づいて行いました。 ただ、やりながら使いづらさを感じていました。 今回、【中級Ex編】までに、gulp導入ついでにpugも取り入 […]

のせっちさんのBrainにはGulp導入で大変お世話になりました。そんなのせっちさんのブログでPugについて、その構成の仕方などを詳しく解説してくれていましたので、ブログにて共有しておきます。 こちら↓ また、gulpf […]

レビュー2回目まで指摘された箇所（フォントのtransform）を修正して、ポートフォリオとして活用させて頂きたいと思います。 以下となります。よろしければご覧ください。 ユーザー名、パスワードともに「tanatiyo- […]

GW中にも関わらず、2回目のレビュー依頼では半日と待たずレビューが返ってきました！ 早くレビューが頂けるから、フィードバックも早くできます！ 今回の記事では2回目のレビュー内容と反省点を振り返ります。中級編の反省はまた翌 […]

ようやく、一通りのチェックも終わり、提出することができました。 GW中にも関わらずレビュー依頼を提出した翌日にはもうお返事がありました。今回も早くて驚きました＾＾； 今回の記事では修正内容と反省をしながら進めていきたいと […]

よくあるブログカードやメディア（画像1枚とテキスト部分からなる）の構成は、CSS設計で勉強したことを踏まえてモジュールと捉え、拡張・保守・運用しやすいようにSassファイルを別で分けてコーディングを行っていました。 とこ […]

flexboxは奥が深いので、まだまだ勉強しなければならないことが多いですが、ここではデザインカンプからのコーディング課題時によく悩んだことの一つ、「子要素の幅を均一にする」ことについて( ..)φメモを残しておきます。 […]

デザインカンプからのコーディングを行っている時に、文字のサイズや行間、文字間は指定通りなのに、なぜか文字がデザイン通りに合わない、ということが出てきました。 その解決方法を備忘録がてら( ..)φメモしておきます。 結論 […]

tableのレスポンシブ対応をする際に、忘れていたので( ..)φメモしておきます。いろんなパターンが考えられますが、ここでは2列複数行タイプのtableをレスポンシブ対応で1列（複数行）にする方法を書いておきます。 簡 […]

ヘッダーの上部を固定してから、レスポンシブが崩れた件で、前回は原因探しを行っていました。 一つ一つ、コンテンツやモジュールなどを確認していくと、それぞれに原因があることが分かってきました。 原因は一か所ではありませんでし […]