Web制作 学習方法

Progateは無料でどこまで学べる?有料プランで副業できるのか徹底解説!

最初にWeb制作、プログラミングをやろうとしたときに、おすすめするのはProgateです。無料でコードに触ることができる。ゲーム感覚でプログラミングを学べるということで、とっつきやすさが魅力です。

私自身、何からやったら良いのかわからないときにProgateから始めました。そんなProgateですが、どんなことを学べるのか、Progateの有料プランを終えたら副業が始められる程のスキルが手に入るのか?を解説します!

この記事では、Progateの「HTML&CSS」コースに重きをおいて解説しています。

Progateとは?初心者に選ばれる理由

Progate(プロゲート)は、オンラインでプログラミングを学べるサービスです。コンセプトがプログラム初心者が独学で挫折せず学べるように、本物のスキルが身につくようにと考えられている教材です。

初心者から、創れる人に

Progate

スライド式のわかりやすい解説、コードを書いてすぐに反映されて目で見てわかる形式、可愛らしいキャラクターの解説などなど、初心者にも入りやすい仕組みが満載です。

アプリもあり、選択方式でコードに触れることができます。

全くの初心者だった私にも抵抗なくプログラムに触れることができて、「コードに触れる最初の一歩」にとても適している教材です。

事実、私の周りでも「まず何をやったら良いですか?」といった質問をされたら「まずはProgateに触れてみて」と返しますし、他のWEB制作されている方もそのように答えます。

自身の経験や、評判からも初心者の方に勧めやすい学習教材です。そういった面もあり、初心者に選ばれやすいと思います。

Progateで学べる言語

Progateで学べる言語一覧です。

本当に最初の最初は赤文字のHTML&CSSを学ぶと良いです。

  • Javascript
  • Python
  • SQL
  • Java
  • Command Line
  • Git
  • PHP
  • Ruby
  • Ruby on Rails5
  • Node.js
  • jQuery
  • React
  • Sass
  • Go

環境構築が不要ですぐ始められる

プログラムを書いたり、Webサイトを作り始める最初に「開発環境の構築」と呼ばれる下準備があります。

これもまた難しく、初心者のハードルを上げていると思うのですが、こういった面倒な環境構築をせずに、すぐに取り掛かることができます。

まずはコードに触れるという目的を簡単に果たせます。

Progate無料プランでできること

Progate無料プランでは、各コースの初歩的な部分に触れることができます。

それぞれの言語の特徴や書き方をサクッと確認できるので、まずは興味がある言語を触ってみるのが良いでしょう。

そもそも何を触ったら良いかわからない、という方はProgate側がおすすめしている「初めてのweb開発をやってみよう」をやってみましょう!学べる内容はHTML&CSSコースとほぼ同じです。

私は右も左もわからないときは「HTML&CSS」コースを進めましたので、プログラミングってどんな感じだろうと掴むのに最適です。

どこまでできるの?

無料プランでできるレベルは、たくさんある言語の特徴を知る、軽く触れてみる、レベルですので触って何かができるようになる、というのはちょっと難しいかもしれません。

触ってみて興味が持てたら有料プランで学んだり、本などの教材を調べてみるといった流れが良いです。
月のプランでも月額1490円と、書籍一冊買うより安いので有料プランを試してみるのがおすすめです。本は色々種類あってややこしいですしね。

また、コードに触れてみることで、向き不向きがわかります。コーダー、プログラマーというのは向き不向きが大きく出ると感じます。

そもそもコードに触れていて楽しくない、わけがわからなくなっちゃう、という方はあまり向いていないかもしれません。そういったことを確認するためにも、無料プランで触って実際にコードに触れてみることをおすすめします。

例えば、HTML&CSSコースなら、以下のことを無料で学べます。

HTMLの構造(webサイトを作る骨組み)の仕組み
CSS(webサイトを綺麗に装飾するコード)を2~3種類

しっかりとコードに触れるので、不向きの方はこの時点で苦手かも…。と判断できます。

楽しいな、やってて特に苦にならない方は有料プランを検討しても良いかもしれません。

1~2時間程あれば学習できる内容です。

有料プランでできること

PLUSプランにすることで、全てのコースを受けることができます。全てのコースを学ぶとどこまでのスキルが身につくのでしょう?

HTML&CSSコースを例に見てみます。

HTML:Webサイト一つを作り上げる
CSS:サイト一つ作り上げるのに合わせて、多数のできることを学ぶ

HTMLとCSSはセットです。無料プランですとWebサイトの初級編の半分まで、1~2時間ほどのボリュームです。

有料プランだと初級の残りから、全部のレッスン、約20時間もの学習ボリュームがあります。

