본문 바로가기

Next.js9

Jamstack이란 무엇일까? (프론트엔드 개발자들이여 프론트에 집중하자!)

Next.js Jamstack 배포를 지원한다는데 무슨말일까?

찾아보니 홈페이지도 있네? https://jamstack.org/

 

Jamstack | JavaScript, APIs, and Markup

What is the Jamstack? You may have already seen or worked on a Jamstack site! They do not have to include all attributes of JavaScript, APIs, and Markup. They might be built using sites built by hand, or with Jekyll, Hugo, Nuxt, Next, Gatsby, or another st

jamstack.org

 

위의 공식 사이트 내용을 요약하자면,

JAM은 일단 Javascript, API들, Markup(HTML)을 말하고,

Stack이란 운영체제나 서버 등 백엔드와 관련된 걸 신경쓰지 않는다는걸 뜻한대. 

즉 정리하자면, Javascript, API, Markup 만 가지고 사이트를 만드는 방법이란 뜻!

Photo by Olia Gozha on Unsplash

 

맞아. 우리 사이트 하나 만드는데 왜이렇게 신경쓸께 많은지. 프론트엔드 하는 사람에겐 완전 환영받을 개념이네!

 

프론트엔드 개발자들이여 프론트에 집중하자!

 

저번에 소개한 Vercel과 같은 사이트 생성하는 서비스를 이용한다면 우리는 이미 JamStack!

 

Next.js 배포하기(Vercel 사이트 이용하기)

친구들! Next.js로 사이트 만들었는데, 이제 배포할 차례야! 집에 서버가 있다면 간단히 빌드 및 실행하는 걸로 가능해! 먼저, 변경사항이 있다면 빌드! - Pre-rendering할 페이지들 미리 만들어주는 과

ppsu.tistory.com

 

아래와 같은 경우는 잼스택이 아니래

  • 서버사이드 CMS로 생성되는 사이트들 ex) WorkPress, Druipal, Joomla, Squrespace.
  • Ruby, Node, 등의 백엔드 언어에 의존하며, 모노리틱 서버에서 동작하는 웹앱
  • 실행시 서버에서 뷰를 생성하기 위해 isomorphic rendering을 사용하는 SPA(Single Page App)

 

 

왜 잼스택일까?

아래 내용은 사이트에 있는 내용을 번역해봤어!

더 나은 성능!

배포타임에 생성해도 되는 페이지들을 요청시마다 생성할필요 없잖아? CDN에서 받는 것 만큼 시간을 절약하는 방법이 없지

더 높은 보안성!

우리가 집중해야 할곳은 맨 앞단 프론트영역, API들은 마이크로 서비스로 추상화되어 감춰지니까 외부의 공격영역이 줄어들고, 해당 도메인에 대한 전문적인 서드파티 서비스들을 이용할 수도 있어.

저렴하고 쉬운 스케일링!

배포해야할 양이 많고 세계 어디든 서비스 해야한다고 하면 스케일링은 신경써야할 문제지. 이때 역시 CDN을 사용하기 좋은데, 요금제에 따라 요걸 선택할수 있다는 장점이 있지.

개발자 친화 환경!

제어의 느슨한 결합과 분리는 더욱 타겟팅된 개발 및 디버깅을 가능하게 하고, 사이트 생성기에 대한 CMS 옵션의 선택 확대로 인해 컨텐츠와 마케팅을 위해 별도의 스택을 유지할 필요가 없어진다는 군!