Express NodeJs - 서버에서 파일전송

kkikki·2024년 10월 11일
import express from "express";

//express 가져옴
const app = express();

//middleware
//main page GET
app.get("/", (req, res) => {
  // res.send("Main Page GET Resquest~!");
  res.send("<h1>메인 페이지입니다</h1>");
});
app.listen(3000, () => {
  console.log("Server is Running~!🎆");
}); //3000번 포트로 서버 구동

res.send 로 화면 수정 가능
res.send("

메인 페이지입니다

");

여러줄이면 백틱으로 해야함
res.send(`

H1

H2

H3

H4

`);

매번 입력은 번거롭기 때문에 파일로 띄워줌


html 파일 하나 만들기


import express from "express";
import path from "path";

const __dirname = path.resolve();

//express 가져옴
const app = express();

//middleware
//main page GET
app.get("/", (req, res) => {
  // res.send("Main Page GET Resquest~!");
  res.sendFile(__dirname + "/public/main.html");
});
app.listen(3000, () => {
  console.log("Server is Running~!🎆");
}); //3000번 포트로 서버 구동

import path from "path";

  • 추가해주기

const __dirname = path.resolve();

그리고 선언

res.sendFile(__dirname + "/public/main.html");

  • 요청에 대한 응답을 파일로 답함


수정하고 서버를 중지하고 다시 켰었는데
이를 해결 하기 위해
Nodemon 사용


npm install nodemon -D

-D : 일반 디펜던시스에 기록이 안되고,데브디펜던시스에 기록됨

일반디펜던시스는 서버에 꼭 필요한 모듈들
데브디펜던시스 : 필수는 아니지만, 개발할때 필요한 모듈들

배포시에는 일반 디펜던시스만 가지고 서버를 구성하게 됨



package.json

{
  "name": "nodejs_my_app",
  "version": "1.0.0",
  "description": "my first node app",
  "main": "index.js",
  "type": "module",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "",
  "license": "ISC",
  "dependencies": {
    "express": "^4.21.0"
  },
  "devDependencies": {
    "nodemon": "^3.1.7"
  }
}

scripts: 어떤 명령어를 저장해주었을때 이 내용에 따른 명령어를 미리 저장해두는 것

  "scripts": {
    "start": "node index.js",
    "dev": "nodemon index.js"
  },

스크립트를 사용할때는 npm run + "스크립트" 라는 명령어로 실행

npm run start
npm run dev

dev로 실행 시킴

메인 페이지 살짝 수정하고
보던 창 새로고침하면 바로 서버 안꺼도 수정 적용됨!


devDependencies 는 제외되고 배포되기 때문에
어떤 모듈이 꼭 필요한지 잘 알고 설치하자

분류 하기 devDependencies로 ⭐️

npm install 설치명 -D

작성할 페이지 기획

메인 페이지
네비게이션 바
풋터

CRUD
블로그, 글 작성, 글 목록, 글 상세 페이지, 글 수정, 글 삭제


글 목록

  • 상단 바 - 메인 로고,글작성 버튼
  • body - 게시글 리스트 view

글 작성

  • 상단 바 - 메인 로고
  • body. - 글제목, 글내용, 작성일, 작성취소,작성완료 버튼

글 상세페이지 수정

  • 상단바 - 메인 로고
  • body - 글제목, 글내용, 작성일

메인 로고 -> 메인으로 이동
글 작성 -> 작성 페이지로 이동

profile
適者生存

0개의 댓글