markdown-body entry-content container-lg" itemprop="text">

React Snapshot Server

📸 A zero-configuration server that serves server-rendered snapshots of Create React App

About

React Snapshot Server is a server based on zeit/micro that creates snapshots from your Create React Apps on the fly. This is done by running the application on the server in jsdom and saving the HTML in a snapshot. The snapshot is then saved and is valid for a given period of time, after that if the page is requested again a new snapshot will be generated.

Starting the server

You can start the server by running node node_modules/react-snapshot-server/bin/cli.js. To make this easier you can open up your package.json and add the following script

  "scripts": {
    ...
    "serve": "react-snapshot-server"
    ...
  },

Options

You can use the following options.

Usage: react-snapshot-server [options] [command]

Commands:

  help  Display help

Options:

  -P, --path [value]  The path to the build directory (defaults to "build")
  -p, --port <n>      The port on which the server will be running (defaults to 3000)
  -v, --validity      Time in minutes that a snapshot is valid (defaults to 10)

Installing

Install React Snapshot Server by running yarn add react-snapshot-server -D

React Snapshot Server works almost out of the box with zero configuration if you use Create React App we do require a few little changes, but it only takes a few seconds work!

Open up your src/index.js file. and replace

- import ReactDOM from 'react-dom';
+ import { render } from 'react-snapshot-server';

- ReactDOM.render(<App />, document.getElementById('root'));
+ render(App, document.getElementById('root'));

and that's it, you now have server side rendering!

Versioning

We use SemVer for versioning. For the versions available, see the tags on this repository.

Authors

Robert van Steen

See also the list of contributors who participated in this project.

License

This project is licensed under the MIT License - see the LICENSE.md file for details

Acknowledgments

next.js for server rendering inspiration.
micro for awesome async http microservice
react-snapshot for the idea of snapshotting as server rendering.
create-react-app for a react app up and running in seconds.

scrnhq/react-snapshot-server

ErrorLooks like something went wrong!

About

Topics

Resources

Uh oh!

Stars

Watchers

Forks

Releases 2

Packages 0

Uh oh!

Languages

Error
Looks like something went wrong!

Packages