Creating a welcome page
The welcome page is the first page displayed when someone goes to the root of your site. The welcome page doesn't require any interaction with Couchbase Server, so you just need to tell Express to render the template for the welcome page:
beer_app.js (welcome page):
function welcome(req, res) {
res.render('welcome');
}
app.get('/welcome', welcome);
The welcome.html template is actually a Jade template that resides inside the views directory. The welcome.jade template looks like this:
views/welcome.jade:
extends layout
block content
.span6
.span12
h4 Browse all Beers
a(href="/beers" class="btn btn-warning") Show me all beers
hr
.span12
h4 Browse all Breweries
a(href="/breweries" class="btn btn-info") Take me to the breweries
.span6
.span12
h4 About this App
p Welcome to Couchbase!
p
| This application helps you to get started on application
| development with Couchbase. It shows how to create, update and
| delete documents and how to work with JSON documents.
The template provides some links to the brewery and beer pages. An interesting thing about this template is that it inherits from the common layout.jade template. All pages in the beer app have a common header and footer to them — with only their body differing. This is the layout.jade template:
views/layout.jade:
!!!5
html(lang="en")
head
meta(charset="utf-8")
title Couchbase Node.js Beer Sample
meta(name="viewport" content="width=device-width, initial-scale=1.0")
meta(name="description" content="The Couchbase Node.js Beer-Sample App")
meta(name="author" content="Couchbase, Inc. 2013")
link(href="/css/bootstrap.min.css" rel="stylesheet")
link(href="/css/beersample.css" rel="stylesheet")
link(href="/css/bootstrap-responsive.min.css" rel="stylesheet")
//HTML5 shim, for IE6-8 support of HTML5 elements
//if lt IE 9
script(src="http://html5shim.googlecode.com/svn/trunk/html5.js")
body
.container-narrow
.masthead
ul.nav.nav-pills.pull-right
li: a(href="/welcome") Home
li: a(href="/beers") Beers
li: a(href="/breweries") Breweries
h2.muted Couchbase Beer Sample
hr
.row-fluid
.span12
block content
hr
.footer
p © Couchbase, Inc. 2013
script(src="/js/jquery.min.js")
script(src="/js/beersample.js")
The template provides some links to the brewery and beer pages (which are shown later).
If you start your app now, you should be able to navigate to http://localhost:1337/welcome and see the welcome page. You’ll get a 404 error if you try to visit any links for pages that haven't been implemented yet. If you downloaded the complete app, the links should work.