Node.js 使用流れ #Node.js

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ファイルの作成５　コード書く

ページ間リンクボタン作成

１　ルーティング内でそれぞれファイルのURLを設定
２　EJS内でボタンクラス内のリンクタグに遷移したいファイルのURLを指定