Pessoal, vou ensinar aqui como subir um aplicação utilizando o express[1], um framework web para node. Vou aproveitar para falar um pouco do package.json que guarda as informações de metadados do nosso projeto. Espero que gostem e este post está aberto para contribuição de todos.
Primeiramente crie a estrutura de diretórios, que nos será útil durante o desenvolvimento do aplicativo.
/
/static
/static/css
/static/css/style.css
/static/javascript
/static/javascript/app.js
/views
/views/index.html
/package.json
/myapp.js
Definindo o projeto 'package.json'
Precisamos criar o arquivo package.json de metadados de informações na raiz do projeto. Esse arquivo guarda informações do projeto e suas dependencias. Com ele fica fácil fazer deploy e o controle de dependência. o ideal é deixa o arquivo mais limpo possível.{ "name": "server-web",
"version": "0.4.0",
"description": " Servidor http",
"contributors": [ {
"name": "Onezino Gabriel Moreira",
"email": "heat2k4@hotmail.com" } ],
"keywords": [ "cli", "http", "server" ],
"dependencies" : {
"express" : "3.x",
"consolidate" : "0.4.x",
"swig": "0.12.x" }
} As dependências que usamos são o renderizador de template e o framework web express. Pra instalar todas as dependências de uma vez é so digitar o comando na raiz do projeto:
npm install
Escrevendo sua aplicação
O próximo passo é escreve nossa aplicação, no myapp.js, a começar carregando os módulo que precissamos.
var express = require('express');
var cons = require('consolidate');
De novidade tempos o consolidate[5] e do express[1], o primeiro é um renderizador de template e o express é nosso objeto de estudo desse post. O express faz nosso wrapper com a biblioteca http então não precisamos carrega-las expressamente.
app = express();
app.get('/',function(req,res){
res.send('Hello world!')});
app.listen(3000);
console.log('app rodando na prota 3000');
App hello world. a novidade está na forma de tratar o response, onde só precisamos chamar o método send. Mas isso não é muito útil, então vamos registrar nosso renderizador e entregar uma página mais elegante ao usuário.
app.engine('html', cons.swig);
app.set('view engine','html');
app.set('views',__dirname+'/views');
Nesse trecho dizemos ao express quem vai renderizar nossas páginas e a localização dos tempaltes. O express aceita uma lista grande de templates, no nosso exemplo estou utilizando o consolidate mas fique livre para utilizar qualquer um de sua preferência. E editamos a linha que entrega o conteúdo na rota '/'.
/* app.get('/',function(req,res){res.send();}); */
app.get('/',function(req,res){
res.render('index')});
Pronto, agora só precisamos servir os arquivos estáticos(estilos, css, imagens). Utilizamos um middleware para tratar as chamadas que trata as chamadas get ao arquivos pesquisando de forma encadeada.
app.use(express.static(__dirname + '/static'));
Podemos agorar utilizar os arquivos /css/style.css e /javascript/app.js em nosso html. Você também pode prefixar o caminho dos arquivos estáticos. vamos utilziar o prefixo /js/ para nossos arquivos javascript.
app.use('/js',
express.static(__dirname+'/static/javascript'));
Pronto o javascript pode ser utilizado apartir do caminho /js, exemplo /js/app.js.
Conclusão
Fizemos um setup básico para uma aplicação rodando em express. Essa foi uma introdução. Vou fazer outros post explorando melhor as características do express. Espero sugestões de vocês.Até a próxmia.
[1] expressjs
[2] npm repository
[3] repositório do projeto.
[4] package.json cheatsheet
[5]consolidate
