Project Setup

This guide covers the standard setup process for new FLYPILOT projects across different technology stacks.

WordPress Project Setup

1. Environment Setup

WPEngine Projects

1. Request new install from WPEngine dashboard
2. Set up three environments: Development, Staging, Production
3. Configure SSH access
4. Enable Git Push for deployments

Local Development

1. Install Local by Flywheel or MAMP Pro
2. Create local site matching production PHP version
3. Clone repository to local site's theme directory
4. Configure .env for local credentials

2. Theme Setup

Block-Based Theme (Gutenberg)

# Create child theme structure
wp-content/themes/
  └── client-theme/
      ├── functions.php
      ├── style.css
      ├── theme.json
      ├── patterns/
      ├── templates/
      └── parts/

DX Plugin Setup

# Initialize DX folder
wp-content/themes/client-theme/
  └── dx/
      ├── acf-blocks/
      ├── patterns/
      ├── scss/
      └── ts/

3. Plugin Requirements

Standard Plugins

Plugin	Purpose	Required
ACF Pro	Custom fields and blocks	Yes
Yoast SEO	Search optimization	Yes
WP Migrate DB Pro	Database sync	Yes
Gravity Forms	Form management	If needed
DX Plugin	Developer experience	For DX projects

4. Configuration Files

theme.json (Design System)

{
  "version": 2,
  "settings": {
    "color": {
      "palette": [
        { "slug": "primary", "color": "#1D2433", "name": "Primary" },
        { "slug": "secondary", "color": "#F5F4F0", "name": "Secondary" }
      ]
    },
    "typography": {
      "fontFamilies": [
        { "fontFamily": "Inter, sans-serif", "slug": "body", "name": "Body" },
        { "fontFamily": "Bebas Neue, sans-serif", "slug": "heading", "name": "Heading" }
      ]
    },
    "layout": {
      "contentSize": "1200px",
      "wideSize": "1512px"
    }
  }
}

---

Next.js Project Setup

1. Initialize Project

# Create new Next.js project
npx create-next-app@latest client-app --typescript --tailwind --eslint --app

# Install shadcn/ui
npx shadcn-ui@latest init

# Install additional dependencies
npm install @tanstack/react-query zustand

2. Database Setup

Supabase

# Install Supabase client
npm install @supabase/supabase-js

# Create supabase client
# lib/supabase.ts
import { createClient } from '@supabase/supabase-js'

export const supabase = createClient(
  process.env.NEXT_PUBLIC_SUPABASE_URL!,
  process.env.NEXT_PUBLIC_SUPABASE_ANON_KEY!
)

Prisma

# Install Prisma
npm install prisma @prisma/client

# Initialize Prisma
npx prisma init

# Generate client
npx prisma generate

3. Project Structure

src/
├── app/
│   ├── layout.tsx
│   ├── page.tsx
│   └── api/
├── components/
│   ├── ui/           # shadcn components
│   └── custom/       # Custom components
├── lib/
│   ├── supabase.ts
│   └── utils.ts
├── hooks/
├── types/
└── styles/

4. Environment Variables

# .env.local
NEXT_PUBLIC_SUPABASE_URL=https://xxx.supabase.co
NEXT_PUBLIC_SUPABASE_ANON_KEY=xxx
DATABASE_URL=postgresql://xxx

---

Shopify Project Setup

1. Initialize Theme

# Install Shopify CLI
npm install -g @shopify/cli @shopify/theme

# Login to Shopify
shopify login --store your-store.myshopify.com

# Clone theme
shopify theme pull --theme-id [theme-id]

2. Development Workflow

# Start development server
shopify theme dev

# Push changes
shopify theme push

---

Common Setup Tasks

Git Repository

# Initialize repository
git init
git remote add origin git@github.com:RealFlyPilot/client-project.git

# Create standard branches
git checkout -b develop
git push -u origin develop

Branch Protection

Configure on GitHub:

• Require pull request before merging
• Require status checks (if CI/CD configured)
• Enable branch protection for main and develop

CI/CD Setup

See Deployments for deployment configuration.

---

Checklist

New Project Checklist

• Repository created and configured
• Branch protection enabled
• Local development environment working
• Staging environment configured
• Required plugins/packages installed
• Design system configured
• Team access configured
• Initial commit pushed

Environment Parity

Always ensure local, staging, and production environments are as similar as possible to avoid deployment issues.