ほわいとぼーだーず

おんりーのーと。僕がプログラミングをしている成長過程を書いていきます。

ど素人の僕がプログラミング言語を学んだ順番を公開!

 

プログラミング言語に突然興味を持った僕はどのような言語から学んだかを話していきます。

 

まずは、基礎となるHTMLから入りました。HTMLをやりながらCSSでデザインを整えていきました。

 

このHTML、CSSがわかればWEBサイトがどのようにデザインされているのかがわかるようになります。僕は戸惑いながらも、なんとかHTMLやCSSがわかるようになってきました。

 

例えば、「あのサイトのこの部分は、こんな感じでデザインしているんじゃないか?」と自分の頭で考えられるようになりました。

 

次に、学んだ言語はJavascriptです。JavaはWEBデザインをより質の高いものにするための言語です。クリックしたときに、ポップアップが出たりと、イメージでいえばWEBサイトに動きをつけていく感じです。

 

 

次に、jOueryという言語。WEBサイトにあるリンクなどをクリックするとそのページに行くなどが可能にしてくれる言語です。僕はめちゃくちゃ難しく感じてしまったのでなんとも言えませんが。。。jQueryをやる人は、しっかり目標物を見失わないことが大事になってきます。なので、イメージできるように何度もトライしてみるのがベストかなと思います。

 

 

ここまでくればWEBサイトを自分で作れるようになります。他にもPHPRubyなどの言語がありますが、プログラミングをやる上での基礎を固めたいならHTML、CSSから学んで、他の言語に移ってみるのがいいかなと感じます。

 

 

 

 

 

 

 

 

【Progate】本日のJavaScriptをやり終えてのアウトプット!

 

2018年8月3日。

外はめちゃくちゃ暑い。。。

そんな中、僕はProgateというサイトを利用してJava scriptをやるのだった。

 

時間は16:00~18:00くらいの約2時間。

休憩はなしで机にコーヒーを置いて集中した。

 

★Progate Java script Ⅳ★

f:id:yosuke1:20180803213931j:plain

このコースをすべてやるぞっっっ!!!と。

 

結果、やり切ったが完全に内容が理解できていないのが現状だった。。。。

だからアウトプットをしようと思う。

 

●コースの課題

1. クラスの基本

2. ファイルの分割

3. クラスの継承

 

▼僕が理解できなかったところ▼

・コンストラクタって何だろう......

・オーバーライドってよくわかんない.....

 

問題を解いていた時は、なるほどなー!ふーん($・・)/~~~

これだけで、コードを書く分には問題なかった。

でも、このコードを書いて何になるんだろう....という状態だったのだ!!

 

 

どうやら僕の頭は図解しないとできないらしい。。。

僕はJava scriptを完全に理解はしていないので、間違いがあっても微笑んでください(^_-)-☆

 

ここを理解するために「クラス」の構成からやらないと始まらないのでそこからやります。

 

 

f:id:yosuke1:20180804000249j:plain

 

クラスには設計図みたいなものを敷いてるイメージです。ここでは粘土板。

そして、次にオブジェクト(物体)を作っていきます。

クラスという設計図からできたオブジェクト(物体)をインスタンスという。

 

クラスの中にオブジェクトが何をしたいのか、その内容を書いていきます。

 

f:id:yosuke1:20180804000937j:plain

 

★コンストラクタが何か見えてきた!!

コンスタンスとは、オブジェクト(物体)=インスタンスが実行するための機能ってことになる。

 

だから、図でイメージすれば、、、

 

f:id:yosuke1:20180804001816j:plain

こんな感じになります。

 

よし、コンスタンスをクリア!!!

 

▲オーバーライドはまた次回にします( ;∀;)▲

 

 

 

 

 

【Progate】ど素人の僕がプログラミングをやってみたパート1

僕はプログラミングをやっています。

理由は、自分のスキルとしてWebページを作ってみたい!と思ったからです。

 

 

今回僕がプログラミングをやってみて気づいたことを書いていきます。

僕が使用しているプログラミングサイトはProgateです。

 

★この記事を読むオススメな人

・プログラミングでどんなことができるのかを知りたい!

・HTML & CSSに興味がある人や実践している人

 

 

HTML & CSSをやってみてどうだった?

f:id:yosuke1:20180728140854j:plain

 

僕が最初に始めたのがHTML & CSSでした。

HTML & CSSは、Webページの見た目をデザインするプログラミング言語です。

 

最初は覚えることがあって大変でしたが、慣れてくるとすごく楽しくなりました

ど素人の僕がプログラミングをやり、あっという間に達成できてしまったのです。

 

具体的に、

f:id:yosuke1:20180728141907j:plain

<h1>と</h1>の間の〇に好きな言葉を入れることで、出力ができます。

もちろん、これだけではありません。

 

・<h1>〇〇</h1>

・<h2>〇〇</h2>

・<h3>〇〇</h3>

・<p>〇〇</p>

 

など使ってWebページを作っていきます。

これをいろんなところで応用できるな!と思いました。

 

 

HTML & CSSを応用してみた!

 

だいたいHTML & CSSの仕組がわかれば、あとはいろんなデザインを作ることが可能になります。

 

そこで僕は、何かマネできないかな?と。

思いついたのは、みんなが知っているこれ!!

 

f:id:yosuke1:20180728143451j:plain

 

メルカリは有名ですよね。

このページにある、

 

f:id:yosuke1:20180728143914j:plain

 

出品ボタンです。

この出品ボタンみたいなのをできないかな?と思ったわけです。

 

で、プログラミングど素人の僕がやってみると、、、

 

f:id:yosuke1:20180728145906j:plain

 

HTMLでは、

・<a>出品</a>

・classはボタンともうひとつが必要だな

・クリックしたときにリンクページに飛ぶ

 

こんなことを予想して書いてみたんです。

そして、

 

f:id:yosuke1:20180728150135j:plain

 

CSSでは、

・btnで文字のカラーは白

・背景は赤

・ボタンが丸いな

 

これを意識してできる限りの知識でやってみたら、、

 

f:id:yosuke1:20180728150356j:plain

 

こんな感じになりました。

まだまだ本物のデザインとは違いますが、プログラミング初心者でもここまでできました。

 

まだまだプログラミングに挑戦し続けます!