Express.js

Express는 웹 프레임워크입니다.

• 웹 서비스를 구현하는데 필요한 모든 기능을 해당 틀 안에서 제공합니다.

Express 홈페이지 소개

• 웹 애플리케이션 :Express는 웹 및 모바일 애플리케이션을 위한 일련의 강력한 기능을 제공하는 간결하고 유연한 Node.js 웹 애플리케이션 프레임워크입니다.

• API : 자유롭게 활용할 수 있는 수많은 HTTP 유틸리티 메소드 및 미들웨어를 통해 쉽고 빠르게 강력한 API를 작성할 수 있습니다.

• 성능 : Express는 기본적인 웹 애플리케이션 기능으로 구성된 얇은 계층을 제공하여, 여러분이 알고 있고 선호하는 Node.js 기능을 모호하게 만들지 않습니다.

• 미들웨어 : Express는 핵심 기능을 최소화한 가볍고 유연한 라우팅 프레임워크로, Express 미들웨어 모듈을 사용하여 기능을 확장할 수 있도록 설계되었습니다.

---

Express는 다양한 기능을 제공하면서 빠르고, 자유도가 높은 웹 에플리케이션 프레임워크.
↓
여러명이서 프로젝트를 작업하고, 프로젝트의 규모가 커질수록 규칙의 필요성이 커집니다.
=> 프로젝트의 구조화

구조화는 어떻게?

• 기능별로 폴더를 분리하여 관리합니다.
  | 장점 |
  • 충돌이나 문제 발생시 빠르게 찾을 수 있습니다. (각 단계별 순서로 확인)
  • 재사용성 증가와, 유지보수 효율이 높아집니다. (중복코드는 줄이고, 명확한 파일구조로 이해도 상승)

---

Express 구조

Express 서버의 node.js 프로젝트 디렉토리(폴더) 구조

src
│   app.js          # App entry point
└───api             # Express route controllers for all the endpoints of the app
└───config          # Environment variables and configuration related stuff
└───jobs            # Jobs definitions for agenda.js
└───loaders         # Split the startup process into modules
└───models          # Database models
└───services        # All the business logic is here
└───subscribers     # Event handlers for async task
└───types           # Type declaration files (d.ts) for Typescript

원본

*비지니스로직 - 컴퓨터 프로그램에서 실세계의 규칙에 따라 데이터를 생성, 표시, 저장, 변경하는 부분을 일컫는다. |위키백과|

아직 위 내용을 이해하고 적용할 단계는 아니기에..

좀 더 간단?하고 express에서 제공하는 구조를 알아보자

• express 공식 홈페이지에서 Getting started에서 express generator메뉴로 들어가면 'Express application generator'을 확인할 수 있는데.
  링크

• 페이지에서 안내한대로 VSC 터미널에서
  npm install express-generator -g
express (myapp) // myapp 은 프로젝트 이름입니다.
  를 실행하면 express 에플리케이션 스켈레톤이 생성된 것을 볼 수 있습니다.

• 각각의 폴더는 기능에 맞게 구조가 잡혀있으며.
  터미널에서 npm start명령어로 실행시킬 수 있습니다..

chat gpt의 도움을 받아 각 폴더의 역할을 정리하면 다음과 같습니다.

myapp/
├── bin/                 # 서버 실행 관련 파일
│   └── www              # Express 서버 실행 스크립트
├── public/              # 정적 파일 (CSS, JS, 이미지 등)
│   ├── images/          # 이미지 파일 저장 폴더
│   ├── javascripts/     # 클라이언트 측 JavaScript 파일 저장 폴더
│   └── stylesheets/     # CSS 파일 저장 폴더
├── routes/              # 라우팅 파일 (URL 엔드포인트 정의)
│   ├── index.js         # 기본 라우트 (홈페이지)
│   ├── users.js         # `/users` 라우트
├── views/               # 템플릿 엔진 파일 (Pug, EJS 등)
│   ├── error.pug        # 에러 페이지 템플릿
│   ├── index.pug        # 메인 페이지 템플릿
│   └── layout.pug       # 공통 레이아웃 템플릿
├── app.js               # Express 애플리케이션의 엔트리 파일
├── package.json         # 프로젝트 정보 및 의존성 목록
├── package-lock.json    # 설치된 패키지 버전 관리
└── README.md            # 프로젝트 설명 파일

• 역할에 따라 분리하였지만 각 폴더는 독립적이지 않습니다.
• 서로의 모듈을 참조하고 의존하는 방식으로 동작합니다.