解説スライド付きの「レッスン」とレッスンで習ったことを0から書く「道場」があり、やりごたえ抜群です。
しっかりやると20時間じゃすみません。

  • 初級:webサイトの基本、基盤の学習
  • 中級:LP(ランディングページ)を1ページ制作
  • 上級:中級で作ったLPのレスポンシブ(パソコン、タブレット、スマホのそれぞれで表示を変える方法)

これらを学びます。

つまり、有料プランを通してHTML&CSSでは、レスポンシブに対応したLPの作り方を学ぶことができます。

上級の後に「flexbox」について学びます。現在主流になっているflexboxを学ぶことができるので、ここまで終わらせることをおすすめします。

レッスンと道場

レッスンでは、見本を参考に、書き方、CSSの意味、HTMLの書く場所などのナビゲート付きで進めて行きます。

無料プランでも見られる方法と同じで、解説スライドを見ながら進めていきます。楽しいです。

最初は覚えることが多いので、少しずつ進めることをおすすめします。

道場ではレッスンで覚えたことを一から自分でコードを書いていきます。

見た目が揃えばそれで良し、なのですが非常に難しいです。判定がシビアなため、あまり根を詰めると嫌になってしまいます。

ちょっとやってみて、わからなかったら復習する、位の温度感で進めたら良いです。

見た目完全に同じなのに違う判定も出ます。中級の道場のボタンはopacity0.7と仕様書にありますが、0.8といった罠もあります。

有料プランのHTML&CSSコースの後

今回はHTML&CSSコースについて深堀りしていますが、同コースが終えた後はjavascriptコース、jQueryコース、PHPコースなどを触れてみるもの良いです。

javascriptはWebサイトを作るうえで必ず必要になります。jQueryも同様です。

PHPは、お問い合わせフォームや、WordPressというCMS(コンテンツ・マネジメントシステム)に深く関連するため、いずれ必要になります。

腰を据えて学習する際には、これらのコースを優先的に進めることをおすすめします。

有料プランで副業ができる?

Progateは副業をできるほどにスキルが身につくのか?実際に実務をこなしている私が一通りやってみました。

Progateのカリキュラムだけでは、実務レベルに到達するには少し物足りないと感じました。

初心者向けのカリキュラムと謳われているだけあって、非常に入りやすく、操作性もよいのですが、

最初に何をしたら良いのか?
どのような形でWEBサイトとして機能させられるか?
など、課題が見つかります。整っているからこそ、自分で走り出すときにわからなくなってしまいます。

以下は個人的な視点のProgateの感想です。

WEBサイトの仕組みがわかる
HTML,CSSがどのようにWEBサイトに影響を与えられるかを知れる
コードの見方がわかるようになる
コードに触れるたら何が変わるかがわかる

Webサイトを作ろう!となったときに最初に何をすべきかがわからない
「コードの編集方法」はわかるけど、そこまで行けない
デザインツールについての言及がない
Webサイトの公開方法がわからない

副業として、webサイト制作に携わろうとすると様々なことを覚える必要がありますが、その中でもコードを触る内容を覚えられる感じです。

一貫した内容を覚えたいときは、書籍「1冊ですべて身につくHTML & CSSとWebデザイン入門講座[第2版]」をおすすめします。

コーディングを始める段階から、サイトを制作、アップロードまで一連の流れを覚えることができます。

また、本格的に続けたいと思う方は、オンラインスクール「デイトラ」のWeb制作コースをおすすめします。

私自身、Progate→デイトラ→フリーランスという道を歩んできましたので、間違いなくスキルが身につきます。

まとめ:Progateの無料の範囲・有料の学習内容。Progate後の動き

WEB制作初心者におすすめの教材「Progate(プロゲート)」のHTML&CSSコースについて、無料プランの範囲、有料プランを完走したら副業ができるレベルまでスキルが身につくのか、を検証しました。

無料プランでは、HTML,CSSの簡単な仕組みまで

有料プランでは簡単なLP(ランディングページ)1ページを作成し、
レスポンシブ(パソコン、タブレット、スマホによって表示が変わる)
で表示する方法まで

有料プランを完走したら副業としてWebサイトを作れるか?→厳しい

Progateを終わったあとにおすすめの動きは?

コードが触るのが嫌になっちゃった→WebデザインやWebライターなどをおすすめします。

もうちょっと触ってたい、もっと知りたいな

→予算はかけたくない
書籍、Udemy(セール時を狙いましょう)をおすすめします。

→予算はある程度かけられる
オンラインスクール「デイトラ」のWeb制作コースをおすすめします。

最後までご覧いただきありがとうございました!

-Web制作, 学習方法