1. FrameWork vs Library
React는 라이브러리이고, Next.js는 리액트의 프레임워크이다.
이 둘의 궁극적인 차이점은 "응용 프로그램의 흐름 주도권을 누가 가지고 있느냐" 이다.
1) Framework
원하는 기능 구현에 집중하여 개발할 수 있도록 일정한 형태와 필요한 기능을 갖추고 있는 골격, 뼈대를 의미한다.
프레임워크는 애플리케이션의 코드가 프레임워크에 의해 사용된다.
애플리케이션 코드는 프레임워크가 짜 놓은 틀에서 수동적으로 동작하기 때문에 제어의 흐름은 프레임워크가 가지고 있고 사용자가 그 안에 필요한 코드를 작성하게 된다.
2) Library
소프트웨어를 개발할 때 컴퓨터 프로그램이 사용하는 비휘발성 자원의 모임, 즉 특정 기능을 모아둔 코드 및 함수들의 집합이며 코드 작성 시 활용 가능한 도구들을 의미한다.
라이브러리를 사용할 때 사용자는 애플리케이션 코드의 흐름을 직접 제어해야 한다.
개발 시 필요한 기능이 있을 경우 능동적으로 라이브러리를 호출하여 사용하거나 기존에 구성된 함수나 코드를 가져나 쓰면 된다.
2. 리액트의 문제점, 왜 Next.js인가?
리액트의 가장 큰 문제점은, 기본적으로 클라이언트 사이드에서만 작동한다는 점이다.
사용자의 웹 브라우저에서만 실행되기 때문에 리액트를 사용한 웹 애플리케이션은 검색 엔진 최적화(Search Engine Optimization(SEO))의 효과를 거의 볼 수 없으며, 첫 화면에 애플리케이션을 제대로 표시하기 위해 실행 초기에 성능 부담이 발생한다.
이 문제를 해결하기 위해 웹 애플리케이션을 미리 렌더링하는 방법에 대한 연구가 시작되었고, Vercel이 Next.js를 만들었다. Next.js는 리액트가 제공하지 않는 다양한 기능을 제공하면서 리액트 웹 애플리케이션 개발 분야의 판도를 뒤흔들었다.
Next.js가 제공하는 기능에는 다음과 같은 것들이 있다.
Next.js이외에도 서버 사이드 렌더링을 지원하는 프레임워크는 다수 존재하지만, 그 중에서 Next.js를 가장 많이 사용하는 이유는 Next.js가 제공하는 믿기 힘들 정도로 뛰어난 기능 때문이다.
또한 많이 사용되는 프레임워크인 만큼 활동적인 커뮤니티를 가지고 있고, 이를 통해 많은 도움을 받을 수 있다는 점도 Next.js의 큰 장점이라고 할 수 있다.
