본문 바로가기
728x90

Programming/React6

[Deploy]React github pages로 배포하기 (create-react-app) create-react-app으로 생성해서 개발이 완료된 프로젝트를 github pages를 통해 배포하는 방법을 알아보겠습니다. 프로젝트 구조 yarn build build 명령어가 완료되면 프로젝트 root 위치에 build 폴더가 생성됩니다. 터미널 창에서 보면 아래와 같은 결과를 볼 수 있습니다. https://cra.link/deployment 위 사이트에 접속해보면 여러 방법으로 배포하는 방법이 자세하게 나와있습니다. AWS Amplify, Azure, firebase, github pages, Heroku, Netlify 등등 다른 방법은 직접 해보시고 여기서는 Github페이지를 통해 배포하는 방법을 설명합니다. (해당 기능은 react-scripts@0.2.0 이상에서 사용할 수 있습니다.. 2020. 12. 28.
husky와 lint-staged로 git hook 관리하기(코드 포맷 자동화) 2020/12/09 - [Programming/React] - 리액트 프로젝트에서 ESLint로 문법 검사하기 2020/12/09 - [Programming/React] - 리액트 프로젝트에서 Prettier로 코드 스타일 통일하기 2020/12/09 - [Programming/React] - Prettier, lint-staged, husky 등 설정파일 별도의 파일로 관리하기 회사에서 팀에서 개발을 하면서 prettier나 eslint로 기본적인 문법, 정해진 코드 스타일을 통해 개발을 하다 보니 한층 편해졌습니다. 0에서 4까지 for문 돌리는 코드를 작성해도 팀원1 코드 스타일 for(let i=0; i < 5; i++) { console.log(i); } 팀원2 코드 스타일 for(let i=0;i 2020. 12. 10.
Prettier, lint-staged, husky 등 설정파일 별도의 파일로 관리하기 2020/12/09 - [Programming/React] - 리액트 프로젝트에서 Prettier로 코드 스타일 통일하기 2020/12/09 - [Programming/React] - 리액트 프로젝트에서 ESLint로 문법 검사하기 리액트 프로젝트에서 ESLint로 문법 검사하기 2020/12/09 - [Programming/React] - 리액트 프로젝트에서 Prettier로 코드 스타일 통일하기 리액트 프로젝트에서 Prettier로 코드 스타일 통일하기 본인 혼자 개발할때는 크게 상관이 없지만, 나를 제외한 다 dev-syhy.tistory.com 지난 글에서는 prettier와 eslint에 대해 간단히 알아보았는데요. 설정파일을 통해 설정하는 방법을 알려드리겠습니다. npx create-react.. 2020. 12. 9.
리액트 프로젝트에서 ESLint로 문법 검사하기 2020/12/09 - [Programming/React] - 리액트 프로젝트에서 Prettier로 코드 스타일 통일하기 리액트 프로젝트에서 Prettier로 코드 스타일 통일하기 본인 혼자 개발할때는 크게 상관이 없지만, 나를 제외한 다른 개발자와 같이 협업을 하여 개발을 진행할때는 여러 규칙들을 정해서 그 규칙을 따라 코드를 작성하는 편이 좋다. 예를 들면 들여 dev-syhy.tistory.com 이전 글에서는 Prettier로 코드 스타일 맞추는 거에 대해 작성했었는데 이번에는 또 다른 좋은 확장 도구인 ESLint에 대해 소개하려고 합니다. ESLint는 자바스크립트 문법 검사를 해주는 확장도구입니다. 설치를 하고 나서 App.js에서 이어서 작성을 해보겠습니다. const로 변수를 선언했기 때.. 2020. 12. 9.
728x90