外出自粛・在宅時間を有効活用！Kindle Unlimited本でHTML/CSSを速習する方法

コロナで外出自粛となり、在宅の方が多いと思います。
こんな時こそ時間を有効活用して、HTML/CSSを使ったWebサイト開発の勉強をしませんか？

この記事では外出自粛・在宅で生じた時間をHTML/CSSを使ったWebサイト開発の学習に利用したい方に向けて、「Kindle Unlimited本を活用した速習方法」について解説します。

この記事はこんな方に向けて書いています。

Kindle Unlimited本でHTML/CSSを速習する方法

最初に結論です。

以下のステップを踏めば、HTML/CSSを使ったWebサイト開発を速習することができます。

それでは解説していきます。

Kindle Unlimitedとは？

ご存知の方も多いと思いますが、Amazonの読み放題サービス「Kindle Unlimited」は月額980円（初回の30日間は無料）で対象となっている電子書籍を全て読むことができるサービスです。

詳細についてはこちらのサイトを参考にして下さい。

たった９８０円で書籍、コミック、雑誌を含む和書12万冊が読み放題になります。

もちろん12万冊といっても個人出版の薄っぺらな内容の本（全てではありませんが）も結構あります。

プログラミング関連の本についても個人出版が多くて内容もピンキリなのですが、中には良書もあります。

この記事では筆者が大量に読んできたKindle Unlimitedのプログラミング関連本の中から、厳選したオススメを紹介します。

速習のための４ステップ

それでは、速習の４ステップを解説していきます。

Step 1：Webプログラミングの全体像を把握する

プログラミング完全初心者の方は、そもそもHTML/CSSって何？という状態かと思います。

そんな方には、まずは「独学で身につけるためのプログラミング学習術」でプログラミング言語の全体像をつかんでいただくことをオススメします。

プログラミングと言ってもHTML, CSS, JapaScriptからPython, Swift, Goなど、本当に様々な言語があります。

これらはWebサイト、Webアプリケーション、スマホアプリなど「何を作るか」によってどの言語を使うかが変わってきます。

この本は、その全体像をわかりやすく説明している良書なので、最初の一歩として読んでみて下さい。

Step 2：HTML/CSSの基礎を学ぶ

全体像がわかったら次はHTML/CSSの基礎を学習しましょう。

だた、すみません！

ここは本よりもWebオンライン学習をオススメします。

なぜかというとこの後のステップで本の写経に入るのですが、この前提として

ことが必要です。

このためには本で学習するよりも無料のWebオンライン学習サイトの方が効率的です。

Webオンライン学習サイトはProgateとドットインストールが2大サイトです。

ドット インストール	開発環境の構築が必要（PCにエディタをインストールしてローカル開発）	Link
Progate	開発環境の構築が不要（Webサイト上でそのまま学習開始できる）	Link

ここでは、開発環境構築（エディタのインストールなど）が必要なドットインストールをオススメします。

Progateの方がお手軽に学習を始められますが、今後Webサイト開発をしていく場合に開発環境構築はさけられないので、ここでやってしまいましょう。

ドットインストールでは開発環境構築用のレッスンもあるので、手順通りやれば難しいことではありません。

ドットインストールで以下のレッスンを受講して下さい。全部無料です！

 

Step 3：コードを写経してWebサイトを制作

HTML/CSSの基礎が理解でき、PCに開発環境を構築できたら、まずはコードをそのまま書き写しながらWebサイトを作ってみましょう。

ちなみに、巷ではこれを写経といいます。

オススメ本はこちらです。

この本の手順に従ってコーディングするだけでなんちゃってブログ風のサイトが出来上がります。

筆者が実際に作成したサイトをポートフォリオに載せていますので、参考にして下さい。

写経する際には単に丸ごと書き写すだけでなく、自分でいじりながらコーディングすることで理解をより深めることができます。

Step 4：デザインカンプからWebサイトを制作

写経でWebサイトを作れるようになったら、次はデザインカンプからWebサイトを作ってみましょう。

デザインカンプって何？という方はこちらを参考にして下さい。

オススメ本はこちらになります。

デザインカンプと指示書を元に

と実際のWeb制作案件と同じ流れの構成となっているので実践的な内容といえます。

 

ちなみにサーバーを立ち上げたい方は、以前にブログ用のサーバーを立ち上げるまでの過程を記事にしていますので参考にして下さい。

会社員でも出来る！！1ヶ月でゼロからブログ開設＋Adsense合格この記事では、会社員をしながら１ヶ月でAdsense合格までたどり着き、収益化の第一歩を歩みだすまでの軌跡について解説します。...

 

更にJavaScriptも学習してみよう

HTML/CSSがある程度わかったら、次のステップとしてJavaScriptも学習してみましょう。

JavaScript関連でもKindle Unlimited対象の良書があるので、紹介しておきます。

まずはこちら。

本書では、「ふりがな」を振ってわかりやすくコードを理解できるようにした今までありそうでなかったユニークな本です。

もう一つ紹介しておきます。

JavaScriptが少しわかってきた方には、この本をオススメします。

写真を送るだけで自動で文字起こししてくれるLINE Bot「文字起こし君」を開発した著者が、その手順を解説した本です。

一見難しそうですが、この本通りに進めるだけでGoogle のAIエンジンを活用したLINE Botが作れます。

筆者は更に改良を加えて「ベトナム語の画像からテキスト検出して英語に翻訳」するLINE Botを開発しました。

https://twitter.com/jomanomad/status/1220334296394715141?s=20

 

 

まとめ

いかがでしたでしょうか？

それでは、最後にもう一度ポイントを確認しましょう。