This is a simple project to learn and experiment some features of Next.js, NextAuth, Prisma, and Tailwind CSS.
- Next.js
- Server Actions
- Form Validation
- FormState and FormStatus
- Optimistic Updates
- NextAuth (Google)
- MongoDB
- Prisma
- Tailwind CSS
- Formik
- Yup
Make sure you have the following installed before running the project:
- Node.js and npm (Node Package Manager)
- MongoDb atlas database (or another supported database for Prisma)
-
Clone the repository:
git clone https://github.com/dead8309/AArenaTesting.git cd AArenaTesting
-
Install dependencies:
npm install
-
Set up your environment variables:
Create a
.env.local
file in the root directory and add the following:NEXTAUTH_SECRET=secret DATABASE_URL="db url" GOOGLE_CLIENT_ID="GOOGLE_CLIENT_ID" GOOGLE_CLIENT_SECRET="GOOGLE_CLIENT_SECRET" NEXTAUTH_URL=http://localhost:3000
-
Run database migrations:
npx prisma migrate dev
-
Start the development server:
npm run dev
The application will be available at
http://localhost:3000
.
app/
: Pages and API routespublic/
: Static assetscomponents/
: Reusable React componentsprisma/
: Prisma database schema and configurations
To learn more about Next.js, take a look at the following resources:
- Next.js Documentation - learn about Next.js features and API.
- Learn Next.js - an interactive Next.js tutorial.
You can check out the Next.js GitHub repository - your feedback and contributions are welcome!
The easiest way to deploy your Next.js app is to use the Vercel Platform from the creators of Next.js.
Check out our Next.js deployment documentation for more details.