All Projects → RyanLamansky → react-redux-typescript-dotnet-core-ssr-hmr

RyanLamansky / react-redux-typescript-dotnet-core-ssr-hmr

Licence: Apache-2.0 license
React + Redux + TypeScript + .NET Core + Server-Side Rendering (SSR) + Hot Module Replacement (HMR)

Programming Languages

typescript
32286 projects
javascript
184084 projects - #8 most used programming language
C#
18002 projects
CSS
56736 projects
HTML
75241 projects

Projects that are alternatives of or similar to react-redux-typescript-dotnet-core-ssr-hmr

zero
Zero is a web server to simplify web development.
Stars: ✭ 5,835 (+34223.53%)
Mutual labels:  hmr, ssr
react-kits
⚔️ Opinionated Fullstack React toolkits featuring project generation, dev server, build production bundle, and common dev-tools. This is simple DIY create-react-app.
Stars: ✭ 13 (-23.53%)
Mutual labels:  hmr, ssr
react-ssr-starter
📚 Featuring Webpack 4, React 17-18, SSR, HMR, prefetching, universal lazy-loading, and more
Stars: ✭ 18 (+5.88%)
Mutual labels:  hmr, ssr
React Firebase Starter
Boilerplate (seed) project for creating web apps with React.js, GraphQL.js and Relay
Stars: ✭ 4,366 (+25582.35%)
Mutual labels:  hmr, ssr
Aspnetcore Angular Universal
ASP.NET Core & Angular Universal advanced starter - PWA w/ server-side rendering for SEO, Bootstrap, i18n internationalization, TypeScript, unit testing, WebAPI REST setup, SignalR, Swagger docs, and more! By @TrilonIO
Stars: ✭ 1,455 (+8458.82%)
Mutual labels:  hmr, ssr
Ts React Boilerplate
Universal React App with Redux 4, Typescript 3, and Webpack 4
Stars: ✭ 104 (+511.76%)
Mutual labels:  hmr, ssr
Webpack Hot Server Middleware
🔥 Hot reload webpack bundles on the server
Stars: ✭ 319 (+1776.47%)
Mutual labels:  hmr, ssr
Koa React Universal
lightweight React-Koa2 universal boilerplate, only what is essential
Stars: ✭ 112 (+558.82%)
Mutual labels:  hmr, ssr
Reeakt
A modern React boilerplate to awesome web applications
Stars: ✭ 116 (+582.35%)
Mutual labels:  hmr, ssr
react-auth-kit
universal react app with flux, altjs, passportjs and server side rendering
Stars: ✭ 21 (+23.53%)
Mutual labels:  ssr
laratron
🖼Laravel SSR using Rendertron 🖼
Stars: ✭ 28 (+64.71%)
Mutual labels:  ssr
angular-universal-firebase
angular-universal-firebase.firebaseapp.com/
Stars: ✭ 30 (+76.47%)
Mutual labels:  ssr
ultimate-backend-dashboard
ultimate react ssr starter kit is a boilerplate strapped with Apollo graphql support and alot of goodies based on FusionJS
Stars: ✭ 19 (+11.76%)
Mutual labels:  ssr
vue-ssr-blog-client
vue ssr的多用户blog前端部分---目前还有部分功能未完成。务必看完下面的提示说明。在线预览
Stars: ✭ 15 (-11.76%)
Mutual labels:  ssr
react-redux-immutable-webpack-ssr-starter
React + React-Router 4 + Redux + ImmutableJS + Bootstrap + webpack 3 with with Server side rendering, Hot Reload and redux-devtools STARTER
Stars: ✭ 21 (+23.53%)
Mutual labels:  ssr
udao
🎒 Youdao translate base Angular 11(angular&ssr)
Stars: ✭ 60 (+252.94%)
Mutual labels:  ssr
core
🚀Fast, 💎Lightweight Angular alternative with the same modern API thats compile directly to WebComponents
Stars: ✭ 49 (+188.24%)
Mutual labels:  ssr
personal-website
Personal website – made with Next.js, Preact, MDX, RMWC, & Vercel
Stars: ✭ 16 (-5.88%)
Mutual labels:  ssr
isomorphic-react-redux-saga-ssr
Isomorphic, React, Redux, Saga, Server Side rendering, Hot Module Reloading, Ducks, Code Splitting
Stars: ✭ 19 (+11.76%)
Mutual labels:  ssr
luci-app-vssr
A new SSR SS V2ray Trojan luci app bese luci-app-ssr-plus
Stars: ✭ 22 (+29.41%)
Mutual labels:  ssr

React + Redux + TypeScript + .NET Core + Server-Side Rendering (SSR) + Hot Module Replacement (HMR)

A sample project combining a variety of useful web development technologies originally shown to work together with .NET Core 2.0's dotnet new reactredux, but updated for .NET Core 2.1 and newer versions of various libraries.

Background

When .NET Core 2.0 was released, it included an excellent project template that combined React and Redux for the front end, .NET Core for the web API, with support for both server-side rendering (SSR) and hot module replacement (HMR). It was amazing!

When .NET Core 2.1 was released, this template was replaced by a much more primitive one that lacked SSR and HMR.

About this Project

This repository aims to preserve the useful feature set of the original .NET Core 2.0 template while keeping the client and server-side libraries up to date. It is not in any way endorsed or supported by Microsoft, but it may prove useful to others who want this combination for their own projects.

Besides updating to newer versions of dependencies, it has been modified in the following ways:

  • JQuery and Bootstrap have been replaced by hand-crafted SCSS and JavaScript, reducing bundle size considerably.
  • The separate "vendor" JavaScript bundle has been removed; it had several negative side effects that weren't worth the gains.
  • Code quality has improved through use of newer TypeScript features.
  • Some newer React features have been applied.

If time permits, the project will continue to be updated and improved (I use it for a lot of my own projects!), but there are no specific plans.

Deviance

This project has a few characteristics that some might consider... unnatural.

  • Not many React projects use TypeScript, Facebook strongly prefers the much less popular "Flow" while most general React users seem to go without any compile-time type checking.
  • It's almost unheard of for a React project to be built without Babel, and yet this one does with no functionality loss.
  • Although React has excellent server-side rendering support, I haven't seen many project templates use it, so it's somewhat of a dark art for many people.

IDE Compatibility

Tested on Visual Studio 2017, 2019, and Code. It has no Windows dependencies and is relatively low complexity, so it should work with a variety of IDEs and operating systems.

Structure

  • Solution.sln is the entry point for "classic" editions of Visual Studio (Pro, Community, etc).
  • WebUI/WebUI.csproj is a suitable starting point for Visual Studio Code.
  • WebUI/Startup.cs the entry point for the .NET code.
  • WebUI/ClientApp contains all of the front-end script, including entry points for client and server side.
  • WebUI/Controlers are conventional ASP.NET MVC-style controllers.
  • WebUI/Views are conventional ASP.NET MVC-style views used to set up the general HTML environment for React to use.

Troubleshooting

  • Visual Studio may not restore NPM packages on startup, fix by running npm install manually or by expanding Dependencies and right-clicking "npm" and choosing Restore Packages.

Known Issues

  • This project currently uses the abandoned "react-router-redux" package, which will need to be replaced.
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].