내일배움캠프 Node.js 7기

JavaScript 톺아보기

Realuda72 2024. 10. 14. 21:46

 

 

자바스크립트란?

 

ko.javascript.info

 

 자바스크립트는 웹페이지에 생동감을 불어넣기 위해 만들어진 프로그래밍 언어이다.

 

 자바스크립트로 작성한 프로그램을 '스크립트(script)'라고 한다. 스크립트는 웹페이지의 HTML 안에 작성할 수 있는데, 웹페이지를 불러올 때 스크립트가 자동으로 실행된다.

 

 스크립트는 특별한 준비나 컴파일 없이 보통의 문자 형태로 작성할 수 있고, 실행할 수 있다.

 

 자바스크립트는 브라우저뿐만 아니라 서버에서도 실행할 수 있다. 이 외에도 자바스크립트 엔진(JavaScript engine)이라는 특별한 프로그램이 들어 있는 모든 디바이스에서도 동작한다.

 

브라우저에서 할 수 있는 일

 모던 자바스크립트는 안전한 프로그래밍 언어다. 메모리나 CPU 같은 로우레벨 영역의 조작을 허용하지 않는다.

 

 자바스크립트의 능력은 실행 환경에 상당한 영향을 받는다.

 

 브라우저 환경에선 웹페이지 조작, 클라이언트와 서버의 상호작용에 관한 모든 일을 할 수 있다.

 

 브라우저에서 자바스크립트로 할 수 있는 일은 아래와 같다.

  • 페이지에 새로운 HTML을 추가하거나 기존 HTML, 혹은 스타일 수정하기
  • 마우스 클릭이나 포인터의 움직임, 키보드 키 눌림 등과 같은 사용자 행동에 반응하기
  • 네트워크를 통해 원격 서버에 요청을 보내거나, 파일 다운로드, 업로드하기
  • 쿠키를 가져오거나 설정하기, 사용자에게 질문을 건네거나 메시지 보여주기
  • 클라이언트 측에 데이터 저장하기

 

브라우저에서 할 수 없는 일

 브라우저는 보안을 위해 자바스크립트의 기능에 제약을 걸어놓았다.

 

 몇 가지 제약사항은 아래와 같다.

  • 웹페이지 내 스크립트는 디스크에 저장된 임의의 파일을 읽거나 쓰고, 복사하거나 실행할 때 제약을 받을 수 있다.
    모던 브라우저를 사용하면 파일을 다룰 수는 있다. 하지만 접근이 제한되어있다.
    카메라나 마이크 같은 디바이스와 상호 작용하려면 사용자의 명시적인 허가가 있어야 한다.
  • 브라우저 내 탭과 창은 대개 서로의 정보를 알 수 없다. 자바스크립트를 사용해 한 창에서 다른 창을 열 때는 예외가 적용된다.
  • 자바스크립트를 이용하면 페이지를 생성한 서버와 쉽게 정보를 주고받을 수 있다. 하지만 타 사이트나 도메인에서 데이터를 받아오는 건 불가능하다

 

자바스크립트만의 강점

  • HTML/CSS와 완전히 통합할 수 있음
  • 간단한 일은 간단하게 처리할 수 있게 해줌
  • 모든 주요 브라우저에서 지원하고 기본 언어로 사용됨

자바스크립트 '너머의' 언어들

 자바스크립트 문법만으로 모든 사람들의 요구를 충족할 수는 없기 때문에 브라우저에서 실행 되기 전에 자바스크립트로 트랜스파일(transpile)할 수 있는 새로운 언어들이 많이 등장했다.

  • CoffeeScript: 자바스크립트를 위한 'syntactic sugar'입니다. 짧은 문법을 도입하여 명료하고 이해하기 쉬운 코드를 작성할 수 있다.
  • TypeScript: 개발을 단순화하고 복잡한 시스템을 지원하려는 목적으로 '자료형의 명시화(strict datatyping)'에 집중해 만든 언어.
  • Flow: 역시 자료형을 강제하지만 TypeScript와는 다른 방식을 사용.
  • Dart: 모바일 앱과 같이 브라우저가 아닌 환경에서 동작하는 고유의 엔진을 가진 독자적 언어.

JavaScript 프레임워크

Express.js는 웹 및 모바일 어플리케이션 개발을 위한 기능을 제공하는 유연한 Nods.js 웹 어플리케이션 프레임워크이다.

Express.js는 아래과 같은 기능들을 제공한다.

  • 라우팅, 세션, HTTP요청, 에러 핸들링과 같은 다양한 백엔드 기능들을 제공한다.
  • 모바일 앱을 포함한 싱글 페이지, 멀티 페이지와 하이브리드 웹 어플리케이션과 같은 API와 웹 어플리케이션들을 쉽게 만들 수 있다.
  • HTTP요청에 대한 다양한 미들웨어를 제공한다.
  • HTTP 메서드와 URL을 사용하여 Express.js만의 고유한 라우팅 기법을 제공한다.
  • MongoDB, Redis, MySQL등과 같은 데이터베이스에 쉽게 연결이 가능하다.

Express.js의 장점은 아래와 같다.

  • 코딩 시간 단축
  • 자바스크립트 기반으로 인한 낮은 진입 장벽
  • 쉬운 설정
  • 다른 엔진들과의 연동이 쉬움
  • 프론트와 백엔드 간의 소통 용이
  • 오래 되었기에 강력한 커뮤니티 형성

Express.js의 단점은 아래와 같다.

  • 에러 메시지 분별력 떨어짐
  • 콜백 이슈
  • 코드 구성이 간혹 어려울 수 있음
  • 규모가 큰 프로젝트에 적합하지 않음

Nest.js는 효율적이고 확장 가능한 서버 사이드 어플리케이션을 만드는 진보적인 Nods.js 프레임워크이다.

Nest.js는 아래와 같은 기능들을 제공한다.

  • OOP (객체 지향 프로그래밍), FP (함수형 프로그래밍), 그리고 FRP(반응형 함수 프로그래밍?)를 모두 결합한다.
  • 다양한 데이터베이스를 지원한다.
  • ExpressJS를 기본으로 사용하면서 Fastify와 같은 HTTP 프레임워크를 설정해서 사용할 수 있을 정도로 에그노스틱한 플랫폼이다.
  • 더 적은 코드양으로도 어플리케이션을 만들 수 있도록 수 많은 라이브러리, API 그리고 기능들을 제공한다.
  • 코드의 가독성 및 유지보수를 위해 Dependency Injection(DI)이 내장되어 있다.
    => DI는 객체들의 의존관계를 정립하고 주입하는 것

Nest.js의 장점은 아래와 같다.

  • JS의 상위호환인 TypeScript를 주로 활용한다.
  • 체계적이고 자세한 문서화
  • 쉽고 빠르게 습득 가능
  • 강력한 CLI (Command Line Interface)
  • 오픈 소스
  • 편리한 유닛테스트

Nest.js의 단점은 아래와 같다.

  • JS기반이지만 TypeScript 지식이 필수
  • 유저 베이스의 결핍
  • ExpressJS보다 작은 커뮤니티

https://velog.io/@mathe1303/Node.js-ExpressJS-VS-NestJS

 

[Node.js] ExpressJS VS NestJS

Node.js - ExpressJS vs NestJS

velog.io