Byron Wade

HobbyHobby Project

ReactPress

The WordPress admin screens rebuilt as React pages in Next.js 14 and React 18, as a starting point for modern field management systems.

Why I built it

People know the WordPress admin. They have used it for years and they do not want to relearn where everything is. The problem is what it is built on. So I wanted to find out whether you could keep the interface people already know and put a modern stack underneath it. That is ReactPress.


What is ReactPress?

ReactPress rebuilds the WordPress admin interface as React pages using Next.js 14, React 18, and TypeScript. It is not a WordPress theme or a skin. It keeps the layout people already know and puts it on a stack I would actually choose today. On the main branch the screens are static: nothing loads or saves content yet.

The Technical Foundation

Built with:

  • Next.js 14 with the App Router
  • React 18 for component-based architecture
  • TypeScript for type safety and developer experience
  • Tailwind CSS, set up alongside the original WordPress admin stylesheet
  • Bun or npm for installs (both lockfiles are in the repository)

The admin area has 39 routes under /rp-admin: the dashboard, post and page lists, categories and tags, comments, media, plugins, themes and menus, users, tools, login, install, and all seven settings pages. They reuse WordPress's own markup, class names and admin stylesheet, which is why they look like the real thing. The block editor is the gap. The new-post and new-page screens are placeholders, and the Gutenberg editor code is commented out.


Why I Started Building ReactPress

The Problem with Traditional WordPress

WordPress powers over 40% of the internet, and for good reason. Its admin interface is intuitive, well-designed, and familiar to millions of users. However, as a developer working on modern web applications, I found myself constantly hitting limitations:

  1. Performance Bottlenecks: Traditional WordPress admin can be slow, especially with complex sites or many plugins

  2. PHP Dependency: The WordPress ecosystem is deeply tied to PHP, which limits integration with modern JavaScript frameworks

  3. Monolithic Architecture: WordPress's tightly coupled architecture makes it difficult to use just the admin interface with other backends

  4. Developer Experience: Working with WordPress means dealing with PHP, jQuery, and older development patterns

The Vision: A Modern Admin Interface Foundation

I realized that what the web development community needed wasn't another CMS or another admin framework. What we needed was a way to leverage the familiar, battle-tested WordPress admin interface with modern technologies that could integrate with any backend, whether that's a headless WordPress installation, a custom API, or a specialized field management system.

ReactPress was born from this vision: take the best of WordPress's UX and combine it with the best of modern web development.


The Journey So Far

Phase 1: Foundation ✅

The first phase focused on establishing the core architecture:

  • Setting up Next.js with the App Router
  • Recreating the WordPress admin layout structure
  • Carrying over the WordPress admin's own responsive styles
  • Building the navigation and routing system

That gives every screen a real route and real components. On the main branch it does not give them data: forms and tables render, but they do not load or save anything.

Phase 2: CSS Modernization 🚧

This phase is unfinished. The plan was to convert the original WordPress CSS to Tailwind CSS utility classes. On the main branch the screens still run on the copied WordPress stylesheet, about 18,600 lines of it. Unmerged work from June 2026 removes unused rules from that stylesheet and starts converting the admin shell to Tailwind. The point of the conversion was:

  • Reducing bundle size
  • Improving maintainability
  • Enabling easier customization
  • Supporting better responsive design patterns

Future Phases

The roadmap, none of it built yet:

  • Component Library: Reusable admin components with Storybook documentation
  • API Integration: Adapters for WordPress REST API, headless CMS platforms, and custom APIs
  • Advanced Features: Plugin architecture, theme customization, and performance monitoring

Why ReactPress is a Critical Stepping Stone for Field Management Systems

The Field Management System Vision

Field management systems are complex applications that need to handle:

  • Data Management: Tracking field operations, equipment, personnel, and schedules
  • User Interfaces: Dashboards, forms, reports, and administrative panels
  • Integration: Connecting with various APIs, databases, and third-party services
  • Scalability: Growing from small operations to enterprise-level deployments

