NextJS React 새로운 프로젝트 생성하기 방법

NextJS는 React 기반의 웹 어플리케이션을 위한 프레임워크이다.
React 웹 어플리케이션을 위한 새로운 방안으로 Meta에서 새롭게 제시되었다.
React 기반의 프레임워크는 여러가지가 있다.
NextJS를 이용할 경우 서버 사이드 렌더링, 정적사이트 구성과 라우팅 구현의 편의성을 제공한다.

프레임워크 생성을 위한 CNA

2025년 Meta는 공식적으로 React 개발을 위한 프로젝트 생성 명령어 CRA 지원을 중단한다.
CRA는 npm create-react-app 명령어의 앞글자를 딴 축약어이며,
React 웹 어플리케이션을 제작하기 위한 프로젝트 생성을 위한 명령어이다.
CRA는 지원 중단을 했지만, 
보완적 수단으로 여거가지가 발표되었다.
본인의 경우 뜻하지 않게 2024년 중순부터 지켜본 것이 CNA이다.
CNA는 npx create-next-app 명령어로,
React 기반의 NextJS 백엔드 개발을 가능하도록 도와준다.
여러가지 장점은 있겠지만, 글쎄 ~ 정확히 어떤 개발을 해 본적이 없기에 잘 모르겠다.
모든 프로그래밍 언어들이 새롭게 나올 때마다 하는 말은 공통적이기 때문이다.

배우기, 개발하기, 적용하기 과거에 비해 쉬워졌다.

믿음은 가지 않지만, 경험자분들의 말에 따르면,
이전의 그것보다는 개발이 많이 수월해 졌다는 후문이다.

NextJS React 프로젝트 생성 과정

  1. npx create-next-app
  2. 무조건 엔터 연타
  3. npm run build
  4. npm run dev
  5. http://localhost:3000

댓글

댓글 쓰기

이 블로그의 인기 게시물

영어 잘 하는 방법 영어 문법을 공부하고 책을 많이 본다

영어를 하는 방법에 대해 질문을 한 적이 있다. 돌아온 답이 2가지였다. `영어 문법을 공부해 보세요.` `책을 많이 보세요.` `이것도 어렵다면 영어 문법 책의 문장을 외워보세요.` 무엇을 하든 동기부여 영상 등의 주를 이루는 것이 책을 소개하는 것이 대부분인 것을 보면, 영어를 잘 하는 방법은 따로 없는 것 같다. 영어 문법을 공부하고, 책을 많이 보고 써먹어 보는 방법밖에는 없어 보이지만, 절대적인 사실임에는 분명해 보인다. 이것도 안되면, 포기해야겠지만 말이다. 영어 잘 하는 방법 영어 문법을 공부하고 책을 많이 본다 어렸을 적부터 훌륭한 사람이 되려면 책을 많이 보라는 잔소리를 듣게 된다. 영어 잘 하고 싶은 질문에도 같은 답변을 받게 받게 될 줄은 생각도 하지 못했지만, 그렇다고 틀린 말도 아니다. 한때 1년동안 독하게 영어공부를 해 본 적이 있다. 열심히 했지만, 도통 실력이 늘어날 기미가 보이지 않았다. 9개월정도 됐을 때 차라리 영어문장을 외워보란 권유를 받았다. 한달 정도 해석이 되지 영어문장을 작은 수첩에 적고, 열심히 읽었다. 그 어려웠던 것들이 조금은 해소가 되고 의미가 무엇인지 알게 되었다. 혹시 이런 맥락이 아닐까 싶다. `영어 문법을 공부해 보세요.` `책을 많이 보세요.` `이것도 어렵다면 영어 문법 책의 문장을 외워보세요.` 솔직히 이미 했던 방법인데 나 자신이 모르고 있던 내용이었다. 그렇다면 지금의 영어 실력은 어떨까 ?? 그 때 이후로 공부를 중단했기에 그 당시의 수준에 머물고 있다. 영어문장을 보면 대충 무슨 맥락인지는 알겠지만, 정확한 내용은 잘 모른다. 미련이 남았기 때문일까? 다시금 영어를 시작해 보기로 했지만, 욕심으로 끝날지, 수준이 높아질지는 미지수이다. 진행이 어떻게 될지는 모르겠지만, 이미 언급한 내용을 기준으로 진행해 보려고 한다. 영어 문법을 공부하기. 영어 문장을 반복해서 읽어보기. 영어 책을 읽어보고 내용 파악하기. 영어라는 큰 주제에서 순서는 의미가 없을 수 있다. 2번의 경우 3번에 해당하기 때문...
자세한 내용 보기

영어 문법 종류와 형식

