Skip to content

SETUP.md

Latest commit

 

History

History
297 lines (239 loc) · 8.96 KB

SETUP.md

File metadata and controls

297 lines (239 loc) · 8.96 KB

MeisterFinder - Setup Complete! 🎉

Your MeisterFinder project has been successfully initialized with all the core infrastructure.

✅ What's Been Set Up

1. Project Foundation

  • ✅ Next.js 15 with App Router
  • ✅ TypeScript (strict mode)
  • ✅ Tailwind CSS with custom theme
  • ✅ shadcn/ui component library
  • ✅ ESLint & Prettier configured

2. Core Files Created

  • ✅ Complete folder structure
  • ✅ Configuration files (Tailwind, TypeScript, ESLint, Prettier)
  • ✅ Supabase client setup (browser, server, middleware)
  • ✅ Utility functions (cn, formatters, distance calculator)
  • ✅ Database type definitions
  • ✅ Category configuration (8 main categories)
  • ✅ Site configuration

3. UI Components

  • ✅ shadcn/ui components installed:
    • Button, Card, Input, Badge, Skeleton
    • Dialog, Select, Form, Label, Textarea
    • Dropdown Menu, Avatar, Separator

4. Layout Components

  • ✅ Header with navigation
  • ✅ Footer with links
  • ✅ Mobile navigation
  • ✅ Main navigation

5. Homepage Built

  • ✅ Hero section with search bar
  • ✅ Categories grid (8 categories)
  • ✅ Trust badges section
  • ✅ CTA section for businesses

6. Placeholder Pages

  • ✅ /suche - Search results page
  • ✅ /betrieb-anmelden - Business registration
  • ✅ /dashboard - Business dashboard

🚀 Next Steps

1. Set Up Supabase Database

You need to create your Supabase project and database schema:

-- Create tables (run in Supabase SQL Editor)
-- See the database schema in types/database.ts

-- 1. Enable UUID extension
create extension if not exists "uuid-ossp";

-- 2. Create profiles table
create table profiles (
  id uuid references auth.users on delete cascade primary key,
  email text unique not null,
  full_name text,
  avatar_url text,
  role text check (role in ('customer', 'business', 'admin')) default 'customer',
  created_at timestamptz default now(),
  updated_at timestamptz default now()
);

-- 3. Create categories table
create table categories (
  id uuid default uuid_generate_v4() primary key,
  name text not null,
  slug text unique not null,
  description text,
  icon text not null,
  parent_id uuid references categories(id),
  sort_order int default 0,
  created_at timestamptz default now()
);

-- 4. Create listings table
create table listings (
  id uuid default uuid_generate_v4() primary key,
  user_id uuid references profiles(id) on delete cascade not null,
  business_name text not null,
  slug text unique not null,
  category_id uuid references categories(id) not null,
  description text not null,
  short_description text,
  street text not null,
  city text not null,
  zip_code text not null,
  state text default 'Bayern',
  latitude decimal(10, 8) not null,
  longitude decimal(11, 8) not null,
  phone text,
  email text,
  website text,
  logo_url text,
  images text[] default '{}',
  opening_hours jsonb,
  is_verified boolean default false,
  subscription_tier text check (subscription_tier in ('basic', 'premium', 'premium_plus')) default 'basic',
  views_count int default 0,
  leads_count int default 0,
  rating_average decimal(2, 1),
  rating_count int default 0,
  status text check (status in ('active', 'inactive', 'pending')) default 'pending',
  created_at timestamptz default now(),
  updated_at timestamptz default now()
);

-- 5. Create reviews table
create table reviews (
  id uuid default uuid_generate_v4() primary key,
  listing_id uuid references listings(id) on delete cascade not null,
  user_id uuid references profiles(id) on delete cascade not null,
  rating int check (rating >= 1 and rating <= 5) not null,
  title text not null,
  comment text not null,
  response text,
  response_date timestamptz,
  is_verified_purchase boolean default false,
  status text check (status in ('pending', 'approved', 'rejected')) default 'pending',
  created_at timestamptz default now(),
  updated_at timestamptz default now()
);

-- 6. Create leads table
create table leads (
  id uuid default uuid_generate_v4() primary key,
  listing_id uuid references listings(id) on delete cascade not null,
  customer_name text not null,
  customer_email text not null,
  customer_phone text,
  message text not null,
  status text check (status in ('new', 'contacted', 'converted', 'closed')) default 'new',
  created_at timestamptz default now()
);

-- 7. Enable Row Level Security
alter table profiles enable row level security;
alter table categories enable row level security;
alter table listings enable row level security;
alter table reviews enable row level security;
alter table leads enable row level security;

