Node.jsの学習の備忘録と振り返りの記事です。
何かの参考になれば幸いです。
付け足しや訂正などある場合ご教授いただけると
大変嬉しく思います！！
###Node.js 手順
１ npmインストール(パッケージ管理システム)
２ パッケージインストールnpm install パッケージ名
３ パッケージ読み込みconst パッケージ名 = require("パッケージ名");
&
使用準備const app = パッケージ名();
4 サーバー起動app.listen(localhost);
5 ファイル実行ターミナルで『node ファイル名』
**ルーティング作成(URLに対応する処理)**
node.js
app.get('/URL',(req,res) => {
処理内容
});
**見た目を表示する処理**
ルーティング処理の中で``res.render('表示したいファイル名');``とかくと指定したビューファイルをブラウザに表示できるnode.js
//app.get('/URL',(req,res) => {
res.render('表示したいファイル');
//});
画面作成簡易手順
１ ejsに対応するルーティング＆処理していく
２ ejsファイル作り
3 ファイル内のコード作成
**CSS適用**
**1 読み込むフォルダの指定** **ルーティングファイル内**のパッケージ読み込み下あたりにCSSを読み込むコードを書く ``app.use(express.static('読み込みたいフォルダ名'));``//const express = require('express');
//const app = express();
app.use(express.static('読み込みたいフォルダ名'));
//app.get('/URL',(req,res) => {
//処理内容
//});
2 CSSのパス指定
EJSファイル内の＜head＞の中の＜link＞タグ内にCSSのパスを指定し読み込む
href = "/フォルダ名/ファイル名"
<!-- <!DOCTYPE html> -->
<!-- <html> -->
<!-- <head> -->
<!-- <meta charset="utf-8"> -->
<!-- <title>LIST APP</title> -->
<link rel="stylesheet" href="/フォルダ名/ファイル名">
<!-- </head> -->
画像の読み込み
EJSファイル内の＜img＞タグ内にCSSのパスを指定し読み込む
img src = "/フォルダ名/ファイル名"
css簡易適用手順
１ CSSを置くフォルダの作成
２ ルーティングファイル内で読み込みたいフォルダの指定
３ EJS内で使用したいCSSパスを指定し読み込む(画像の読み込みも同様)
４ CSSファイルの作成
５ コード書く