Zoodle - Food & Meal Planning Application

Zoodle is a cross-platform food application designed to provide a seamless experience for recipe management and meal planning across mobile (Android) and web platforms.

Overview

Zoodle helps users:

• Store and organize recipes with detailed instructions and images
• Search and filter recipes by name, ingredients, categories, and tags
• Plan weekly meals with lunch and dinner slots
• Access their data from both mobile and web platforms
• Work offline on mobile devices with automatic synchronization

Technology Stack

Backend

• Java 17 with Spring Boot 3.2
• PostgreSQL database
• JWT authentication
• Flyway database migrations
• Maven build tool

Web Frontend

• React 18 with TypeScript
• Vite build tool
• React Router for navigation
• TanStack Query for data fetching
• Axios for HTTP requests

Mobile Frontend

• React Native with Expo
• TypeScript
• React Navigation for navigation
• AsyncStorage for offline data
• NetInfo for connectivity detection

Infrastructure

• Docker containerization
• Docker Compose orchestration
• Deployable on NAS (Network Attached Storage)

Project Structure

Zoodle/
├── backend/                # Spring Boot backend service
│   ├── src/
│   │   ├── main/java/com/zoodle/
│   │   └── main/resources/
│   ├── pom.xml
│   ├── Dockerfile
│   └── README.md
│
├── frontend-web/          # React web application
│   ├── src/
│   ├── public/
│   ├── package.json
│   ├── vite.config.ts
│   └── README.md
│
├── frontend-mobile/       # React Native mobile app
│   ├── src/
│   ├── assets/
│   ├── App.tsx
│   ├── app.json
│   ├── package.json
│   └── README.md
│
├── docs/                  # Project documentation
│   ├── vision.md
│   ├── requirements.md
│   ├── use-cases.md
│   └── technology-stack.md
│
├── docker-compose.yml     # Docker services configuration
├── .env.example          # Environment variables template
└── README.md             # This file

Getting Started

Prerequisites

• Java 17+ (for backend development)
• Maven 3.6+ (for backend builds)
• Node.js 18+ (for frontend development)
• Docker & Docker Compose (for deployment)
• PostgreSQL 14+ (for local database development)

Initial Setup

1. Clone the repository

   cd Zoodle

2. Configure environment variables

   cp .env.example .env
   # Edit .env with your configuration

3. Backend setup

   cd backend
   mvn clean install

4. Web frontend setup

   cd frontend-web
   npm install

5. Mobile frontend setup

   cd frontend-mobile
   npm install

Development

Running Backend Locally

cd backend
mvn spring-boot:run

Backend will be available at http://localhost:8080

Running Web Frontend

cd frontend-web
npm run dev

Web app will be available at http://localhost:3000

Running Mobile App

cd frontend-mobile
npm start

Then:

• Press a for Android emulator
• Or scan QR code with Expo Go app on physical device

Deployment

Using Docker Compose (Recommended)

1. Build and start all services

   docker-compose up -d

2. Stop services

   docker-compose down

3. View logs

   docker-compose logs -f

Services

When running with Docker Compose:

• Backend API: http://localhost:8080
• PostgreSQL: localhost:5432
• Web Frontend: Build and serve separately or through backend

Deploying to NAS

1. Ensure Docker is installed on your NAS
2. Copy the project to your NAS
3. Configure .env file with production settings
4. Run docker-compose up -d
5. Access the application via your NAS IP address

Core Features

Recipe Management

• Create, edit, and delete recipes
• Add multiple images to recipes
• Organize ingredients into groups (sauce, main, side, etc.)
• Assign categories and tags to recipes
• Search recipes by name or ingredients
• Filter recipes by categories and tags
• Get random recipe suggestions

Meal Planning

• Plan meals for a full week
• Schedule lunch and dinner for each day
• View weekly meal overview
• Copy meals from previous weeks
• View past meal plans

User Management

• User registration and authentication
• Isolated data per user
• JWT-based session management

Cross-Platform

• Consistent experience across web and mobile
• Offline support on mobile with data synchronization
• Responsive design for various screen sizes

Documentation

Detailed documentation is available in the docs/ directory:

• Project Vision - Overview and goals
• Requirements - Functional and non-functional requirements
• Use Cases - Detailed use case scenarios
• Technology Stack - Technology decisions and rationale

Component-specific documentation:

• Backend README
• Web Frontend README
• Mobile Frontend README

API Documentation

API documentation will be available through Swagger/OpenAPI (to be configured).

Database Migrations

Database schema changes are managed through Flyway migrations in backend/src/main/resources/db/migration/.

Contributing

This is a personal project. For questions or suggestions, please refer to the documentation.

License

Private project - All rights reserved.

Version

Current version: 0.1.0 (Initial setup)