Git 없이 배포하는 최고의 방법 (surge.sh)

Sun, 21 Jan 2024 09:18:33 GMT

프론트 작업하다 보면 배포가 필요할 때가 있음

요즘은 github page, netlify 등 다양한 배포 서비스가 존재하지만 대체로 git을 사용한 배포 방법을 가지고 있음

이번에 소개하는 배포 방식은 커맨드라인(CMD) 내에서 명령어 한번으로 배포할 수 있음

바로 surge.sh를 사용한 방식임

공식 사이트

[surge.sh](https://surge.sh)

공식 사이트를 보면 간단한 퍼블리싱 방식을 지향함을 알 수 있음

> Static web publishing for Front-End Developers
> Simple, single-command web publishing. Publish HTML, CSS, and JS for free, without leaving the command line.

실제로 지금 글을 작성하고 있는 날짜 기준으로 천만 건이 넘는 배포 수를 확인할 수 있음

![Image](https://upload.cafenono.com/image/slashpagePost/20240121/180031_k2Bfqz2DHmEFPkE1hF?q=75&s=1280x180&t=outside&f=webp)

이 글에서 설명한 부분 외에도 필요한 부분이 있다면 아래 링크를 통해 공식 문서를 읽어보길 바람

[Surge Documets](https://surge.sh/help/getting-started-with-surge)

surge의 문서는 굉장히 잘 적혀있으니 원하는 정보를 금방 찾을 수 있을거라 생각함

---

### Install

우선 최신 버전(LTS)의 node.js가 설치되어 있어야 함

구 버전의 node.js가 설치되어 있다면 n이나 nvm과 같은 버전 관리 툴을 통해 버전을 변경하길 바람

준비되었다면 cmd에서 설치 명령어를 입력함

```
npm install --global surge
```

이러면 설치가 완료된거임

이제 디렉토리 내에서 명령어를 실행하여 해당 디렉토리를 웹에 게시할 수 있게 됨

아래는 공식 문서에서 가져온 예시

![Image](https://upload.cafenono.com/image/slashpagePost/20240121/181020_Z77z4NI3jS1zKtwr2v)

방법을 간단히 설명하자면 다음과 같음

1. 배포를 원하는 디렉토리에서 cmd 실행

2. surge 입력

3. 최초 실행 시 email, password 입력(이후 입력X)

4. 배포 원하는 디렉토리 경로 입력(build 파일이 위치한 경로)

1. 내가 사용하는 nuxt를 예시로 들면 .output/public 경로임

2. 대체로 dist, public과 같은 경로일듯

5. 배포 원하는 도메인 입력(기본값으로 랜덤 도메인이 입력되지만 이미 사용 중일 수 있음)

6. 배포 완료

git 저장소를 통한 방식과 다르게 커맨드라인 내에서 모든 걸 해결할 수 있어서 굉장히 편리하고 빠르게 배포를 할 수 있는 장점이 있음

실제로 나도 배포 테스트가 필요할 때 IDE 내에서 금방 테스트 해볼 수 있어서 애용중임

client-side routing 방식으로 사이트를 이동하는 경우에는 에러가 발생할 수 있는데, 이때는 200 page를 추가해줌으로 해결할 수 있음

아래는 공식문서에서 설명하는 방법임

[adding-a-200-page-for-client-side-routing](https://surge.sh/help/adding-a-200-page-for-client-side-routing)

이외에도 많은 정보를 문서를 통해 얻을 수 있으니 관심있으면 정독해보는걸 추천함(난 안읽음)

도움이 되었다면 댓글이나 좋아요 부탁함