Daycare App
A modern full-stack daycare management application built with Next.js, React, and Supabase. The application allows caregivers to create structured daily reports for children, while parents can securely access those reports through a role-based dashboard. This project focuses on production-oriented architecture, secure data access, and clean server-side patterns.
🚀 Tech Stack
- Next.js (App Router)
- React
- Supabase (Authentication, PostgreSQL, Storage)
- Tailwind CSS
🏗 Architecture Overview
Authentication & Authorization
- Authentication is handled via Supabase Auth.
- Role-based access control is implemented using JWT
app_metadataand enforced through PostgreSQL Row Level Security (RLS) policies.
Roles:
- Caregiver
- Parent
All database access is protected by RLS rules to ensure users can only access permitted data.
Data Model (Conceptual)
The application consists of three core entities:
- Users (by Supabase Auth)
- Children
- Reports
Each child is associated with a parent account (users). Each report belongs to a specific child.
The database design follows relational principles with enforced foreign key constraints and indexed relationships for performance.
🖥Application Structure
/ -> Login page:
- Users choose whether they log in as caregiver or parent.
/daycare/caregiver -> Caregiver dashboard:
- Create daily reports
- Upload images
- Add notes
- View submitted reports
- Create and delete child accounts
All mutations are handled via Next.js Server Actions.
/daycare/parent -> Parent dashboard:
- View reports for their child
- See summarized evaluation data
- Access controlled by RLS policies
Data fetching is handled server-side.
🧠 State & Data Handling
Form state within the caregiver reporting flow is managed using the React Context API.
All data fetching and mutations are handled via Next.js Server Actions. There is no client-side data fetching library involved.
This ensures:
- Reduced client-side complexity
- Secure server-controlled mutations
- Clear separation between UI and backend logic
🔐 Security Considerations
- Row Level Security enabled on all relevant tables
- Role-based access enforced at database level
- Optimized RLS policies for performance
- Secure authentication via Supabase
- No direct database access from the client
🎯 Design Decisions
Why no React Query / Client-side caching library?
This application relies entirely on Server Actions for data mutations and retrieval.
Since the system:
- Is not real-time
- Does not require aggressive client-side caching
- Uses server-driven rendering
A client-side data synchronization library would introduce unnecessary complexity.
The architecture prioritizes:
- Simplicity
- Security
- Maintainability
- Clear server/client boundaries
⚙️ Local Setup
git clone <repository>
cd daycare-app
npm install
npm run devEnvironment variables:
NEXT_PUBLIC_SUPABASE_URL=your_project_url
NEXT_PUBLIC_SUPABASE_PUBLISHABLE_KEY=your_public_anon_key
📄 Purpose This project was built as a portfolio application to demonstrate production-oriented full-stack architecture, secure data modeling, and modern Next.js patterns using Server Actions.
👤 Author: Liascope Fully conceived, designed, and developed independently. From initial product concept and feature definition to database architecture, authentication flow, role-based access control, backend logic, and UI implementation, every technical and design decision was made and implemented by me. Daycare-App reflects my approach to building secure, maintainable, and scalable full-stack systems with a clear separation between client and server responsibilities.