- Next.js with TypeScript - The React Framework for Production.
- Next-Auth - Authentication for Next.js.
- Prisma with CockroachDB - Next-generation Node.js and TypeScript ORM.
- tRPC 10 - End-to-end typesafe API.
- Tailwind CSS with clsx - A utility-first CSS framework for rapidly building custom designs.
- Radix UI Primitives - Unstyled, accessible components for building highβquality design systems.
- Framer Motion - A production-ready motion library for React.
- Iconoir icons - A set of 1000+ free MIT-licensed high-quality SVG icons.
- Prettier with prettier-plugin-tailwindcss - An opinionated code formatter + sort tailwindcss classes.
- React-Hook-Forms - Performant, flexible and extensible forms with easy-to-use validation.
- Zod - TypeScript-first schema validation.
General:
- Authentication with Github.
For the participant:
- The user can add his project.
- The user can edit his project before a deadline (soon).
- When the deadline is reached, the user can only see the project (soon).
For the admin:
- The admin can add a new hackathon.
- The admin can edit a hackathon.
- The admin can delete a hackathon.
- The admin can share the link to the hackathon.
- The admin can see the list of projects.
- The user can set a winner (mark a user as a winner).
- The user can set a project as 'reviewed'.
- /prisma - Database schema.
- /src/animations - Framer motion animations.
- /src/components - All app components, built with Tailwind CSS.
- /src/env - Validate all environment variables with Zod.
- /src/layout - App header & footer.
- /src/lib - getServerAuthSession (next-auth) & Prisma library.
- /src/pages/api - Next-Auth config & tRPC api route.
- /src/schema - Hackathon & Participation Zod schemas.
- /src/styles - Tailwind CSS global styles + add custom font.
- /src/trpc - tRPC routers, initialization & global appRouter.
- /src/types - Hackathon, participation & next-auth types.
- /src/ui - All UI components built with Radix + Tailwind (clsx).
- /src/ui/icons - Iconoir icons *.
- We have extracted the icons used in the app due to a bug in the React library - issue.
- Clone or fork the repository:
[email protected]:pheralb/project-hackathon.git
- Install dependencies with your favorite package manager:
# with npm:
npm install
# with pnpm:
pnpm install
# with yarn:
yarn install
# with ultra:
ultra install
- Create a
.env
file in the root of the project with the following variables:
# CockroachDB connection string:
DATABASE_URL = ""
# Next-Auth config:
NEXTAUTH_SECRET="" # Generate a random string.
NEXTAUTH_URL="" # Your project url, e.g. http://localhost:3000.
# Github OAuth Provider:
GITHUB_CLIENT_ID=""
GITHUB_CLIENT_SECRET=""
- Create a free cluster.
- Create a SQL user.
- To connect to the user, copy the connection string and paste it in the
.env
file, replacing theDATABASE_URL
variable.
- Click here to create new Github OAuth app.
- Go to "Client secrets" and generate new client secret and and paste it into GITHUB_CLIENT_SECRET env.
- Copy the Client ID and paste it into GITHUB_ID env.
- Run in your terminal:
# with npm:
npm run dev
# with pnpm:
pnpm run dev
# with yarn:
yarn dev
# with ultra:
ultra dev
and open http://localhost:3000 π.
- Vercel: https://phck.vercel.app