조회 1,785
익명
1월 16일
신입이지만 스타트업이라서, 어쩌다보니 제가 프론트를 리드하게 됐습니다. 웹을 만들어야 하는데 react와 nextjs 중에 고민이 됩니다. react 개발 경험은 있는데, nextjs는 처음이라서요. 어떤 걸 추천하시나요?
구체적이고 정성스러운 질문에 ↑Up 투표를 눌러주세요.
설명이 부족한 질문에 ↓Down 투표를 눌러주세요. 커리어리가 질문자에게 수정을 요청할게요.
답변 4
BEST 답변
안녕하세요. 단순 React (Single Page Application)과 Next.js와 같은 정적 사이트 생성기 혹은 서버 사이드 렌더링에 도움을 주는 프레임워크의 차이점과 장단점을 알고나면 어떤 걸 선택해야 하는지 대충 감이 올 것 같아요. 단순 React (Single Page Application)은 하나의 페이지에서 모든 데이터를 주고 받아요. 사실 페이지 이동처럼 보이게 하는 것도 react-router-dom과 같은 대표적인 라우팅 라이브러리로 사실은 페이지 이동이 아니라 URL이 변경될 때 보여주는 컴포넌트가 달라지는 것 뿐이죠. 실제로 페이지가 이동되어서 다시 html과 javascript를 받아오는 건 아니에요. 그래서 단순 React와 같은 SPA에서는 맨 처음에 유저가 홈페이지에 들어와서 html을 받아오고 나서 css와 javascript(react)를 불러와서 앱을 실행시키면 그 이후에는 우리가 React안에서 작성해놓은 코드로 앱이 동작하게 돼요. 반면에 Next.js와 같은 정적 페이지 생성 프레임워크들은 미리 페이지를 생성해놔요. (HTML을 여러 개 생성해놔요) 그리고 유저가 홈페이지에 들어왔을 때 해당하는 URL의 HTML를 전달해줄뿐이죠. (모든 동작이 다 같다는건 아니에요. SSR, SSG에 따라서 조금 다르긴한데 이건 요기서 다루지 않을게요.) 그래서 React와 같은 SPA에서는 웹 페이지를 불러오고 나서 데이터를 주고 받을 일이 많을 때 조금 더 유리해요. Next.js와 같은 프레임워크는 HTML을 미리 생성해놓는데, HTML을 불러오고 나서 HTML이 많이 바뀔거라면 굳이 미리 생성해놓을 필요가 없는거죠. 그래서 어드민 페이지(단순 텍스트보다 주고 받는 데이터가 훨씬 많음) 혹은 한 페이지에서 모든 일을 처리하는 앱과 같은 경우는 굳이 Next.js와 같은 프레임워크를 사용할 필요가 없을 것 같네요. 반대로 HTML을 많이 생성해놓으면 유리한 앱들이 있어요. 예를들면 블로그나 공식문서와 같은 페이지들은 데이터가 자주 변할 일이 없어요. 거의 같은 HTML을 생성할거라면 굳이 유저가 웹페이지에 들어와서 HTML을 요청할 때 만들어주는게 아니라 미리 다 만들어놓고 만들어놓은 HTML을 단순히 전달해주면 되는거죠. 그리고 Next.js에서는 JavaScript는 실행하지 않는 검색엔진 로봇들에게는(구글봇은 이제는 Javascript도 실행한다고 하지만) HTML이 생성이 되어있어야 해당 HTML을 읽어서 검색엔진에 노출을 시켜주기도해요(SEO). 검색엔진에 노출되지 않아도 되는 앱들도 있어요. 예를들면 회사 내부에서만 쓰이는 웹사이트라던가, 어드민 페이지 같이 내부에서 쓰이는 페이지는 굳이 SEO를 신경쓰지 않아도 되겠죠. 또한 여러가지 프레임워크가 제공해주는 편의성 기능들이 있기도해요. 해당 기능들은 공식문서 ( https://nextjs.org/ )에 가면 조금 더 자세히 알 수 있으니 참고하시면 될 것 같아요. 결론 1. 데이터 교환이 많은 앱인가? (Yes: React, No: Next) 2. 검색엔진노출이 중요한 앱인가? (Yes: Next, No: React) 3. 또한 프레임워크가 제공해주는 여러 기능들이 마음에 들고 공감하는가? => 그럼 사용 위의 것들을 잘 고려하시고, 공식문서도 참고하셔서 잘 저울질 하셔서 선택하시면 될 것 같아요~ 감사합니다!
익명
작성자
1월 16일
데이터 교환이 많고 검색엔진 노출에 중요하지 않아서 React로 시작해야겠어요. 정성스러운 답변 감사합니다!
유원곤
겟차 프론트엔드 개발자 • 4월 6일
요즘 cra 대신에 next.js를 쓰라고 권장하고 있습니다. 생각보다 어렵지 않고 편합니다.
지금 가입하면 모든 질문의 답변을 볼 수 있어요!
현직 개발자들의 명쾌한 답변을 얻을 수 있어요.
이미 회원이신가요?
지금 가입하면 모든 질문의 답변을 볼 수 있어요!
현직 개발자들의 명쾌한 답변을 얻을 수 있어요.