React App

Create React App with server-side code support
Alternatives To React App
Project NameStarsDownloadsRepos Using ThisPackages Using ThisMost Recent CommitTotal ReleasesLatest ReleaseOpen IssuesLicenseLanguage
React App Rewired9,4042,5329973 months ago75February 15, 202213mitJavaScript
Override create-react-app webpack configs without ejecting
Scaffold Eth8,545
2 days ago60mitCSS
🏗 forkable Ethereum dev stack focused on fast product iterations
a year agobsd-3-clauseJavaScript
A Beautiful Open Source RSS & Podcast App Powered by
Craco6,97118733313 days ago72July 07, 202224apache-2.0TypeScript
Create React App Configuration Override, an easy and comprehensible configuration layer for Create React App.
Create React Library4,78472316 days ago50June 01, 2020125JavaScript
CLI for creating reusable react libraries.
React Gh Pages4,769
9 days ago22TypeScript
Deploying a React App (created using create-react-app) to GitHub Pages
React Firebase Starter4,44722 months ago25July 22, 2016135mitJavaScript
Boilerplate (seed) project for creating web apps with React.js, GraphQL.js and Relay
Create React App Typescript3,76914 years ago4January 25, 2018119JavaScript
DEPRECATED: Create React apps using typescript with no build configuration.
Serverless Stack Com3,654
a day ago122mitSCSS
An open source guide for building and deploying full-stack apps using Serverless and React on AWS.
Create React App Buildpack3,328
9 months ago14mitShell
⚛️ Heroku Buildpack for create-react-app: static hosting for React.js web apps
Alternatives To React App
Select To Compare

Alternative Project Comparisons

React App SDK

Everything you love about Create React App plus server-side code support (SSR, GraphQL API, etc) and config overrides (Babel, Webpack, etc.). See the demo project.

React App SDK is intended to be used as a drop-in replacement for react-scripts NPM module. If you want to add server-side code into your application built with Create React App, all you have to do is to replace react-scripts dev dependency with react-app-tools plus provide one more entry point for Node.js as demonstrated below:

Directory Layout

├── build/                      # Compiled output
├── src/                        # Universal application source code
│   ├── components/             # Shared React.js components
│   │   ├── /App/               #   - The top-level React component
│   │   ├── /Button/            #   - Some other UI element
│   │   └── ...                 #   - etc.
│   ├── server/                 # Node.js app
│   │   ├── ssr.js              #   - Server-side rendering, e.g. ReactDOMServer.renderToString(<App />)
│   │   ├── api.js              #   - GraphQL API endpoint
│   │   └── index.js            #   - Node.js app entry point
│   └── index.js                # Client-side app entry point, e.g. ReactDOM.hydrate(<App />, container)
└── package.json                # List of project dependencies and NPM scripts


  "main": "build/server.js",
  "engines": {
    "node": ">=8.10"
  "dependencies": {
+   "express": "^4.6.14",
    "react": "^16.8.4",
    "react-dom": "^16.8.4"
  "devDependencies": {
-   "react-scripts": "^1.1.1"
+   "react-app-tools": "^3.1.0-preview.7"
  "scripts": {
-   "start": "react-scripts start",
+   "start": "react-app start",
-   "build": "react-scripts build",
+   "build": "react-app build",
-   "test": "react-scripts test"
+   "test": "react-app test"

src/index.js - Client-side rendering

import React from 'react';
import ReactDOM from 'react-dom';
import App from './components/App';

ReactDOM.hydrate(<App />, document.getElementById('root'));

src/server/index.js - Server-side rendering and/or API endpoint

const path = require('path');
const express = require('express');
const React = require('react');
const ReactDOMServer = require('react-dom/server');
const App = require('../components/App');
const stats = require('./stats.json');

const app = express();

app.get('*', (req, res) => {
        <div id="root">${ReactDOMServer.renderToString(<App />)}</div>
          src => `<script src="${src}"></script>`

if (process.env.NODE_ENV === 'production') {
  app.listen(process.env.PORT || 8080);
} else {
  module.exports.default = app;

You can launch the app in development mode by running:

$ npm install
$ npm start

Then open http://localhost:3000/ to see your app.
When you’re ready to deploy to production, create a minified bundle with npm run build.

npm start

For more information refer to Create React App documentation:

Join our Telegram chat for support and feature requests -

Server-side rendering with React.js
How fast is React SSR?

How to Customize

Create webpack.config.js file in the root of your project that extends the default Webpack configuration. For example:

module.exports = () => {
  const [
  ] = require('react-app-tools/config/webpack');
  return [
      plugins: {
          new LimitChunkCountPlugin({ maxChunks: 1 })


Love React App SDK? Help us keep it alive by donating funds to cover project expenses!


Help shape the future of React App SDK by joining our community today, check out the open issues, submit new feature ideas and bug reports, send us pull requests!


MIT © 2016-present Facebook, Kriasoft.

Popular Reactjs Projects
Popular Create React App Projects
Popular Web User Interface Categories
Related Searches

Get A Weekly Email With Trending Projects For These Categories
No Spam. Unsubscribe easily at any time.
Single Page Applications
Server Side Rendering
Create React App
Graphql Js
React Starter Kit