Assemble.io is a static site generator and rapid prototyping framework. It has some great features like middleware, Gulp support and Handlebars templating engine…

Assemble’s default templating engine is Handlebars. This allows you to treat your data or content written in json as your logic-less model.

Keeping your templates separate from content. It binds this data to your template. Outputting the combined static html. It also split’s your static site up in to layouts, partials and pages. A fantastic way to build reusable components and separate concerns.

Content

{
    "title": "My New Post",
    "content": "This is my first post!"
}

Template

<article class="post">
    <h1>{{title}}</h1>
    <div class="post__content">
        {{ content }}
    </div>
</article>

Content + Template = Output

<article class="post">
    <h1>My New Post</h1>
    <div class="post__content">
        This is my first post!
    </div>
</article>

Getting started

Assemble has been built using many of the same packages as Gulp so you can integrate it in to your build pipeline. Here’s my gulpfile.js example:

var assemble = require('assemble')();
var flatten  = require('gulp-flatten');
var extname  = require('gulp-extname');
var plumber  = require('gulp-plumber');

gulp.task('assemble', function() {
  //Set main assemble options
  assemble.option('layout', 'default');
  assemble.partials('src/templates/partials/**/*.hbs');
  assemble.layouts('src/templates/layouts/*.hbs');
  assemble.pages('src/templates/pages/**/*.hbs');
  assemble.data('src/templates/{pages,partials,data}/**/*.json');
  assemble.helpers('src/templates/helpers/**/*.js')

  // push "pages" collection into stream
  return assemble.toStream('pages')
      // render pages with default engine (handlebars)
      .pipe(assemble.renderFile())
      .pipe(flatten())
      .pipe(extname())
      .pipe(plumber())
      // specify your output
      .pipe(assemble.dest('dist'));
});

Conclusion

If you are looking for a way to build static templates, keeping your data and templates separate. Then Assemble is a great out of the box solution.

Assemble has a steeper learning curve compared to other generators like Jekyll or Hugo. I found the documentation frustrating and building complex components a real challenge. It’s easy for your files to become hard to read with various logic included in to the template.

If I had to create some static files from json in the future I would look at just using Handlebars.