background preloader

Reviews & Contrib Guides

Facebook Twitter

The Middleman. A modular, feature-rich static site generator « Thomas Reynolds. The Middleman. A modular, feature-rich static site generator Update: Middleman version 2.0 has been releasedUpdate: Middleman version 1.1 has been releasedUpdate: New Middleman Support Forum Developing large sites can be a tedious process. First of all, a large portion of each page will contain some amount of shared code. You have site-wide navigation, footers, javascript and CSS. Within those sections you may have other common data such as color schemes, asset paths and tracking codes. Experienced developers will see this problem coming from a mile away and start the project with site-wide constants and common components separated into their own reusable files.

The two most common approaches I've encountered are to develop every page statically with shared components repeated in each and every file. These approaches have a couple problems. Existing solutions The Ruby world already has a handful of tools which accomplish this. Nanoc, on the other hand, looks very, very powerful. Middleman.

Middleman + Github Pages == Static Site Bliss. Julie Pagano - Site Redesign Using Middleman. I finally redesigned my site and moved it over to a static site generated using Middleman and hosted using Github pages. I thought I would share a little bit about my process in case it helps anyone else going through the same thing. You can find the repository for my project on Github. Feel free to use it as a detailed reference for what I did, but don’t judge too harshly for the code quality. This was something I slapped together during some spare time, and it is not a good example of best practices. Background Previously, my site lived on a locally hosted server with WordPress and a poorly hacked up custom theme.

I admit to being a WordPress novice, so this is probably on me. Picking a static site generator A static site generator is pretty much exactly what it sounds like. There are approximately a bazillion different static site generators out there. I found Middleman to be that something compelling. Setting up Middleman Install Middleman gem install middleman Create your project Logo. Understanding Middleman - the static site generator for faster prototyping. To get something from this, you’re probably a front-end focused coder (HTML/CSS) with absolutely zero Ruby knowledge and only cursory knowledge of the command line (I’m using OS X so sorry Windows users for the bits that make no sense). It will help a lot if you are already familiar with Sass and Compass. Do you create lots of mockups (HTML/CSS templates) for sites/apps? If so, perhaps at present you create flat HTML/CSS/JS pages (if a corporate site, imagine ‘home page’, ‘about -us’, contact-us’, ‘product1’, ‘product 2’ and on and on).

This practice is fine until after creating 10–15 pages something common to all pages needs to change (perhaps the navigation for instance). Sure you can ‘find and replace’ across the files but surely there is a better way? There are a few ways to solve this problem, PHP or similar can do ‘includes’ (allowing you to have a header.php, footer.php for example and then include them on the current page). Middleman is one such ‘static site generator’. The yield. Three Middleman Hacks We’re Using On This Site - Discover Meteor. People are often surprised to hear that we don’t use Meteor for this very site. After all, if anybody should want to use Meteor everywhere, it should be us. But we’re also big believer in using the right tool for the right situation. And I personally think that when it comes to building static sites, Meteor just isn’t the right fit. Instead, we’re using Middleman. Just like its slightly more famous cousin Jekyll, Middleman is a Ruby static site generator, only with few extra tricks under its sleeves.

In this post, I’ll highlight three hacks that we’re using on this very site: Generating complex pages from YAML data. Let’s get started! Please note that this post is about “Middleman” – and not “man-in-the-middle” - hacks. The Power of Static Having that compile phase lets you do all kinds of cool stuff, such as writing your content in Markdown and having it automatically translated into HTML. And using static files also means minimal resource use and great scalability. /data/features.yml. Building static websites with Middleman | 12 Devs. I’m going to make a bold statement — static sites are cool.

Jekyll has been one of the libraries at the core of this movement, which has given rise to static site generators made in nearly every language you can think of. Static websites have the benefit of simplicity; they don’t need complex server-side technologies to host, they just need something that can serve HTML. The purpose of any static site generator is to take some templates, some content and compile it into some static HTML ready for you to deploy. Middleman is a library for creating static websites written in Ruby, that utilises some of the power of Rails (the popular Ruby web framework). In this article we’ll be touching on how Middleman works, some of its features and how you can deploy a Middleman site to various hosting platforms with ease.

Hello, Middleman I’m also going to assume you’re fairly comfortable with a terminal as Middleman requires the command line to run its tasks. . $ gem install middleman $ middleman version. Middleman + Enlive: The best thing since PHP. Apr 2, 2013 Before I begin, the ideas in this article were introduced to me by this blog post, which I consider a must-read for anyone who uses Clojure on the web. I've been using Clojure for web development a lot more lately. This can be a contentious topic for some people.

“Clojure is hard to hire for”, they say. “It's for pretentious nerds”. I've been struggling with the fact that I can't really defend against any of the above, but that I love making apps in Clojure anyhow. Every since PHP hit the scene, the story of going between code and HTML has been through templating. None of these, I've discovered, have a damn thing on Enlive. Enlive changes the definition of “template” Enlive is library for working with HTML. Why is this so powerful? Middleman to the rescue Middleman is a way to make static sites. The result is a static HTML site. What's so great about this workflow? (Really) separate presentation and logic Separation of thought Fast UI iteration Generate HTML however you like Show me!

Alexander Shvets's Web Page. Nanoc and middleman are comparable tools. Both provide static web site generation from ruby templates, such as erb, haml etc. I discover that middleman is easier to configure and has better/simpler extension support. So, I decided to convert my existing web site to work with middleman. Here are the steps that you need to do in order to use middleman or migrate your web site from other static site generator. 1. .ruby-version: .ruby-gemset: This is the new way of handling ruby version and gemset name introduced in latest versions of bundler. 2.

In this minimal configuration we have support for dynamic reloading of web pages when they get changed and support for haml and markdown engines. 3. 4. Make sure that your styles, javascripts and images are located in: source/assets/stylesheetssource/assets/javascriptssource/assets/images 5. If you want support for language highlight in markdown files, include this gem into Gemfile: and these lines to config.rb file: 6. 7. 8. 9.

Hacking up sites with Middleman | Miscellanea by Darren Newton. TL;DR - I’m going to walk through how I rebuilt this blog using a static site generator. In the first half I walk through my decision for moving to a static site. You can skip down to the tech talk if you want. When re-designing/building my portfolio site in 2007 I did the tried and true geek thing: I hacked up my own custom CMS using CakePHP backed by MySQL. It was pretty standard stuff, complete with a blog engine modeled after WordPress. Putting it together was a great learning experience, similar to the “15 minute blog” videos from the Rails heyday of 2005-2007. If you want to learn a language/framework, build something in it. It was also complete overkill.

I got 99 reasons… Speed: Nothing loads faster than static HTML. To be honest tooling was the most important. Nanoc (Ruby) Jekyll (Ruby) Hyde (Python) Hakyll (Haskell) Phrozn (PHP) And many, many more… Hackety hack hack At the time that I rebuilt my blog (June 2012) Middleman 3 was still in Beta. Philosophy Extend yourself Re-usability.

The Middleman. A modular, feature-rich static site generator « Thomas Reynolds.