Micro Saas - Sou Eu Dev "Project in Bio"

Description

This is a Micro Saas project developed during the Micro Saas course by Rocketseat. The objective of this project is to provide an page for developers to showcase their projects.

Built With

• Next.js v15 and ReactJS v19
• Tailwind CSS (UI)
• Firebase (Database and storage)
• Auth.js (Authentication with Google)
• Stripe (Payment gateway)
• Lucide (Icons)
• Resend (Email)

Requirements

Firebase database and storage

• Setup Firebase Cloud Firestore
  • Export Firebase Credentials
• Setup Firebase Cloud Storage
  • Get Firebase bucket name

Add them to your .env file:

FIREBASE_PROJECT_ID=
FIREBASE_CLIENT_EMAIL=
FIREBASE_PRIVATE_KEY=
FIREBASE_STORAGE_BUCKET=

Auth.js

To use Google authentication in Auth.js, you need to obtain your credentials:

1. Go to the Google Cloud Console.
2. Create a new project or select an existing one.
3. Navigate to APIs & Services > Credentials.
4. Click Create Credentials > OAuth 2.0 Client ID.
5. Set up the consent screen and configure the redirect URIs.
   - Authorized JavaScript Sources: http://localhost:3000
   - Authorized redirect URIs: http://localhost:3000/api/auth/callback/google
6. Copy your Client ID and Client Secret.

Add them to your .env file:

AUTH_GOOGLE_ID=
AUTH_GOOGLE_SECRET=
AUTH_SECRET=

Stripe

1. Create a Stripe account
2. Register products and get their Product IDs
3. Set up a local webhook with stripe cli - Run pnpm webhook:run to retrieve the webhook secret
4. Get API keys (Public Key, Secret Key)

Add them to your .env file:

STRIPE_LIFETIME_PRICE_ID=
STRIPE_MONTHLY_PRICE_ID=
STRIPE_PUBLIC_KEY=
STRIPE_SECRET_KEY=
STRIPE_WEBHOOK_SECRET=

Resend

To use Resend for sending emails, you need to obtain your API key:

1. Go to the Resend website and create account
2. Navigate to the API section to generate a new API key

Add it to your .env file:

RESEND_API_KEY=

Getting Started

Follow the steps below to set up the project locally:

1. Clone the repository:

git clone https://github.com/victordev13/curso-microsaas.git

2. Navigate to the project directory:

cd curso-microsaas

3. Install the dependencies:

pnpm install

4. Create and configure the .env file:

cp .env.dist .env
# Edit the .env file with your Firebase credentials

5. Start the development server:

pnpm dev

6. Start the local stripe webhook:

pnpm webhook:run

7. Open http://localhost:3000 in your browser.

Screenshots

TODO

• Allow to edit or remove user card custom links
• Allow to edit or remove projects