Skip to content
Saasfly Docs

Manu-manong Setup

Ang pinakamabilis na paraan upang lumikha ng bagong site ng Saasfly ay ang paggamit ng create saasfly tulad ng ipinapakita sa gabay sa Pag-install.

Pangangailangan sa System

  • Node.js - 18.17 o mas bago.
  • Bun - 1.0 o mas bago.
  • OS - macOS, Windows (kabilang ang WSL), at Linux ay suportado.

Siyanga pala, inirerekomenda namin ang paggamit ng NVM (Node Version Manager) para magpatakbo ng iba’t ibang bersyon ng Node.js.

1. Manu-manong Pag-install

Para manual na gumawa ng bagong Saasfly app, kailangan lang ng ilang hakbang:

Fork at Clone Repository Mula sa GitHub

Mangyaring buksan ang https://github.com/saasfly/saasfly , at i-fork ang repositoryong ito.

Ang tinidor ay isang kopya ng isang repositoryo. Ang pag-forking ng repositoryo ay nagbibigay-daan sa iyong malayang mag-eksperimento sa mga pagbabago nang hindi naaapektuhan ang orihinal na proyekto.

I-clone ang forked repository (mangyaring palitan ang <your_username> sa iyong account name ng GitHub):

Terminal window
git clone https://github.com/<your_username>/saasfly.git

Makikita mo ang pamamaraan ng pag-clone:

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 0
Receiving objects: 100% (402/402), 963.18 KiB | 130.00 KiB/s, done.
Resolving deltas: 100% (77/77), done.

I-install ang Dependencies

Para sa mas magandang karanasan, mangyaring gamitin ang Bun (How ​​to install Bun) , sa halip na npm o yarn.

Paggamit ng bun upang i-install ang mga dependencies:

Terminal window
bun i

Maaaring tumagal ito ng ilang minuto, at pagkatapos ay makikita mo ang:

+ @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]
+ [email protected]
+ [email protected] (v1.12.4 available)
+ [email protected]


1296 packages installed [1133.89s]

Bumuo ng Mga Uri ng Prisma

Pakitiyak na nasa saasfly folder ang iyong, pagkatapos ay gumamit ng bun upang bumuo ng mga uri ng Prisma:

Terminal window
cd packages/db/
bun db:generate

Output:

✔ Generated Kysely types(1.7.1) to./ prisma in 1.32s

2. Simulan ang Saasfly

Dapat mong gawin ang mga listahan sa ibaba upang patakbuhin ang server.

I-set Up Ang Mga Variable ng Environment

Ilagay ang saasfly folder, i-duplicate ang .env.example file, palitan ang pangalan nito sa .env.local , at ilagay ang iyong mga variable.

Terminal window
cd saasfly
cp .env.example .env.local

Tiyaking mayroon kang Postgres DB (Kung wala kang Postgres, mag-click dito ) at nakagawa ng bagong database.

Ang POSTGRES_URL ay dapat nasa iyong .env.local na file:

# Halimbawa ng Format
# POSTGRES_URL="postgres://{USER}:{PASSWORD}@{DB_HOST}:{DB_PORT}/{DATABASE}"


POSTGRES_URL="postgres://postgres:[email protected]:5432/saasfly"

Pagkatapos, gamitin ang bun upang lumikha ng mga talahanayan ng database:

Terminal window
bun db:push

Output:

🚀  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                          │
└─────────────────────────────────────────────────────────┘

Kung may nangyaring mali, maaari mo kaming kausapin sa Discord , natutuwa kaming sumagot ng anuman tungkol sa Saasfly.

Patakbuhin muna ang build

Dahil ang ilang pangunahing bahagi ay kailangan ng oras ng pag-compile, dapat mong run build muna.

Terminal window
bun run build

Patakbuhin ang Development Server

Gamitin ang bun run upang simulan ang iyong web server:

Terminal window
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

Kung magiging maayos ang lahat, dapat na ngayong ihatid ng Saasfly ang iyong proyekto sa http://localhost:3000, at makikita mo ang resulta:

Installation

Binabati kita! Ngayon ay maaari ka nang magsimulang mag-coding para buuin ang iyong SaaS.

Kung bago ka sa Saasfly, tingnan ang project structure docs para sa pangkalahatang-ideya ng lahat ng posibleng file at folder sa iyong application.

Run With Stripe

Pakibasa ang artikulong Stripe. At pagkatapos ay gamitin ang bun dev upang tumakbo kasama si Stripe:

Terminal window
bun dev