ほんきでJavaScriptの様子。クスールブログクスールブログメニューコンテンツへスキップほんきでJavaScriptの様子。furuya学校Tweetみなさんこんにちは。学校事業部の古谷です。今回は、前回の続き『ほんきでJavaScript』の後半の授業の様子をお届けいたします。前半の様子はこちらです。前半は主に基礎の部分を一つ一つ丁寧に学んでいく内容でしたが、後半は、習ったスキルをまた積み重ね合体させていく作業で、前半でやった基礎を振り返りながら、チャレンジしていきました。日頃使ってない頭をフル回転させ、いつも授業が終わる頃には抜け殻のようでしたが、それと同時に達成感も感じました^^では早速5回目の様子からレポートしていきます。localStorage最初はもちろん前回の復習から。append(追加)と、thisの書き方をもう一度やって行きました。その後はlocalStorageについてです。appendthislocalStorage最初はlocalStorageの簡単な書き方から。こちらはサンプルなので動かないですが、下記のようなものHTML上で作っておいて『テキストボックスにテキストを入力し、追加ボタンが押された段階で、localStorageに保存(setItem)し、<p>に表示。ブラウザを更新し、再表示ボタンを押すと(getItem)また先ほど表示されていたものが<p>に表示される』というシンプルなものから勉強していきました。再表示<p>表示させる</p>その後は、配列を使ってデータをlocalStorageに保存して行く書き方を学びました。配列としてブラウザに表示させ、文字列にしlocalStorageに保存。文字列を呼び出し、配列に戻してブラウザに表示。この流れを何度も繰り返し覚えて行きました。最初はこの流れを理解するのに時間がかかりましたが、localStorageの概念をゆっくりわかりやすく教えてもらいました。api6回目ももちろんlocalStorage。前回の復習から行っていきました。復習はいつも補助講師は岩本くん(クスール)が担当してくれています。お題をもらって、前回習ったlocalStorageをもう一度最初からやっていきました。localStorageobjectapiその後はobjectの概念をまなび、APIの内容に入っていきました。今回サンプルで使用したAPIは『楽天トラベル』。https://webservice.rakuten.co.jp/api/simplehotelsearch/APIに繋げ、オブジェクト形式で書かれている情報を確認し、その情報を表示していきました。テキストボックスに『地域(例:大阪)』を入力し、検索ボタンを押すと、<li></li>にホテル情報(ホテル名、アクセス、画像、リンク)を表示させました。検索<li>リストで表示</li>いろいろなサイトなどもこうやって情報を表示させているんだなと、興味深かったです。細かい部分を、完璧に理解するのはなかなか難しい。この書き方は忘れたくないので、きちんと最終作品にもAPIを入れたいようと心に決めました。メモ帳追加機能この日は、objectの復習からやっていきました。その後は、いつも授業のサンプルで使っているメモ帳に、カテゴリー分け機能を追加していきました。その他、というカテゴリーを選択し、メモを種類別にできる機能です。メモを追加した日付も記憶できる、日付を表示できる機能も追加していきました。その後は自身の作品の制作時間でした。作品発表この日は18時からスタート予定の発表会まで、制作時間にあてました。考えるにはまだ難しい部分など講師と一緒に作っていったり、もうちょっとメモ帳として足すべきところなど指摘してもらったりし、みなさん進めていきました。18時ごろ発表会を行っていきました。メモ帳の機能を紹介していただき、頑張ったところ、出来なかったところなど、お話していただきました。受講生同士の質問もあり、「その部分をどのようにつくったのか」など質問をもらいました。講師からも、この先の改善点や、もっと必要な機能や、JavaScriptの指摘など、アドバイスをいただきました。みなさん妥協せず頑張って作られていて、素晴らしかったです。約2ヶ月ほどの全8回の『ほんきでJavaScript』が終了しました。私も受講させていただきましたが、長いような短いような期間でした。JavaScriptの基礎の基礎から学ぶことができ、基礎の分を復習を重ね、いろんな言語に対応していきたいので、もうちょっと勉強していきたいなと思います。他の受講生の方からも、難しかったけど楽しかったと感想をいただき、充実した2ヶ月だったんだなと、とても嬉しく思います。受講生募集中!5月20日から『ほんきでHTML』を開催します。デザイナーの方など、これからHTML/CSSを本格的に学びたい方や、Web業界への転職を考えている方、ゼロからのハンドコーディングに自身のない方、などにおすすめです。ご興味お持ちの方はお気軽にお問い合わせください。ほんきでJavaScriptがはじまりました。関連記事ほんきでJavaScriptがはじまりました。『ほんきでJavaScript』開講決定!受講生募集中です。for:クスールはWebの技術を中心に「ものづくり」を学ぶ、小さな学校です。メモ6月5日スタート「ほんきでHTML」受講生募集中です。