たった1日で基本が身に付く! JavaScript 超入門 読んでみた。
［記事公開日］2017/10/17
［最終更新日］2024/08/22
WebCampPRO
無料体験会実施中
転職を本気で考えている方向けのプログラミングスクール！
転職を保証しているため、未経験からIT業界へ転職を求めている方へおすすめです。
受講完了後、3ヶ月以内に転職・就職できない場合は ”全額返金” しています！
WebCamp
無料体験会実施中
Webスキルを習得！大人気テックスクール
短期で学びたい方のための講座です。
1ヶ月で集中して一気に学ぶことができます。
プログラミングやデザイン未経験者でも安心のサポート体制をご用意しています。
TechAcademy
未経験からプロを育てるオンラインブートキャンプ
最短4週間で未経験からプロを育てるオンライン完結のスクールです。
どこかに通う必要なく、自宅でもプログラミングやアプリ開発を学ぶことができます。
【現在提供中のコース】
・Webアプリケーションコース（Ruby on Rails）
・PHP/Laravelコース
・フロントエンドコース
・WordPressコース
・iPhoneアプリコース
・Androidアプリコース
・Unityコース
・はじめてのプログラミングコース
・Webデザインコース
・UI/UXデザインコース
・Webディレクションコース
・Webマーケティングコース
Amazon：たった1日で基本が身に付く
https://amzn.to/4czIbQO
たった1日で基本が身に付く！シリーズの本。
いろいろ出てます。
わかりやすく解説で、詰め込みすぎていないので
わかりやすい本だと思います。
（プログラミング系の本だと難しく感じるかもです）
ただ、1日で、身に付くかはわからないです。
また、内容が古いのもあります。
1日で基本が身に付くのって？思いますが、
この、本のシリーズは、章ごとに、解説してて、
1単元を1時間など、自分のペースで学ぶとよいと思います。
こんな方におすすめ
JavaScriptプログラミングを一から勉強したい入門者など
JavaScriptプログラミングを一から学ぶための、やさしい入門書です。
Webサーバーを利用するための環境構築から始まり、
文法、構文、変数・配列の扱い方、オブジェクトの利用、
HTMLの操作、イベント処理、Web APIの利用法など、
JavaScriptによるプログラミングで必要になる知識を一通り解説しています。
最終的に、これらの知識をもとにしてWebアプリを開発していきます。
1日8時間の勤務時間内に読むことができる内容で、初心者・新人が最初に読む解説書としてふさわしい1冊です。
たった1日で基本が身に付く! JavaScript 超入門 大型本 – 2017/6/15
WINGSプロジェクト (著), 片渕 彼富 (著), 山田 祥寛 (監修)
JavaScriptプログラミングを一から学ぶための、やさしい入門書です。
目次
たった1日で基本が身に付く! JavaScript 超入門 読んでみた。
CHAPTER 1 環境設定
CHAPTER 2 JavaScriptの基本的な文法
CHAPTER 3 よく利用される変数や処理の扱い
CHAPTER 4 HTMLを操作する
CHAPTER 5 イベントを扱う
CHAPTER 6 Web APIを利用する
CHAPTER 7 日記アプリを作成する
CHAPTER 8 さらに開発を進めるために
これからのJavaScriptの教科書 単行本（ソフトカバー） – 2024/6/1
狩野 祐東 (著)
確かな力が身につくJavaScript「超」入門 第2版 単行本 – 2019/9/21
狩野 祐東 (著)
スラスラ読める JavaScriptふりがなプログラミング 増補改訂版 (ふりがなプログラミングシリーズ) 単行本（ソフトカバー） – 2022/8/23
リブロワークス (著), 及川卓也 (監修)
プログラムが「読めない」を解決する入門書
たった1日で基本が身に付く! JavaScript 超入門 大型本 – 2017/6/15
WINGSプロジェクト (著), 片渕 彼富 (著), 山田 祥寛 (監修)
JavaScriptプログラミングを一から学ぶための、やさしい入門書です。
たった1日で基本が身に付く! JavaScript 超入門 読んでみた。
この1日シリーズ
値段も手頃な価格で、おすすめだと思います。
Chapterは1から8まであります。
他の、プログラミング系の本を読んで、難しく感じるなら、
自分に合う本を買ってみるといいと思います。
個々で、難しく感じるのもありますが。
この1日シリーズ、1冊持っておくと、忘れないためにもいいかもです。
サンプルファイルもあるので学びやすいと思います。
JavaScriptの役割
①Webアプリケーションの補助的な機能
②Ajaxを利用した通信機能
③HTML5のAPIを利用したWebアプリケーションを担う部分など他、
目次は、このような感じです。
CHAPTER 1 環境設定
CHAPTER 2 JavaScriptの基本的な文法
CHAPTER 3 よく利用される変数や処理の扱い
CHAPTER 4 HTMLを操作する
CHAPTER 5 イベントを扱う
CHAPTER 6 Web APIを利用する
CHAPTER 7 日記アプリを作成する
CHAPTER 8 さらに開発を進めるために
JavaScriptが、ここまで広く利用されるようになったのは、ブラウザさえあれば動作させられるという実行環境のためです。
SECTION 01 JavaScriptの概要を理解しよう
JavaScriptは、Webブラウザでページが表示された際に実行されます。
初期のJavaScript
AjaxとHTML5の登場
FlashとHTML5
Webアプリケーション以外で利用されるJavaScript
など説明しています。
SECTION 02 開発環境を準備しよう
プログラミングをするには、プログラムを作成する環境と作成したプログラムを実行する環境が必要です。
これらを、まとめて開発環境といいます。
開発に必要なもの
Webアプリケーションを作成するには、Webサーバーが必要です。
Webサーバーは、レンタルサーバーを借りてもいいです。
また、 パソコンを自分専用のWebサーバーにできます。
Webサーバー、インターネット経由
個人PCにApache（無料）をインストールし、Webサーバーと同じ環境をローカル内に構築
本書での開発に必要なもの
サーバーソフト、Apache（ブラウザ上にページを表示）
ブラウザ、Google Chrome（ページの閲覧）
テキストエディタ、（ページの編集）
開発環境に必要なものを入手する。
SECTION 03 Apacheをインストールしよう
Apacheは、世界中で利用されている、Webサーバーのサーバーソフトです。
Apacheは、OS、別にインストールファイルが配布されています。
Apacheの入手
Windowsで解説
Apache
https://httpd.apache.org/
Apacheのインストール
Apacheの実行には、Visual Studio 2015のVisual C++ 再頒布可能パッケージが必要です。
Windowsの場合は、32ビット版、64ビット版があります。
Visual Studio 2015 の Visual C++ 再頒布可能パッケージ
https://www.microsoft.com/ja-jp/download/details.aspx?id=48145
Apacheの起動など解説
SECTION 04 Google Chromeをインストールしよう
Google Chromeの設定で
JavaScriptを有効にする設定
SECTION 05 作成した開発環境を確認してみよう
開発環境の準備ができたら、動作確認をします。
インストールした、ApacheとChromeの動作を確認。
Apacheでテストページを表示する
Chromeのデベロッパーツールを利用する
サンプルファイルを使っての解説
JavaScriptで利用できる基本的な文法について説明。
実際にJavaScriptでプログラミングをしてみましょう。
SECTION 01 JavaScriptの基本的なルールを理解しよう
JavaScriptを記述する場所
HTMLの内部に埋め込んで記述する
ファイルに記述して読み込む
JavaScriptのプログラムの主な構成要素
①変数
②オブジェクト
③演算子
④制御文
⑤関数
JavaScriptを記述する際の注意点など解説
SECTION 02 変数を使ってみよう
プログラムで数値や文字列などの値を処理する場合、値を、そのまま扱うことはしません。
値は、変数という、入れ物に入れて処理します。
変数とは
変数の宣言など解説
変数のデータ型
配列型
オブジェクト型
SECTION 03 オブジェクトを使ってみよう
オブジェクトとは、プログラムで操作できるものの総称です。
文字列、日付、ブラウザ情報などをプログラムで扱いやすくするために、一定のルールでまとめたものです。
オブジェクトを利用することで、プログラムをより短く的確に記述することができます。
オブジェクトの種類
JavaScriptのオブジェクトは、3種類あります。
①組み込みオブジェクト
②ブラウザオブジェクト
③DOMオブジェクト
オブジェクトの構成
オブジェクトを利用する際のルール
組み込みオブジェクトを利用する
ブラウザオブジェクトを利用する
など解説
変数や処理の扱い、それらの機能を、まとめたメソッドについて説明。
SECTION 01 変数を操作してみよう
演算子とは
四則演算子を行なう
変数の値を比較する
文字列を結合、比較する
など解説。
SECTION 02 処理の流れを制御してみよう
プログラムの処理の流れ
条件分岐
処理を繰り返す
など
SECTION 03 処理をまとめてみよう
関数を利用する
変数のスコープに注意する
varのつけ忘れに注意する
SECTION 04 プログラムを効率よく作成してみよう
デバッグを行う
コメントを記述する
JavaScriptからHTMLに動きをつけたり、書き換えたりする処理について説明。
SECTION 01 HTMLを操作する仕組みを理解しよう
プログラムからHTMLを扱う基本的な仕様
JavaScriptから扱うHTMLの構造
SECTION 02 要素を取得してみよう
DOMの仕様
idを指定して要素を取得する
タグの名前を指定して要素を取得する
CSSクラスの名前を指定して要素を取得する
要素の属性を取得、変更する
SECTION 03 HTMLを書き換えてみよう
取得した要素や属性をJavaScriptで変更する
テキストを書き換える
HTMLを書き換える
要素を追加する
要素を削除する
インタラクティブな処理の実装について解説。
SECTION 01 イベントの仕組みを理解しよう
ユーザーの動作を検出するイベント
よく利用されるイベント
SECTION 02 イベント発生時に処理を行ってみよう
イベント・ドリブンモデル
イベントハンドラー、イベントリスナーを定義する
イベントをキャンセルする
SECTION 03 イベントを利用して動的に画面を変更してみよう
イベント発生元の要素にアクセスする
動的にUIを制御する
ネットワークこしのデータとの取得と、取得したデータの利用について解説。
SECTION 01 APIの仕組みを理解しよう
Web APIとは
プログラムが持っていない外部の機能やデータを呼び出して、利用できるようにする仕組みの名称です。
Web APIとのデータのやり取り
XML
利用者が独自のタグを指定することができるマークアップ言語の形式
RSS
Webサイトの更新情報などを簡単に、まとめたXMLの形式
JSON
JavaScriptのオブジェクト表記構文でデータを記述する形式
CSV
データを、カンマで区切った形式
JSONとは
SECTION 02 JavaScriptからWeb APIを呼び出してみよう
Flickr API
Flickr API Public feed
画像検索結果を解析してみよう
SECTION 03 画像検索アプリを作成してみよう
作成するアプリケーションの概要
画面で利用するUIを定義する
Web APIを動的に呼び出す
入力したキーワードを使って画像検索を行う
画像検索の結果を取得する
JavaScriptでのデータの保存と読み出しについて、日記風のサンプルを作成しながら説明。
SECTION 01 日記アプリを作成してみよう
作成するアプリの概要
アプリを作成するうえで整理しておく点
SECTION 02 データを保存してみよう
JavaScriptでのデータ保存
データを保存する、保存したデータを呼び出す
保存したデータを削除する
SECTION 03 日付の扱いをマスターしよう
日付を扱う
指定した日付を取得する
SECTION 04 カレンダーを作ってみよう
作成するカレンダーの概要
ヘッダを作成する
カレンダーのセルを作成する
SECTION 05 カレンダーに日記機能をつけてみよう
画面を作成する
カレンダーの日付と日記入力欄をリンクさせる
書いた日記を保存する
初回表示時に、当日の日記を表示する
本書の学習を終えて、さらに、次のステップアップに進むには、どうしたらよいか解説。
SECTION 01 JavaScriptのプログラムを1人で練習してみよう
お手を見ながらプログラムを作ってみる
実践的なプログラムを作成する
JavaScriptでの開発に便利なエディタ Atom
SECTION 02 jQueryを利用してみよう
jQueryとは
jQueryを利用するための準備
要素を取得する
要素の属性を操作する
要素を追加する
要素を削除する
イベントを利用する
SECTION 03 jQueryのプラグインを利用してさまざまな機能を実装しよう
jQueryのプラグインとは？
スライダーを簡単に実装できる
レスポンシブデザインに対応したメニューを作成できる
たった1日で基本が身に付く! JavaScript 超入門 大型本 – 2017/6/15
WINGSプロジェクト (著), 片渕 彼富 (著), 山田 祥寛 (監修)
JavaScriptプログラミングを一から学ぶための、やさしい入門書です。
