리액트 빌드 글에 은근 수요가 있다. 내가 궁금했던 것 들을 다른 초보 개발자들도 궁금해하리라 믿고 내가 알고 있는 지식을 조금 더 풀어볼까 한다. 실제로 뭔가를 해보고 따라 해보는 글은 아니다. 이런 내용도 있구나 알면 검색할 때 도움이 될 테니 빌드해보라니까 해 본 사람들에게만 바친다.
빌드를 하면 뭐가 실행되는걸까?
이것도 모르고 난 그냥 빌드를 했다. 이건 빌드뿐 아니라 start, dev에도 적용할 수 있다. 우리는 패키지 매니저를 사용하는데 보통 npm, yarn을 사용한다. 그럼 npm run build만 하면 끝일까?
타입스크립트로 예시를 들어볼까 한다. 타입스크립트를 배워보면 tsc라는 커맨드를 사용해 보게 되는데 컴파일하는 과정을 입력한다 생각하면 된다. 이런 컴파일 과정에서 타입검사를 하기 때문에 사전에 타입에 의한 버그를 예방할 수 있게 된다. 실제로 로컬에서만 돌려볼 때는 문제가 없더니 빌드에서 문제가 생기기도 한다. 빌드 전에 컴파일도 해봐야 할 텐데 터미널에서 매번 입력을 해야 할까?
프로젝트폴더엔 package.json 파일이 있다. 여기엔 script 내용이 있을 텐데 이게 핵심이다. 타입스크립트를 사용한다면 지금의 스크립트 앞에 tsc를 넣어 tsc && {원래 있던 스크립트}로 만들 수 있다. vite로 했으면 tsc && vite build가 될 것이고 next 프로젝트면 tsc && next build가 되겠지.
결론은 지정한 쉘스크립트를 실행할 뿐이라는 것이다. echo 어쩌고 하는 그런 것들 말이다. 개발 환경에 따라 키값을 지정해 줘야 하거나 포트를 설정하거나 할 수 있다. 어떻게 사용을 하던 내가 필요한 건 검색해서 해야 한다.
무중단 배포가 뭐지?
말 그대로 중단 없이 서비스를 띄워 놓는다는 건데 개념보다 방법들이 많아 어렵다고 느껴진다. 끊기지 않으면 된다는 건 알겠는데 어떻게 해야 끊기지 않는 걸까? Nginx와 pm2에 대해 공부해 보면 좋다. 말은 쉽지만 nginx내용만 공부해도 엄청나다. 나도 초보로써 공부할 거 투성이고 경험할게 투성이라 검색할만한 키워드 알려주는 게 끝일 듯하다. 보고 있는 nginx 책을 다 떼고 내 페이지에 nginx 설정을 마음껏 다뤄보고 있을 때 이에 대한 글도 써보고 싶다.
나도 아직 노력이 많이 필요한 사람이다 보니 내용이 두서없고 간단명료하지 않다고 느껴진다. 고수가 본다면 조언을 해주면 좋겠다!
'FE > React' 카테고리의 다른 글
리액트 - Javascript에서 Switch Case 사용하기 (1) | 2023.07.12 |
---|---|
리액트 빌드하기 (0) | 2023.07.10 |