Build rapid and lightweight static websites with Hyde - IBM
Build rapid and lightweight static websites with Hyde - IBM Build rapid and lightweight static websites with Hyde - IBM
developerWorks® ibm.com/developerWorks/ horsepower. Another issue is backups and content portability. When you choose a CMS or web publishing framework, you rely on it to make sense of your content. With your content tied up in database tables, you can't easily reach in and grab a file to share. The move to a different infrastructure can be a daunting task. You also have to rely on specialized tools for backup and restore. The characteristic underlying these issues is transparency. Web publishing frameworks and CMSs are generally not transparent, which means a lot of special knowledge is required to understand how they store, manage, and serve up content. To some extent, this requirement is inevitable on all but the simplest websites, but recently emerging projects offer some frameworks benefits, without losing the core element of processing and publishing simple files on a server. One popular such framework is Jekyll. Some developers built on the core ideas of Jekyll, but using a different set of building blocks created the open-source Hyde project. Hyde is now my web publishing system of choice. It is simple yet offers a great deal of power, and it limits most of its business to processing simple files to generate a static site, resulting in a great deal of efficiency and flexibility. Getting started with Hyde Hyde is a system written in Python that allows you to manage content and templates in a directory on the file system of your web development machine. You create or update the content using a regular text editor and command-line tools, or you can use an IDE if you like. When you're ready to see how it looks, Hyde can generate the site and serve it up locally using a test web server. When you are satisfied with how the site looks in test mode, you can push the static, generated files to your production web server for Apache, Lighttpd, Nginx, or any web server that can serve files at lightning speeds. Installation and setup If you do web development on Mac or Linux systems, you already have the main thing you need, Python. Python is also easy to install on Microsoft® Windows® and most other platforms. To install Hyde in your Python library, invoke sudo easy_install hyde or pip install hyde, depending on your setup. When you do so, the hyde command should be available. To start, set up Hyde in a directory with a skeleton set of files for a typical website with this command: hyde -s $PATH_TO_DIRECTORY create Replace $PATH_TO_DIRECTORY with the directory where you want to work on content and template files. The above command uses a default layout for a site, but Hyde allows you to pick other site layouts. This option is useful if you want to use some well-known toolkit or setup for your site, for example, if you use the Twitter Bootstrap framework, or if you know the target site will be a weblog. Build rapid and lightweight static websites with Hyde Page 2 of 9
ibm.com/developerWorks/ developerWorks® If you switch to the newly created site directory using the default layout, you should see the following subdirectories: README.markdown content info.yaml layout site.yaml Each of these entries offers a different side of Hyde. Markdown Not many people enjoy writing HTML, and with Hyde you can minimize how much HTML you deal with. Most content management systems offer ways to avoid handauthoring HTML, usually using special what-you-see-is-what-you-get (WYSIWYG) widgets that give you a word-processor feel while generating HTML. Another approach is well-known from wikis. You edit plain text using special characters to indicate the various HTML markup constructs. These are called lightweight markup languages, and one of the more popular specimens is Markdown. Hyde builds in a processor that allows you to author web pages in Markdown rather than HTML. I shall not undertake a full introduction to Markdown in this article, but Listing 1 is a small example of rich content in Markdown format. Listing 1. Example of rich content in Markdown format For immediate release. **Boulder, Colorado, 1 January 2012** The new year began with a bang.... At city hall a local first nation elder was invited to offer residents a greeting of *Heebee*, or "Hello" in Arapaho, and recorded for the [city Web page](http://www.bouldercolorado.gov/). One resident said his New Year resolutions were to: * Lose weight * Go camping for at least one week in the summer * Pay off one credit card A Markdown processor such as the one bundled with Hyde can convert this into HTML such as in Listing 2. Listing 2. HTML output from Markdown content in Listing 1 For immediate release. Boulder, Colorado, 1 January 2012 The new year began with a bang.... At city hall a local first nation elder was invited to offer residents a greeting of Heebee, or "Hello" in Arapaho, and recorded for the city Web page. One resident said his New Year resolutions were to: Lose weight Go camping for at least one week in the summer Pay off one credit card Site configuration and YAML YAML Ain't Markup Language (YAML) is a language that some programmers like to use for configuration files. A site built with Hyde does require some configuration, for example, to control how templates are applied. The default site.yaml file generated by Hyde specifies a few plug-ins, indicates how some local file directories are Build rapid and lightweight static websites with Hyde Page 3 of 9
- Page 1: Build rapid and lightweight static
- Page 5 and 6: ibm.com/developerWorks/ developerWo
- Page 7 and 8: ibm.com/developerWorks/ developerWo
- Page 9: ibm.com/developerWorks/ developerWo
ibm.com/developerWorks/ developerWorks®<br />
If you switch to the newly created site directory using the default layout, you should<br />
see the following subdirectories:<br />
README.markdown content info.yaml layout site.yaml<br />
Each of these entries offers a different side of <strong>Hyde</strong>.<br />
Markdown<br />
Not many people enjoy writing HTML, <strong>and</strong> <strong>with</strong> <strong>Hyde</strong> you can minimize how much<br />
HTML you deal <strong>with</strong>. Most content management systems offer ways to avoid h<strong>and</strong>authoring<br />
HTML, usually using special what-you-see-is-what-you-get (WYSIWYG)<br />
widgets that give you a word-processor feel while generating HTML. Another<br />
approach is well-known from wikis. You edit plain text using special characters to<br />
indicate the various HTML markup constructs. These are called <strong>lightweight</strong> markup<br />
languages, <strong>and</strong> one of the more popular specimens is Markdown.<br />
<strong>Hyde</strong> builds in a processor that allows you to author web pages in Markdown rather<br />
than HTML. I shall not undertake a full introduction to Markdown in this article, but<br />
Listing 1 is a small example of rich content in Markdown format.<br />
Listing 1. Example of rich content in Markdown format<br />
For immediate release. **Boulder, Colorado, 1 January 2012** The new year began<br />
<strong>with</strong> a bang.... At city hall a local first nation elder was invited to offer<br />
residents a greeting of *Heebee*, or "Hello" in Arapaho, <strong>and</strong> recorded for the<br />
[city Web page](http://www.bouldercolorado.gov/). One resident said his New Year<br />
resolutions were to:<br />
* Lose weight<br />
* Go camping for at least one week in the summer<br />
* Pay off one credit card<br />
A Markdown processor such as the one bundled <strong>with</strong> <strong>Hyde</strong> can convert this into<br />
HTML such as in Listing 2.<br />
Listing 2. HTML output from Markdown content in Listing 1<br />
For immediate release.<br />
Boulder, Colorado, 1 January 2012<br />
The new year began <strong>with</strong> a bang....<br />
At city hall a local first nation elder was invited to offer residents<br />
a greeting of Heebee, or "Hello" in Arapaho, <strong>and</strong> recorded<br />
for the city Web page.<br />
One resident said his New Year resolutions were to:<br />
<br />
Lose weight<br />
Go camping for at least one week in the summer<br />
Pay off one credit card<br />
<br />
Site configuration <strong>and</strong> YAML<br />
YAML Ain't Markup Language (YAML) is a language that some programmers like to<br />
use for configuration files. A site built <strong>with</strong> <strong>Hyde</strong> does require some configuration, for<br />
example, to control how templates are applied. The default site.yaml file generated<br />
by <strong>Hyde</strong> specifies a few plug-ins, indicates how some local file directories are<br />
<strong>Build</strong> <strong>rapid</strong> <strong>and</strong> <strong>lightweight</strong> <strong>static</strong> <strong>websites</strong> <strong>with</strong> <strong>Hyde</strong> Page 3 of 9
Change language