Mastering Server-Side Development with Hapi.js: A Guide
Written on
Chapter 1: Introduction to Hapi.js
Hapi.js is a lightweight framework for Node.js designed to facilitate back-end web application development. This article will delve into creating back-end applications using Hapi.js.
Section 1.1: Rendering Views with Hapi.js
To render a view, the h.view method is utilized. Below is a basic implementation:
const Path = require('path');
const Hapi = require('@hapi/hapi');
const Hoek = require('@hapi/hoek');
const init = async () => {
const server = new Hapi.Server({
port: 3000,
host: '0.0.0.0',
debug: { request: ['error'] }
});
await server.register(require('@hapi/vision'));
server.views({
engines: {
html: {
module: require('handlebars'),
compileMode: 'sync'
},
},
relativeTo: __dirname,
path: 'templates',
});
server.route({
method: 'GET',
path: '/',
handler (request, h) {
return h.view('index');}
});
await server.start();
console.log('Server running at:', server.info.uri);
};
process.on('unhandledRejection', (err) => {
console.log(err);
process.exit(1);
});
init();
The above code snippet demonstrates how to render the index.html file. The relativeTo option indicates the location of the template folder, while path specifies the folder name.
We can also send dynamic data to the view. For instance:
server.route({
method: 'GET',
path: '/',
handler (request, h) {
return h.view('index', { title: 'My home page' });}
});
In this case, the title property is represented in the template using {{title}}.
Subsection 1.1.1: Simplifying the View Handler
Instead of manually invoking h.view, we can streamline our route handler as follows:
server.route({
method: 'GET',
path: '/',
handler: {
view: 'index'}
});
When we want to pass data to the view, we can structure it like this:
server.route({
method: 'GET',
path: '/',
handler: {
view: {
template: 'index',
context: {
title: 'My home page'}
}
}
});
This approach allows us to define the context title, which is rendered as {{title}} in the view. Consequently, navigating to the root endpoint will display "My home page."
The first video, "Server Side Rendering with EJS and Node.JS," provides a comprehensive overview of server-side rendering techniques using EJS and Node.js.
Section 1.2: Conclusion
In summary, Hapi.js offers a robust way to render views and pass dynamic data. By utilizing view handlers, developers can efficiently create and manage back-end applications.
Chapter 2: Understanding Server-Side vs. Client-Side Rendering
The second video, "Client-Side vs Server-Side Rendering, Simplified with JS, NodeJS, React & NextJS examples," explains the differences between client-side and server-side rendering, complete with practical examples.