Back to services

Custom service

React Web Application

Purpose-built React applications with separately engineered Node.js APIs and MySQL database layers, priced above focused Next.js builds to reflect the additional custom backend, data, security, testing, and deployment work.

A custom web app people use in their browser, such as a dashboard, portal, SaaS MVP, internal tool, or customer workflow. I handle the React frontend design as well as its engineering. AI can accelerate concepts and implementation, but I personally refine and perfect the interface so its layout, hierarchy, responsive behaviour, interactions, and branding suit the customer rather than looking machine-generated or generic. This service deliberately uses a separately engineered Node.js API and MySQL data layer rather than relying on Next.js to combine frontend and server routes in one project. The higher starting price reflects designing, securing, testing, deploying, and connecting those custom layers, including authentication, permissions, validation, API contracts, database models, and failure handling. For many projects, the frontend can begin with a suitable licensed React template, but a more directly engineered interface with restrained animation may be the better professional choice when stability, clarity, accessibility, older-device support, and predictable interaction matter more than decorative effects.

Deliverables

  • Frontend and backend architecture
  • Custom Node.js API routes, validation, and access controls
  • Admin dashboards, user roles, and management workflows
  • AI-selected news feeds tailored to the customer's industry, risks, competitors, or technology stack
  • Optional Gmail-style email inbox with tailored message metadata and workflow tools
  • Social profiles, feeds, communities, or messaging interfaces
  • Database schema design
  • API integration
  • Testing and launch support

Process

  • Map the main user journeys and data needs.
  • Select and licence a suitable React template when it will save design and frontend development time.
  • Use AI-assisted drafts where useful, then personally refine the responsive screens, components, navigation, and visual system.
  • Design a secure Node.js API and database layer for the product when one is not already available.
  • Connect the React frontend to validated API endpoints rather than exposing the database directly.
  • Add forms, loading states, and clear error states.
  • Prepare handoff notes for future changes.

Good for

  • Dashboards
  • Client portals
  • SaaS MVPs
  • Admin tools

Preview and staged approval

Review working software before the final handoff.

I can provide secure previews throughout the agreed project so you can analyse progress, test important workflows, and request reasonable in-scope changes. The payment structure is agreed before work begins and reflects the size, risk, and engineering effort involved.

Private progress previews

I can provide a private web preview or suitable mobile test build so you can inspect agreed work before approving the next milestone or final payment.

Request included changes

You can request reasonable revisions covered by the agreed scope at no extra charge before confirming that the build is right for you.

Payment terms matched to scope

A focused lower-cost build may qualify for payment after preview. Complex custom applications require an agreed deposit or paid milestones before substantial engineering begins.

Focused websites or template-based builds may be eligible for approval and payment after a completed preview. Substantial React, React Native, Node.js, API, authentication, or MySQL projects require a deposit, paid discovery, or milestone payments because they consume significant engineering time, testing effort, infrastructure, and paid AI-development resources such as ChatGPT Codex usage. A complex completed application therefore cannot be declined without paying for work already approved and completed. New features outside the agreed scope are quoted separately. Source code, production credentials, final deployment, and third-party licences are transferred only after the final balance is paid.

Architecture and pricing

Why a custom React and Node.js application starts at a higher price.

React is a user-interface library and does not automatically require a Node.js backend. For my custom React application service, however, I engineer a separate Node.js API whenever the product needs its own secure business logic, accounts, permissions, integrations, or MySQL data. That gives more explicit, lower-level control, but it also means building and operating two connected application layers instead of one integrated Next.js project. That custom API work takes additional engineering time and a lower-level understanding of HTTP, security, data contracts, processes, deployment, and failure handling.

Integrated Next.js

  • Next.js supplies routing, server rendering, and Route Handlers, so the frontend and server-side code can live in one application.
  • Framework conventions and AI-assisted development can make a focused integration faster by avoiding a separate frontend-to-backend repository, release pipeline, and cross-origin configuration.
  • It handles much of the backend framework plumbing, but validation, authentication, permissions, business logic, and MySQL access are still deliberately engineered.

Separate React + Node.js API

  • The React client and standalone Node.js API are designed, tested, deployed, and monitored as separate application layers.
  • The API needs explicit contracts, validation, authentication, permissions, error handling, rate limits, and safe MySQL queries.
  • The same backend can independently serve a React website, React Native app, administration dashboard, and future integrations.

A separate React and Node.js architecture is not universally better. It is valuable when several clients need the same stable API, when frontend and backend releases must remain independent, or when the backend requires its own scaling and security boundary. For a focused website, store, or portal, Next.js can be the more efficient professional architecture. If a Next.js project needs substantial custom backend engineering, that work is still priced according to its complexity. AI can accelerate implementation in either architecture, but it does not replace architecture decisions, security review, testing, or production responsibility.

