
Template details
RAN
RAN is a production-ready React, GraphQL, and Next.js boilerplate toolkit with SSR, SEO, hot-reload, and CLI commands.
About this template
RAN is a production-ready boilerplate toolkit that combines React, GraphQL, and Next.js with server-side rendering, SEO support, hot-reload, and CLI commands for generating pages.
What is RAN?
RAN (React . GraphQL . Next.js Toolkit) is an open-source boilerplate for building universal web applications with React and GraphQL. It scaffolds a project with Apollo Client, Redux, styled-components, and Next.js, and outputs a ready-to-deploy application. The project is created by Ilker Guller, versioned with SemVer, and released under the MIT license.
Key Features
- Hot-Reload Ready — the development server supports hot reloading so changes appear instantly.
- Next Generation JavaScript — uses ES6+ syntax with Babel.
- Offline Ready (Experimental) — includes experimental offline-first support.
- CSS-in-JS — styled-components is integrated for component-scoped styling.
- CLI Page Generator — a single command creates a new page with its corresponding route.
- SEO-Ready — server-side rendering and meta tag handling are preconfigured.
- Deployment-Ready — configured for Now, Digital Ocean, Heroku, and AWS.
- Code Quality — Prettier and ESLint are integrated.
Who is it for?
- Developers starting a React/GraphQL app — they can skip manual setup and use a preconfigured stack.
- Teams needing SEO-friendly server-rendered sites — SSR and SEO features are included.
- Prototypers and early-stage startups — the CLI generates pages quickly and deployment targets are provided.
What can you do with RAN?
- Generate pages with routes — run the CLI command to create a new page and route without writing boilerplate files.
- Deploy to multiple cloud platforms — use the provided configuration to deploy to Now, Digital Ocean, Heroku, or AWS.
- Start coding in the browser — use the Glitch remix button to fork the project and code online.
How does RAN work?
Clone the repository with git clone --depth=1 https://github.com/Sly777/ran.git, install dependencies with yarn && yarn setup (or npm install && npm run setup), then start the dev server with yarn dev. For a clean project without example pages, run yarn setup:clean; a separate beta branch is also available for pre-release features.
FAQ
Is RAN free?
Yes, RAN is open source under the MIT license, so it is free to use and modify for personal and commercial projects.
What is the beta branch for?
The beta branch contains new features and fixes being tested before release. It is unstable and not recommended for production use.
What GraphQL service does the example use?
The example project on ran.now.sh uses graph.cool as the GraphQL backend and is hosted on now (Zeit).
Where can I find documentation?
Documentation is available at rantoolkit.com, and the repository includes separate docs for commands, FAQ, and contributing.















