wardpeet/tessellate

Server-side React render service.

Server-side React render service.   

What is Tessellate?

Tessellate is a server-side React service that creates static HTML and a JavaScript bundle from abstract JSON definitions. It is meant to be used as a Fragment as part of the Mosaic stack for micro services in the frontend but can be used independently as well.

Package	Description	Version
tessellate-bundler	Builds universal React bundles from JSON.
tessellate-fragment	Dynamic server-side React render service.
tessellate-bundler	Common service foundation for editor and bundler.
tessellate-editor	Experimental editor for composing reusable components.
tessellate-viewer	Experimental layout service for composing Mosaic fragments.
tessellate-transform	Experimental JSON transformation tool.

Dynamic fragments

A Mosaic Fragment is a web service that provides some partial HTML, CSS and JavaScript. Multiple Fragments can be composed into a complete web page by the Tailor layout service. Tessellate is an opinionated implementation of such a Fragment.

tessellate-fragment responds to incoming requests based on a customizable^* logic and uses React to render precompiled JavaScript bundles into static HTML. tessellate-bundler compiles those bundles ahead of time based on an abstract JSON document and with the help of webpack. We call this a dynamic Fragment because the bundles can be updated independetly from the Fragment and because they are selected dynamically for each request.

Tessellate offers a simple yet powerful solution to integrate content providers into a Mosaic stack for micro services in the frontend. Instead of implementing specialized Fragments to render different parts of a website, you can simply transform all your content into precompiled JavaScript bundles that Tessellate knows how to render. Please read the architecture overview to learn more.

^* subject to ongoing development

Installation

The Tessellate micro services can easily be installed as Node modules:

npm i --save tessellate-bundler tessellate-fragment

Configuration

Each micro service reads configuration from environment variables, command line arguments or a file. See each subproject for details.

Development

Tessellate requires Node.js >= 7.6 and uses Lerna for managing packages. Run the following commands in the root directory to get started:

npm install   # Install dependencies and initialize packages.
npm run dist  # Compile all packages.

We recommend using Atom text editor together with the Nuclide plugin and Flow for static type checking.

Here's how to install Nuclide (requires Atom) and Flow:

apm install nuclide
npm install -g flow-bin

Contributing

For details on pull requests, commit messages and conditions for contributing please see CONTRIBUTING.md

Documentation

Go to zalando-incubator.github.io/tessellate for detailed documentation.

License

MIT