How do I create a Jade page that has two buttons where each one of them redirects to another page made with Jade?
Jade is a template engine for node. js and the default rendering engine for the Express web framework. It is a new, simplified language that compiles into HTML and is extremely useful for web developers. Jade is designed primarily for server-side templating in node.
Popular template engines Template engines are mostly used for server-side applications that are run on only one server and are not built as APIs. The popular ones include Ejs, Jade, Pug, Mustache, HandlebarsJS, Jinja2, and Blade.
js, also known as PUG, is a Javascript library that was previously known as JADE. It is an easy-to-code template engine used to code HTML in a more readable fashion. One upside to PUG is that it equips developers to code reusable HTML documents by pulling data dynamically from the API.
According to some benchmark tests, EJS is way faster than Jade or Haml.
This is the code I made for your question:
server.js
var express = require('express');
var path = require('path');
var app = express();
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'jade');
app.get('/', function(req, res){
res.render('layout', {
title: 'Home'
});
});
app.get('/newpage', function(req, res){
res.render('anotherpage', {
title: 'Home'
});
});
app.listen(3000);
page1.jade
doctype html
html
head
title= title
body
p hi there!
button(onclick="move()") newPage
script.
function move() {
window.location.href = '/newpage'
}
anotherpage.jade
doctype html
html
head
title= title
body
p welcome to the other page!
Enjoy, because it took me 15 minutes to write all this and the post.
Luca
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With