취업은 spring으로 할것이라.. node 프로젝트를 주말에 조금씩하고 있는데 이 세개의 차이 점이 무엇인지 포스팅 하고자 한다
Nest (NestJS)는 효율적이고 확장 가능한 Node.js서버측 애플리케이션을 구축하기 위한 프레임워크입니다.
프로그레시브 자바스크립트를 사용하고 TypeScript로 빌드되고 완벽하게 지원하며(하지만 여전히 개발자가 순수 자바스크립트로 코딩할 수 있음), OOP (객체 지향 프로그래밍 Object Oriented Programming), FP (함수형 프로그래밍 Functional Programming) 및 FRP (함수형 반응형 프로그래밍 Functional Reactive Programming) 요소를 결합합니다. ->next js 공식사이트
express를 기본으로 채택하고 그 위에 여러 기능을 미리 구현해놓은 것이 nestjs입니다.
Nest.js는 React,Nuxt.js는 Vue를 위한 프레임워크인데, Nest.js는 Java의 Spring 구조를 본떠, Node에서 활용할 수 있게 만들어졌다.
node보다 좋은점은
SEO(Search Engine Optimization)와 SSR(Server Side Rendering)에 대한것인데 대표적으로는, 브라우저에는 window 객체, Element 객체 등이 있지만, Node.js에서는 없다.
SEO & SSR (Search Engine Optimization & Server Side Rendering)
React는 SPA(Single Page Application)로, 가장 큰 단점은 CSR(Client Side Rendering)으로 작동한다는 것입니다. 그래서 SEO가 불가능하다는 것과, SEO를 위해 SPA를 SSR하려면, 별도의 복잡한 설정, 수많은 오류와 부딪혀야 한다 Browser 환경과 Node.js 환경이 달라서 상당히 고생하게 된다. Next.js는 이를 해결해준다.
---그럼 nest next 차이점은?
Nuxt – 범용 렌더링을 지원하는 Vue 애플리케이션을 만드는 프레임워크
Next – 범용 렌더링을 지원하는 React 애플리케이션을 만드는 프레임워크
Nest – 추가 구조 및 지원을 갖춘 노드 애플리케이션 개발을 위한 프레임워크
Next.js를 사용하면 얻어지는것들
Front-end configurations
React components
React routing
Babel
Webpack
TypeScript
SourceMap
Dev Server
HMR (Hot module Replacement)
etc…
Back-end configurations
REST API
SEO (Search Engine Optimization)
SSR (Server Side Rendering)
SSG (Static Site Generation)
Dynamic Routes
Middleware
public assets
etc…
->next를 사용하면 위와 같은 복잡한설정 x
Express
유연함, 확장성-xpress는 가볍게 테스트용 서버를 띄울수 있습니다. 아이디어를 빠르게 검증하는 데에는 좋겠지만 단순하고 자유도가 높은 만큼 자기에게 맞는 라이브러리를 찾기 위해 발품을 팔아야 합니다. 보일러 플레이트를 미리 얹어 놓은 깃허브 리포지토리들이 있으니 이를 활용해도 좋습니다.
Typescript 지원-추가 설정을 통해 사용가능합니다.
NestJS
미들웨어, IoC, CQRS 등 이미 많은 기능을 프레임워크 자체에 포함하고 있습니다. 사용자는 문서를 보고 쉽게 따라할 수 있습니다. 원하는 기능이 없다면 다른 라이브러리를 적용해서 사용하면 됩니다.
typescript 기본 설정입니다. 바닐라 자바스크립트1로도 작성 가능합니다.
Next.JS를 사용하는 가장 큰 이유는 SSR이다. 하지만 CSR방식으로 사용하면서 SPA의 장점도 유지할 수 있다.
Next.JS의 작동원리
- 초기에 사용자가 Server에 페이지 접속을 요청하면, SSR방식으로 렌더링 될 HTML을 보냄.
- 브라우저에서 JavaScript를 다운로드하고 React를 실행함.
- 사용자, 페이지가 서로 상호작용하여 다른 페이지로 이동할 땐, Server가 아닌 CSR방식으로 브라우저에서 처리함.
-web framework
React Javascript
Typescript SPA(Single Page Application)나 모바일 앱 개발에 사용된다.
최근 몇 년간 가장 인기있는 프론트엔드 프레임워크
가상 DOM(Virtual Document Object Model)을 사용한다
페이스북이 주도하는 공동체에서 유지 보수되고 있다
Vue.js Javascript
Typescript React.js와 함께 인기있는 프론트엔드 프레임워크
SPA를 구축할 수 있다
MVVM 패턴에서 VM(View Model)에 해당하는 라이브러리
속도가 빠르다
Express Javascript
Typescript 가장 많은 사용자를 가지고 있는 Node.js 기반 백엔드 프레임워크
가볍게 서버를 구동시킬 수 있다
NestJS와 같이 Express를 기반으로 하는 프레임워크도 존재한다
Spring Java
Kotlin 국내에서 인기가 높은 자바기반 프레임워크.
전자정부프레임워크를 이용하는 프로젝트를 수행하기 위해서는 스프링을 알아야 하기 때문에 그 영향이 크다
IoC, DI, AOP와 같은 객체 지향 프로그래밍 기법을 쉽게 적용할 수 있다
+Node.js의단점
아무래도 컴파일러 언어의 처리속도에 비해 그 성능이 떨어진다는 점입니다. 하지만 서버의 성능은 꾸준히 발전하고 있고, V8엔진의 성능이 계속 향상되고 있어 왠만한 웹 애플리케이션을 만들기에는 손색이 없습니다. 이벤트 기반 비동기 방식으로 복잡한 기능을 구현하다 보면 여러 이벤트를 동시에 처리하는 경우 콜백 지옥에 빠지는 경우가 있습니다. 코드가 대각선으로 쭉 들어쓰여 작성되면서 가독성이 떨어지고 이해하기 어려운 코드가 양산되는 경우가 빈번했습니다. 하지만 ECMAScript 2015(ES6)에서 Promise가 도입되면서 간결한 표현으로 작성할 수 있게 되었습니다. ECMAScript 2017에서는 async/await 기능이 추가되면서 비동기 동작을 마치 동기로 처리하는 것처럼 코드를 작성할 수 있게 되었습니다.
