수동 설정
새로운 Saasfly 사이트를 만드는 가장 빠른 방법은 설치 가이드에 표시된 대로 create saasfly
를 사용하는 것입니다.
시스템 요구 사항
그런데, Node.js의 다양한 버전을 실행하려면 NVM(노드 버전 관리자)을 사용하는 것이 좋습니다.
1. 수동 설치
새로운 Saasfly 앱을 수동으로 생성하려면 몇 단계만 거치면 됩니다.
GitHub에서 Fork 및 Clone 저장소
https://github.com/saasfly/saasfly를 열고 이 저장소를 포크하세요.
포크는 저장소의 사본입니다. 저장소를 포킹하면 원래 프로젝트에 영향을 주지 않고도 변경 사항을 자유롭게 실험할 수 있습니다.
포크된 저장소를 복제합니다(<your_username>
을 GitHub 계정 이름으로 바꿔주세요):
git clone https://github.com/<your_username>/saasfly.git
복제 절차를 살펴보겠습니다.
remote: Enumerating objects: 402, done.remote: Counting objects: 100% (402/402), done.remote: Compressing objects: 100% (298/298), done.remote: Total 402 (delta 77), reused 386 (delta 65), pack-reused 0Receiving objects: 100% (402/402), 963.18 KiB | 130.00 KiB/s, done.Resolving deltas: 100% (77/77), done.
종속성 설치
더 나은 경험을 위해 npm이나 yarn 대신 Bun (Bun 설치 방법)을 사용하세요.
bun
을 사용하여 종속성을 설치합니다.
bun i
몇 분이 걸릴 수 있으며 그 후에 다음이 표시됩니다.
+ @saasfly/api@workspace:packages/api+ @saasfly/auth@workspace:packages/auth+ @saasfly/common@workspace:packages/common+ @saasfly/db@workspace:packages/db+ @saasfly/eslint-config@workspace:tooling/eslint-config+ @saasfly/nextjs@workspace:apps/nextjs+ @saasfly/prettier-config@workspace:tooling/prettier-config+ @saasfly/stripe@workspace:packages/stripe+ @saasfly/tailwind-config@workspace:tooling/tailwind-config+ @saasfly/typescript-config@workspace:tooling/typescript-config+ @saasfly/ui@workspace:packages/ui+ @turbo/[email protected] (v1.12.4 available)+ [email protected] (v1.12.4 available)
1296 packages installed [1133.89s]
Prisma 유형 생성
saasfly 폴더에 있는지 확인한 다음 bun을 사용하여 Prisma 유형을 생성하세요.
cd packages/db/bun db:generate
산출:
✔ Generated Kysely types(1.7.1) to./ prisma in 1.32s
2. Saasfly 시작하기
서버를 실행하려면 아래 목록을 따라야 합니다.
환경 변수 설정
saasfly 폴더로 들어가서 .env.example
파일을 복제하고 .env.local
로 이름을 바꾼 후 변수를 입력합니다.
cd saasflycp .env.example .env.local
Postgres DB가 있는지 확인하세요(Postgres가 없으면 여기를 클릭하세요) 그리고 새 데이터베이스를 생성하세요.
POSTGRES_URL
은 .env.local
파일에 있어야 합니다:
# 형식 예# POSTGRES_URL="postgres://{USER}:{PASSWORD}@{DB_HOST}:{DB_PORT}/{DATABASE}"
POSTGRES_URL="postgres://postgres:[email protected]:5432/saasfly"
그런 다음 bun
을 사용하여 데이터베이스 테이블을 만듭니다.
bun db:push
산출:
🚀 Your database is now in sync with your Prisma schema. Done in 151ms
┌─────────────────────────────────────────────────────────┐│ Update available 5.9.1 -> 5.10.2 ││ Run the following to update ││ npm i --save-dev prisma@latest ││ npm i @prisma/client@latest │└─────────────────────────────────────────────────────────┘
문제가 발생하면 Discord에서 저희에게 이야기하세요. Saasfly에 관한 모든 것에 기꺼이 답변해 드리겠습니다.
먼저 빌드를 실행하세요
일부 기본 구성 요소는 컴파일 시점에 필요하므로 먼저 run build
를 실행해야 합니다.
bun run build
개발 서버 실행
bun run
을 사용하여 웹 서버를 시작하세요.
bun run dev:web
@saasfly/nextjs:dev: cache bypass, force executing ad8bea47f156e113@saasfly/nextjs:dev: $ bun with-env next dev@saasfly/nextjs:dev: $ dotenv -e ../../.env.local -- next dev@saasfly/nextjs:dev: ▲ Next.js 14.1.0@saasfly/nextjs:dev: - Local: http://localhost:3000@saasfly/nextjs:dev:@saasfly/nextjs:dev: automatically enabled Fast Refresh for 1 custom loader@saasfly/nextjs:dev: ✓ Ready in 12.1s
모든 것이 잘 진행된다면, Saasfly는 이제 http://localhost:3000에서 귀하의 프로젝트를 제공할 것이고, 결과를 볼 수 있을 것입니다:
![Installation](/images/WechatIMG18.jpg)
축하합니다! 이제 SaaS를 빌드하기 위한 코딩을 시작할 수 있습니다.
Saasfly를 처음 사용하는 경우 애플리케이션에서 사용할 수 있는 모든 파일과 폴더의 개요를 보려면 프로젝트 구조 문서를 참조하세요.
Stripe와 함께 달리세요
Stripe 기사를 읽어보세요. 그리고 bun dev
를 사용하여 Stripe로 실행하세요:
bun dev