WebFund 2013F: Assignment 1: Difference between revisions
No edit summary |
No edit summary |
||
Line 56: | Line 56: | ||
</source> | </source> | ||
==public/stylesheets/style.css== | ==public/stylesheets/style.css== |
Revision as of 04:31, 20 September 2013
In this assignment you are to examine, modify, and answer questions regarding the form-demo sample node application. For reference, the key files are included below.
package.json
{
"name": "application-name"
, "version": "0.0.1"
, "private": true
, "dependencies": {
"express": "2.5.8"
, "jade": ">= 0.0.1"
}
}
app.js
/**
* Module dependencies.
*/
var express = require('express')
, routes = require('./routes');
var app = module.exports = express.createServer();
// Configuration
app.configure(function(){
app.set('views', __dirname + '/views');
app.set('view engine', 'jade');
app.use(express.bodyParser());
app.use(express.methodOverride());
app.use(app.router);
app.use(express.static(__dirname + '/public'));
});
app.configure('development', function(){
app.use(express.errorHandler({ dumpExceptions: true, showStack: true }));
});
app.configure('production', function(){
app.use(express.errorHandler());
});
// Routes
app.get('/', routes.index);
app.post('/add', routes.add);
app.listen(3010, function(){
console.log("Express server listening on port %d in %s mode", app.address().port, app.settings.env);
});
public/stylesheets/style.css
body {
padding: 50px;
font: 14px "Lucida Grande", Helvetica, Arial, sans-serif;
}
a {
color: #00B7FF;
}
routes/index.js
/*
* GET home page.
*/
exports.index = function(req, res){
res.render('index', { title: 'form demo with node and express' })
};
exports.add = function(req, res){
res.render('add', { title: 'Person added',
name: req.body.name,
country: req.body.country,
date: req.body.birthday,
email: req.body.email});
};
views/layout.jade
!!!
html
head
title= title
link(rel='stylesheet', href='/stylesheets/style.css')
body!= body
views/index.jade
h1= title
div
p Fill out your info
form(method="post", action="/add")
div
input#name(type="text", name="name")
label.add-on(for="name")
| Name
div
input#country(type="text", name="country")
label.add-on(for="country")
| Country
div
input#birthday(type="text", name="birthday")
label.add-on(for="birthday")
| Birthday
div
label.checkbox
input#send-email(type="checkbox", name="send-email")
| Email Me
div
input#email(type="text", name="email")
label.add-on(for="email")
| Email
button(type="submit") Submit
views/add.jade
h1 Info Added
p Name: #{name}
p Country: #{country}
p Date: #{date}
p Email: #{email}