最初に言っておきます
私自身の勉強方法なので決して『おすすめ』っていう訳ではありません(-_-;)


それでも、たくさん調べたり、有料ロードマップ等を購入したうえでの経緯なので、最低限のところはつかめていると思います!

ロードマップ

Progate

入り口ですね!もうやってるって方も多いと思います(*'▽')
そのような方は次に進んでください!


Progateはオンラインでプログラミングを学べるサービスです。
ゲーム感覚で進められて、解説等も親切に教えてくれてます。
無料、有料とあるのですが、有料一択です(゚д゚)!
正直、ここで悩んでたらこの先もっとたくさんの参考書が...(;^ω^)


ここはサラッと1週、やっても2週にしましょう。


自分も半分も理解出来ずに3週目に行こうとしたのですが、同じことを繰り返すより、違う環境で1から学んだ方が、知識は積み重ねられると思います(*'▽')

Progate

テキストエディタ

最低でもここら辺から、自分でコードを打つのにも慣れておいた方がいいです。


テキストエディタをインストールして環境構築しましょう(*'ω'*)

今、私はAtomを使っていますが、 Visual Studio Codeに変更しようと思います。


これは好みによるのですが、Twitterなどで見かける人の7割くらいはVisual Studio Codeを使われている気がするので、今後、共同作業する時を考え、同じ環境の方が色々都合がいいと思って(´艸`*)


ここの工程は自分でググってもらえれば、インストールまでの流れが分かる優良記事はたくさんあります!

ドットインストール

3分動画でマスターできるプログラミング学習サービスです。
通勤、ちょっとした合間、カップラーメンを待つ間などで視聴できる動画です。
Progateには無かった知識があるドットインストールで=基礎完了。と、考えてもいいと思います!

こちらも有料コースがあります!
ドットインストール

自分は今のところ無料コースです(;^ω^)
と、言うのも...

YouTube

無料でみれるYouTubeで勉強してました(゚д゚)!

TechAcademy [テックアカデミー]

たにぐち まことのともすたチャンネル

☝の2チャンネルも有料級の動画チャンネルとなっております!

参考書籍

これすごくいいです(*'▽')


テキスト通りに自分でコードを打って、3個のサイトを作っていきます!

上の工程を飛ばしてこちらの書籍から始めても大丈夫ってくらいに満足できるものでした(*'ω'*)

udemy

様々ジャンルな勉強ができる動画をまとめている、買い切り型のオンライン教材です。


好きな時に見られ、自分のペースで進められるのがいいです(*'▽')
普段は¥20,000近くする教材なのですが、毎月のようにセールがあるのでそこで、¥2,000くらいで買えれるので、すんごいお得感があります(;^ω^)

実践Webサイトコーディング講座 | HTML5とCSS3を使って、カフェのサイトやWebメディアサイトを作ってみよう

[HTML/CSS/JavaScript] フロントエンドエンジニアになりたい人の Webプログラミング入門

この2つを買いました!(^^)!


こちらも3個ほどサイトを動画を見ながら作っていきました
2つとも高評価です!迷ったらこれ!

udemy

参考書籍

自分の中で一応の卒業製作としてこちらで完了にしました!


この書籍も3個のサイトを作っていきます!
レスポンシブの工程もあるので中級者向けな感じがしました!

最後に...

自分はこの工程で次に進みました。一応次は...
→Bootstrap→javascript→...って、進めば良いかと思います(*'ω'*)


途中にCSS設計とかSASSを勉強するのもいいと思います!
いずれは知識として入れとかなきゃいけない分野ですからね(;^ω^)


本当に学ぶことばかりですよね(´・_・`)
でも、継続は力なりです!
一緒に頑張りましょう(''ω'')ノ



本当の最後ですが、プログラミングの参考書は分厚くて重いのでkindleを使ってます。
が、紙媒体として辞書は個人的にあった方がいいような気もしてコレも買ってます☟

おすすめの記事