しもむらのITブログ

【基礎講座】Web制作プログラミング独学手順 【まとめ記事】

,

先日に下記のツイートをしました。

✅大学生がプログラミングで稼ぐ方法
①ドットインストールなどで勉強する
②仕事を取って実績を作るorオリジナルサービスを作る
③ ②をもとに企業にアピールしてインターンor就職してスキルアップ
これで時給は跳ね上がります
私はこれで稼げました😌

上記を深堀りします。
※今回は大学生向けに書いていますが、会社員でも可能だと思います

大学生向けに無料で勉強できるサイトを紹介しています

本記事のもくじ

大学生が「プログラミングの基礎」を独学する方法

僕のプログラミング学習方法は下記です

✅僕のプログラミングの学習方法
1.Progate
2.ドットインストール
3.YouTubeで言語+tutorial
4.サイトを模写
5.ポートフォリオ制作
すべて無料で出来ます👍
※ポートフォリオは1週間を目安にサクッと公開しましょう

過去の僕はポートフォリオ作りに時間を割きましたがあまり意味は無かったです😌

ちなみに僕のポートフォリオはこちら

この記事の通りに学習を進めていけばクラウドワークスやランサーズで1万〜5万円程度の案件が獲得できるレベルになります

独学は苦しいこともあるけど頑張りましょう

それでは、まとめて解説してきます

1.Progateでプログラミングに触れる

Progateでプログラミングに触れる

まずはProgateでプログラミングに触れましょう

Progateはプログラミングに必要なソフトなどをインストールする必要がないので誰でも簡単に出来ます

Progateでやるべきコース

プログラミング学習の第一歩は現代だとProgate一択かなと。僕も新しい言語を初めて触れるときは、まずはProgateで触っています

なお、Progateを何周も回したりしている人もいますがそれではいつまで経っても稼げるようにはならないです

Progateができたらサクッとステップアップしましょう

2.ドットインストールでプログラミングを学習する

ドットインストールでプログラミングを学習する

ドットインストールを使って自分のパソコンでプログラミング学習をしましょう

プログラミングコードを書くエディタをインストールして自分のパソコンで実行します

ドットインストールでやるべきコース

ドットインストールもWeb界隈ではかなり有名なサイトになります

ドットインストールは3分くらいの動画で分かりやすく解説してくれるサイトで僕もかなりお世話になりました。

3.YouTubeで言語+tutorialで学習する

YouTubeで言語+tutorial

最近だとYouTubeで良質なチュートリアル動画が増えています
無料で学習できることに感謝しつつ学びましょう

YouTubeでやるべきコース

progateやドットインストールには申し訳ないのですが、有料版は課金しなくてOKです

なぜなら英語でYouTubeで勉強できるからです。プログラミングは英語でエラー文が表示されることがほとんどなので英語には慣れておいた方が良いです

※真面目な人は英語を勉強しないといけない?と思う人もいますがそれは必要ないです。定番の単語だけ徐々に覚えればOK Gooogle翻訳で十分に意味が分かります

4.既存のサイトを模写

ここからは、Web制作の案件を獲得するための学習になります

既存のWebサイトを模写します。模写とは既存のWebサイトと同じサイトを自分でコーディングすることを言います

模写すべきサイト

ただ、既存のWebサイトには著作権があるのでインターネットなどにアップなどはせずに学習用としてまとめておきましょう

なお、模写したら案件でも使いまわせるようにまとめておきましょう

ボタンならこんな感じでまとめると便利に使いまわせます

5.ポートフォリオ制作

ここまで出来たら、ポートフォリオサイトを制作しましょう

ポートフォリオサイトとはクライアントや就職先に自分のスキルを見せるためのWebサイトのことです

ポートフォリオサイト制作で参考になるサイト

すみません。上の動画は僕の動画です。。とはいえ、かなり作り込んだので参考にしつつ学習してみてください

↓こんな感じのサイトができます

ポートフォリオサイト

そして、この動画を参考にポートフォリオサイトを作るのも良いのですが今までの学習を踏まえて自分なりにカスタマイズしてくと、かなり勉強になると思います

なお、ポートフォリオサイトを制作したらサーバーにアップして公開しましょう

サーバーはエックスサーバーがおすすめです

ファイルのアップロード方法はこちらに書いてあります

基礎学習後のスキルアップ方法

基礎学習後のスキルアップ方法

ここまでのスキルが身に付いたら次に進むのは大きく3つ

基礎スキル後のステップアップ方法3つ

  • 営業して仕事を取る
  • インターンや就職して現場に入る
  • WordPressやデザインの学習を継続する

上記のとおり。それぞれ解説します

営業して仕事を取る

この辺りは別記事にまとめました

インターンや就職して現場に入る

やはり現場に入って仕事をするのが最もオススメ。

大学生だった僕でも新卒の初任給くらいの時給1200円でインターンをさせて頂いています

WordPressの学習もする

WEB制作の独学は以上ですがさらに学習を進めたいならWordPressを学習するのも良いと思います

WordPressの勉強方法は以下にまとめているのでここまで学習出来た方はこちらをご覧くださいませ。

Webデザインの学習もする

Webデザインにいくのも楽しいと思います

僕はWeb制作のプログラミングがメインですがこのくらいのデザインは出来ます

その辺りの学習した方法は下記にまとめました

【モチベーションの保ち方】フォローしておくべきTwitter

WEB制作を独学で勉強しているとモチベの維持が一番難しいかなと思います

僕の場合、やる気が出る日と出ない日の差が大きく、やる気が出ない日はTwitterで他人からやる気をもらっています

フォローしておくべきTwitter

すみません。最後は僕です、、、

ザックリ紹介すると

Twitterのタイムラインを見ると、皆さんTwitterでアウトプットしていますね

WEB制作はプログラミングのトレンドだけでなくGoogleのアップデートやマーケティング分野も深く関係しているので最新の情報を得られるTwitterはうまく使うと良いと思いますよ

また、プログラミング勉強に行き詰まっている人などは、Twitterなどからご連絡いただけたら、可能な限り回答します。プログラミング勉強がんばりましょう!

コメント

“【基礎講座】Web制作プログラミング独学手順 【まとめ記事】” への11件のフィードバック

  1. […] 大学生がWEB制作を独学する手順【月20万稼いだ大学生が解説】 […]

  2. […] 大学生がWEB制作を独学する手順【月20万稼いだ大学生が解説】 […]

  3. […] 大学生がWeb制作を独学する手順【月20万稼いだ大学生が解説】 […]

  4. […] 大学生がWeb制作を独学する手順【月20万稼いだ大学生が解説】 […]

  5. […] 大学生がWeb制作を独学する手順【月20万稼いだ大学生が解説】 […]

  6. […] 大学生がWeb制作を独学する手順【月20万稼いだ大学生が解説】 […]

  7. […] 大学生がWeb制作を独学する手順【月20万稼いだ大学生が解説】 […]

  8. […] す。 学習方法はスクールでも独学でもOKですなおWeb制作なら「大学生がWeb制作を独学する手順【月20万稼いだ大学生が解説】」Webデザインなら「Webデザインの始め方3ヶ月で達成可能【完 […]

  9. […] 大学生がWeb制作を独学する手順【月20万稼いだ大学生が解説】 […]

  10. […] 独学する場合は「大学生がWeb制作を独学する手順【月20万稼いだ大学生が解説】」の記事をご覧ください […]

  11. […] 大学生がWeb制作を独学する手順【月20万稼いだ大学生が解説】 […]

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です