A social platform for the Democratic Youth (D-Youth) community in Thailand.
Post anonymous or named messages to a shared wall, browse member profiles, and exchange direct notes.
- Public Wall — Post coloured sticky-note messages visible to everyone; supports anonymous mode.
- Direct Messages — Send private notes to any member; colour-coded paper style.
- Family Directory — Browse all D-Youth members grouped by cohort year, with instant search.
- Profile Management — Upload an avatar, set your nickname, province, cohort year, and Instagram handle.
- Google OAuth — One-click sign-in via Supabase Auth.
- Responsive UI — Mobile-first design with a fixed bottom navigation bar.
- Performance — Vercel Analytics + Speed Insights built-in.
| Category | Technology |
|---|---|
| Framework | Next.js 15 (App Router) |
| Language | TypeScript 5 |
| Styling | Tailwind CSS 4 |
| Backend / DB | Supabase (PostgreSQL, Auth, Storage) |
| Animations | Framer Motion |
| Icons | React Icons |
| Hosting | Vercel |
- Node.js ≥ 18
- A Supabase project with the schema described in
docs/database-schema.md
# 1. Clone the repository
git clone https://github.com/Jesselpetry/D-Youth-Dropbox.git
cd D-Youth-Dropbox
# 2. Install dependencies
npm install
# 3. Configure environment variables
cp .env.example .env.local
# Edit .env.local and fill in your Supabase credentials (see below)
# 4. Start the development server
npm run devOpen http://localhost:3000 in your browser.
Create a .env.local file in the project root:
NEXT_PUBLIC_SUPABASE_URL=https://<your-project>.supabase.co
NEXT_PUBLIC_SUPABASE_ANON_KEY=<your-anon-key>
NEXT_PUBLIC_SITE_URL=http://localhost:3000 # change to your production URL for deploymentsNever commit
.env.localto version control. It is already excluded by.gitignore.
| Command | Description |
|---|---|
npm run dev |
Start the development server (Turbopack) |
npm run build |
Create a production build |
npm run start |
Start the production server |
npm run lint |
Run ESLint |
The project is designed to be deployed on Vercel.
- Push your code to GitHub.
- Import the repository in the Vercel dashboard.
- Add the three environment variables listed above under Settings → Environment Variables.
- Click Deploy.
For detailed setup instructions see SETUP.md.
| Document | Description |
|---|---|
docs/architecture.md |
Project structure, rendering strategy, auth flow |
docs/database-schema.md |
Table definitions and relationships |
docs/api-endpoints.md |
Supabase query patterns used in the app |
Contributions, issues, and feature requests are welcome!
Please read CONTRIBUTING.md before submitting a pull request.
- Fork the project.
- Create your feature branch:
git checkout -b feature/amazing-feature - Commit your changes:
git commit -m 'feat: add amazing feature' - Push to the branch:
git push origin feature/amazing-feature - Open a Pull Request.
This project is licensed under the MIT License — see the LICENSE file for details.
Made with ❤️ by the D-Youth community