본문 바로가기

FE/배포3

[배포] TypeScript + Express 배포하기 TypeScript + Express 배포하기 웹 페이지는 html, css, js 이외의 파일은 읽지 못한다. 그러니 내가 짠 코드를 웹 페이지가 읽을 수 있는 파일로 변환한 build용 파일이 따로 있어야 한다. 배포를 하기 위해서는 build 파일들이 있어야 하는 것이다. TypeScript로 작성된 프로젝트를 배포하기 위한 과정을 알아보자. 배포는 클라우드타입에서 진행하였다. (클라우드타입으로 배포하는 법: https://inthedev.tistory.com/57) 사이트에 배포하고 싶은 파일, build 폴더 생성을 위한 명령어, 실행 명령어를 입력해주면 배포가 완료된다. 그 과정은 1. npm ci 2. tsc : ts 파일을 js 파일로 변환 3. node app.js : 실행 이 과정을 컴.. 2023. 3. 3.
[배포] 클라우드타입으로 Express 배포하기 클라우드타입으로 Express 배포하기 Express로 작은 프로젝트를 만들고 나서 배포를 하기 위해 클라우드타입 이라는 서비스를 이용하였다. 유튜브 조코딩님의 영상을 참고하여(https://youtu.be/SGGebq48h3Y) Express를 배포하는 방법을 소개하려 한다. 1. 클라우드타입 홈페이지 회원가입 https://cloudtype.io/ 모두의 플랫폼팀, 클라우드타입 클라우드타입은 클라우드 기반 애플리케이션을 빠르게 개발하고 배포할 수 있는 클라우드 애플리케이션 플랫폼입니다. cloudtype.io 깃허브로 가입하면 깃허브에 올린 Repositories와 연동이 편하다. (다른 방식으로는 가입 안 해봐서 모르겠음...) 2. + 버튼 눌러서 프로젝트 형식 선택하기 상단의 +를 누르면 아래에.. 2023. 3. 2.
[배포] GitHub로 React 배포하기 Github로 React 배포하기 1. gh-pages 패키지 설치하기 npm install --save gh-pages // or yarn add gh-pages 2. package.json에 homepage 추가하기 "homepage" : "http://(본인username).github.io/(Repository이름)", 3. package.json의 scripts에 predeploy와 deploy 항목 추가 "scripts": { "predeploy" : "npm run build", "deploy" : "gh-pages -d build" } * 배포하기 전 주의할 점 React 프로젝트에서 BrowserRouter를 사용했다면 페이지 배포 후 에러가 생길 수 있음. 로컬 환경에서는 기본 주소가 .. 2023. 2. 8.