Over a million developers have joined DZone.

GrazeWP7: Static Site Generation Using Razor

· Mobile Zone

Graze is a simple static site generator. It takes a template and a configuration file and generates a static web site. The generated site is pure HTML / CSS / JavaScript and can be hosted on any web server. The Graze templates are created using the Razor Syntax.

Getting started

  1. Download and extract the Graze. It comes with an example.
  2. Run graze.exe.


The static site (index.html) is generated into the “output” folder.

Graze templates

The Graze templates are created using the Razor.

<html>
<head>
    <title>@Model.Title</title>
</head>
<body>
    <h1>@Model.Description</h1>
</body>
</html>


Graze configuration

The configuration for Graze is done in XML.

<?xml version="1.0" encoding="utf-8" ?>
<site>
  <Title>Graze</Title>
  <Description>Graze: Static site generator using Razor</Description>
</site>


The configuration file represents the data which is injected to the generated static site.

Generating the static site

Once the Graze template and the configuration file are in place, the static site can be generated running the graze.exe. The static site is outputted to the output-folder.

GrazeWP7

The GrazeWP7 uses Graze to generate marketing sites for Windows Phone 7 applications.

screenshot_small


GrazeWP7 is a Windows Phone 7 app marketing site generator. It uses the Graze templating engine with Twitter Bootstrap to create static web sites.

GrazeWP7 uses a simple configuration file to generate a static web site for your application. The generated sited is pure HTML / CSS / JavaScript and can be hosted on any web server.

More details

More details about WP7Graze, including the quick start, are available from the project’s home.

Features

Lists

Lists can be created in XML and accessed in the Graze template. Example XML:

<Features>
  <Feature>Layouts defined using Razor syntax.</Feature>
  <Feature>Dynamic data models created in XML.</Feature>
  <Feature>Supports complex data models and arrays.</Feature>
  <Feature>Fast static site generation.</Feature>
  <Feature>Pure HTML / CSS / Javascript output. Host in Apache, IIS etc.</Feature>
</Features>


Example template for accessing the list:

<h2>Features:</h2>
<ul>
    @foreach (var feature in Model.Features)
    {
        <li>@feature</li>
    }
</ul>


Complex types

By default all the data in the XML is of type string when accessed from the template. But complex types can be created also:

<Link Url="https://github.com/mikoskinen/graze">Source code hosted in GitHub</Link>

 

<a href="@Model.Link.Url">@Model.Link.Link</a>


Case sensitive

The configuration is case sensitive.

Folder structure

Graze expects the following folder structure:

graze.exe
--template/
----configuration.xml
----index.cshtml
----assets


The assets folder is copied wholly to the output folder. The assets folder can include the CSS / JSS / image files required by the template.

License

Graze is available with the MIT-license. It uses the RazorEngine to generate the output.

Source code

Graze is hosted at GitHub.



Source: http://mikaelkoskinen.net/post/Graze-Static-site-generator-using-Razor.aspx

Topics:

Opinions expressed by DZone contributors are their own.

The best of DZone straight to your inbox.

SEE AN EXAMPLE
Please provide a valid email address.

Thanks for subscribing!

Awesome! Check your inbox to verify your email so you can start receiving the latest in tech news and resources.
Subscribe

{{ parent.title || parent.header.title}}

{{ parent.tldr }}

{{ parent.urlSource.name }}