プログラミング

Web制作の勉強法【完全まとめ】

Web制作の勉強法【完全まとめ】

こんにちは、現在Web系フリーランスとして3年ほど活動しているしょーごと申します。

この記事では「Web制作の勉強法」についてまとめていきます。

Web制作の準備

Web制作を始める前に、どれぐらい費用がかかるのか、何を準備したらいいのかを知っておくことは大事です。

Web制作・デザインのおすすめPC紹介!

私はかなりギリギリのスペックのMacBookを買ってしまい、結局耐えきれず買い直すことになりました。

Windows,MacBook関わらず、この記事にある「最低スペック」をご自身のPCが超えているかをぜひ確認してみてください。

Web制作(フリーランス独立)でかかる全費用を解説!

Web制作を仕事にしようとすると、意外に多くの費用がかかることに驚きます。

特に直近のキャッシュフローが安定していない・お金がカツカツの人は危機に陥るので、何にどれぐらいかかるのか予め確認しておきましょう!

この記事ではWeb制作にかかるほとんどの費用を解説しています。

全てはProgateから始まる

プログラミング学習はやはりProgateから始まります。

ただし学習の仕方を間違えると延々とProgateから抜けられなくなるため、

正しい学習方法に関しては記事に書いておりますのでご参照ください。

Web制作をスクールで学ぶ

私はスキル面を「メンターのいるスクールで学ぶ」ことをおすすめしています。

全く知らない分野を自分一人で学習するのはめちゃくちゃきついです。

個人的にはデイトラ」一択です。

Web制作の独学で行う【ロードマップ公開】

独学で、Web制作を一から学んで実務まで一直線にいける独学ルートを無料公開しています。

しょーご
しょーご
お金が全然ない人、普段から学習する習慣がある人向けです。苦難の道ですが、やり遂げた人はいます。

このルートに沿っていただければ実案件レベルまでたどり着くことができます。

基本ルートはこの記事で大丈夫です。

ピンポイントの学習方法

ロードマップを基本にしていただきながら、その他細かいポイントを解説していきます。

検証ツールの使い方

Web制作を行う上で「検証ツール」は最低限使いこなす必要があります。使い方を復習しておきましょう!

Chromeのいれておくべき拡張機能

Web制作学習を始める前に、Chrome拡張機能をあらかた入れておきましょう!

学習効率も上がりますし、実案件でも使います。

VSCodeのおすすめプラグイン

VSCodeはWeb制作でもプログラミングでも広く使える神エディターです。

使い始める前に、必要なプラグインはあらかた入れておきましょう!

JavaScript学習方法

Web制作においてJavaScriptは避けては通れないところです。

Web制作に特化したJavaScriptの学習方法や教材を出しています。

PHP・WordPress学習方法

WordPressはもちろん、Web制作の実務ではよく「PHPの実力不足」を痛感することになります。

その際に自分が「これはよかった!」というような学習方法や教材を紹介しています。

WordPress学習方法

PHP学習方法

WordPressを理解するには、PHPでの超簡単なシステムを作る経験(CRUD実装)を通して、仕組みを理解するのが近道です。

WordPress・PHPを動画で学ぶ

テキスト学習よりも動画学習の方が難しい分野ほど効果的です。

おすすものWordPress・PHPのUdemy講座をまとめており、これまで独学で挫折してしまった人はこちらを参考にしてみてください!

WordPressサイト公開練習

実際の案件ではサイトの公開まで行うことが非常に多いです。

また、ブログをWordPressで行っておくと、WordPressの学習が非常にスムーズになります。

HTMLサイトの納品でもFTPを使っていきなり実案件でファイルをやり取りするのは怖いので、

自分のサーバーでHTMLサイトを公開する手順をぜひ練習しておいてほしいです!

ここでは【10分】でHTML・WordPressサイトを構築&公開する方法を解説しています。

Web制作おすすめ本まとめ

これまでWeb制作関連で使ってきておすすめの本をまとめました。

Web制作がコーディング以外に多様な領域と隣接しています。

  1. プログラミング
  2. webマーケティング
  3. webデザイン

の分野の本をまとめています。

模写はしなくて良い

Web制作を学ぶ上で、「模写」という言葉を聞く機会が多いと思いますが、個人的に模写はいらないと思っています。

模写≠デザインからのコーディング

私のロードマップにも「模写」は採用しておりませんが、

どういうこと?」と思われた方は、以下の記事で確認しておいたほうがいいです。

Webデザインを学びたい場合

実践形式でおすすめのWebデザインスクール・サービスをまとめています。

Webマーケティングを学びたい場合

Webマーケターとして就職・転職に特化したスクールを紹介しています。

他のまとめ記事一覧↓

Web制作案件獲得方法【完全まとめ】

Web制作実案件の進め方・流れ【完全解説】

Web系の仕事で役立つ便利ガジェット・サービス

あなたに是非読んでほしい記事です!