개발자

seo가 중요하지 않은 웹서비스 만들 때 react랑 nextjs 중에 뭘 더 추천하시나요?

2023년 01월 16일조회 2,933

신입이지만 스타트업이라서, 어쩌다보니 제가 프론트를 리드하게 됐습니다. 웹을 만들어야 하는데 react와 nextjs 중에 고민이 됩니다. react 개발 경험은 있는데, nextjs는 처음이라서요. 어떤 걸 추천하시나요?

이 질문이 도움이 되었나요?
'추천해요' 버튼을 누르면 좋은 질문이 더 많은 사람에게 노출될 수 있어요. '보충이 필요해요' 버튼을 누르면 질문자에게 질문 내용 보충을 요청하는 알림이 가요.
profile picture
익명님의 질문

답변 5

인기 답변

정현수님의 프로필 사진

안녕하세요. 단순 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. 또한 프레임워크가 제공해주는 여러 기능들이 마음에 들고 공감하는가? => 그럼 사용 위의 것들을 잘 고려하시고, 공식문서도 참고하셔서 잘 저울질 하셔서 선택하시면 될 것 같아요~ 감사합니다!

profile picture

익명

작성자

2023년 01월 16일

데이터 교환이 많고 검색엔진 노출에 중요하지 않아서 React로 시작해야겠어요. 정성스러운 답변 감사합니다!

유원곤님의 프로필 사진

유원곤

겟차 프론트엔드 개발자2023년 04월 06일

요즘 cra 대신에 next.js를 쓰라고 권장하고 있습니다. 생각보다 어렵지 않고 편합니다.

인기 답변

kevin님의 프로필 사진

nextjs에 대해서 좀더 알아보시면. 비단 ssr 용도로 사용되기에 이것을 쓴다 이것말고도 사용할이유가 엄청납니다 React 로 직접 환경을 구성한다고 해도 nextjs 에서 제공하는것만큼 깔끔하게 나오기 쉽지 않아요.. 게다가 스태틱빌드같은경우도 제공하고 하이드레이션을 할수있다거나 등등 🤣

송동훈님의 프로필 사진

next의 file-based routing도 정말 편한 기능이라고 생각합니다. react에서 routing 코드를 손수 짜다보면 프로젝트가 커질때마다 꽤나 복잡하더라구요.

최경훈님의 프로필 사진

SEO가 안중요하다면 스타트업에서는 사실 뭘 써도 무방하다고 생각됩니다. 빠르게 개발할거면 React로만 빨리 하는게 좋겠죠

제일님의 프로필 사진

제가 보기엔 이 질문에 대한 대답은 SEO 여부보다도 개발 구성팀이 어떻게 되어있는지가 핵심입니다. nextjs 같은 경우 단순히 SSR을 지원해서 SEO를 하게 해주는 것이 아니라, SSR을 하기 때문에 Server side를 필연적으로 만지게 된다는 점입니다. 즉, 직접 데이터를 핸들링하거나 혹은 DB 전문가가 만들어 놓은 db 기능(procedure, query)에 접근 및 처리하는 부분까지 담당하셔야 한다는거에요. 물론 next.js만으로 프론트만 개발할수 잇죠. 하지만 next.js로 넘어가면 서버 개발자도 next.js를 다루게 해야 합니다. 이 점에서 타협이 이루어졌는지가 궁금하네요. 만약 역할 부분에서 이야기 된 부분이 없다면 next.js로 넘어가기 어려워 보입니다.

지금 가입하면 모든 질문의 답변을 볼 수 있어요!

현직자들의 명쾌한 답변을 얻을 수 있어요.

또는

이미 회원이신가요?

목록으로
키워드로 질문 모아보기

실무, 커리어 고민이 있다면

새로운 질문 올리기

지금 가입하면 모든 질문의 답변을 볼 수 있어요!