Skip to content

README.md

Latest commit

 

History

History
97 lines (72 loc) · 2.05 KB

README.md

File metadata and controls

97 lines (72 loc) · 2.05 KB
Raw

🍳 Resepi KhairulAming

Harini kita nak buat...

A modern recipe collection web app featuring delicious recipes from Malaysian TikTok chef KhairulAming.

✨ Features

  • 🔍 Smart search across recipes
  • 📱 Responsive design for all devices
  • 🎥 Embedded TikTok cooking videos
  • ⚡ Fast performance with Next.js 15

🚀 Quick Start

Prerequisites

  • Node.js 18+
  • Supabase account

Setup

  1. Clone and install:

    git clone https://github.com/danishayman/resepi-kharulaming.git
cd resepi-kharulaming
npm install

  2. Setup Supabase:

    • Create a project at Supabase
    • Run SQL from SQL/sql_definition.sql
    • Get your project URL and anon key

  3. Configure environment:

    cp .env.example .env.local

    Add to .env.local:

    NEXT_PUBLIC_SUPABASE_URL=your_project_url
NEXT_PUBLIC_SUPABASE_ANON_KEY=your_anon_key

  4. Start development:

    npm run dev

    Visit http://localhost:3000

🛠️ Tech Stack

  • Next.js 15 - React framework
  • TypeScript - Type safety
  • Tailwind CSS - Styling
  • Supabase - Database and backend

📁 Project Structure

app/
├── page.tsx          # Homepage with recipe grid
├── layout.tsx        # Root layout
└── resepi/[slug]/    # Recipe detail pages

components/
├── RecipeCard.tsx    # Recipe cards
├── SearchBar.tsx     # Search functionality
└── TikTokEmbed.tsx   # Video embeds

lib/
├── supabase.ts      # Database client
├── types.ts         # TypeScript types
└── utils.ts         # Utilities

🚀 Deployment

Deploy to Vercel:

  1. Push to GitHub
  2. Import project at vercel.com
  3. Add environment variables
  4. Deploy!

🤝 Contributing

  1. Fork the repository
  2. Create a feature branch
  3. Make your changes
  4. Submit a pull request

📄 License

MIT License - see LICENSE for details.

Made with ❤️ for food lovers everywhere