Skip to content

[DEPRECATED] Server-side rendering with create-react-app, React Router v4, Helmet, Redux, and Thunk

Notifications You must be signed in to change notification settings

cereallarceny/cra-ssr

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

41 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Deprecation notice

It didn't take long. The web has grown a lot since I first developed this project. Lo and behold Jared Palmer has beat me to it. I'm going to shut down shop at cra-ssr in favor of a better solution: Razzle.

To anyone looking to use cra-ssr, I highly suggest you check out Razzle instead.


Server-side rendering in Create React App

SSR with all the goodies, without ejecting.

Goals

  • Zero modifications to your existing CRA application
  • Create React App without ejecting
  • React 16 (fiber, baby!)
  • React Router v4 (with Thunk)
  • Full SEO support via React Helmet
  • Preloaded page data via async/await and React Frontload
  • Code splitting via React Loadable
  • Server-side cookie support

Examples

  • Multiple pages (/, /about)
  • User-specific pages with preloaded data set on a timeout to fake an API call (/profile/1, /profile/2)
  • Basic authentication with cookie storage (/login, /dashboard, /logout)
  • Not found (404, etc.) page

Installation

  1. Install dependencies via yarn install
  2. To run locally, use yarn start
  3. To run under SSR mode, use yarn build && yarn serve

Why?

Server-side rendering is a requirement for many modern web applications to appear correctly in search engines and social media parsers.

Question: Have you ever created a web application with multiple pages only to find out that your meta descriptions weren't page specific?
Answer: Server-side rendering

Question: Have you ever created a web application where users had individual profile pages that required pre-loading of metadata?
Answer: Server-side rendering

Question: Have you ever created a web application with a lot of content on your page that ends up taking a long time for your users to load in poor Internet conditions?
Answer: Server-side rendering

Contribute

Do what you normally do - fork and PR.

About

[DEPRECATED] Server-side rendering with create-react-app, React Router v4, Helmet, Redux, and Thunk

Resources

Stars

Watchers

Forks

Releases

No releases published

Sponsor this project

 

Packages

No packages published