この本を一言で言うと
Codejump主催者が教える、実案件をもとにした6種類の練習サイトでプロレベルのコーディング力を習得する実践書。
この本の概要
本書はHTML&CSSの基本を学んだ後、実際にWebサイトを制作できるレベルへと飛躍するための実践書。累計10万人以上が利用するコーディング学習サイト「Codejump」の主催者・小豆沢健が、実案件をもとに作成した6種類の練習サイト（入門〜実践編）を通じて現場レベルのコーディングスキルを解説。フレックスボックス・グリッドレイアウト・CSSアニメーション・ドロップダウンメニュー・ハンバーガーメニュー・モーダル・パララックス・スライダーなど実務定番技術を網羅。576ページの大ボリュームで独学の限界を超えられる一冊。
「基礎はできたけど何も作れない」という壁を、この本が壊してくれた
Progateとかドットインストールを一通りやって、「HTMLとCSSはわかった」と思っていたんですよ。でもいざ何かを作ろうとすると、何も作れない。ハンバーガーメニューってどう作るんだっけ？ スライダーは？ モーダルは？ という感じで、全部調べないといけなくて全然進まなかった。
この本の最大の特徴は「実案件をもとにした練習サイト」というコンセプトで、プロフィールサイトからコーポレートサイトまで6段階で作っていく。各サイトに使う画像素材まで用意されているから、ダウンロードして開けばすぐ始められた。
各章の冒頭でレイアウト構成を確認してから手を動かす流れが良くて、「どういう構造で組むか」を考える習慣が自然に身についた。この視点が、一番独学で学びにくいところだと思う。
576ページは正直ボリューミーで最初は怯んだけど、最後まで終わったときにはドロップダウンもハンバーガーメニューもスライダーも全部自分で書けるようになっていた。転職活動でこの本で作ったポートフォリオを見せたら、「独学でここまで作れるんですね」と言われました。
— Web制作の独学者（24歳男性・転職活動中）
この本で学べること
✓
プロフィールサイト・ブランドサイト・サービスサイト・カフェサイト・ランディングページ・コーポレートサイトと、実務に直結する練習サイトで学べる。
✓
フレックスボックス・グリッドレイアウト・CSSアニメーション・ドロップダウン・ハンバーガーメニュー・モーダル・スライダーなど現場で頻出の実装を習得できる。
✓
各練習サイトのレイアウト構成を先に確認してから制作に入る流れで、設計の視点も同時に身につく。
✓
ソースコードだけでなく123RFによる本番用画像もダウンロード提供されており、環境を整えたらすぐに始められる。
✓
入門から実践まで6段階の難易度で学べる大ボリューム構成で、独学で仕事レベルの実力を養成できる。
本の目次
- 1第1章【入門編】プロフィールサイト〜フレックスボックス
- 2第2章【初級編】ブランドサイト〜ポジション
- 3第3章【中級編】サービスサイト〜複数ページ
- 4第4章【上級編】カフェサイト〜複数レイアウト
- 5第5章【応用編】ランディングページ〜動きのあるWebサイト
- 6第6章【実践編】コーポレートサイト〜実務を想定したWebサイト制作
良い点・気になる点
良い点
- ○実案件をもとにした6種類の練習サイトで実践力が徹底的に身につく
- ○画像込みのダウンロードデータですぐ学習を開始できる
- ○576ページのボリュームで入門から実務レベルまで一冊で到達できる
- ○累計10万人が利用したCodejumpの信頼あるノウハウ
気になる点
- △基礎知識が前提のため完全初心者向けではない
- △ページ数が多く読了するまでの時間がかかる
著者について
こんな人におすすめ
✓
✓
✓
よくある質問
Q. 完全初心者から読めますか？▼
A. HTML&CSSの基本（タグの意味・CSSの書き方程度）を事前に学んでいることが前提です。完全初心者の方は入門書で基礎を学んでから本書に進むことをおすすめします。
Q. JavaScriptの知識は必要ですか？▼
A. JavaScriptの基礎知識は不要です。ドロップダウンメニューやスライダーなどの実装はJQueryを活用した実践的な方法で解説しています。
Q. ダウンロードデータには何が含まれていますか？▼
A. ソースコード（HTML・CSS・JS）と123RFから提供される練習サイト用の画像素材がすべて含まれており、購入後すぐに学習を始められます。
UIデザインガイドライン集
実務で使えるUIデザインのガイドラインを無料でダウンロード
※ 登録いただいたメールアドレスは資料送付にのみ使用します