영어 문법을 공부하기 위해  책을 한권 구입하면 문법 형식에 대한 얘기가 먼저 나온다. 영어의 문법 형식은 5가지가 있으며, 보통 영어의 5형식이라 표현한다. `5가지 공식만 외우면 된다` 그리고, 각 형식들의 구성요소를 나열하면 다음과 같다. 주어, 동사, 보어, 목적어, 간접목적어, 직접목적어, 목적보어 위의 7가지 구성요소를 수식으로 만들 줄 알면  이론적인 영어 문법의 5가지 형식과 종류는 알고 있다고 볼 수 있다. 물론, 말하기와 영어 문장을 해석하는 것은 어려울 수 있다. 잘하는 사람들  부럽다. 영어 문법 종류 5가지 형식과 종류 영어 문법은 7가지의 구성요소로 이루어진 하나의 문장 체계이다. 구성요소는 ` 주어, 동사, 보어, 목적어, 간접목적어, 직접목적어, 목적보어 `로 되어 있다. 구성요소를 이용한 영어 문법의 5가지 형식과 종류는 다음과 같다. 1형식 주어 + 동사 2형식 주어 + 동사 + 보어 3형식 주어 + 동사 + 목적어 4형식 주어 + 동사 + 간접목적어 + 직접목적어 5형식 주어 + 동사 + 목적어 + 목적보어 영어는 못하더라도 이 문장 공식은 외워두도록 하자. 거의 모든 문장은 위의 형식을 기준으로 만들어지고, 독해할 때는 도움이 된다. 말을 배우기 전  책을 읽기 위한 조건이라 생각하자. 솔직히, 언어를 배우는 것은 해당 국가의 사람과 듣고, 말하기가 가능해야 되는 것이지만, 상대적으로 이런 경험이 부족할 수 밖에 없는 경우, 책을 보고 익히는 것이 상대적으로 가장 빠른 방법이다. 일단, 위의 문장형식이 익숙해지면,  단어들을 이용해 문장을 만드는 연습이 자연스레 익숙해 지기도 한다. 뭐, 쉽지는 않다. 5형식 문장 구조
자세한 내용 보기

공부했던 C# 닷넷 프로그래밍 정리하기

C# 닷넷 프로그래밍 자체는 방대하고, 다양한 기능을 제공하지만,  제대로 정리해 본 경험은 없는 것 같다. 주로 게시판과 같은 업무용 프로그램을 했고, 다른 것들은 조금씩 해봤기에 C# 닷넷이 대충 어떤 것인지 느낌은 있지만, 그럼에도 제대로 한 경험은 없는 느낌이다. 오랜기간 닷넷 프로그래밍을 하면서 도움을 받은 책은 `닷넷 프로그래밍 정복`이란 책이다. 국내 서적 중 가장 두껍고 자세한 설명이 있다. 다분히, 사람을 지치게 하지만, 여기에 있는 모든 코드를 한번쯤 실행해 봤다면, 어지간한 프로그래밍은 C# 닷넷으로 가능하다. 하지만, 윈도우 한정이고, 웹서비스를 위해선 비용이 좀 든다는 단점이 있긴 하다. 뭐, 이정도를 제외하면 이것만한 것은 없다는 생각이다. 개인적인 생각으로, 닷넷 프로그래밍을 위한 비주얼 스튜디오는 현존 최강이란 생각이다. C# 닷넷 프로그래밍 공부에 필요한 것 C# 닷넷 프로그램을 공부를 위해 필요한 것은 얼마되지 않는다. 다만, 학습에 막대한 시간이 필요하다. C# 닷넷 프로그래밍을 위한 개발툴과 문법 그리고, 코드 사용법, 디버깅 정도이다. 솔직히, 모든 프로그래밍의 근본은  코드를 목적에 맞게 어디에서 어떻게 사용하는지가 포인트가 된다. 아래는 C# 닷넷 프로그래밍을 공부할 때 필요한 몇가지 내용이다. 비주얼스튜디오 ( Visual Studio ) C# 문법 C# 코드 사용법 디버깅 비주얼스튜디오 / Visual Studio 비주얼스튜디오는 C# 닷넷 프로그래밍을 하기 위한 툴( IDE )이다. 프로젝트를 생성하고, 파일을 만든 후, 컴파일을 하면  코드를 작성한 순서대로 프로그램이 실행된다. 비주얼스튜디오는 C# 뿐만 아니라 윈도우 프로그래밍을 하기 위한 전반적인 개발툴이며, C# 뿐만 아니라 유니티, 인공지능 등의 라이브러리와 프로젝트를 제공하고 있다. 특별한 일이 없다면, 거의 사용하지 않을 것들이 넘쳐나는 것이기도 하지만, 자세히 살펴보면 꽤나 흥미로운 것들이 있다. 역시나,  전부 익...
자세한 내용 보기