プログラミング未経験者でもたった8週間でWeb開発可能！
おっさんでもこうなれるのか
という思いで5／29日（月）からスパルタコーディングクラブの
プログラミング入門コースにて学習を開始しました！
今週は2週目となります。
結構難しくなってきたぜ〜

スパルタコーディングクラブ

第2週目スタート

1週間の振り返り（2週目）

今週は平日は仕事ですが、動画も10分ぐらいなので、
隙間時間を見つけて少しづつ学習を進めていましたが
かなり内容も難しくなってきたので見返しながらやっていたら
1週間フルフルになりました。
来週も同じ感じかな〜？より高度になってｷﾀ━━━ヽ(∀ﾟ )人(ﾟ∀ﾟ)人( ﾟ∀)ノ━━━!!
でも頑張ります！

■JavaScript

JavaScriptは動き！
HTMLは骨組み、CSSは装飾

●webサイトを作る時に必要な三種の言語
HTML／CSS／JavaScript
webページは基本的に、
この3つのプログラミング言語で構成されることがほとんどです。

●JavaScriptの記述例：コンソールで確認したい時

<script>
	function hey() {
		console.log("こんにちは")
	}
</script>

●JavaScriptの記述例：リスト型（順番を持っているデータ型「 [　] で囲う」）
ここ重要です！コンピュータは0から数えます! リストに入っている最初の値は[0]で呼び出します!

let a = ['りんご','すいか','いちご','かき']

●JavaScriptの記述例：ディクショナリ型（キー(key)-バリュー(value) 値の束「 { } で囲う」）

let a = {'name':'太郎','age':27}

●JavaScriptの記述例：リスト型とディクショナリ型の組み合わせ
ここ重要です！大かっことキー - バリュー, この2種類からなるデータはよく使います！

let a = [
	{'name':'太郎','age':27},
	{'name':'花子','age':15},
	{'name':'伸夫','age':20}
]

■jQuery（ジェイクエリー）

JavaScriptでできることを
コンパクトかつ便利にまとめたライブラリ言語である。
長く複雑になってしまうコードをjQueryでより直観的に書くことができます。
jQuery

●jQueryを利用するには<head>と</head>の間に下記のコードを入れる

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>

●プログラムでjQueryを使うには$(’#id値’)の記述が必要

document.getElementById("element").style.display = "none";
//この長いJavaScriptをjQueryで記述すると
$('#element').hide()
//という短いコードで記述できる

●jQueryは基本id値で要素を指定する

$('#id名')
<div id="値"></div>
//idは重複して使用不可能、タグ1個に1個だけ指定可能
//【補足】
$('.class名')
<div class="値"></div>
//classは重複して使用可能、タグ1個に複数のclassを指定することもできる

■Fetch（フェッチ）

プログラムの特定の場所からデータなどを読み出す動作のこと

●fetchの基本形

fetch("ここにURLを入力") // このURLでウェブ通信をリクエストする。 括弧の中に他のものがなければGET！
	.then(res => res.json()) // 通信リクエストを受けたデータはresという名前でJSON化する
	.then(data => { 
		console.log(data) // 開発者ツールに出力してみる
	}) // JSON形態に変わったデータをdataと名付けて使用する

//JSONとは「JavaScript Object Notation」の略で、「JavaScriptのオブジェクトの書き方を元にしたデータ定義方法」のこと

2週目の成果

Githubにて1週間で学習しながら製作したサイトを公開しました。
（温度がリアルタイムに変化します）
2週目の成果

来週の目標

かなり難しくなってきたので、復習しながら
課題にもっと効率良く勉強していこう！

●プログラムの考え方の補足/参考情報

【JavaScriptのデータ型について】

var

・重複宣言できる。
　・var a = 10; var a = 20;の文法が許される
・宣言後、データを変えることができる。
　・var a = 10; a = 20;の文法が許される
・自由度と柔軟性が高いため、使うときは注意が必要とされる。
・条件分岐や繰り返し文の中に宣言する場合、外から操作できる。

let

・重複宣言できない。
・宣言後、データを変えることができる。
　・let a = 10; a = 20;の文法が許される
・ES6から追加されたデータ型
・条件分岐や繰り返し文の中に宣言する場合、外から操作できない。

const

・重複宣言できない。
・宣言後、データを変えることもできない。
・ES6から追加されたデータ型
・条件分岐や繰り返し文の中に宣言する場合、外から操作できない。
【演算子】
+：足し算
-：引き算
*：掛け算
/：割り算
%：割り算の余り（modular演算）
【比較演算子】
※条件分岐と繰り返し文で使われる
a < b：aはbより小さい
a <= b：aはbと同じまたはより小さい
a === b：aとbはデータ型を含めて完璧に一致している
a !== b：aとbはデータ型を含めて完璧に一致してない
a == b：aとbはaのデータ型基準で一致している
a != b：aとbはaのデータ型基準で一致してない
a > b：aはbより大きい
a >= b：aはbと同じまたはより大きい
【論理演算子】
※条件分岐と繰り返し文で複数の条件を取り扱う際に使われる
a>=3 && b>=3：aとbは3以上である。
a>=3 || b>=3：aまたはbは3以上である。
!a：true/falseの値で主に使われる。既存の値を否定する。