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

NO TITLE

WEBデザインとかブログ運営、社会・経済、音楽などなど

JavaScriptの勉強用に使えるサイトや記事(備忘録)

スポンサードリンク

f:id:shiromatakumi:20151109005830j:plain

JavaScript学習おすすめサイト・記事

私も去年の10月から少しずつJavaScriptの勉強を始めています。勉強していく中で参考になった(している)サイトや記事を備忘録として集めてみました。

どちらかと言うと入門~初心者向けのサイトや記事になります。

 

私はHTMLとCSS、JavaScriptしか使用していないので他の言語とは比較できませんが、JavaScriptはテキストエディタがあればブラウザ上で簡単に実行できるので、プログラミング初心者でも手をつけやすい言語ではないでしょうか。

 

実際、プログラミング言語の中でも人気が高いようです。

人気があるということは、ネット上にたくさんの情報が公開されているので情報収集がしやすいというメリットもありますね。

それでは紹介していきます。

JavaScript講座

JavaScriptを学べるWEBサイトはたくさんあります。JavaScriptの勉強に役立ったサイトを紹介します。

 

JavaScript入門

JavaScript入門

とても分かりやすく入門にはぴったりのサイトです。勉強を始めたばかりの時はこちらにお世話になりました。

 

マンガで分かるJavaScriptプログラミング講座

マンガで分かる JavaScriptプログラミング講座

ちょっと古くて私はあんまり見てません…。ただ、分かりやすいって評判みたいなので人によっては合うかもしれません。

 

ドットインストールJavascript入門

きっとたくさんの人がお世話になっているサイトだと思います。動画を観ながら学習できるのが嬉しいですね。

 

AjaxTower

正直、次のサイトの方が私には合っていたので、こちらのサイトは軽く目を通しただけですね。次のサイトと比べてみて、分かりやすいなって思う方を使ってみたら良いと思います。

 

JavaScript初級者から中級者になろう

JavaScript初級者から中級者になろう — uhyohyo.net

おすすめ大本命はこちらのサイト。上の入門・初級者向けサイトをある程度マスターしたらこちらに進んでみて下さい。非常に分かりやすい解説でとても身になります。もちろん、基本的な部分もしっかり説明しています。私も脱初心者に目指して頑張って読んでます。

 

 

 

リファレンス

js.STUDIO

解らないところがあったらこちらのサイトを使って調べています。ブラウザのお気に入りに登録していつでも開けるようにしています。

MDNに比べると解りやすいと思います。

 

MDN JavaScript

ドットインストールではこちらをオススメしていました。他のサイトに比べるとこっちの方が厳密なのでしょうか。ただ、初心者には難しいのであまりオススメできません…。

 

用語解説

勉強していて、意味が分からない用語が出てくるんですよね。そういった理解が難しい用語を分かりやすく説明している記事があるので紹介します。多分初心者は同じ所で引っかかると思いますので。

プロトタイプ:

 

クロージャ:

 

thisの違い:

 

コンストラクタ:

 

読み物

これは読んでおいて良かったなって記事も紹介します。

ライブラリのコードを読む?jQueryのコード読んでみたけどさっぱり意味不明だったぜ。 無理すぎた。しかし、いつか理解できるようになってみせるよ!

 

初学者から上級者まで、自分がどれくらいのランクにいるかのチェック表です。判定が厳しくて泣きながら読んだぜ。チェック表を一通り読んでみるだけで勉強になる名エントリーやで。ちょっと古い記事なのが気になるが…。

ちなみにこのブログは現在も更新されているので、気になった方は読者登録してみて下さい。私はしました。

 

最強オブジェクト指向言語 JavaScript 再入門!

こちらはスライドショーです。プロトタイプとかスコープとか初心者にはポカーンな用語をしっかり説明してくれる素晴らしいスライドですよん。

 

様々なデバックの方法を紹介してる記事です。コードが長くなればなるほどデバックのテクニックも必要になっていきますね。

console.log しか使ってない私…。

 

サンプルコード

他の人はどんなコードを書いてるんだろう。そして、JavaScriptでどんなことができるんだろうって気になりますよね。たくさんの人がコードを公開しているサイトを紹介するよ。

CodePen ではたくさんの人が公開しているコードが見れるので、一度目を通してみることをオススメします。観てるだけでも楽しいよ。こんなことができるんだ!って発見ばかりです。

ちなみにこちらは CodePen の使い方。

CODEPENの使い方 アカウント登録から基本的な操作 | 9ineBB

 

他にも jsdo.it とかも有名ですね。

情報収集

JavaScript周りは進化が早くて情報いち早く手に入れなくてはいけませんね。JavaScriptの情報がチェックできるサイトはこちらです。

 

でも、なんだかんだ言ってはてなブックマークを使ってます。

一年以内で日付指定して人気記事を読んだり、ホットエントリーから最新情報もチェックしたりと情報収集にはやっぱり便利。

 

ベテラン・中級・上級者の人達はどうやって情報収集してるのかも気になりますね。

 

勉強に使った教材

よくわかるJavaScriptの教科書

よくわかるJavaScriptの教科書

 

 JavaScriptとjQueryが学べる教材です。結構分かりやすかったですね。でも、jQueryでbindとか使っててちょっと古い感じはありましたが。

 

10日でおぼえるJavaScript入門教室 第3版 (10日でおぼえるシリーズ)

10日でおぼえるJavaScript入門教室 第3版 (10日でおぼえるシリーズ)

 

基礎をしっかり学ぶにはオススメ。表を作ったり購入フォームを作ったりと、実際に手を動かして学べるのが良かったです。できた時の達成感がありますね。

 

今後はもっと高度な教材をもっと読んで勉強していきたいと思います。

 

ただ、教材で学ぶのも良いですが、日々進化していくのでネットでの情報収集もやっぱり必要になってくるんですよね。大変だなこりゃ。

 

おそらくどうでもいい私の話

私の本業はWEBデザイナーですが、少人数の会社なためデザインからコーディングまで全部やらなくてはいけません。それが意外と楽しかったりしますが。

しかし、入社して間もない私はまだまだJavaScriptは強敵です。ちなみにjQueryばっかり使ってます…。でも、コピペするだけじゃつまらないので、できる限り自力で書くように心がけてます。

 今後はクライアントサイドだけではなく、Node.jsとかフレームワークを使ってアプリ開発とかもしてみたいです。できるかな…

 

それにしてもWEB周辺の技術変化が急すぎてヤバい。

 

こんな記事も書いてます。

shiromatakumi.hatenablog.com

 

不人気だったレオス・カラックスの記事も誰か読んで…