Professional frontend foundation

A licensed React template can be the sensible starting point

Dashboard, portal, CRM, SaaS, and internal-tool projects often do not benefit from rebuilding every navigation pattern, form, table, authentication screen, and responsive layout from zero. A well-supported React and TypeScript template can provide a consistent component system and speed up the visual frontend, leaving more of the budget for the application's real data, permissions, APIs, security, and business workflows.

Phoenix React from ThemeWagon is one example I can evaluate and customise. It uses React, TypeScript, Bootstrap 5, responsive layouts, multiple navigation options, authentication-page designs, admin and customer panels, forms, tables, and other reusable application components. The customer purchases the appropriate template licence separately.

Phoenix React from ThemeWagon is one dashboard foundation I can evaluate, licence, and customise. I have years of hands-on experience with ThemeWagon and Bootstrap 5 templates, and can connect the dashboard to the mobile application's backend so collected data becomes useful tables, summaries, and graphs for administrators. The customer purchases the appropriate template licence separately.

The charts are selected around decisions the customer or admin actually needs to make, rather than filling a dashboard with decorative statistics. Suitability, dependency quality, accessibility, performance, security, privacy, data permissions, and required custom development are reviewed for every project.

Phoenix React + Bootstrap

The React version uses React, TypeScript, Bootstrap 5, and React-oriented packages. It is usually the closer foundation for an interactive React dashboard that needs component state, data tables, forms, charts, routing, and direct integration with a custom Node.js API.

Phoenix Tailwind CSS

The premium Tailwind version is a separate implementation built around Tailwind CSS and ThemeWagon's Hummingbird component system. Its utility-first styling offers detailed visual customisation, but it is not simply the React version with its CSS replaced. The application architecture and required integrations must be evaluated before choosing it.

ThemeWagon's All Versions product currently combines the Bootstrap, React, and Tailwind editions under one offering. The customer purchases the licence appropriate to the number of projects and intended commercial use; current contents, versions, prices, and licence terms remain controlled by ThemeWagon.

Custom admin dashboards

Useful admin dashboards and internal tools for real work.

I can design and build private admin areas for ecommerce stores, social platforms, SaaS products, React Native mobile-app backends, customer portals, and other data-driven applications. Each dashboard can be tailored to the project's database, APIs, staff roles, and everyday workflows.

  • Projects, revenue, downloads, enquiries, and audience insights
  • Useful operational tools connected to your real application data
  • Custom Gmail-style inboxes with received messages, attachments, replies, search, workflow statuses, routing details, and useful email metadata
  • Private authentication, operational logs, and file sharing
  • AI-selected recent news tailored to the business, industry, risks, competitors, or technology stack
A working CodeKits example: an editorial-style private feed that continuously searches official React, React Native, Node.js, TypeScript, MySQL, Ubuntu Server and Linux sources, prioritises consequential changes, and explains why they matter to my software-development work.
CodeKits administration workspace showing projects, enquiries, inbox, email composition, file sharing, orders, downloads, subscribers, analytics, newsletters, and audit tools
A real CodeKits.shop workspace combining project tracking, customer communication, commerce operations, analytics, and secure internal tools in a responsive Next.js and MySQL application.

Continued support included

You are supported after purchase or delivery.

Support continues after handover, with practical help related to the delivered projectrather than leaving you with code and no direction.

Questions answered

Get clear follow-up answers about the supplied code, setup documentation, configuration, and technical handover.

Tailored command sheets

Request practical command sheets for installation, deployment, server configuration, updates, and common troubleshooting.

Engineering plans

Receive structured next-step plans covering architecture, milestones, integrations, security work, testing, and launch preparation.

Included support covers reasonable questions and guidance connected to the purchased product or agreed project scope. New features, substantial redevelopment, managed hosting, and third-party charges are quoted separately.

React and Vite deployment

Build a React application for Nginx.

For a client-side React app, the terminal workflow creates a Vite project, produces static assets and publishes them through a checked Nginx configuration.

  • Scaffold a typed React application with Vite
  • Run checks and create the optimised static build
  • Publish the dist folder to the web directory
  • Validate Nginx before reloading the site

Final command sheets are tailored to the project and hosting setup.

✓ Ubuntu packages updated
✓ Vite production assets created in dist/
✓ React application published through Nginx

Project inquiry

Request React Web Application

Tell me what you want to build, what budget range you have, and when you want to launch. I will reply with scope questions and a custom quote.

Private by default. Your contact and project details are used only to respond to and deliver your enquiry. They are never sold, published, shared with other customers, or used for unrelated marketing. Any testimonial or review is entirely optional, can be anonymous, and can be skipped altogether.

FAQ

Custom development service questions

Still have questions? Email us at [email protected]