19日目:Node.js:ページ作成、ルーティング、JavaScriptの組込み HTMLにJavaScriptが使えるの!?
<学習日>
19日目
<学習内容>
① Node.js Ⅰ(50-100%):ページ作成、ルーティング、JavaScriptの組込み
<参考>
Progateレベル:106
<学習内容詳細>
① Node.js Ⅰ(50-100%):ページ作成、ルーティング、JavaScriptの組込み
さて、本日はNode.js パートⅠの残りを終わらせました!
この単元、全般的に難しいというのか、今までのProgateのカリキュラムと毛色が違うというのか、
・今までのカリキュラム「全体像は置いておいて、小さなcode範囲からまずは勉強して、最終的に全体像を掴めるようになろう!」
・今回のカリキュラム「細かいcodeの書き方はペーストでいいから、全体として何をやろうとしているのかをまず抑えよう」
みたいな感じなんですね。
全体像は今まで自分で意識して把握できるようにしてきたので、スタンス的な点は問題ないのですが、codeの各論がボヤっとしているので、逆に全体像を掴みにくくなっているというのか。
うーむ、単純にNode.jsの単元が難しいということもあるのか?
悩んでても仕方がないので、1周目はまず進めることを優先します!
ただ結果的に、少し自分にとってとっつきにくく感じているので、焦らずにしっかり咀嚼しながら進めていきたいと思います^^
前置きが長くなりましたが、今回勉強したのは「ページの作成」「ルーティング」「JavaScriptのHTMLへの組込み」についてです!
<ページの作成>
app.getを使い、どのアドレスにアクセスしたときに、どのページフォルダで構成したページを表示するのか指定するcodeのことです。
具体的には、
app.get('メインアドレス以降のアドレス情報'), (req, res) => {
res.render('ページ作成ファイル名'); } ) ;
という構成で記述します。
<ルーティング>
最初に見たときは、繰り返し関数のようなものかなと思っていましたが、「道」の方のルートを動名詞化したもだったのかなと^^;
要するに「このアドレスにアクセスしたら、この処理をしてね」ということを記述するcodeです。
実際の使い方は、すでに<ページ作成>で記載した、2行目部分のcodeとなります。
<JavaScriptのHTMLへの組込み>
そうなんです!1週間くらい前に感じていた疑問が解けました^^
というのも、HTML&CSSで学習をしているときに、実際のHPのソースコードをF12でちょこちょこ確認していたのですが、JavaScriptの文字が入っていたりして、一度深入りするのを撤退しました。
その心は、JavaScriptの単元を終わらせてから、また戻ってくるぞということですね。
が、JavaScriptを終わらせても、HTMLにJavaScriptを使うというような内容がなくて、結局あれば何なんだ!?となっていたわけです。
まぁ、Progateを進めていくうちに、いずれ答えに辿り着くか、少なくともヒントはあるだろうから、その時に調べようと考えていました!
で、今回<%%>でJavaScriptがHTMLに組み込めるとわかり、一人テンションが上がっていました^^
<% JavaScriptのcode %>で、WEBページには非表示でJavaScriptのcodeが実行されて、
<%= JavaScriptのcode %>で、WEBページにその実行内容を表示させる、という使い方をします。
forEach関数を組み込むことで、HTMLの繰り返しの記述が簡素化されるというcodeを例にとって、カリキュラムが組まれていました。
が、結構難しい^^;;
これは何回か色々なcodeを書いて、慣れていかないと厳しいなという印象です。
まだ始めたばっかりですが「プログラミングはやはり簡単ではないな」と思いました。
ただだからこそ、しっかりと基礎・基本、原理原則を習熟して、使いこなせるようになれば、ちゃんと武器になるスキルだと感じました!
焦らずに、確実にやり続けようと思います^^
ちょっと今回は感想が多めになってしまいましたが、どのタイミングで、どのように感じていたのか、これも残しておきたい情報なので、ご容赦くださいm(_ _)m
ではでは、1日でも長く続けられるように頑張っていきます^^
同志の方、一緒に頑張っていきましょう!