Building such a system from scratch is a massive undertaking. You need:

  • An admin interface people can find their way around without being taught
  • A component library that can be extended for domain-specific features
  • An architecture that supports rapid development and iteration
  • A foundation that doesn't require reinventing the wheel

How ReactPress Fills the Gap

That is the foundation ReactPress is meant to become:

1. Proven UX Patterns

WordPress's admin interface has been refined over two decades. Millions of users already know how to navigate it, where to find settings, and how to manage content. By starting with ReactPress, a field management system inherits these proven patterns rather than forcing users to learn a completely new interface.

2. Component-Based Architecture

The sidebar, toolbar, footer and list table are shared components. Most screens are still one large page file each, so breaking the dashboard widgets and settings forms into their own components is part of the remaining work. Once they are, a field management system extends them instead of starting from scratch: a field-operations widget built on the dashboard's widget layout, an equipment-tracking form built on the settings forms.

3. API-First Design

The plan is for ReactPress to work with any backend: WordPress, a custom API, MongoDB, or a field management database. None of that is on the main branch: SWR and Recoil are installed but not used, and an early MongoDB and Firebase setup script is commented out. An unmerged branch from June 2026 connects most list screens, the dashboard and General Settings to Fakebase, an in-process stand-in backend, which is a first step but not a real one. That flexibility matters for field management systems, which often need to integrate with:

  • Equipment tracking systems
  • GPS and mapping services
  • Weather APIs
  • Scheduling systems
  • Reporting tools

4. Modern Performance

Field management systems need to be fast, especially when field workers are accessing them on mobile devices with limited connectivity. I have not measured ReactPress against the WordPress admin, so I make no speed claim here. The bet is that React pages built with the Next.js App Router are a better place to start than a PHP admin carrying years of plugins.

5. Developer Productivity

Building a field management system is complex enough without also having to build an admin interface from scratch. ReactPress aims to provide:

  • TypeScript for the components
  • Consistent styling patterns
  • Reusable UI components
  • A familiar structure that any WordPress developer can understand

This means developers can focus on the domain-specific features of the field management system rather than spending months building basic admin functionality.

The Path Forward

ReactPress isn't the end goal, it's the foundation. Here's how it enables the field management system:

  1. Start with ReactPress: Use the existing admin interface as the base
  2. Extend with Domain Components: Add field-specific components (equipment tracking, scheduling, reporting)
  3. Integrate with Backend APIs: Connect to your field management database and services
  4. Customize the Experience: Modify the interface to match your specific workflows while maintaining familiar patterns

The aim is to cut development time and risk: start from screens people already know, and spend the effort on what your field management system does differently.


The Bigger Picture

ReactPress represents more than just a WordPress alternative. It's a demonstration that:

  • Familiar interfaces can be modernized without sacrificing usability
  • You can keep the interface people already know while replacing everything under it
  • Developer productivity matters as much as user experience

For the field management system, ReactPress is meant to provide:

  • A proven starting point that reduces risk
  • Familiar patterns that reduce training time
  • Modern architecture that supports long-term growth
  • Component reusability that accelerates feature development

Conclusion

ReactPress started as an experiment: "What if we could have the WordPress admin interface on a modern stack?" It grew into a plan for something bigger, a foundation for complex applications that need robust admin interfaces.

For the field management system, that foundation would give me a familiar UX, a modern technical architecture, and components that can be extended for domain-specific needs. Most importantly, it would let the development team focus on what makes the field management system unique rather than rebuilding basic admin functionality.

The journey from ReactPress to a full field management system is a natural progression: start with a solid foundation, extend it with domain-specific features, and build something that serves real-world needs while keeping the usability and familiarity that users expect.

ReactPress's main branch has not changed since June 2025. The screens are in place; the data layer, the block editor and the CSS conversion are not. Unmerged branches from June 2026 start on two of those. Finishing all three is what would turn it into a real foundation for the field management system.

That is why ReactPress matters to me. It started as a WordPress experiment, and it is also a stepping stone toward building better applications that solve real problems.


ReactPress's source is public on GitHub; the repository has no license file. You can click through the static screens at reactpress.byronwade.com/rp-admin.