[Node.js] 프런트를 위한 자바스크립트 파일 만들기

·"localhost:3000/login"으로 서버에 접근했을 때 보여지는 화면인 login.ejs파일과 화면의 동작을 담당하는 JS파일 연결

1) src > public > js > home 폴더를 생성한 후 login.js라는 이름으로 자바스크립트 파일 만들기

 

2) 자바스크립트 파일에는 간단하게 아래와 같은 코드 작성

// login.js
"use strict";

console.log("Hello");
console.log("bye");

 

3) login.ejs파일에는 자바스크립트를 연결시킬 코드 작성

// login.ejs
// 아무곳에나 코드 삽입하면 됨
<script src="/js/home/login.js"></script>

 

4) app.js에도 js폴더로 접근할 수 있도록 해주는 미들웨어(app.use) 생성

// app.js

app.use(express.static(`${__dirname}/src/public`))
// __dirname은 현재 파일이 있는 디렉토리 이름
// 해당 경로(app/src/public 폴더)를 정적 경로로 추가해주겠다는 의미

 

5) 서버 가동 후 localhost:3000/login에 접속하면 다음과 같이 자바스크립트 파일의 동작이 실행됨