All Projects → evilquail → ssr

evilquail / ssr

Licence: other
React Server-Side Rendering Example

Programming Languages

javascript
184084 projects - #8 most used programming language
CSS
56736 projects

Projects that are alternatives of or similar to ssr

Ssr
React Server-Side Rendering Example
Stars: ✭ 226 (-14.72%)
Mutual labels:  ssr, rendering, react-redux
react-ssr
从零搭建一个react-ssr框架 解决页面js事件 样式同构 服务器客户端路由 数据注水脱水等问题
Stars: ✭ 42 (-84.15%)
Mutual labels:  ssr, react-redux
Typescript Hapi React Hot Loader Example
Simple TypeScript React Hot Loading example with Hapi Server-side rendering
Stars: ✭ 44 (-83.4%)
Mutual labels:  ssr, react-redux
Hapi React Hot Loader Example
Simple React Hot Loading example with Hapi Server-side rendering
Stars: ✭ 44 (-83.4%)
Mutual labels:  ssr, react-redux
prax
Experimental rendering library geared towards hybrid SSR+SPA apps. Focus on radical simplicity and performance. Tiny and dependency-free.
Stars: ✭ 18 (-93.21%)
Mutual labels:  ssr, rendering
Dva Starter
完美使用 dva react react-router,最好用的ssr脚手架,服务器渲染最佳实践
Stars: ✭ 60 (-77.36%)
Mutual labels:  ssr, react-redux
isomorphic-react-redux-saga-ssr
Isomorphic, React, Redux, Saga, Server Side rendering, Hot Module Reloading, Ducks, Code Splitting
Stars: ✭ 19 (-92.83%)
Mutual labels:  ssr, react-redux
boss-lite
Boss Lite - React Redux Material Admin Template
Stars: ✭ 148 (-44.15%)
Mutual labels:  ssr
keynote-react-ssr
[AWS Community Day 2020] React.js SSR on AWS Demo
Stars: ✭ 54 (-79.62%)
Mutual labels:  ssr
react-coat-ssr-demo
Demo with Typescript + React + Redux for server-side-rendering (SSR)
Stars: ✭ 100 (-62.26%)
Mutual labels:  ssr
graduation-web
A PWA for the community of students of CEIT Department at Amirkabir U of Technology (Class of 2018)
Stars: ✭ 25 (-90.57%)
Mutual labels:  ssr
react-ssr-starter
📚 Featuring Webpack 4, React 17-18, SSR, HMR, prefetching, universal lazy-loading, and more
Stars: ✭ 18 (-93.21%)
Mutual labels:  ssr
webpack-isomorphic-compiler
A compiler that makes your life easier if you are building isomorphic webpack powered apps, that is, single page applications with server-side rendering
Stars: ✭ 16 (-93.96%)
Mutual labels:  ssr
elegant-react-ssr
Server-side rendering with create-react-app, React Router v4, Helmet, Redux, and Thunk boilerplate, without ejecting CRA
Stars: ✭ 16 (-93.96%)
Mutual labels:  ssr
SLProject
SLProject is a platform independent 3D computer graphics scene graph library. Read more on:
Stars: ✭ 47 (-82.26%)
Mutual labels:  rendering
book-fullstack-react
Fullstack React: The Complete Guide to ReactJS and Friends by Anthony Accomazzo
Stars: ✭ 100 (-62.26%)
Mutual labels:  react-redux
admin-template-for-react
🌏 Admin template for React, React Redux, Redux Saga, React Router, i18n and integrated OAuth login
Stars: ✭ 83 (-68.68%)
Mutual labels:  react-redux
react-candee
A react framework that encapsulates the redux.
Stars: ✭ 30 (-88.68%)
Mutual labels:  react-redux
Auxilium
Emergency reporting app.
Stars: ✭ 29 (-89.06%)
Mutual labels:  react-redux
eshop
e-commerce website built with reactjs & redux on the frontend and lumen on the backend.
Stars: ✭ 27 (-89.81%)
Mutual labels:  react-redux

React Server-Side Rendering Example

Above is an example playground for you to play with React & Redux on Client and Server sides. Before jumping into it, make sure to read SSR tutorial on Freecodecamp (Outdated).

Here’s what we will build in this tutorial:

Clash of Clans app card

Development

  • Clone the repo:
$ git clone https://github.com/Rohitkrops/ssr.git
  • Go to the project directory and install dependencies:
$ cd ssr && yarn install

Launch the server:

$ yarn start

Now, the application is running at http://localhost:3000. The homepage is Sever Rendered and '/client' is client side rendered.

Note

This tutorial is to help you understand the concept behind server side rendering of a React application. Don't use this in Production.

For that use mature solutions, I would recommend Next.js

🥳

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].