Differences

This shows you the differences between two versions of the page.

--- javascript:jade:start [2014/03/18 03:41] – created mithat
+++ javascript:jade:start [2014/03/18 04:03] (current) – mithat
@@ Line 1: / Line 1: @@
-==== Creating web pages ====
+====== Jade ======
-In this section, we will use Jade to build a simple but complete web page. It will serve as an introduction to some fundamental Jade language concepts.
+[[http://jade-lang.com|Jade]] is billed as a template engine for [[http://nodejs.org/|Node.js]], but it could be thought of as a language that makes writing HTML easier and that also lets you do templating. Here are some notes on learning how to use Jade. I will add to them as my CopiousFreeTime™ allows me to learn more.
-<file jade myPage.jade>
-doctype html
-html
-    head
-        title A Simple Site
-    body
-        h1 Hello there!
-        p Nice to meet you.
-</file>
-<file javascript buildMyPage.js>
-var jade = require('jade');
-var fs = require('fs');
-options = {
-    pretty: true
-};
-// Render an HTML page from a file written in Jade.
-var html = jade.renderFile('myPage.jade', options, function(err, html) {
-        if (err) {
-           throw(err);
-        }
-        return html;
-    });
-// Write HTML to a file.
-fs.writeFile('myPage.html', html, function(err) {
-    if (err) {
-        throw(err);
-    }
-});
-</file>
-output:<code>
-$ cat myPage.html
-<!DOCTYPE html>
-<html>
-  <head>
-    <title>A Simple Site</title>
-  </head>
-  <body>
-    <h1>Hello there!</h1>
-    <p>Nice to meet you.</p>
-  </body>
-</html>
-</code>
-The basic idea is that Jade uses a shorthand HTML syntax where indentation is used to nest elements.
-This should be enough to make you comfortable reading the [[http://jade-lang.com/reference/|Jade Language Reference]], after which you should be able to compose entire web pages in Jade.
+  * [[Getting started]]
+  * [[Templating]]
+  * [[Modularizing]]