期間限定でWordPress開設が41%OFF!11/8まで

Progateが終わったら次にやるべき5ステップ【Progate沼から抜けよう】

Progateが終わったら次にやるべき5ステップ【Progate沼から抜けよう】

Progateで一通り学習が終わったけど、次は何したらいいの?
Progateやったは良いけど、稼げるビジョンが全く見えません・・・。

Progateで一通り学習すると、「終わったけど、次どうすればいいの?」ってなるんですよね。

私も最初はProgateで学習しましたが、「次どうしよう」ってなったんですよね。

Ken

この記事を書いている私(@kenyellblog)はProgateのレベルが120を突破しました。
Progateを経由して、現在はWeb系の現役エンジニアとして働いています。

Progate利用者は多いものの、同時に次のステップが分からない人も増えています。

この記事の内容

Progateでの学習を終えた後に取り組むべきことを5ステップで解説します。
Web系の言語を学習した後という想定の記事内容になっています。
『次やるべきこと』を紹介するので、この記事を参考にしつつ取り組んでみて下さい。

この記事を読み終えれば、Progateを終わらせた後に何を学習すべきかが分かり、迷いが無くなります。

【結論】Progateが終わったらスキル定着をしよう

早速結論ですが、

Progateが終わったらスキル定着のための行動をする

というのがベストです。

【結論】Progateが終わったらスキル定着をしよう
具体的にいうと、見たら理解できるレベルから自分で書けるレベルになりましょうという事です。

考えてみて欲しいのですが、Progateが終わった後に「じゃぁWebサイト作ってみて」って言われても不可能だと思います。

これはProgateの周回が足りないとかそういう話ではなく、そもそもProgateの範囲外なんですよね。

ということで、自分で実際になんでもいいからサイトを作ってみるというのが最適解となります。

おすすめは以下の5ステップです。

Progateが終わった後の5ステップ

  • 自分で開発できる環境を整える
  • サイト模写でスキル定着
  • Javascript・jQueryの学習も始める
  • さらに学ぶのであれば、WordPressを学習 or PHPやRubyなどのバックエンドで使う言語を学ぶ
  • ポートフォリオ作成をして、目標達成にグンと近づける

上記の5ステップについてこれから具体的に解説していきます!

ステップ1:自分で開発できる環境を整える

ステップ1:自分で開発できる環境を整える

Progateはブラウザ上でコードを書いて、すぐに結果を見ることができていましたが、実際はそうもいきません。

自分でコードを効率よく書いていくためのエディタも必要になってきます。

また、書いた後にどうやって結果を確認するか(自分の作ったWebページを見るか)も合わせて学習する必要があります。

Progate終わりにすべきことは、まずはステップ2での準備という事ですね。

おすすめのエディタはVSコードなのですが、詳細はステップ2で合わせて解説していきます。

Ken

ステップ2の内容で準備方法についても触れていきます!

ステップ2:Progateが終わったらサイト模写でスキル定着

ステップ2:Progateが終わったらサイト模写でスキル定着

Progateを習った後は、「読めば理解できるけど、自分では書けない」というレベル。

これを、「自分でも書ける」というレベルに高めることが必要でして、おすすめはサイト模写となります。

自分の好きなサイトを見ながら、そのサイトの見た目に近づくようにコーディングしていくという事ですね。

サイトの模写で身に付くスキル

  • デベロッパーツールの使い方
  • HTML・CSSについてより深い理解を得る(自分の力で書けるように)
  • プロのデザインについて、体験を通して学ぶ

上記のスキルが身に付きまして、私もサイト模写から始めました。

自分のレベルではまだできないなと思った人へ

「サイト模写か・・・ちょっと自分のレベルではまだ難しいかな」と思った人が結構いると思いますが、挑戦だけしてみてください。

Progateを何周もしたところで、Progateのやり方と模写コーディングのやり方は別物なので、上記の不安が完全に消えることはないです。

一旦やってみる→無理過ぎ・・・となったら、Progateに戻るくらいの感覚でOKです。

この模写コーディングで悩む人も多いと思ったので、当サイト『プログラミングエール』では以下の2記事でサポートしています。

