74 lines
2.2 KiB
Markdown
74 lines
2.2 KiB
Markdown
# SIGAP Website
|
|
|
|
This is the website for SIGAP Jember, built with Next.js.
|
|
|
|
## Features
|
|
|
|
* User Authentication
|
|
* Data management with Prisma and Supabase
|
|
* Interactive maps with Mapbox GL JS
|
|
* UI components with Radix UI and Tailwind CSS
|
|
* Form handling with React Hook Form and Zod
|
|
* State management with Zustand
|
|
* Email handling with React Email and Resend
|
|
|
|
## Technologies Used
|
|
|
|
* **Next.js**: React framework for building full-stack web applications.
|
|
* **Prisma**: Next-generation ORM for Node.js and TypeScript.
|
|
* **Supabase**: Open Source Firebase Alternative (Backend as a Service).
|
|
* **Tailwind CSS**: A utility-first CSS framework for rapidly building custom designs.
|
|
* **Radix UI**: A collection of unstyled, accessible UI components.
|
|
* **Mapbox GL JS**: For interactive, customizable vector maps on the web.
|
|
|
|
## Getting Started
|
|
|
|
### Prerequisites
|
|
|
|
* [Node.js](https://nodejs.org/)
|
|
* [npm](https://www.npmjs.com/) or [Yarn](https://yarnpkg.com/)
|
|
* A Supabase project configured with your environment variables.
|
|
* A PostgreSQL database (for Prisma).
|
|
|
|
### Installation
|
|
|
|
1. Clone the repository:
|
|
```bash
|
|
git clone https://github.com/your-username/sigap-v.git
|
|
cd sigap-v/sigap-website
|
|
```
|
|
2. Install dependencies:
|
|
```bash
|
|
npm install
|
|
# or yarn install
|
|
```
|
|
3. Create a `.env` file in the `sigap-website` directory and add your environment variables (e.g., Supabase credentials, database URL):
|
|
```
|
|
DATABASE_URL="postgresql://user:password@host:port/database?schema=public"
|
|
NEXT_PUBLIC_SUPABASE_URL=YOUR_SUPABASE_URL
|
|
NEXT_PUBLIC_SUPABASE_ANON_KEY=YOUR_SUPABASE_ANON_KEY
|
|
```
|
|
4. Run Prisma migrations:
|
|
```bash
|
|
npx prisma migrate dev
|
|
```
|
|
|
|
### Running the App
|
|
|
|
```bash
|
|
npm run dev
|
|
# or yarn dev
|
|
```
|
|
|
|
## Project Structure
|
|
|
|
```
|
|
src/
|
|
├── app/ # Next.js App Router pages
|
|
├── components/ # Reusable React components
|
|
├── lib/ # Utility functions and configurations
|
|
├── styles/ # Tailwind CSS styles
|
|
└── types/ # TypeScript type definitions
|
|
prisma/ # Prisma schema and migrations
|
|
public/ # Static assets
|
|
``` |