こんにちは！
セブ島の海上に住んでいるバジャウ族でゴロゴロしてたらIT × 英語留学の「Kredo」にスカウトされた太一です。
最近はKredoで働きつつ、プログラミングも勉強しています。
そこで今回は、僕がプログラミング学習で大いにお世話になっているProgate（プロゲート）のHTML&CSSコースの無料版、有料版を使った正直な感想を書いていきます！
僕は初心者として使ってみての感想を書きますが、同じ「Kredo」で働く現役エンジニア「エイジ」のアドバイスも途中で入れていきます！
- Progateを使おうか迷っている人
- 有料版に変更しようか迷っている人
です。
たくさんプログラミングの学習サイトがあって迷ってしまいますよね。
この記事を読むことで、あなたがProgate（プロゲート）の有料版を使うべきかが分かると思います。
また、Progate（プロゲート）以外のオススメ教材はこちらの記事で紹介していますので参照してみてください。
「これからの時代、プログラミングと英語が必要そう…」 それは、間違いではありません。 あと10〜20年の間に、人間が行う仕事の約半分が機械に奪われると言われています。 そのような未来がきたとき、自分自身、そしてあなたの大切な人を守れますか？ セブ島 IT×英語留学の「Kredo」では、 政府公認ITカリキュラム 大学教授レベルのフィリピン人IT教員 スピーキングに特化した英語クラス 日本人スタッフによる学習サポート などによって、 これからの時代に必要なIT×英語のスキルが 初心者からでも最短で身につきます。 KredoのIT留学で人生を変えてみませんか？
記事のもくじ
Progate（プロゲート）とは？
Progateとは、プログラミングをゲーム感覚で学習できるサイトです。
無料から始めることが可能で、初心者向けのサイトです。
難しい説明はなく、とても分かりやすいです。
レベルが上がったり、Twitterと連携していたり、スライドでのわかりやすい説明があったりと挫折しにくい仕組みになっています。
＼Progateで学んだあとはKredoのIT留学で実践／
【卒業総数1,000名以上、就職決定率87%】
セブ島IT×英語留学のKredoでは
Progateを学んだことを応用できる、より実践的なカリキュラムをご用意しています。
Progateで基礎知識を身に付けた方はKredoでIT留学してみませんか？
Progate（プロゲート）で学べるコース
Progate（プロゲート）では以下のコースを学ぶことができます。
- HTML & CSS
- JavaScript
- JavaScript（ES5）
- jQuery
- Ruby
- Ruby on Rails5
- PHP
- Java
- Python
- Swift
- Command Line
- Git
- SQL
- Sass
- Go
- React
全部で16コース（言語）学習可能です。
Progate（プロゲート）：HTML＆CSSコースを１ヶ月ガチった感想
結論：初心者はProgate（プロゲート）【有料版】を使う価値あり
先に結論を述べると、基礎中の基礎が学べるのでゼロから勉強する方にはおすすめです。
無知の人が「とりあえずやってみよう」ということならいいサービスではないでしょうか。
しかし、ある程度知識のある人がレベルアップするための教材としては、イマイチでしょう。
HTML＆CSSについて大まかに理解できた
「あー、HTML・CSSってこんなものなんだ」って大まかに理解できます。
また、HTML&CSSがどのようなものなのか、タグの働き、書き方など基礎中の基礎は理解できるようになるでしょう。
ですが、このコースをやり終えたところで何かサイトが作れるようになるということはないかと思います。
それでも簡単で大まかなWebサイトのデザインならできるようになるでしょう。
「道場コース」が難しい
僕はこの画像部分でつまずきました。
「道場コース」というコースなのですが、上記画像を見てもらえればわかりますが、具体的にどのように間違っているのかの説明がないのです！笑
そのため、どの部分にどのような修正が必要なのかわからず、ひたすら色々な場所を修正するしかありません。
さらに道場コースでは自分なりにコードを書いていくので、見本通りの見た目になることはほとんどありません。見た目がほとんど同じでも、コードの書き方が同じになることは滅多にないのです。
これらがプログラミング学習の独学において、多くの人が離脱してく理由だと思いました。
一度わからない場所が出てくると、そこを修正できるまで次に進めず、特に独学では問題が発生した時にヘルプを求められる人がいないため続けるのが難しく感じました。
ちなみに、Kredoの先生に聞いたらすぐに解決しましたし、プログラミング学習においてはメンターを作ることが最速の習得策かなと思いました。
実戦形式の学習があまりない
ProgateのHTML&CSSコースを学んだだけで仕事を受注できたり、満足のいくWebサイトを作ることは難しいと感じました。
なぜなら、実践形式の学習があまりないからです。
メンターの重要性を感じた
また、Progateで学習することによって独学でのプログラミング学習の難しさも実感しました。つまずいてしまっても頼れる人がおらず、そのままフェードアウトしてしまうなと感じました。
多くの人がプログラミングの独学での学習を諦めてしまう理由が、メンターがいないことによって問題の解決方法がわからないことだと思います。
IT×英語留学の「Kredo」では優秀なメンターが、わかりやすく教えてくれます。
＼Kredoは大学教授レベルのIT教員＆日本人エンジニアのダブルメンター／ 【卒業総数1,000名以上、就職決定率87%】 セブ島IT×英語留学のKredoでは 大学教授レベルのフィリピン人IT教員と日本人エンジニアのダブルメンタリング！ Progateでつまずいた方は、KredoでIT留学してみませんか？
Progate（プロゲート）【無料版】とProgate（プロゲート）【有料版】の比較
改めて無料版と有料版の比較をしてみます。
値段
無料版（無料会員）：0円
有料版（プラス会員）：980円/月
以前は有料版の中にプレミアムコース（２９８０円/月）という質問できるコースがあったのですが、今は無くなっていて、この二つのコースがあります。
有料でも月980円で使い放題です。
しっかりと使うことができれば、十分元を取ることは可能でしょう。
本や他の教材と比較しすると、1000円以下でこれだけ学べるというのはとてもお得ですね。
受講可能なレッスン数
コース（言語）は先ほども紹介した通り16コースですが、それぞれにいくつかのレッスンが用意されています。
受講可能なレッスン数が無料と有料で変わるので比較してみます。
無料版：18レッスン(15コース）
有料版：76レッスン(全コース)
無料でもSass以外のコース（言語）を学習可能ですが、本当に基礎の部分です。
例えばHTML＆CSSコースの場合、初級編〜上級編の全６レッスンのうち、初級編の１レッスンしか学習できません。
プログラミングに触れてみたい、お試し感覚でするのであれば無料版でもいいかもしれませんが、しっかり学びたい人には物足りないでしょう。
有料版になると76レッスン利用可能になります。
これから新しいコースが開講される可能性もあるので、さらに利用できるレッスンも増えるかもしれません。
学習レッスン一覧表に全ての言語が載っていますので、チェックしてみてください。
Progate【有料版】を使った人の感想
ツイッターなどの口コミも参考にしてみてもいいでしょう。
１ヶ月のプロゲート有料会員期間を終えて、やれたこと。
・HTML&CSS
・JS
・jQuery
・PHP良い感じです！今後はwpサイトをドットインストールを見ながら作ってみます。
それと平行してunityとarduino系の勉強も進めます！
— s h u♪✏️ (@shu_neko1) June 20, 2019
プロゲートやドットインストールは一部有料だけど、参考書買うよりも圧倒的に安いので、初学者には是非オススメ！あ、paizaも。#プロゲート #ドットインストール #paiza #独学
— webクリエイターイカラシ (@hudousan0122) April 17, 2019
リプありがとうございます✨
プロゲート、使いました！
１ヶ月だけ有料使ってみましたスマホでできるのがいいですよね✨
ブログはWordPressで始めてるんですが、文章力がなくて、記事がなかなか書けないのが悩みです😭
— あられ✡ワーママ生活をラクに楽しく✡ (@ararearare4) June 27, 2019
プログラミングに初めて触る本当の初心者の方が、最初のステップとして使っているケースが多いようです。
ゲーム形式なので挫折しにくく、楽しみながら学習可能です。
また、僕も知らなかったのですが、スマホ版もあり隙間時間でも学習しやすいようです。
他の学習サイトとの比較
他の初学者向け、プログラミング学習サイトとも比較していきたいと思います！
Codecademy（コードアカデミー）との比較
Codecademyという学習サイトを知っていますか？
このサイトはProgateの元になっていると言われているサイトで、ゲームのように学習できる英語のサイトです。
プログラミングを学習するなら英語で学ぶ方が効率がいいので、英語とプログラミングを学習できるこのサイトはおすすめです。
【Codecademyの口コミ】
ProgateのHTML&CSS学習コース上級まで終わったから、codecademyのHTML&CSSコースやってる。こっちもわかりやすいしコード実際に打ち込めるしいいネ。
— ｚｚｚ (@awe23rgfqwasdf5) May 8, 2017
codeacademyまじでオススメです。 progateより説明が細かくて、分かりやすい。
Learn to Code – for Free | Codecademy https://t.co/JZjngsHL8J
— ふしれ (@makemebetterj) May 29, 2019
【口コミの感想】
Codeacademyの方がより細かく説明してくれる上に、コンテンツ内容が豊富なようです。
英語も比較的簡単な英語を使っており、理解しやすいという意見がありました。
【英語でプログラミングを学ぶメリット】
英語でプログラミングを学ぶメリットは以下の６つです。
- プログラミングの理解スピードが上がる
- 英語での情報量が圧倒的に多い
- 海外の開発拠点が増加している
- 海外のエンジニア年収は日本人より高い
- 国内マーケットの縮小による外国人エンジニアの増加
- レベルの高い仲間に出会えたり、コミュニティに入ることができる
詳しくはこちらの記事を読んでみてください。
ドットインストールとの比較
ドットインストールもProgateと同じく、おすすめのサイトとしてよく紹介される学習サイトです。
大きな違いは、動画で学習するという点でしょう。
一本の動画が３分以内なので、時間がない方でも学習可能です。
【ドットインストールの口コミ】
超初心者の私は #プロゲート と #ドットインストール の有料プランどちらとも試しましたが、9:1ぐらいの比率で”Progate”から始めてよかったと心から感じます。ドットインストールはドットインストールで学べること部分たくさんありますが挫折を防ぐという意味でも最初に #Progate 選んで良かったです🙇♀️ pic.twitter.com/rHRlJ8BvIo
— ナナ＠稼ぐ力をつけて月5万稼ぐ💰 (@growup2019) 2019年6月27日
ドットインストールは「〜だから〜します。はい次は〜」という感じで流れでガンガン進んでいく。ガチ初心者にはちとスピーディーすぎると思う。
なのでprogate（有料）で基礎知識つけてドットインストール（有料）をやったほうがタイムコスパ高く学習効率がいい。
— けいちむ@プログラミング白帯 (@hellonewworld69) June 26, 2019
【口コミの感想】
ドットインストールは学びやすいという意見の一方で、Progateをしてからドットインストールを学ぶ方が理解しやすいという意見もありました。
一つの動画が３分以内なので、たしかにスピードは早く感じるかもしれません。Progateで学んでからの方がより理解が深まるでしょう。
Progate：HTML&CSSコースで学べる内容【無料版】
Progate：HTML&CSS初級編
初級編（無料）で学べるのはHTML&CSSの基礎中の基礎です。
7つの章があり、それぞれ合格しなければ次の章に進むことができません。
- HTMLに触れてみよう！
- CSSに触れてみよう！
- レイアウトを作ろう！
- ヘッダーを作ろう！
- フッターを作ろう！
- コンテンツを作ろう！
- お問い合わせフォームを作ろう！
この順番にHTML・CSSを学んでいきます。
例えばHTMLに触れてみよう！という第１章では、リンクの設定方法や画像の挿入方法、リストの表示のさせ方などを学んでいきます。
第１章ではまずHTMLに触れることから始まり、HTMLの役割、書き方などを学びます。
このようにまず始めにスライドで勉強した後に実践に移り、実際にコードを書きそれぞれのタグがどのような働きをするのかを確認しながら進むことができます。
７章を終了する頃にはWebサイトのだいたいのアウトラインが作成できるくらいのレベルになります。
Progate：HTML&CSSコースで学べる内容【有料版】
ここからは有料会員になることで受講可能になる中級編、上級編で学べることをご紹介！
Progate：HTML&CSS中級編
中級編（有料）ではどのようにランディングページを作成していくのかを学習します。
ランディングページとはサイトに訪問した人が一番初めに見るWebサイトのページのことです。ランディングページは、商品の購入やお問い合わせなどユーザーが行動を取りやすくするためのページなので、売り上げに大きな影響を与えるのでとても重要なページになります。
中級編も７つの章から成り立っており、学習のプロセスも初級編と同じく初めにスライドで学習をしてから、実践に移ります。
- レイアウトを作ろう
- トップ部分を作ろう
- ヘッダーを作ろう
- レッスン一覧部分を作ろう
- メッセージ部分を作ろう
- フッターを作ろう
- ヘッダーを固定しよう
Webページの構成はヘッダー、トップ、レッスン、メッセージ、フッターの5つのコンテンツから構成されており、それぞれの作成の方法を学んでいきます。
また、トップ部分のレイアウトを作成し、お問い合わせなどをするために必要なボタンを作成していきます。さらに、ボタンをクリックした時のアニメーションを加える方法や、背景画像の設定の方法も学習します。
その他、文字を中央に寄せる方法や、文字の間隔を変更する方法を学ぶことができ、より細かくこだわったデザインをすることが可能となります。
Progate：HTML&CSS上級編
上級編（有料）ではレスポンシブデザインの作成方法を学びます。レスポンシブデザインはWebサイト作成時にとても重要なスキルです。
レスポンシブデザインとはスマホ、タブレット、PCなど異なる画面幅でウェブサイトを見た時にレイアウトを崩すことなく、綺麗に保つ方法です。タブレットなどでサイトを訪れた場合に、デザインが崩れるのを防ぎます。また、それぞれの特徴に基づいて異なったデザインを設定することもできます。
また、メディアクエリ（Meadi Queries）というタグの使用方法も学びます。メディアクエリとは、条件を満たせばCSSが適応されるようになるためのタグです。
- レスポンシブデザインとは
- メディアクエリ
- レスポンシブデザインの実装
Progate : HTML&CSS「道場コース」
僕が今現在まさにつまずいたところがこの道場コース。
道場コースでは、見本となる完成デザインのみをヒントに、デザインを模写していきます。また、道場コースも初級編・中級編・上級編の３つに分かれており、それぞれ学習コースで学んだことを実践的にアウトプットしていきます。
このように、画面右下の見本のみをヒントに、自分なりに「このデザインならこのタグを使おう」と考えながらコーディングしなければならないため、学習コースに比べると難しいです。
そしてこの道場コースをやりながら「プログラミングは試行錯誤の上に成り立つ」「エラーを自己解決する力がかなり必要」だということに気づかされました。
ネットではエラーを自己解決する力が大切と書いてありましたが、実際に自分がその立場に立つと、改めてその重要性を実感しました。
今後、プログラマー、エンジニアを目指すのであれば避けては通れない道ですね。
Progate：HTML＆CSSコースを終えて
ProgateのHTML＆CSSコースを終えてできるようになることは、HTML・CSSについて少し理解する程度だと思います。
HTML＆CSSの基礎中の基礎は理解できるようになるでしょう。
ゲームのように進められるので挫折しにくく、僕のような本当の初心者がHTML・CSSに触れるきっかけとしてはいいと思います。
ですが、このコースをやり終えたところで何かサイトを作れるようになることはないと思います。
このコースだけやり終えて仕事にすることは難しいと感じました。
まとめ：Progateの次のステップは「Kredo」がおすすめ
Progateで基礎を学んだ後は、IT×英語留学の「Kredo」がおすすめです。
なぜならProgateは基礎は身につきますが、実践的な力は身につきにくいからです。実践的な力を身につけるにはスクールに通う必要があるでしょう。
さらに、「Kredo」では英語でプログラミングを学習することができますし、分からないことがあった時にすぐに聞くことができます。
Kredoの先生はフィリピン人で、とても親身になり教えてくれます。先生1人に対しての生徒数も少ないので分からなければすぐに質問できる環境が整っています。
これからプログラミングを学習したい、プログラミング学習で挫折してしまった、英語も身につけ将来優秀なエンジニアを目指したいという方はぜひ、KredoのIT×英語留学を検討してみてはいかがでしょうか？
「これからの時代、プログラミングと英語が必要そう…」 それは、間違いではありません。 あと10〜20年の間に、人間が行う仕事の約半分が機械に奪われると言われています。 そのような未来がきたとき、自分自身、そしてあなたの大切な人を守れますか？ セブ島 IT×英語留学の「Kredo」では、 政府公認ITカリキュラム 大学教授レベルのフィリピン人IT教員 スピーキングに特化した英語クラス 日本人スタッフによる学習サポート などによって、 これからの時代に必要なIT×英語のスキルが 初心者からでも最短で身につきます。 KredoのIT留学で人生を変えてみませんか？