【難易度別】初心者にもオススメな模写コーディングにうってつけなサイト9選 【難易度別】初心者にもオススメな模写コーディングにうってつけなサイト9選 初心者にもおすすめな模写コーディングにうってつけなサイトを9つ、初級者・中級者・上級者に分けて紹介します。最初は簡単な模写コーディングから始めて、自分でサイト作成ができる技術レベルまでもっていきましょう! 【準備編】模写コーディングの具体的なやり方【自分もこれで鬼成長しました】 【準備編】模写コーディングの具体的なやり方【自分もこれで鬼成長しました】 模写コーディングのやり方を、具体的に解説します。必要なものの準備から実際に書き出すまでをしっかりサポートするので、これから模写コーディングを始める方はこの記事を参考にして模写コーディングを始めてみましょう。

これで模写コーディングに関する準備も完了し、やり方の知識も集まるので、上記記事を参考にぜひ挑戦してみて下さい。

ステップ3:Javascript・jQueryの学習も始める

ステップ3:Javascript・jQueryの学習も始める

模写コーディングなどでHTMLとCSSがしっかりと学習出来たら土台が出来上がっているので、JavascriptとjQueryも学習していきましょう!

動きのあるサイト作りに必須な言語でして、Web制作・Web開発をしている人なら必ず学習するレベルの言語ですね。

HTMLとCSSの土台がしっかりしていればそこまで苦労しないかと思います。

Ken

jQueryから先に学習したらより簡単に感じるかもしれません!

こちらについても、しっかりとアウトプットをしていきましょう。

Javascript・jQueryのアウトプット例
  • ミニゲームサイトの作成
  • jQueryを使用したハンバーガーメニューの作成

上記のような内容でアウトプットする人が多いですね。

Ken

私は○×ゲームを作成しましたが、ビンゴゲームやスロットゲームなど、簡単なルールのものなら何でもいいです。

ステップ4:WordPressか、バックエンドで使う言語を学習

ステップ4:WordPressか、バックエンドで使う言語を学習

そこまで学習出来たら、今後できることを増やすためにもうちょっとだけ学んでいきます。

目指す方向によって、学習内容は異なってくるのですが、以下の通り。

ステップ4:WordPressか、バックエンドで使う言語を学習

  • Web制作を目指す人:WordPressを学習
  • Web開発を目指す人:バックエンドで使う言語を学習

急によくわからない単語が出てきた・・・となっている人もいると思いますが、以下のような感じ。

Web制作を目指す人

Web制作で稼ごうと思ったら、WordPress学習がひとまずのゴール地点かなと思います。

WordPressとは

サイトの作成やブログの作成などができるCMS(コンテンツ管理システム)の1つ。

Web関連技術が無い人でもサイト管理や記事投稿ができるため、世界中のサイトでWordPressが活用されている。

当サイト『プログラミングエール』もWordPressを使っています。

世界中のサイトで使われていると書きましたが、本当にその通りで、案件も豊富ですね。

Web開発を目指す人

一方、Web開発を目指す人は「バックエンドで使う言語を学習すべき」で、具体的には以下のような感じ。

バックエンドで使う言語って?

PHP、Rubyなどですね。

ユーザーから目に見えないところで活用し、データベースとのやりとりでよく使います。

例えばログインのときは、上記のような言語を使ってデータベースに会員の情報があるか調べ、ログインの成功・失敗の結果を出すような感じで使います。

Web制作を目指す人とWeb開発を目指す人でやることは異なりますが、一通りの流れとしてはイメージがつかめたのではないかと思います。

なお、学習方法についてはどちらも「実際に触ってみる」ということが必要ですね。

Ken

WordPressは実際にサイトを立ち上げて実際に触るべきだし、Web開発の方は実際に自分でサービスを作ってみるべきです。

WordPressを使ったサイトの立ち上げ方は、以下の記事で誰でも分かるように紹介しています。参考にしてみてください。

ポートフォリオを公開するならConoHa WINGで30分で完了!【HTMLやWordPressも】 ポートフォリオを公開するならConoHa WINGで30分で完了!【HTMLやWordPressも】 この記事の通りに進めれば、30分でWordPressの立ち上げ・ポートフォリオのアップロードが完了します!ポートフォリオ作成時のホスティングやWordPress学習の参考になる記事になっています。

ステップ5:ポートフォリオ作成で目標達成にグンと近づこう

ステップ5:ポートフォリオ作成で目標達成にグンと近づこう

最後のステップとして、ポートフォリオの作成をやって完了です!

目標を叶えるときに大きな力を発揮してくれるのがポートフォリオです。

自分の制作物や、スキルをまとめたページのことで、ポートフォリオを使用しての提案・面接をすることで案件獲得や就職の目標を叶えるときに武器になります。

