読者です 読者をやめる 読者になる 読者になる

Try Something New

この世界の秘密を見つけ出すために、どんなことでもやってみて、いろんなことを考えます。

興味は尽きない ど初心者でもHTMLやCSSが無料で学べるProgateをやってみた

Webサービス

こんにちは、デスクトップPCを修理したあたりからパソコンに興味津々なうたこです。

utautan.hatenablog.com

パソコンを修理していく過程で色んな人から色んな情報を得て、パソコンって思ってたより機械で、そして人間が動かすものなんだなぁと思いました。

なんでも興味を持った瞬間にやってみるのがモットーな私は、とあるサイトの作り直しもやりたいということで、HTMLやCSSを勉強できる楽しげなサイトを発見しました。

Progate

「ど」初心者な私には、こういう進研ゼミみたいな、最初から流れが組まれているお勉強方法で、かつ楽しくゲーム感覚でできるものが嬉しいです。

f:id:utautan:20151105220006p:plain

Progateは無料のプログラミング学習サービス! 

スライドで勉強して、実際に書いてみて、見本通りの形を作ってみることでプログラミングを勉強することができます。

アカウント登録

アカウントは新しく作ることもできますし、FacebookTwitterと連携することもできます。私はTwitterと連携して作りました。

スタート時はLv.1です。早速始めてみましょう。

f:id:utautan:20151105220019p:plain

お勉強開始

f:id:utautan:20151105220038p:plain

まず、見た目が可愛くて読む気になりますね!!! 

 

「パソコン1台で世界は変えられる。」

 

なんて夢のある言葉でしょうか。

プログラミングの世界へようこそ

こういう言われ方をすると新しい出会いがあるような楽しげな気持ちになってあっという間にやる気が出ます。そう、単純なんです。

f:id:utautan:20151105220048p:plain

ここから、HTMLに関する説明が始まります。

文章は端的で、実践にうつるまでのスライドも少ない枚数にまとめられています。

f:id:utautan:20151105220101p:plain

スライドを読み、実際にぽちぽち打ち込んでみると・・・。

 

どうやら、正解のようです!! 

そして、レベルが上がりました! 嬉しい!w 

f:id:utautan:20151105220257p:plain

引き続き、CSSにうつります。

f:id:utautan:20151105220305p:plain

HTMLとCSSの違いなんてさっぱり意味が分からなかったんですが、HTMLは枠組み、CSSは装飾というふうに考えればいいみたいです。

例えば・・・。

レゴブロックで恐竜を作るとする。

その恐竜の形を思い浮かべ、必要になるパーツを先に手元に集める。←HTML

手元にかき集めたパーツを元に、恐竜の形にしていく。←CSS

こんな感じ?! 

 

引き続きレベルアップを目指して頑張っていこうと思います!!!!

prog-8.com