Skip to main content

Getting Started

Welcome to FlatWP - the easiest way to build modern, performant websites with WordPress and Next.js.

What is FlatWP?​

FlatWP is a complete starter kit that combines WordPress's easy content management with Next.js's speed and modern features. Get started quickly and build websites that are fast, beautiful, and easy to maintain.

Key Features​

  • ⚡ Lightning Fast: Optimized performance with smart caching
  • 🎨 Beautiful UI: Modern design with TailwindCSS and pre-built components
  • 🔄 Auto-Updates: Content changes in WordPress appear on your site automatically
  • 📱 Mobile-Ready: Fully responsive on all devices
  • 🔧 Easy Customization: Change colors, add features, and extend functionality
  • 🚀 React Dashboard: Modern WordPress admin with real-time monitoring
  • 📦 Open Source: Free to use with MIT license

What You'll Need​

Before getting started with FlatWP, make sure you have:

  • Node.js version 20.0 or higher
  • WordPress 6.0+ with WPGraphQL plugin
  • Package Manager: npm, yarn, or pnpm (we recommend pnpm)
  • Basic knowledge of WordPress and web development
Prerequisites Check

Not sure if you have everything? Run these commands:

node --version  # Should be 20.0 or higher
npm --version   # Any recent version

Quick Start Guide →

ACF Setup

What's Included​

FlatWP comes with everything you need:

Next.js Starter Template​

  • Pre-built pages (Home, Blog, About, Contact)
  • Responsive navigation and footer
  • Blog post layout with featured images
  • Page builder with flexible content blocks
  • Contact form with email integration
  • Search functionality
  • SEO optimization

WordPress Plugin​

  • Modern React-based admin dashboard
  • Real-time connection monitoring
  • Cache management interface
  • Automatic revalidation webhooks
  • Preview mode for draft content
  • Settings management

Ready-to-Use Components​

  • 8 content block types (Hero, Features, CTA, Testimonials, etc.)
  • 2 sidebar widget types
  • Image optimization with blur placeholders
  • Responsive design system
  • Dark mode support

Tech Stack​

Built with modern, battle-tested technologies:

  • Next.js 15 - React framework with App Router
  • TypeScript - Type-safe development
  • TailwindCSS - Utility-first styling
  • Shadcn/ui - Beautiful, accessible components
  • WordPress - Powerful content management
  • WPGraphQL - Efficient data fetching
  • ACF Pro - Flexible custom fields (optional)
Why These Technologies?

Each tool is chosen for production-ready reliability, active community support, and excellent documentation. You're building on a solid foundation used by thousands of sites.

Next Steps​

Ready to build your first FlatWP site? Follow our Quick Start Guide to get up and running in under 10 minutes.

Learning Path​

  1. Quick Start - Install and set up in 10 minutes
  2. ACF Setup - Configure custom fields with examples
  3. Customization - Customize colors, components, and features
  4. WordPress Plugin - Learn about the React dashboard
  5. Configuration - Advanced configuration options
  6. Deployment - Deploy to production

Who Is This For?​

FlatWP is perfect for:

  • Freelancers building client websites
  • Agencies delivering modern WordPress projects
  • Developers wanting to use React with WordPress
  • Bloggers who want better performance
  • Anyone building content-driven websites

Community & Support​

License​

FlatWP is open source and MIT licensed. Free to use for personal and commercial projects! 🚀