tambahannya

public/READS.md

@@ -0,0 +1,138 @@
+# Bun React Template Starter
+
+This template is a starting point for building modern full-stack web applications using Bun, React, ElysiaJS, and Prisma. This project is designed to provide a fast, efficient, and structured development experience with a cutting-edge technology stack.
+
+## Key Features
+
+- **Super-Fast Runtime**: Built on top of [Bun](https://bun.sh/), a high-performance JavaScript runtime.
+- **End-to-End Typesafe Backend**: Utilizes [ElysiaJS](https://elysiajs.com/) for a type-safe API from the backend to the frontend.
+- **Automatic API Documentation**: Comes with [Elysia Swagger](https://elysiajs.com/plugins/swagger) to automatically generate interactive API documentation.
+- **Modern Frontend**: A feature-rich and customizable user interface using [React](https://react.dev/) and [Mantine UI](https://mantine.dev/).
+- **Easy Database Access**: Integrated with [Prisma](https://www.prisma.io/) as an ORM for intuitive and secure database interactions.
+- **Clear Project Structure**: Logical file and folder organization to facilitate easy navigation and development.
+
+## Tech Stack
+
+- **Runtime**: Bun
+- **Backend**:
+  - **Framework**: ElysiaJS
+  - **ElysiaJS Modules**:
+    - `@elysiajs/cors`: Manages Cross-Origin Resource Sharing policies.
+    - `@elysiajs/jwt`: JSON Web Token-based authentication.
+    - `@elysiajs/swagger`: Creates API documentation (Swagger/OpenAPI).
+    - `@elysiajs/eden`: A typesafe RPC-like client to connect the frontend with the Elysia API.
+- **Frontend**:
+  - **Library**: React
+  - **UI Framework**: Mantine
+  - **Routing**: React Router
+  - **Data Fetching**: SWR
+- **Database**:
+  - **ORM**: Prisma
+  - **Supported Databases**: PostgreSQL (default), MySQL, SQLite, etc.
+- **Language**: TypeScript
+
+## Getting Started
+
+### 1. Clone the Repository
+
+```bash
+git clone https://github.com/your-username/bun-react-template-starter.git
+cd bun-react-template-starter
+```
+
+### 2. Install Dependencies
+
+Ensure you have [Bun](https://bun.sh/docs/installation) installed. Then, run the following command:
+
+```bash
+bun install
+```
+
+### 3. Configure Environment Variables
+
+Copy the `.env.example` file to `.env` and customize the values.
+
+```bash
+cp .env.example .env
+```
+
+Fill in your `.env` file similar to the example below:
+
+```
+DATABASE_URL="postgresql://user:password@host:port/database?schema=public"
+JWT_SECRET=a_super_long_and_secure_secret
+BUN_PUBLIC_BASE_URL=http://localhost:3000
+PORT=3000
+```
+
+After that, create TypeScript type declarations for your environment variables with the provided script:
+
+```bash
+bun run generate:env
+```
+
+This command will generate a `types/env.d.ts` file based on your `.env`.
+
+### 4. Database Preparation
+
+Make sure your PostgreSQL database server is running. Then, apply the Prisma schema to your database:
+
+```bash
+bunx prisma db push
+```
+
+You can also seed the database with initial data using the following script:
+
+```bash
+bun run seed
+```
+
+### 5. Running the Development Server
+
+```bash
+bun run dev
+```
+
+The application will be running at `http://localhost:3000`. The server supports hot-reloading, so changes in the code will be reflected instantly without needing a manual restart.
+
+### 6. Accessing API Documentation (Swagger)
+
+Once the server is running, you can access the automatically generated API documentation at:
+
+`http://localhost:3000/swagger`
+
+## Available Scripts
+
+- `bun run dev`: Runs the development server with hot-reloading.
+- `bun run build`: Builds the frontend application for production into the `dist` directory.
+- `bun run start`: Runs the application in production mode.
+- `bun run seed`: Executes the database seeding script located in `prisma/seed.ts`.
+- `bun run generate:route`: A utility to create new route files in the backend.
+- `bun run generate:env`: Generates a type definition file (`.d.ts`) from the variables in `.env`.
+
+## Project Structure
+
+```
+/
+├── bin/              # Utility scripts (generators)
+├── prisma/           # Database schema, migrations, and seed
+├── src/              # Main source code
+│   ├── App.tsx       # Root application component
+│   ├── clientRoutes.ts # Route definitions for the frontend
+│   ├── frontend.tsx  # Entry point for client-side rendering (React)
+│   ├── index.css     # Global CSS file
+│   ├── index.html    # Main HTML template
+│   ├── index.tsx     # Main entry point for the app (server and client)
+│   ├── components/   # Reusable React components
+│   ├── lib/          # Shared libraries/helpers (e.g., apiFetch)
+│   ├── pages/        # React page components
+│   └── server/       # Backend code (ElysiaJS)
+│       ├── lib/      # Server-specific libraries (e.g., prisma client)
+│       ├── middlewares/ # Middleware for the API
+│       └── routes/   # API route files
+└── types/            # TypeScript type definitions
+```
+
+## Contributing
+
+Contributions are highly welcome! Please feel free to create a pull request to add features, fix bugs, or improve the documentation.

public/apa.html

@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>APA Page</title>
+</head>
+<body>
+    <h1>APA Page</h1>
+    <p>This is a test page to verify static file serving.</p>
+    <img src="/public/kelinci.png" />
+</body>
+</html>