NGMsoftware

NGMsoftware
로그인 회원가입
  • 매뉴얼
  • 학습
  • 매뉴얼

    학습


    Web 리액트와 넥스트js의 문제점에 대한 이야기. (React and Next.js)

    페이지 정보

    본문

    안녕하세요. 엔지엠소프트웨어입니다. 2023년 최고의 frontend 개발 언어는 단연코 리액트라고 할 수 있습니다. 저도 몇년전까지 Angular를 이용해서 frontend를 개발했었는데요. 회사 내부적으로 차세대 프론엔드 개발 언어로 뭘 쓸지 고민이 많았습니다. 그래서, 2023년 시작하게 된 New Product은 Vue와 React중에서 React로 방향이 정해졌습니다. React를 이용한 frontend 개발이 2년차가 되어 갑니다. 물론, backend는 Java입니다. 데이타베이스는 InfluxDB를 좀 사용하다가 지금은 PostgreSQL로 만들고 있습니다.

    yjuTxYa.png

     

     

    위에서 할 수 있듯이 2023년 Web Frameworks 랭킹에서 Node.js를 제외하면 React가 1위를 차지하고 있습니다. React의 단점을 개선한 Next.js가 5위에 올라와 있네요. 요즘은 React만 이용해서 개발하지는 않고, Next.js를 같이 사용합니다. 프로젝트의 규모가 커지고 복잡도가 올라갈수록 리액트의 한계점에 봉착하게 됩니다. 그래서, 여러가지 확장 프레임워크를 도입해서 개발하고 있습니다. 엔터프라이즈급 프로덕션 프로젝트의 경우 아래와 같은 문제로 인해 개발에 어려움을 겪게 됩니다.

    • 페이지별 라우팅을 지원하지 않음
    • 데이타 패칭 솔루션 없음
    • 페이지 렌더링이 서버사이드만 지원해서 SEO 품질 저하
    • Slow TTV/FCP로 인한 느린 랜더링 (TTV: Time To View, FCP: First Contentful Paint)

    VyevlH2.png

     

     

    위와 같은 문제들 때문에 리액트만 가지고 개발하기에는 한계에 부딪히게 됩니다. 그래서, 다양한 React Meta-Frameworks들이 등장하게 되었습니다. 그중에 하나가 지금 여러분들과 같이 학습하고 있는 Next.js입니다. 저도 이번 회사 프로젝트를 React로 개발하다가 발생되는 문제점들을 어떻게 극복할 수 있을까를 고민하면서 여러가지를 테스트하고 있습니다. 자료를 조사하면서 알게된 사실은 정말 많은 회사들이 Next.js를 이용해서 프로덕션을 제작하고 있다는것입니다. 지금 리액트로 되어 있는 회사 프레임워크를 어떻게 Next.js로 마이그레이션할지가 큰 고민이 아닐 수 없습니다.

    ytPkkm3.png

     

     

    여러분들도 단순히 학습용이나 개인 포트폴리오용이 아닌 제대로된 회사 제품을 개발한다면 Next.js를 사용하는게 좋을겁니다. React는 이미 많은 개발자들이 사용하고 있을테니 학습하는데 큰 어려움은 없을겁니다. 앞으로도 계속 강좌를 해 나가겠지만, 리액트에서 크게 4가지 정도만 이해하면 사용하는데 무리가 없습니다^^

     

    개발자에게 후원하기

    MGtdv7r.png

     

    추천, 구독, 홍보 꼭~ 부탁드립니다.

    여러분의 후원이 빠른 귀농을 가능하게 해줍니다~ 답답한 도시를 벗어나 귀농하고 싶은 개발자~

    감사합니다~

    • 네이버 공유하기
    • 페이스북 공유하기
    • 트위터 공유하기
    • 카카오스토리 공유하기
    추천0 비추천0

    댓글목록

    등록된 댓글이 없습니다.