천천히 알아가는 세상

안녕하세요. 이번에는 React의 Create-react-app으로 프로젝트를 생성한 후 ESLint를 사용할 때 Error가 발생하는 현상을 해결해 보겠습니다. create-react-app으로 생성한 폴더 Components에서 return ( token parase 관련 Error 때문에 빨간 줄이 안 없어지는 현상 확인 pacakge.json "devDependencies": { "eslint": "^8.31.0", "eslint-config-airbnb-base": "^15.0.0", "eslint-plugin": "^1.0.1", "import": "^0.0.6", "prettier": "^2.8.1", "typescript": "^4.9.4" } 1. .eslintrc.js 파일에서 pars..

안녕하세요. 이번에는 React에서 build를 하는 방법에 대하여 알아보겠습니다. 우선 해당 프로젝트는 create-react-app으로 만든 프로젝트입니다. 1. Webpack 여러 기능을 넣고 하면 작업을 하면 우선적으로 용량 문제가 발생한다. 필요한 기능을 필요한 순간에 모듈 형태로 불러와서 사용을 하고, 배포할 때에는 필요 없는 기능은 다 빼고 빌드를 하는 방식을 사용한다. 의존성이 있는 모듈을 모아서 하나의 파일로 만들어 주는 역할한다. webpack webpack is a module bundler. Its main purpose is to bundle JavaScript files for usage in a browser, yet it is also capable of transformin..

안녕하세요. 저번에 이어서 React에 대하여 알아보겠습니다. 저번 글에서는 CDN으로 사용하는 방식에 대하여 진행하였지만, 이번에는 Create-react-app을 이용해서 하는 방법으로 진행하겠습니다. 1. 기본 세팅 설정 방법 최소 사양 Node 14.0.0 이상 npm 5.6 이상 기본 포트 3000번을 사용한다. 생성 명령어 my-app 대신에 사용하실 폴더 이름으로 변경해도 됩니다. VS Code 명령창에 입력하면 됩니다. npx create-react-app my-app cd my-app npm start 처음 실행 시 나오는 창 2. NPX Node Package eXute Node 실행을 위한 명령어이며, npm과는 달리 최신 버전의 패키지를 임시로 설치해서 실행하는 용도로 사용된다. N..