-- 8. Create RLS policies (examples - customize as needed)
create policy "Public profiles are viewable by everyone"
  on profiles for select using (true);

create policy "Users can update own profile"
  on profiles for update using (auth.uid() = id);

create policy "Categories are viewable by everyone"
  on categories for select using (true);

create policy "Active listings are viewable by everyone"
  on listings for select using (status = 'active');

create policy "Users can insert own listings"
  on listings for insert with check (auth.uid() = user_id);

create policy "Users can update own listings"
  on listings for update using (auth.uid() = user_id);

-- 9. Create indexes for performance
create index listings_category_id_idx on listings(category_id);
create index listings_city_idx on listings(city);
create index listings_subscription_tier_idx on listings(subscription_tier);
create index reviews_listing_id_idx on reviews(listing_id);
create index leads_listing_id_idx on leads(listing_id);

-- 10. Insert categories
insert into categories (name, slug, description, icon) values
  ('Elektriker', 'elektriker', 'Elektroinstallationen, Reparaturen und Wartung', 'Zap'),
  ('Klempner/Sanitär', 'klempner-sanitaer', 'Sanitärinstallationen, Rohrreinigung und Notdienst', 'Droplet'),
  ('Dachdecker', 'dachdecker', 'Dacheindeckung, Reparaturen und Dachfenster', 'Home'),
  ('Maler', 'maler', 'Malerarbeiten, Fassaden und Lackierungen', 'PaintBucket'),
  ('Schreiner/Tischler', 'schreiner-tischler', 'Möbelbau, Innenausbau und Holzarbeiten', 'Hammer'),
  ('Heizungsbauer', 'heizungsbauer', 'Heizungsinstallation, Wartung und Modernisierung', 'Lightbulb'),
  ('Bauunternehmen', 'bauunternehmen', 'Neubau, Umbau und Sanierung', 'Drill'),
  ('Allgemein', 'allgemein', 'Hausmeisterservice, Renovierung und mehr', 'Wrench');

2. Add Environment Variables

Update your .env.local with actual values:

# Get these from your Supabase project settings
NEXT_PUBLIC_SUPABASE_URL=https://your-project.supabase.co
NEXT_PUBLIC_SUPABASE_ANON_KEY=your-anon-key
SUPABASE_SERVICE_ROLE_KEY=your-service-role-key

# Site configuration
NEXT_PUBLIC_SITE_URL=http://localhost:3000

# Stripe (get from stripe.com)
STRIPE_PUBLISHABLE_KEY=pk_test_...
STRIPE_SECRET_KEY=sk_test_...
STRIPE_WEBHOOK_SECRET=whsec_...

# Resend (get from resend.com)
RESEND_API_KEY=re_...

3. Generate TypeScript Types from Supabase

npx supabase gen types typescript --project-id YOUR_PROJECT_ID > types/database.ts

4. Start Development

npm run dev

Visit http://localhost:3000 to see your site!

📋 Development Phases

Phase 1: Foundation ✅ COMPLETE

  • ✅ Project setup
  • ✅ Basic UI components
  • ✅ Layout and navigation
  • ✅ Homepage

Phase 2: Search & Listings (Next)

  • Implement search functionality
  • Create listing detail pages
  • Add filtering and sorting
  • Implement pagination

Phase 3: Reviews & Auth

  • Set up authentication
  • Build review system
  • User profiles

Phase 4: Business Dashboard

  • Registration flow
  • Dashboard with analytics
  • Listing management
  • Lead management

Phase 5: Monetization

  • Stripe integration
  • Subscription plans
  • Premium features

Phase 6: Polish & Launch

  • SEO optimization
  • Performance optimization
  • Testing
  • Deployment

🎨 Component Library

All UI components are built with shadcn/ui, which means:

  • ✅ Fully accessible (WCAG 2.1 AA)
  • ✅ Customizable with Tailwind
  • ✅ TypeScript types included
  • ✅ Production-ready

To add more components:

npx shadcn@latest add [component-name]

Available components: https://ui.shadcn.com/docs/components

🔥 Tips

  1. Use Server Components by default - Only add "use client" when you need interactivity
  2. Validate inputs with Zod - Already set up in lib/validations
  3. German UI text - All user-facing text should be in German
  4. Mobile-first - Design for mobile, then scale up
  5. Accessibility - Use semantic HTML and ARIA labels

📚 Resources

🆘 Need Help?

Check the documentation or open an issue on GitHub.

Ready to build? Let's create something amazing! 🚀