Below is the code snippet from my app.js file:
var express = require('express');
var path = require('path');
var favicon = require('serve-favicon');
var cookieParser = require('cookie-parser');
var bodyParser = require('body-parser');
var viewRoute = require('./routes/view'), //defining routes
apiRoute = require('./routes/api'),
app.set('views', path.join(__dirname, 'views')); //setting to HTML engine instead of EJS | JADE
app.engine('html', require('ejs').renderFile);
app.set('view engine', 'html');
app.use(favicon(path.join(__dirname, 'public', 'favicon.ico')));
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: false }));
app.use(cookieParser());
app.use(express.static(path.join(__dirname, 'public')));
app.use('/', viewRoute); //using middleware for routing
app.use('/api', apiRoute);
I have defined two main things :
- View -- Rendering for HTML files
- Api -- Code for handling get / post request from views (HTML files)
Let's take a look at the view.js file
var express = require('express');
var router = express.Router();
/* GET home page. */
router.get('/', function(req, res, next) {
res.render('index');
});
router.get('/home', function(req, res, next) {
res.render('pages/home');
});
router.get('/login', function(req, res, next) {
res.render('pages/login');
});
router.get('/about', function(req, res, next) {
res.render('pages/about');
});
module.exports = router;
Now let's explore the api.js file :
var express = require('express');
module.exports = (function() {
'use strict';
var api = express.Router();
api.get('/home', function(req, res, next) {
console.log("A GET Request for Home Page\n");
});
api.get('/dashboard', function(req, res, next) {
console.log("A GET Request for About Page\n");
});
api.get('/about', function(req, res, next) {
console.log("A GET Request for About Page\n");
});
return api;
})();
Next, let's check out my AngularJs Controller File for routing :
$routeProvider
.when('/home', {
templateUrl: '/home',
controller: 'homeCtrl'
})
.when('/login', {
resolve : {
'check' : function ($location, $cookies){
if ($cookies.get('isAuthenticated') && $cookies.get('current_user')) {
$location.path('/dashboard');
}
}
},
templateUrl: '/login',
controller: 'loginCtrl'
})
.when('/dashboard', {
resolve : {
'check' : function ($location, $cookies){
if (!$cookies.get('isAuthenticated') || !$cookies.get('current_user')) {
$location.path('/login');
}
}
},
templateUrl: '/dashboard',
controller: 'dashboardCtrl'
})
.otherwise('/home');
Lastly, in my controller files I handle user navigation after login and set permissions:
myApp.controller('homeCtrl', function ($interval, $rootScope, $scope) {
//Displaying HOME page
});
myApp.controller('loginCtrl', function ($scope) {
//DISPLAYING LOGIN PAGE FOR LOGIN
//YOUR LOGIN CODE GOES HERE AND AFTER THAT DO:
$location.path('/dashboard/*'); //depending on you
});
smpApp.controller('aboutCtrl', function ($interval, $rootScope, $scope) {
//DISPLAYING YOUR ABOUT US PAGE
});
Key points to note:
- Routes are authenticated every time.
- Separate files for viewing HTML and handling requests.
- Distinct controllers for each functionality.
- Usage of $location.path for user redirection to dashboard.
Thank you & Cheers!