Progateって勉強になる?HTML、CSSコーディング練習サイトを現役コーダーが試してみたよ

ガジェット系

今日はブログ友達のキノム()くんがProgateというサイトでプログラミングの勉強をしているというツイートを見て、楽しそうだなと思い、わたしもphpのレッスンを受けてみました~!!

プログラミングが学べるオンラインサイトって最近は多くなってきましたねー!!

簡単になった分使い方によってはすごい勉強になると思います!

わたしが今のバイト先でコーディングを始めたばかりの時に、会社の先輩からコーディング初心者にはドットインストールというサイトで、コーディングが学べるよ!と教えてもらい、少しだけドットインストールを使って勉強していたのですが、

今はもっと便利なサイトがあるんですね~!、今日はProgateを使たレビューと、実際にコーダーとして働いている目線から、採用されるにはどうすればいいか?という考察をブログを書いてみたいとおもいます。

ProgateサイトのHTML & CSS 初級編コーディング練習は勉強になる?プロゲートのおすすめポイント

今日初めてProgateを触ってみたんですが、めっちゃくちゃにいいやんこれーー!!ってなってます!!

Dreamweaver(ドリームウィーバー)やAtom(アトム)などのエディタとか開かなくても、サイト上でしっかりエディタが再現されているので、めちゃくちゃわかりやすいです!!Progateすごい!!!!

 

Progateのすごいところ①「サイト上のエディタの再現性が高い」

上の画像は、わたしがHTML・CSSレッスンの課題をやっているキャプチャなのですが、左側にどのようにするのかの指示があり、さらにリンク先などのどうでもいい情報はワンクリックでコピペできるようになっていて、無駄がないーーー!!

そして真ん中の黒っぽいやつがエディタですね!!

 

わたしがびっくりしたところはちゃんとタグの閉じ忘れがあると×印が出て知らせてくれます。

<a href=”https://prog-8.com”></a みたいに、</a>←のかっこが閉じていない時などに、「閉じてないけど?!」って感じで教えてくれます

 

この機能は仕事をする上で、きっと使用するであろうDreamweaverやAtom、Sublime Textなどのエディタには、ほとんど備わっている機能なので、本当に仕事で使うようなソフトを同じ環境、感覚でサイト上で学ぶことができます。なんて素晴らしいんだ!!

 

レッスン3の課題は「リンク」の仕組みを知ろう!ということなんでですが、この時に、自動で閉じタグが挿入される機能も、サイト上に備わっていてびっくりしました!

<div>って打つだけで、かってに</div>って閉じタグを挿入してくれる機能です!!

 

これがサイト上でできるっていうのがすごいね

 

Progateのすごいところ②「とにかくサイトが見やすい!わかりやすい!」

これほんとうにめちゃめちゃわかりやすいです!!

Progateでは、レッスンごとにお題あるのですが、レッスン1だと「HTMLの仕組み、とタグについて」がお題となっています。

先ほどのエディタを使ってお題についての、ソース(<h1>~とかのことをソースって呼ぶよ)を書く前に、まず始めにスライドでわかりやすくお題についての説明をしてくれます。

 

そのスライドが、まぁなんとわかりやすいことか・・・!

しかもスライドの始まりに、キーボードでも操作できることを、教えてくれてますね。(画像の右下のところ)

全部が親切な設計やなぁ!!と感激してます。ほんとに。

 

プログラミングを勉強するぞ!って意気込んでいるときに、学ぶためのサイトの使い方が、わからなかったりすると、それだけでやる気がそれてしまうので、Progateはとてもおすすめです!

だからこそ、オンラインで勉強する際には、そのサイトが使いやすいかどうか。で決めるのがとても大切な点じゃないかなと思います!!

ProgateサイトのHTML & CSS 初級編コーディング練習は勉強になる?スキルを身につけて転職するには?

これはわたしが働いているアルバイト先の会社で、自分が受かった時のことや、新しい人を採用するのとかを見ていて、感じたことなんですが、

