Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Sign up
Appearance settings

tuffstuff9/nextjs-serveraction-drizzle-starter

Repository files navigation

Next.js 13 with Drizzle ORM & PlanetScale Starter Template

A robust starter template for Next.js 13, integrated with Drizzle ORM and PlanetScale. This template provides a quick and seamless option to get up and running quickly.

nextjsserveractionshq.mp4

🌟 Features

  • Next.js App Router : The latest version of the popular React framework for server-rendered applications.
  • Drizzle ORM : A modern and efficient ORM to manage database operations.
  • PlanetScale : A scalable and serverless relational database.
  • TailwindCSS : A utility-first CSS framework for rapid UI development.
  • Server Actions : Utilize the experimental features of Next.js for better server-side operations.
  • UseFormStatus : An experimental hook to manage form states.

πŸš€ Getting Started

Prerequisites

  • Node.js (v14 or newer)
  • npm or Yarn

Setup

See the accompanying blog post for a more detail overview.

  1. Clone the Repository

    git clone https://github.com/tuffstuff9/nextjs-serveraction-drizzle-starter.git
    cd nextjs-serveraction-drizzle-starter
  2. Install Dependencies

    yarn install
    # or
    npm install
  3. Setup Environment Variables

    • Create a .env file
    • Set up your PlanetScale database and add the DATABASE_URL to the .env file. See here for further details on how to setup PlanetScale integration.
    • Modify the copied connection string by replacing ?sslaccept=strict with ?ssl={"rejectUnauthorized":true}
  4. Run Migrations

    yarn drizzle-kit push:mysql
    # or
    npm run drizzle-kit push:mysql
  5. Start Development Server

    yarn dev
    # or
    npm run dev

Now, you can open http://localhost:3000 in your browser to see your app in action!

πŸ“ƒ License

This project is MIT licensed.

AltStyle γ«γ‚ˆγ£γ¦ε€‰ζ›γ•γ‚ŒγŸγƒšγƒΌγ‚Έ (->γ‚ͺγƒͺγ‚ΈγƒŠγƒ«) /