Getting Started
Start Building

Start Building

Follow these steps to quickly set up your development environment and start building your application.

If you're using the Next.js + Prisma + PostgreSQL Template

  1. Install PostgreSQL locally or use a hosted database like neon.tech (opens in a new tab) or ElephantSQL (opens in a new tab).

  2. Create a new database and copy the connection URL

  3. Open .env and set DATABASE_URL and DIRECT_URL

  4. Run the following commands to create the database schema and seed data:

npx prisma migrate dev
npx prisma db seed
  1. Start the development server:
npm run dev
 
# or if using yarn
yarn dev
  1. Open http://localhost:3000 (opens in a new tab) with your browser to see the result.

1. If you're using the MongoDB + Mongoose Template. Pick an Option to Set Up MongoDB

Option 1: Local MongoDB

  1. Install MongoDB locally.
  2. Create a local MongoDB database.
  3. Copy the connection URL.
  4. Open .env.local and set MONGODB_URI to your local MongoDB connection URL.

Option 2: MongoDB Atlas

  1. Create an account on MongoDB Atlas (opens in a new tab).
  2. Set up a new free tier cluster (opens in a new tab) using the Atlas UI.
  3. Create a new database and user with read and write access to the database.
  4. Allow access from anywhere (for development purpose) or add your IP address to the IP access list.
  5. Copy the connection string (opens in a new tab)
  6. Open .env.local and set MONGODB_URI to your MongoDB Atlas connection string.

2. Send email with Resend.com

  1. Create a FREE account on Resend.com (opens in a new tab).
  2. Obtain your API key from the Resend.com dashboard.
  3. Open .env.local and set RESEND_API_KEY to your Resend.com API key.
  4. Visit the Authentication documentation for detailed instructions on setting up email magic link authentication.

3. Become an Admin

  1. Access your MongoDB database using a MongoDB client such as MongoDB Compass (opens in a new tab) or Robo 3T (opens in a new tab).
  2. Navigate to the "users" collection.
  3. Add "admin" to the array of roles for your user. Now your user should have 2 roles (["user", "admin"]).
  4. Refresh the app, and the "Admin" option should now appear in the navbar.

4. Start Building

With your database and authentication set up, you're ready to start building your app. Focus on your application logic and features.

Additional Configurations (Optional)

  • Stripe: Add Stripe integration by following the documentation.
  • OAuth Support: Integrate OAuth for Google, Github, and Facebook as needed. Refer to the respective documentation pages for each service.

Congratulations! You've successfully set up your development environment. If you have any questions or need further assistance, refer to the documentation or our community support.

Happy Coding!

Full-Stack-Kit © 2024