We saw what does a Noradf application looks like in our previous post (Part I and Part II). Now it’s time to create a sample application to show Noradf in action
Creating a Noradf application
First of all we need to init our sample application
noradf init
Now we need to create our module
noradf module 'Sample Module'
Now we’re ready for create our Hello World application. Since Noradf uses Express we can use the app
object to config our application routing. We will define the routing in our module file
'use strict'; var path = require('path'); module.exports = function (app) { app.get('/', function (req, res) { res.render(path.join(__dirname, 'views/index.html')); }); };
You have to create a file name index.html
under a directory called views
inside your module folder
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Hello Noradf</title> </head> <body> <h1>Hello Noradf</h1> </body> </html>
And now, you have to create a file named server.js
in the root directory of your application like this
'use strict'; var noradf = require('noradf-core'); noradf.startServer();
Init your server
node server.js
And point to http://localhost:3000
You have your first Noradf application running!!!
Let’s see how pass variables to our html file. We use swig for template rendering. Change your module.js
file
'use strict'; var path = require('path'); module.exports = function (app) { app.get('/', function (req, res) { res.render(path.join(__dirname, 'views/index.html'), {date: new Date().toDateString()}); }); };
And your index.html
file
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Hello Noradf</title> </head> <body> <h1>Hello Noradf. It's {{ date }}</h1> </body> </html>
Advanced configuration
You can split your client side logic from your server side logic in your application. Just create a public
directory and a server
directory to do that
In your public directory you can create an assets
directory. Everything under this directory will be serve as a static file. Your static files will be server under the nameofyourmodule path, e.g.: http://localhost/sample-module/js/myjs.js
You can put your routes files under a directory called routes
in the server
directory. These files must be like the module.js
file and you can inject dependencies in the same way that you do that in the module.js
file
This is a new framework and we are developing some applications with it so more features and modules will come. Check the Github Organization Repositories for more information
You can fork this example from the Github Repository