Skip to content

Instantly share code, notes, and snippets.

@topfunky

topfunky/CHANGES.md

Created August 2, 2012 18:27
Download ZIP

Revisions

  1. topfunky revised this gist Aug 6, 2012. 1 changed file with 4 additions and 4 deletions.
    8 changes: 4 additions & 4 deletions CHANGES.md
    View file
    Original file line number Diff line number Diff line change
    @@ -25,21 +25,21 @@ extends ../../../views/layout
    * Use `include` to render another template (this previously used `partial`). If you want to use a leading underscore for partial templates, mention it explicitly when `include`ing the template. For example, in `views/layout.jade`:
    ```coffee-script
    ```jade
    body
    include _admin-menu
    ```

    * To render other templates, use `block` with a name. In `layout.jade`, this looks like this:

    ```coffee-script
    ```jade
    block content
    ```

    * The corresponding content in a template uses `block` with the same name. So `apps/sidewalk/views/index.jade` looks like this:

    ```coffee-script
    ```jade
    block content
    ul
    each pie in pies
    @@ -48,7 +48,7 @@ block content

    * So the full template of `apps/sidewalk/views/index.jade` looks like this:

    ```coffee-script
    ```jade
    extends ../../../views/layout
    block content
  2. topfunky revised this gist Aug 6, 2012. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion CHANGES.md
    View file
    Original file line number Diff line number Diff line change
    @@ -19,7 +19,7 @@ The biggest changes are:

    * You must explicitly tell sub-templates what layout they should use. Previously, they would automatically be wrapped by the `layout` template. Now you need to call `extend` at the top of the template. For example, in `apps/sidewalk/views/index.jade`:

    ```coffee-script
    ```jade
    extends ../../../views/layout
    ````
  3. topfunky revised this gist Aug 2, 2012. 1 changed file with 40 additions and 28 deletions.
    68 changes: 40 additions & 28 deletions CHANGES.md
    View file
    Original file line number Diff line number Diff line change
    @@ -19,50 +19,62 @@ The biggest changes are:

    * You must explicitly tell sub-templates what layout they should use. Previously, they would automatically be wrapped by the `layout` template. Now you need to call `extend` at the top of the template. For example, in `apps/sidewalk/views/index.jade`:

    extends ../../../views/layout
    ```coffee-script
    extends ../../../views/layout
    ````

    * Use `include` to render another template (this previously used `partial`). If you want to use a leading underscore for partial templates, mention it explicitly when `include`ing the template. For example, in `views/layout.jade`:

    body
    ```coffee-script
    body

    include _admin-menu
    include _admin-menu
    ```

    * To render other templates, use `block` with a name. In `layout.jade`, this looks like this:

    block content
    ```coffee-script
    block content
    ```

    * The corresponding content in a template uses `block` with the same name. So `apps/sidewalk/views/index.jade` looks like this:

    block content
    ul
    each pie in pies
    # etc
    ```coffee-script
    block content
    ul
    each pie in pies
    # etc
    ```

    * So the full template of `apps/sidewalk/views/index.jade` looks like this:

    extends ../../../views/layout
    ```coffee-script
    extends ../../../views/layout

    block content
    ul
    each pie in pies
    li(class=[helpers.cssClassForPieAge(pie), pie.type])
    = pie.name
    span.status
    = helpers.wordsForPieAge(pie)
    block content
    ul
    each pie in pies
    li(class=[helpers.cssClassForPieAge(pie), pie.type])
    = pie.name
    span.status
    = helpers.wordsForPieAge(pie)
    ```

    * ALSO: Express did away with built-in support for the extremely useful view helper methods. You can recreate it with a bit of middleware. Assign methods to `app.helpers` or `app.dynamicHelpers`. Then see `middleware/upgrade.coffee` in the PeepCode Express 3.0 demo app for a way to automatically load these as helpers in your views.

    routes = (app) ->
    app.all '*', (req, res, next) ->
    app.locals
    helpers: app.helpers
    flash: req.flash()
    for method of app.dynamicHelpers
    do (method, req, res) ->
    app.locals[method] = () ->
    app.dynamicHelpers[method] req, res
    next()

    module.exports = routes
    ```coffee-script
    routes = (app) ->
    app.all '*', (req, res, next) ->
    app.locals
    helpers: app.helpers
    flash: req.flash()
    for method of app.dynamicHelpers
    do (method, req, res) ->
    app.locals[method] = () ->
    app.dynamicHelpers[method] req, res
    next()

    module.exports = routes
    ```

    We hope to update the video to mention these changes. In the meantime, try the `HotPie-Express3` app in the code download at [PeepCode](https://peepcode.com/products/full-stack-nodejs-i).
  4. topfunky revised this gist Aug 2, 2012. No changes.
  5. topfunky created this gist Aug 2, 2012.
    68 changes: 68 additions & 0 deletions CHANGES.md
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,68 @@
    # Changes in Express 3.0 Templates

    Related: [PeepCode Full Stack Node.js screencast](https://peepcode.com/products/full-stack-nodejs-i) (an included code sample works with Express 3.0).

    There are several syntax changes in Express 3.0. They do require modifications to your code, but they aren't too complicated.

    The biggest change is that Express templates now use Django style inheritance rather than ERB/Rails style automatic layouts.

    ## Summary

    * Use `extends` to explicitly specify a layout template.
    * Use `include` instead of `partial`.
    * Use `block` to make a placeholder in a layout.
    * Use `block` again in an individual template to specify the content to render in the layout.

    ## Details

    The biggest changes are:

    * You must explicitly tell sub-templates what layout they should use. Previously, they would automatically be wrapped by the `layout` template. Now you need to call `extend` at the top of the template. For example, in `apps/sidewalk/views/index.jade`:

    extends ../../../views/layout

    * Use `include` to render another template (this previously used `partial`). If you want to use a leading underscore for partial templates, mention it explicitly when `include`ing the template. For example, in `views/layout.jade`:

    body

    include _admin-menu

    * To render other templates, use `block` with a name. In `layout.jade`, this looks like this:

    block content

    * The corresponding content in a template uses `block` with the same name. So `apps/sidewalk/views/index.jade` looks like this:

    block content
    ul
    each pie in pies
    # etc

    * So the full template of `apps/sidewalk/views/index.jade` looks like this:

    extends ../../../views/layout

    block content
    ul
    each pie in pies
    li(class=[helpers.cssClassForPieAge(pie), pie.type])
    = pie.name
    span.status
    = helpers.wordsForPieAge(pie)

    * ALSO: Express did away with built-in support for the extremely useful view helper methods. You can recreate it with a bit of middleware. Assign methods to `app.helpers` or `app.dynamicHelpers`. Then see `middleware/upgrade.coffee` in the PeepCode Express 3.0 demo app for a way to automatically load these as helpers in your views.

    routes = (app) ->
    app.all '*', (req, res, next) ->
    app.locals
    helpers: app.helpers
    flash: req.flash()
    for method of app.dynamicHelpers
    do (method, req, res) ->
    app.locals[method] = () ->
    app.dynamicHelpers[method] req, res
    next()

    module.exports = routes

    We hope to update the video to mention these changes. In the meantime, try the `HotPie-Express3` app in the code download at [PeepCode](https://peepcode.com/products/full-stack-nodejs-i).