타입 스크립트 버전으로 설치

 

next js (ts 버전) 설치

npx create-next-app 앱이름 --ts
# or
yarn create next-app 앱이름 --typescript

 

작동

해당 앱폴더로 이동하여

npm dev

#or

yarn dev

 

상대경로 -> 절대경로로 바꾸기

 

 

tsconfig.json 파일에 아래를 추가

{
  [기타내용],
  "compilerOptions": {
  	[기타내용],
    "baseUrl": ".",
    "paths": {
      "@/*": [
        "./*"
      ]
    }
  },
  [기타내용],
 }

 

mobx 설치

yarn add mobx
또는
npm install --save mobx

 

 

설치 후 작동이 안될 경우

.next / node_modules / package-lock.json 을 지우고 

yarn install
또는
npm install

한 뒤 실행해본다

 

참고 사이트

velog.io/@soncl_97/Next.js-%EC%8B%9C%EC%9E%91%ED%95%98%EA%B8%B0

 

📋Next.js 시작하기

next 시작하기

velog.io

 

noogoonaa.tistory.com/65

 

next.js 와 typescript를 끼얹어 보자

최근 프론트엔드 생태계는 React, Vue, Angular 이 삼대장이 주류를 이루고 최근 Typescript 또한 각광 받고 있습니다. 저 또한 프론트엔드쪽 일을 자주하는 개발자로써 자연스럽게 이 삼대장 중 React를

noogoonaa.tistory.com

 

sumini.dev/guide/003-react-typescript-absolute-import/

 

React+Typescript 절대경로 import 설정하기

상대 경로를 사용하면 package 구조가 깊어질 수록 파일 간의 관계를 파악하기 어려워지고, 파일 이동시 귀찮게 경로를 수정해야 합니다. 예시 절대 경로를 사용하면 depth와 상관 없이 일관되고 짧

sumini.dev

 

chanyeong.com/blog/post/35

 

타입스크립트에서 절대경로(alias) 사용하기! - chanyeong

개요 요즘 부스트캠프에서 프로젝트를 진행하고 있는데 서버를 타입스크립트로 구현하고 있다. 그런데 설계 과정에서 폴더 및 파일이 나눠지고 import, export하는 과정에서 상대경로를 사용하다

chanyeong.com

 

velog.io/@sji7532/Next-Next-js%EB%A5%BC-%EC%82%AC%EC%9A%A9%ED%95%98%EC%97%AC-SSR-CSR-%EA%B5%AC%ED%98%84

 

[Next] Next js를 사용하여 SSR, CSR 구현

Next.js를 사용하면 React에서도 CSR, SSR을 혼합하여 빠른 성능을 구현할 수 있다.

velog.io

 

mobx.js.org/installation.html

 

Installation · MobX

mobx.js.org

 

'Web > ReactJS' 카테고리의 다른 글

intellij 인텔리제이 eslint typescript prettier  (0) 2021.02.19
react js / next js quill 적용  (0) 2021.02.17
react // 리덕스 실습  (0) 2020.08.14
리액트 // redux 리덕스  (0) 2020.08.12
리액트 // useEffect 연습  (0) 2020.08.05

+ Recent posts