uixmat / event-app

An open source events app for casual football teams built with NextJs 13, Prisma and MongoDB. Design system built with Tailwind and Storybook.

uixmat.dev 〰️ Portfolio

This is my personal website that I have open-sourced to the community to use, learn from and enjoy. If you like this project please give it a ⭐ Star!

Live Demo

Key Features

• Deployed on Vercel
• Built with Next.js Typescript
• Three.js built with Spline
• Parallax using Locomotive Scroll
• Animations using Framer Motion

Installation

• Clone the project
• Run yarn install to install dependencies
• Run yarn dev to fire up localhost

Preview

event-app's Issues

Next.js | use new App dir

Basic restructuring

Some basic restructuring within the project such as defunct pages, shared global styles.

Something like

.next/
.storybook/
.vscode/
app/
├── (auth)
├── (site)
├── components // Move all components to Storybook
lib/
pages/
├── profile.tsx // Remove
public/ // Remove Vercel assets

Setup Prisma

Tailwind CSS

Fully integrate Tailwind CSS.

Setup Next.js 13

Setup MongoDB

Storybook with NextAuth

Fully integrate Storybook within the Next app.

• Setup Storybook.
• Build first components and stories.
• Integrate a mock data / NextAuth solution.

next-auth useSession hook breaks Header.stories.ts

Possible fix here

Refactoring

Some of the code was written quick and dirty. Take the time to go over existing code to make improvements and follow best practices.