Starter kit code (Javascript version)

React+GraphQL front-end starter kit. Universal: Browser + SSR.

Typescript version also available.

Want to install quickly? Use the CLI - it does the heavy lifting for you.

Features

Stack

ReactQL CLI for quickly starting a new project
React for UI
Apollo Client (React) for GraphQL
React Router 4 for declarative browser + server routes
Redux for flux/store state management

Server-side rendering

Built-in Koa 2 web server, with async/await routing
Full route-aware server-side rendering (SSR) of initial HTML
Universal building - both browser + Node.js web server
HTTP header hardening with Helmet for Koa
Declarative/dynamic <head> section, using react-helmet

Real-time

Dev + React-compatible hot code reloading; zero refresh, real-time updates
Development web server that automatically rebuilds and restarts on code changes, for on-the-fly SSR testing with full source maps

Code optimisation

Webpack 2, with tree shaking
Universal building - both browser + Node.js web server
Easily extendable webpack-config files
Production bundling, for generating optimised server and client code
Static bundling mode for hosting your full app on any static host -- Github pages, S3, Netlify, etc
Separate local + vendor bundles, for better browser caching/faster builds
Dynamic polyfills, courtesy of babel-preset-env
Aggressive code minification with Uglify
GIF/JPEG/PNG/SVG crunching for images
Static compression using the Zopfli Gzip and Brotli algorithms for the serving of static assets as pre-compressed .gz and .br files

Styles

PostCSS v6 with next-gen CSS and inline @imports
SASS and LESS support (also parsed through PostCSS)

Developer support

ESLinting based on a tweaked Airbnb style guide
Tons of code commentary to fill you in on what's happening under the hood
Extensive, up-to-date online documentation
Examples repository, showing you how to add a GraphQL server, run without GraphQL, take advantage of Redux, etc.

Usage

See the CLI tool for easily deploying this starter kit on Mac, Windows or Linux.

Complete documentation @ https://reactql.org

New to GraphQL?

Watch my free 45 minute YouTube video, for a live coding walk-through of putting together a GraphQL server with a database. Learn how to write queries, mutations and handle nested/related data.

If you want to build your own GraphQL server, check out the GraphQL Server repo in examples.

SauliusB/kit