採用されるためには、自分でコーディングしたWEBサイトを作っておくのがおすすめです!!

 

会社にもよるかと思いますが、未経験の人採用されるとか全然ありますよ!!

なので、希望を捨てずにチャレンジするのと本当によいと思います!

あとは、面接時に「Progateで勉強しています。」だけだと、具体的にどの程度のことを知っているのか判断できないので、自分で作ったサイトを見せるとその人が書くソースが見れて、ある程度知識があることが証明されるので、勉強の復習ってな感じでWEBサイトを作るとよいですね。

わたしの場合ですが、ミュージシャン友達のサイトをデザイン、コーディングで作らせてもらったので、面接時に提出できるサイト(ポートフォリオ)ができたのでした。




ココナラで安い金額で仕事を受けてみるというのもとてもおすすめです!

今あるスキルを試して、お金も発生するからいいよね。とにかくやってみるっていうのが一番ためになりました。

 

ココナラはわたしも前はよく使用していましたが、サービスを買ってくれる人で超親切な人とかいますし、作業してあげてよかったなぁって思えるので、いいですよ。

 

そしてこれはほんとに完全にわたしが感じた意見ですが、会社からすると、素直で若いプログラマーを採用して自社で育てていったほうがいいなって思ってるんじゃないかなぁと思います。

プログラミングも会社によってルールがいろいろ決まっているので、柔軟に対応できる能力というのが、組織で働くときには必要かなと思います。

こういう風になりたいんです!っていう願望みたいなものを素直に伝えるといいんじゃないかなと思いました。

 

あとはやっぱり面接時に過大なことは言わない。っていうのが大事じゃないかなと思います。

面接時に思ってもないこと言うと、採用した側も採用された側も不幸です・・・;;

 

ProgateサイトのHTML & CSS 初級編コーディング練習は勉強になる?プラスおすすめの勉強法

Progateにプラスして効果が出そうなおすすめ勉強法を紹介します~!

とにかく人がつくったサイトのソースを見てどうしてかと考えると勉強になるよ!!

どんな風にclass名を付けてるのかなとか、どんな風にCSSを書いているのか。などです。

入りたいなと思っている会社が作ったホームページのソースを観察してみると、その会社のコーディングルールがある程度わかったりするものです。

その観察したことを、面接のときに話してみると、喜んでもらえるかもしれません。なるべく新しい実績のものを見るといいですね。

 

クロムのブラウザで要素の検証を行ってソースを見てみましょう~!

サルワカさんのサイトでわかりやすく解説されいますよ!!

「初心者向け!Chromeの検証機能(デベロッパーツール)の使い方」

 

どうしてこんな風に組んでいるんだろう?と考えることってだいぶ勉強になりますよ。

わたしの場合は、サイトのソース(HTMLと紐づけされているCSS)を全部印刷して、タグ部分に蛍光ペンで色塗ってっていうのやってました~!なつかし。アナログやなぁ。

 

わからないことがある時はとにかくググる試すを繰り返す

コーディングでつまずいたときは、とにかくググれば絶対に答えがあります!!!

とにかく悩んでる時間を短くして、「試す→失敗→試す→成功」の繰り返しが大切です。

トライ&エラーのスパンが早い人は問題解決能力が高いので優秀だなーーと個人的に思います。

あれ・・・スライダー動かない。なんでだろう。。。っていろんなサイトを見て調べている時に、いろいろ答えというかヒントが書いてあると思いますが、それを試していくことが大切なのです。

 

ProgateサイトのHTML & CSS 初級編コーディング練習ってどう?のまとめ

Progateはとにかく使いやすくて、わかりやすい。

基礎の知識がしっかり身に着くので、現役コーダーにもおすすめだなと思いました!

 

あとはProgateで検索してこのブログを見てくれた人に言いたいのは、プログラミングってすごい楽しいよ!ってことです!

慣れてくると爆速でキーボードを打てるようになりますが、それも楽しいよ!

 

それではっ!!

 

コメント

タイトルとURLをコピーしました