気まぐれで軟体動物やってます!!

介護士たこにゃんが伝える、ためになる?ブログ

Progateを実際にやってみました

f:id:taconyan:20190907150928p:plain

誰でも覚えられるプログラミング

前回はProgateの大まかな内容について解説しました。

 

www.kimagure-taco.com

 

 

Progateは本当によく作られているので、初心者がプログラミングに触れるきっかけとしてはとてもオススメできます。

 

今回はProgateの実際の勉強用の画面を解説します。

f:id:taconyan:20190907144133p:plain

Progateレッスンメニュー

こちらがメニュー画面です。

初めはこちらの「HTML & CSS」を進めていくことをオススメします。

 

欲張って、他のレッスンも受けたくなるとは思いますが、他のレッスンを同時並行で進めるのは大変です。

 

一通り終わった頃には、はじめに勉強した「HTML & CSS」を忘れてしまうので、一つずつマスターしていったほうがいいと思います。

 

こちらを学んでおけば、ブログの編集ぐらいはできますので基礎だけでも知っておいたほうがいいと思います。

 

f:id:taconyan:20190907144607p:plain

レッスン内容

レッスン内容はこんな感じですね。

目安の時間も書かれており、こちらは4時間ほどになります。

 

これは基礎なので、スライドも細かく丁寧に作られていますが、他のレッスンは1時間〜2時間ほどのものが多いです。

 

f:id:taconyan:20190907144732p:plain

スライド画面

 

レッスンを進めるとこのようなスライド画面が出てきます。

 

図解で解説してくれますので、とても見やすくて理解がしやすいです。

 

f:id:taconyan:20190907144914p:plain

スライド解説画面

スライドの解説画面です。

こちらは一番基礎的な「h1タグ」の解説になります。

 

とても丁寧に作り込まれているスライドだということがわかりますね。

 

プログラミング初心者の人でも、勉強しやすいように作られているので、プログラミングの知識が全くない人でも安心して進めることができます。

 

f:id:taconyan:20190907145133p:plain

左:課題部分

画面の左には課題が表示されています。

 

基本的には左の課題通りに入力をしていけば、プログラミングが作動するようになっています。

 

練習問題になっているので、左画面の指示通りに入力していきましょう。

 

f:id:taconyan:20190907145511p:plain

右:プログラミング表示画面

右側にはプログラミングで入力した内容が表示されます。

 

上が自分が入力したコードになります。

表示されている「Hello,World」の文字が小さいですね。

 

下が完成後の画面になります。

Hello,World」が大きくなっていますね。

 

上の画面が下の画面と同じになるようにしましょう。

 

f:id:taconyan:20190907145336p:plain

真ん中:入力画面

左の課題をこちらの真ん中に入力していきます。

 

メモ帳のように入力していくことができます。

 

f:id:taconyan:20190907145826p:plain

入力例

こんな感じで

[<h1> Hello World</h1>]

と入力します。

 

f:id:taconyan:20190907145927p:plain

クリア画面

右上の文字に「h1」が適応され大きくなりました。

 

この状態で「次へ」ボタンを押すと「 Congratulations!!」と出てきます。

 

正解すると、次の課題に進めます。

 

f:id:taconyan:20190907150313p:plain

エラー画面

問題を間違えた場合はこのようにエラー画面が出ます。

詳細に教えてくれるので、どこが間違えているのかがわかりやすいです。

f:id:taconyan:20190907150428p:plain

答えの確認

また、自分のコードと答えのコードを比較することもできます。

問題が難しくなってくると、微妙なコードの違いを確認できますのでこれも便利な機能です。

 

まとめ

簡単にProgateの使い方を紹介しました。

 

基本的には指示通りにプログラミングを打ち込んでいくだけでクリアできる仕組みになっています。

 

ゲームをクリアしていくような感覚で進めるので、とても楽しくプログラミングを学ぶことができます。

 

この機会にプログラミングの勉強をしてみてはいかがでしょうか?

 

www.kimagure-taco.com

 

 

読者登録お願いします!!