🌳 MyTree Journal

Simple, extensible tree record-keeping for researchers and hobbyists.
📚 Explore the docs »

View Demo · Report Bug · Request Feature

---

📖 Table of Contents

• About The Project
• Features
• Tech Stack
• Project Structure
• Getting Started
  • Prerequisites
  • Installation
  • Environment Variables
  • Quick Start
• Usage
• Deployment
• Roadmap
• Contributing
• License
• Contact

---

About The Project

MyTree Journal is a full-stack tree record-keeping system designed for simplicity and extensibility. Perfect for researchers, hobbyists, or small-to-medium scale cultivation projects.

Why MyTree Journal?

• 🎯 Purpose-built for tree and plant tracking
• 📱 Mobile-first responsive design
• 🌙 Dark mode support out of the box
• 📸 Media management with automatic thumbnails
• 🔗 QR codes for easy sharing and tracking

(back to top)

---

Features

Core Functionality

Feature	Description
🌱 Strain Management	Organize plants by genetic strains
📦 Batch Tracking	Group plants by cultivation batches
🌳 Tree Records	Comprehensive individual plant records
📸 Media Attachments	Images and documents per tree
📊 QR Codes	Generate shareable QR codes

User Experience

Feature	Description
🎨 Modern UI	Organic Biophilic + Claymorphism design
🧱 Bento Grid	Responsive dashboard with hero cards
🌐 Multi-lang	Thai (TH) & English (EN) support
📱 Responsive	Works on desktop, tablet, and mobile
🌙 Dark Mode	System-aware theme switching
⚡ Fast	useMemo, useCallback optimizations
♿ Accessible	ARIA labels and keyboard navigation

Data Management

Feature	Description
🧬 Genetics	Track lineage, parents, and strains
📅 Timeline	Detailed lifecycle tracking
🌸 Pollination	Breeding and seed harvest records
📂 Smart Folders	Auto-organize images by tree name
🖼️ Thumbnails	Automatic thumbnail generation
📤 Drag & Drop	Upload files with drag-and-drop

(back to top)

---

Tech Stack

Backend

Frontend

Infrastructure

(back to top)

---

Project Structure

mytree-journal/
├── 📁 mytree_journal/        # Django project configuration
│   └── settings.py           # Database, CORS, timezone config
│
├── 📁 trees/                 # Django app (models, views, API)
│   ├── models.py             # Strain, Batch, Tree, Image models
│   ├── serializers.py        # DRF serializers
│   ├── views.py              # API ViewSets
│   └── migrations/           # Database migrations
│
├── 📁 mytree-frontend/       # Next.js frontend
│   ├── app/
│   │   ├── page.tsx          # Dashboard
│   │   ├── types.ts          # TypeScript type definitions
│   │   ├── utils.ts          # Shared utility functions
│   │   ├── constants.ts      # App-wide constants
│   │   ├── strains/          # Strain management
│   │   ├── batches/          # Batch management
│   │   └── tree/[id]/        # Tree detail page
│   ├── components/           # Reusable UI components
│   │   ├── TreeCard.tsx      # Tree card with clay styling
│   │   ├── DashboardStats.tsx # Bento grid stats
│   │   ├── InfoCard.tsx      # Reusable info card
│   │   └── Navbar.tsx        # Responsive navigation
│   ├── constants/            # Shared constants
│   │   └── treeStatus.ts     # Tree status constants
│   ├── services/             # API service layer
│   │   └── treeService.ts    # Tree API client
│   ├── contexts/             # React contexts
│   │   └── LanguageContext.tsx # i18n context
│   └── hooks/                # Custom React hooks
│
├── 📁 media/                 # Uploaded files
│   ├── tree_images/          # Tree photos & thumbnails
│   └── tree_documents/       # Attached documents
│
├── 📁 nginx/                 # Deployment config
├── 📄 requirements.txt       # Python dependencies
├── 📄 package.json           # Node.js dependencies
├── 📄 CHANGELOG.md           # Version history
└── 📄 README.md              # This file

(back to top)

---

Getting Started

Prerequisites

Requirement	Version
Node.js	v22.13.1+
npm	v10.8.3+
Python	3.11+
PostgreSQL	14+ (recommended)
Nginx	For production

Installation

1. Clone the repository

   git clone https://github.com/naravid19/mytree-journal.git
   cd mytree-journal

2. Set up the backend

   # Create virtual environment (recommended)
   python -m venv venv
   source venv/bin/activate  # Windows: venv\Scripts\activate
   
   # Install dependencies
   pip install -r requirements.txt
   
   # Run migrations
   python manage.py migrate

3. Set up the frontend

   cd mytree-frontend
   npm install
   cd ..

Environment Variables

Create .env in the project root:

DJANGO_ALLOWED_HOSTS=localhost,127.0.0.1,api.example.com

Create mytree-frontend/.env.local:

NEXT_PUBLIC_FRONTEND_ORIGIN=https://www.example.com
NEXT_PUBLIC_API_BASE_URL=https://api.example.com
NEXT_PUBLIC_MEDIA_DOMAIN=api.example.com

Quick Start

Option 1: One-click (Windows)

# Double-click start_app.bat

Option 2: Manual

# Terminal 1: Backend
python manage.py runserver

# Terminal 2: Frontend
cd mytree-frontend
npm run dev

Then open http://localhost:3000 in your browser.

(back to top)

---

Usage

Route	Description
/	Dashboard - View and manage all trees
/strains	Manage plant strains
/batches	Manage cultivation batches
/tree/[id]	Public tree detail page
/api/	REST API documentation

Data Models

• Strain: Name, description, genetics information
• Batch: Code, description, start date
• Tree: Comprehensive plant data with relationships

Media Support

• Images: JPEG, PNG, WebP (auto-thumbnails)
• Documents: PDF attachments
• Storage: Organized in media/tree_images/ and media/tree_documents/

(back to top)

---

Deployment

See the Nginx configuration example for production deployment.

Key features:

• Static & media file serving
• API reverse proxy
• Security headers
• HTTPS support (add your SSL config)

(back to top)

---

Roadmap

• 🎨 Design system (Claymorphism + Bento Grid)
• 🔧 Clean code refactoring
• ⚡ Performance optimizations (useMemo, useCallback)
• 🔐 Authentication & user management
• 🔍 Advanced search & filtering
• 📱 Progressive Web App (PWA)
• 👥 Multi-user collaboration
• 📊 Analytics dashboard

See the open issues for a full list of proposed features.

(back to top)

---

Contributing

Contributions are what make the open-source community amazing! Any contributions are greatly appreciated.

1. Fork the Project
2. Create your Feature Branch (git checkout -b feature/AmazingFeature)
3. Commit your Changes (git commit -m 'Add some AmazingFeature')
4. Push to the Branch (git push origin feature/AmazingFeature)
5. Open a Pull Request

(back to top)

---

License

Distributed under the MIT License. See LICENSE for more information.

(back to top)

---

Contact

Project Link: https://github.com/naravid19/mytree-journal

(back to top)

---

Acknowledgments

• Tailwind CSS
• Flowbite
• Flowbite React
• Best-README-Template

(back to top)