https://github.com/gourmetjs/gourmet-ssr

A React Server-Side Rendering Engine for Production
https://github.com/gourmetjs/gourmet-ssr

code-splitting isomorphic nextjs react server-rendering ssr universal webpack

Last synced: 27 days ago
JSON representation

A React Server-Side Rendering Engine for Production

• Host: GitHub
• URL: https://github.com/gourmetjs/gourmet-ssr
• Owner: gourmetjs
• License: mit
• Created: 2018-03-06T08:56:22.000Z (over 6 years ago)
• Default Branch: master
• Last Pushed: 2019-03-28T18:36:56.000Z (over 5 years ago)
• Last Synced: 2024-05-08T05:34:15.547Z (2 months ago)
• Topics: code-splitting, isomorphic, nextjs, react, server-rendering, ssr, universal, webpack
• Language: JavaScript
• Homepage: https://ssr.gourmetjs.org
• Size: 4.93 MB
• Stars: 47
• Watchers: 4
• Forks: 2
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Lists

• awesome-repositories - gourmetjs/gourmet-ssr - A React Server-Side Rendering Engine for Production (JavaScript)

README

        


  

    

  





  

    

  

  

    

  

  

    

  

  

    

  

  

    

  

  

    

  

  

    

  

  

    

  



## Introduction

- **Library, not Framework** - Gourmet SSR is designed to be used as a view library in your existing project. We worked very hard to make Gourmet SSR unobtrusive.

- **Production First** - Small footprint at runtime, chunked transfer, long-term caching, HTTP/2 optimized bundling and much more. Production is always the number one priority of Gourmet SSR.

- **Human Friendly** - Developers are humans too. When we a new feature, the first thing we consider is how to make it easy to understand and use - just like we do for the consumer products.

- **Flexible** - Gourmet SSR can be deployed as an in-process VM sandbox, a separate process, a remote HTTP cluster or an AWS Lambda function. Your server can be Django or Rails. The view layer is not limited to React.

## Quick Overview

> You write the user interface without complicated bootstrapping or boilerplate. It is just a plain tree of React components.

```js

// hello.js

import React from "react";

export default function Hello({greeting}) {

  return 
{greeting}
;

}

```




> Configuration is designed to be minimal, but not to the level of "magic". Here, we specify the above React component as a root component of the `main` page.

```js

// gourmet_config.js

module.exports = {

  pages: {

    main: "./hello.js"

  }

};

```




> Gourmet SSR is just a view library in your server. This is how you render and serve the `main` page.

```js

// server.js

const express = require("express");

const gourmet = require("@gourmet/client-lib");

const app = express();

app.use(gourmet.middleware());

app.get("/", (req, res) => {

  res.serve("main", {greeting: "Hello, world!"});

});

app.listen(3000, () => {

  console.log("Server is listening on port 3000");

});

```




> The content is rendered on the server-side and rehydrated on the client-side.

> Required assets are also linked statically.

>

> The HTML output has all the elements it needs to render the initial user interface - which is great for SEO and user experience.

```html

$ curl http://localhost:3000

  

    

    

  

  

    
Hello, world!

    window.__gourmet_data__={"renderedLoadables":[],"clientProps":{"greeting":"Hello, world!"},"reactClientRender":"hydrate"};

  


```

## Documentation

Learn more about using [Gourmet SSR on the official website](https://ssr.gourmetjs.org).

- [Getting Started](https://ssr.gourmetjs.org/docs/getting-started)

- [Tutorial](https://ssr.gourmetjs.org/docs/tutorial-1)

## License

Gourmet SSR is open source software [licensed as MIT](https://github.com/gourmetjs/gourmet-ssr/blob/master/LICENSE).