본문 바로가기
Web/Node.js

Node.JS, Javascript, HTML, PUG 간단 정리

by 은유지니 2022. 1. 14.

JavaScript

  • 독립적인 언어가 아닌 스크립트 언어
  • 특정 프로그램 안에서만 동작 가능 

특히 크롬, 파이어폭스, 사파리, 익스플로러 등 에서만 가능

  • 이런 웹 브라우저가 없으면 사용할 수 없는 단점

따라서 client개발을 위한 용도로만 국한

 


 

Node.Js

  • 자바스크립트와는 반대로 node.js는 backend를 다룰 수 있는 도구
  • 터미널 프로그램(윈도우 cmd, mac terminal 등)에서 node를 입력하여 브라우저 없이도 실행할 수 있게 됐다.
  • nodeJS를 사용한 REST 서버를 편리하게 구현하게 해주는 프레임워크로는 Koa, Hapi, express(가장 대중적)
  • express 

       : node.js를 위한 빠르고 개방적이며 간결한 웹 애플리케이션 프레임워크

 

express 기본 폴더 구조https://junspapa-itdev.tistory.com/7

  • public :  정적 파일을 위한 폴더로서 자바스크립트 파일, 이미지 파일, CSS 등을 포함합니다. 관리를 쉽게하기 위해 js와 css로 폴더를 구분 
  • routes :  라우팅을 위한 폴더입니다. 라우팅 리소스 별로 모듈을 만들어 라우팅 로직을 구현합니다. 클라이언트에서 요청 별로 어떤 로직을 수행할지 정해놓은 파일이라고 생각하시면 됩니다. (java에서는 Controller 역할)
  • views : request 요청에 대한 로직을 처리한 후 클라이언트에 응답을 보낼 때 html 코드로 변환해서 반환하는 파일을 정의한 폴더입니다.  ejs나 pug 템플릿 엔진 사용
  • app.js : express 설정파일이 담겨있는 파일입니다.(보통 파일 자동생성시 app.js 로 되어 있는데 cafe24를 호스팅으로 사용할 경우 파일이름이 web.js로 되어 있어야 합니다.)
  • package.json :  프로그램 이름, 버전, 필요한 모듈 등 노드 프로그램의 정보를 기술합니다. (NPM은 이 정보를 참고하여 필요한 모듈을 관리)

HTML

  • 우리가 보는 웹페이지가 어떻게 구조화되어있는지 브라우저로 하여금 알 수 있도록 하는 마크업 언어(프로그래밍 언어 X)

 

PUG

  • 코드를 간소화 시켜 컴파일 한 후에 html을 렌더링 하는 방식
  • Node Express Template Engine(express가 지원하는 템플릿 엔진)
  • html to pug Online converter: https://html-to-pug.com/