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

woshidan's blog

そんなことよりコードにダイブ。

初心者でのプログラミング学習について

ジョブウェブさんのITスキルアップキャンプ

http://company.jobweb.jp/news/a-116220

に参加したあと、やっぱりいくらなんでも思いつきでひどいコード書きすぎてただろうということで、初心者用の本を買ったり、プログラミングサイトを回ろうと思いました。

 

最初にやって、そして、挫折しそうになったのは、これ。

JavaScript辞典 第4版 [HTML5対応]

JavaScript辞典 第4版 [HTML5対応]

キャンプの講座でなんとなくphpが書けたので、JavaSriptも多分なんとなくで動くだろうと思って初級をすっ飛ばして購入→動かないのでちょっと本棚の脇へ放置。

原因はこの本が悪いとかじゃなくて、window.onloadを入れなかったので、htmlの中の要素の読み込み前に、Javascriptで要素の取得を行おうとして要素の取得に失敗していたとかその辺の、予備知識なさすぎでなめすぎだったところだと思います。

たいへん申し訳ありませんでした。

 

で、次の本。

キャンプでは強がっていたけど、どう考えてもノンプログラマなので、

というより、はじめて勉強するものは自分がやりたいことが入っている限りで、

可能な限り初心者向けのを買ってきたほうが楽なので、

(最終的にはそればかりに頼るのも問題だけど、ある程度かっちりしたものは急に知識を仕入れたい、というときにするものじゃない)

ノンプログラマのためのJavaScriptはじめの一歩 (WEB+DB PRESS plus)

ノンプログラマのためのJavaScriptはじめの一歩 (WEB+DB PRESS plus)

を購入して、二日くらいでサンプルコード写しつつ読む。

 

  • オブジェクト=連想配列(異なる形式のデータを混ぜる場合が多い。名前で要素を指定)
  • あらかじめすべて読み込んでおいてdisplay属性を切り替えて表示/非表示
  • getElementByIdで要素を取得するときはwindow.onload = function() { ... }の中にしとかないとhtmlで読みこむ前に要素を取得しようとして失敗して動かない。もう一つ読み込むのを待つ方法がある
  • jQueryで、$(function(){ ... }); を使うとページを全部読み込まなくても動作させられる
  • みたいなことを覚えました。

忘れてるところが多すぎるけど、どうせいまから頭に入れるのはよく使うもの(あるいは使いすぎて書かないようにするもの)だから、また覚えましょう。

 

この本の後半でやたら、divやらspanやらの要素を取得、要素を取得って出てきて何がうれしいのだ、となったので、これはcss勉強したほうがいいかなぁ、と思って、探していたら、facebookでキャンプの同期の人たちから、

CODEPREP http://codeprep.jp/

が流れてきたのでやってみる。

 

これはすごい面白かった。

(いまのところ)一つの比較的小さな目的にあわせて、一行ずつくらい抜き出して

左側にコードの意味を説明して、右のエディタっぽい画面でコードを書かせてると、右下の画面が変化するっていう構成。

成果がすぐ出るのは大好きだ

何回も同じようなコードを書かせるところがあるのだけど、そこがむしろ自分にはうれしかった。

覚えることに意味は無いかもしれないんだけど、ある程度覚えて調べなくてもかけるようにならないとと思っていたので。

 

やった結果、

  • CSSの類似クラスとdisplay, transitionを使って結構動かせる
  • カーソルを例の指のボタンに変えるにはcursor : pointer
  • まだ標準化されてない機能をブラウザごとに対応させるの面倒くさい

なことを思いながら、全部書いてしまいました。

これも大幅に忘れているのですが、なんとなく出来ることがたくさんあるんだな、というのが見えてきて、楽しい。

 

キャンプで実装に失敗した()カレンダーみたいな画面は

php+MySQLで読み込み→CSSで表示がえ、Javascriptでデータ受け取って

またphp+MySQLでデータ送って、なんて考えたり。

 

でも、まだもうちょっと勉強したら、もっと便利そうな機能が見えたり、

コード覚えてきれいに早く使えるようになるに決まってるので、もっと他にないかな

(繰り返しやればいいじゃん、という話だし高校のときは三回繰り返し信者だったのにね) ということで、

 

これは便利!初心者でも挫折しないプログラミング学習サイト5選

http://laugh-raku.com/archives/1551

 を見てます。

 

とりあえず、どっとインストール

http://dotinstall.com

は性に合わないみたいです。

おとなしく話を聞いているのが苦手な残念な人なので←

もっと難しい段階になって、読むだけだと理解が苦しいかも、というときは動画で一通り見せてもらったほうがよいので、上達してから戻ります。

 

で、いまからやろうとしているのは、

codeacademy

http://www.codecademy.com

です。

英語ですが、構成がCODEPREPと同じ感じで、操作自体は大丈夫でしょうし、

内容がある程度想像できている英語なのでさすがに読めるでしょう、読めてください。

 

というわけで、codeacademyやってみたらまた記事書きます。

それでは。