https://github.com/ddochea0314/template-axum-svelte
axum + svelte 를 통한 풀스택 웹 사이트 개발 템플릿
https://github.com/ddochea0314/template-axum-svelte
axum rust svelte
Last synced: 3 months ago
JSON representation
axum + svelte 를 통한 풀스택 웹 사이트 개발 템플릿
- Host: GitHub
- URL: https://github.com/ddochea0314/template-axum-svelte
- Owner: ddochea0314
- Created: 2025-01-19T13:12:31.000Z (5 months ago)
- Default Branch: master
- Last Pushed: 2025-01-19T14:25:16.000Z (5 months ago)
- Last Synced: 2025-01-19T15:27:37.969Z (5 months ago)
- Topics: axum, rust, svelte
- Language: Rust
- Homepage:
- Size: 37.1 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# template-axum-svelte
이 Repository는 Axum과 Svelte를 사용하여 중소형 웹 풀스택 환경을 구축하는 템플릿입니다.
## 설치 및 사용법
### VSCode의 `Run and Debug`를 이용한 방법
VSCode를 이용할 경우, Repository에 포함된 `Compound` launch.json을 통해 즉시 디버깅 및 실행할 수 있습니다.
> Repository를 받은 후 즉시 실행할 경우 `backend` 및 `frontend`에 필요한 종속성 항목들을 install 하는 작업이 있으므로 실행까지 속도가 다소 느릴 수 있습니다.
이미지를 참고하여 `Compound`를 실행시키면 아래와 같은 웹 서비스 환경이 실행됩니다.
- [http://localhost:3000](http://localhost:3000) (Axum 웹 서비스)
- [http://localhost:5173](http://localhost:5173) (Vite 웹 서비스)
> `localhost:3000`과 `localhost:5173` 모두 웹 페이지를 볼 수 있지만, `localhost:3000`의 웹 페이지는 `frontend`에서 작업한 웹 프레임워크의 빌드된 결과를 표기하므로 브라우저를 통한 디버깅이 어려울 수 있습니다. `frontend` 영역에 대한 디버깅이 필요하다면 `localhost:5173`으로 접근하시기 바랍니다.
### 명령어를 통한 방법
CLI 환경에서 직접 처리하고 싶을 경우 아래 순서로 실행하세요.
1. `frontend` 에서 npm i 실행
```sh
npm i
```
2. `frontend`에서 `npm run build` 실행 (선택)
Axum 서버 환경을 통해 웹페이지를 보고 싶을 경우, `frontend` 디렉토리에서 아래 명령어를 실행하세요. Repository를 처음 clone 한 후 1번 단계 없이 바로 다음 단계 실행 뒤, `localhost:3000` 서비스에 접근하면 웹페이지가 표기되지 않습니다.
```sh
npm run build
```
3. 프로젝트 폴더에서 `cargo run` 실행
```sh
cargo run
```
4. `frontend`에서 `npm run dev` 실행
```sh
npm run dev
```