SYNTH

The first back-end framework specially designed for single-page web applications.

Current status

Version 0.6.1 (latest):

Note: Despite being fully functional, synth is still in beta. It hasn't been fully tested in production and since it's in active development, implementation and interface details are likely to change.

Synth is an API-first web app framework (built on NodeJS) that provides the following features:

• Easily create new RESTful API resources by just creating folders and naming functions a certain way.
• Preload angular model data on page load (saving an extra roundtrip).
• Preload html view on page load (saving another extra roundtrip!)
• A simplified project structure where front-end code (angular code, html, css, bower packages, etc) is in the 'front' folder and back-end code (node code and node packages) are in the 'back' folder.
• A command-line tool for installing third party packages, using npm + bower, that auto-updates manifest files.
• Auto compilation of assets on request for dev, and pre-compilation for prod (including minification and ng-annotate).
• Auto-restarts the server when changes are detected.
• Support for various back-end and front-end templates to help get a new project going quickly.

Documentation + Tutorial

For complete up-to-date documentation, tutorials, and example apps, check out synthjs.com.

Components

While Synth is an opinionated framework that provides everything you need to make a great web app, parts of it are available to be used by existing web apps:

• synth-api – Easily generate a back-end JSON API for Express based on your app's directory structure.
• synth-di – The dependency-injection library used by synth-api.
• apiPrefetch.js - Used to take advantage of api prefetching on the front-end.
• heroku-buildpack-synth - Use this buildpack to easily deploy Synth apps on Heroku or other compatible cloud hosting platforms.

Sample App

Blurbs Live Demo - Source

License

MIT

Credit

• This project was created by Jon Abrams (Twitter | GitHub).
• Thanks to Katie Lefevre for the logo.
• Thanks to Stephen Ausman (aka stackd) for handing over control of the 'synth' package on NPM.