上記のような感じで、最近は競争が激化しており、ここまでやらないと厳しいのではないかな・・・と思っています。

Ken

今までやってきたことの集大成、という感じですね。
このポートフォリオのレベルが高ければ競合を出し抜けるので、力を入れて取り組みましょう!
関連記事
【大学生向け】エンジニア志望者がポートフォリオを作るべき理由と作り方を解説 【大学生向け】エンジニア志望者がポートフォリオを作るべき理由と作り方を解説 エンジニア志望の大学生はポートフォリオを作成すべきですが、その理由と作り方についても具体的に解説していきます。ポートフォリオの重要性だけでなく、作り方も同時に学んで面接で勝ち抜きましょう!

大学生なら、Progate終わり+αでインターンに応募するのもあり

大学生なら、早い段階でインターンに応募するのもあり

Progate終わりにも模写コーディングくらいの経験を積み、自分でサイトを作れますよくらいのスキルがあればインターンにも受かる可能性もあります。

上手くいけば「学びながら稼げる」という最高の環境が手に入ります。

自分も長期インターンでバイトをしていたのですが、メリットしかありませんでした。

インターンのメリット

  • バイト代が出て、月10万も達成(時給が一般的なバイトの2倍とかでした)
  • 現役エンジニアに直接質問できる
  • より実践的なスキルを学ぶことができる

もし周りにインターン生を募集している所があれば考えるのも良いですね。

大学生がクラウドソージングなどで稼ぐことは可能か?

逆に地方大学生だと、インターンのような手段をとれませんよね・・・。

クラウドソージングなどで稼ぐことになると思いますが、Progate終わりたてで稼ぐというのは不可能です。

先ほども書いたように競争が激化しており、ポートフォリオ作成などで実績を開示できるようになってから挑戦したほうが良いですね。

関連記事
大学生がプログラミングを始めても稼げない確率は高い【逆にチャンスあり】 大学生がプログラミングを始めても稼げない確率は高い【逆にチャンスあり】 大学生がプログラミングを始めても稼げないのか?について解説します。結論ですが、挫折率は高いけど挑戦する価値ありですね。諦めずに継続できた時のリターンが大学生にとってはでかすぎる。私も大きなメリットを得ました。

Progateが終わったらサクッとProgate沼から抜けよう

Progateが終わったらサクッとProgate沼から抜けよう

Progateを何周しても、たった一回の実践的なコーディングには敵いません。

Progateを早めに終わらせて、模写コーディングなどの「スキル定着」ができるような行動をするのがオススメです。

最後に、この記事のまとめです。

Progateが終わったらやるべきこと
  1. 実際にコーディングするための準備
  2. サイト模写などでスキル定着をする
  3. Javascript・jQueryの学習
  4. WordPressやバックエンドの言語の学習
  5. 全体的なレベルを高めつつ、ポートフォリオを作成する

ということで、まずは『【準備編】模写コーディングの具体的なやり方【自分もこれで鬼成長しました】』の記事で準備をしてみてください。

とはいえ、Progate終わりからの難易度は上がる

最後に悲報ですが、Progate終わりからの難易度は多少上がります。

答えがなく、エラーや分からないこととの戦いの連続になっていくためですね。

プログラミングは、特に最初の段階は想像よりも何倍も難しいです。

Ken

思ったよりも難しかった・・・とならないよう、この記事を読んでしっかりと再認識してもらえると嬉しいです。

Progate終わりからは継続が鍵となっていきます。

この記事でこの先すべきことを見て「自分ではやりきれなさそう」と思った人はスクールを検討するのもアリですね。

Progate終わりに?と思うかもしれませんが、プログラミングスクールは完全初心者にはハードルが高いから、むしろProgate終わりの方が良いです。

HTML・CSSの基礎が分かった上でスクールに通い、その先をガッツリ学ぶというやり方でプログラミング学習をする人は良く聞きますね。

以下の記事でおすすめのスクールを7社に絞って比較しているので、スクールの方向性もアリかなぁと思った人は読んでみてください!

スクール=高い!と思って避けがちですが、中にはそうでないところもありますので、検討の余地ありです。

神コスパのプログラミングスクール7社を徹底比較!【実体験アリ】 神コスパのプログラミングスクール7社を徹底比較!【実体験アリ】 コスパの高いプログラミングスクールに絞って目的別に比較しました。プログラミングスクールで悩んでいる方は、この記事を読めばどのスクールにすべきか絞り込むことができますよ。

Progate終わりからが本番です。応援しています!