After.js - Next.js-like framework for server-rendered React apps built with React Router 4

  •        61

Next.js is awesome. However, its routing system isn't for me. IMHO React Router 4 is a better foundation upon which such a framework should be built. Routes are just components and don't / should not have anything to do with folder structure. Static route configs are fine.

https://github.com/jaredpalmer/after.js#readme
https://github.com/jaredpalmer/after.js

Tags
Implementation
License
Platform

   




Related Projects

isomorphic-flux-boilerplate - ES7 Isomorphic Flux/ReactJS Boilerplate


A wonderfull boilerplate for Flux/ReactJS universal applications, running on koajs. Koa will be our server for the server side rendering, we use alt for our Flux architecture and react-router for routing in our app.

universal-router - A simple middleware-style router for isomorphic JavaScript web apps


A simple middleware-style router that can be used in both client-side (e.g. React, Vue.js) and server-side applications (e.g. Node.js/Express, Koa).Play with an example on JSFiddle, CodePen, JS Bin in your browser or try RunKit node.js playground.

react-app - Create React apps with server-side rendering and no build configuration


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.

react-dashboard - React Dashboard - isomorphic web dashboard template (React


built with React, Bootstrap, React Router (with Server Side Rendering!), Redux and GraphQL based on React Starter Kit and latest industry best practices.Demo. Use following credentials: user/password.

react-webpack-server-side-example - Example of an react application with webpack including server-side rendering


Example of an react application with webpack including server-side rendering.This is not for the normal user. This example is meant as inspiration to develop an framework that can do server-side rendering of react with webpack. You shouldn't use the code, only the idea.


rapscallion - Asynchronous React VirtualDOM renderer for SSR.


This function returns a Renderer, an interface for rendering your VirtualDOM element. Methods are enumerated below.This function evaluates the React VirtualDOM Element originally provided to the renderer, and returns a Promise that resolves to the component's evaluated HTML string.

js-stack-from-scratch - 🛠️⚡ Step-by-step tutorial to build a modern JavaScript stack.


Welcome to my modern JavaScript stack tutorial: JavaScript Stack from Scratch. This is a straight-to-the-point guide to assembling a JavaScript stack. It requires some general programming knowledge, and JavaScript basics. It focuses on wiring tools together and giving you the simplest possible example for each tool. You can see this tutorial as a way to write your own boilerplate from scratch. Since the goal of this tutorial is to assemble various tools, I do not go into details about how these tools work individually. Refer to their documentation or find other tutorials if you want to acquire deeper knowledge in them.

isomorphic-webpack - Abstracts universal consumption of application code base using webpack.


isomorphic-webpack is a program that runs server-side and enables rendering of the same code base client- and server-side. Put it another way, it is a service for rendering webpack applications server-side. All that can be rendered client-side (e.g. React, Angular, etc. applications) will be processed server-side and served as static HTML.

vue-ssr-starter-kit - Vue 2


A Vue.js project with vue 2.0, vue-router and vuex starter kit for server side rendering.

react-universal - React, redux, react-router, graphql, postgres, koa, universal starter-kit


A react starter kit that handles universal rendering as well as a bunch of another neat things. This is sort of a living spec for how I build web applications. react-relay, though the tools are included to get started with Relay, including the graphql backend, I've decided to not include the start of a Relay based front end until server-side rendering hooks are exposed [facebook/relay#136].

react-apollo - :recycle: React higher-order component for Apollo Client


React Apollo allows you to fetch data from your GraphQL server and use it in building complex and reactive UIs using the React framework. React Apollo may be used in any context that React may be used. In the browser, in React Native, or in Node.js when you want to server side render.React Apollo unlike many other tools in the React ecosystem requires no complex build setup to get up and running. As long as you have a GraphQL server you can get started building out your application with React immediately. React Apollo works out of the box with both create-react-app and React Native with a single install and with no extra hassle configuring Babel or other JavaScript tools.

universal-redux - An npm package that lets you jump right into coding React and Redux with universal (isomorphic) rendering


Universal Redux is an npm package that when used as a dependency in your project provides a universal (isomorphic) rendering server. You can either use its defaults and begin coding your project, or configure it to your liking with custom Webpack options and Express or Redux middleware. It's intended as both an easy starting point for developers new to React and Redux, as well as an extensible base by which advanced developers can augment with their own middleware and keep up to date with the fast-moving React ecosystem. The quickest way to get started is to clone the starter project. This gives you a base project that is set up with default configurations of Webpack and Express.

react-server-example - A simple example of how to do server-side rendering with React (no compilation needed)


A simple (no compile) example of how to do server-side rendering with the React library so that component code can be shared between server and browser, as well as getting fast initial page loads and search-engine-friendly pages.A more complex example with shared routing and data fetching can be found at react-server-routing-example.

prep - Pre-renders your web app (React, Vue, Angular,


Pre-renders your web app into static HTML based on your specified routes enabling SEO for single page applications.NOTE: prep is now based on Chromeless. We'll shortly release an updated version.

react-snap - 👻 Zero-configuration framework-agnostic static prerendering for SPAs


Pre-renders web app into static HTML. Uses headless chrome to crawl all available links starting from the root. Heavily inspired by prep and react-snapshot, but written from scratch. Uses best practices to get best loading performance. Zero configuration is the main feature. You do not need to worry how does it work or how to configure it. But if you are curious here are details.

vidom - Library to build UI based on virtual DOM


Vidom is just a library to build UI. It's highly inspired from React and based on the same ideas. Its main goal is to provide as fast as possible lightweight implementation with API similar to React. Try live playground to play with Vidom in your browser.

razzle - ✨ Create server-rendered universal JavaScript applications with no configuration


Universal JavaScript applications are tough to setup. Either you buy into a framework like Next.js or react-server, fork a boilerplate, or set things up yourself. Aiming to fill this void, Razzle is a tool that abstracts all complex configuration needed for SSR into a single dependency--giving you the awesome developer experience of create-react-app, but then leaving the rest of your app's architectural decisions about frameworks, routing, and data fetching up to you. With this approach, Razzle not only works with React, but also Reason, Elm, Vue, Angular, and most importantly......whatever comes next.Below is a list of commands you will probably find useful.

blog - All the sources for my (not powered by React anymore) blog


This is the raw source for my blog, jlongster.com. I don't experiment with new libraries here anymore. In fact, sadly, this does not use React anymore. If you are looking for my blog that supports server-side rendering with react, redux, and react-router, check out the react-blog branch.