ReactQL v4.8.5

Universal React+GraphQL starter kit.

npm install -g reactql

React v16 · Apollo Server 1.0 · Redux · Webpack 3 · React Router 4 · PostCSS/SASS/Less

Full-stack. Universal. Server-side rendering.

Your go-to stack for GraphQL

ReactQL is a "done for you" starter kit that seamlessly integrates: 

React v16 (streaming API)

User interface (UI)

Create reusable components that combine UI and logic, and compile down to HTML on the server. Seamless server and browser compatibility, from the same codebase.

Apollo Server/Client + Redux

GraphQL & store management

Build/connect a GraphQL back-end with Apollo Server + Client + custom Redux stores. Fully SSR compatible- data is fetched before HTML is sent.

React Router 4

Universal HTTP/app routing

New in v4, write routes declaratively inside your React components. Zero configuration required.

Webpack 3

Code bundling & minification

Extendable Webpack config generates browser + server bundles, optimises your code paths, crunches images and generates code ready for production.

PostCSS + SASS + LESS

Next-gen CSS stylesheets

Write locally-scoped CSS with nested statements, @import, variables and next-gen CSS features - in plain CSS, SASS or LESS. Automatic vendor prefixes come as standard.

Koa 2

Built-in web server with SSR

Bolster your SEO with SSR and improve user experiences with fast time-to-first-byte (< 10ms) with the performant Koa 2 web server, built in to your server bundle.

Super powers, as standard

ReactQL solves the tedious set-up code, so you can focus on what matters

Server-side rendering (SSR) 

GraphQL queries run on the server first, giving users and search engines rich HTML with data, markup and styles - with no configuration needed.

Built-in GraphQL + web server

Run a production-grade web server with one CLI command - dumps your React + GraphQL into plain HTML dynamically per request, with full client-side support.

Ultra-fast single page apps (SPA)

Navigating your site will be blistering fast, thanks to pre-loaded routes and async data loading. Obliterate full-page reloads and enjoy server-side rendering, to boot.

Built for dev + production

Enjoy full sourcemaps and hot code reloading in development. Then, when you're ready to go live, one CLI command builds a production-grade bundle.

Written in ES6

ReactQL is written in modern ES6 code with async/await and all the other goodies that Javascript now brings, with automatic polyfills thanks to babel-present-env.

Tree shaking / no dead code

Thanks to Webpack 3, ReactQL automatically eliminates unused code paths in your browser code, for minimal bundle sizes.

Hot code reloading

Freely edit React components, styles or other code in development, and watch changes happen in real-time in the browser - no refresh needed.

Aggressive minification

Your code, images and CSS will be minified to save every byte possible. Assets in production will be served gzipped, too.

Airbnb linting, tweaked

Built-in ESLinting in Atom.io, Sublime or any supported editor/IDE. Write in an Airbnb style, but without restricting async/await, generators, for..of loops and more.

Redux store de/rehydration

Redux data crunched on the server is sent down the wire to the browser, so your user can pick-up where your server finishes. Easily add your own Redux reducers, too.

Auto vendor splitting

Vendor code is automatically split from the code you write, making async route loading and caching fast and automatic. No need to maintain a separate vendor list.

The finer details, sorted

From HTTP hardening in Koa, to declarative <head> rewinds via Helmet, ReactQL gives you an optimised starter kit with all the finer details taken care of - freeing you to code.