Welcome folks today in this blog post we will be exporting handlebars resume template to pdf document in express using node.js and puppeteer library. All the full source code of the application is shown below.
Get Started
In order to get started you need to make a new node.js project using the below command as shown below
npm init -y
npm i express
npm i puppeteer
npm i handlebars
And now you need to make the index.js file and copy paste the following code
index.js
|
1 2 3 4 5 6 7 8 9 10 11 12 13 |
const express = require("express"); const app = express(); const path = require("path"); const handlebars = require("handlebars"); const puppeteer = require("puppeteer"); app.use(express.urlencoded({ extended: false })); app.use(express.json()); // Start the server app.listen(3000, () => { console.log("Server started on port 3000"); }); |
As you can see in the above code we are importing the required libraries and starting the express server at the port number 3000. And then we are also including the middleware of bodyparser to the express app.
Passing Data to Dynamic Handlebars Template
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 |
// Define the route for rendering the resume PDF app.get("/resume", async (req, res) => { // Compile the Handlebars template const source = ` <div> <h1>{{name}}</h1> <p>{{email}}</p> <p>{{phone}}</p> <h2>Experience</h2> {{#each experience}} <h3>{{this.title}}</h3> <p>{{this.company}}</p> <p>{{this.startDate}} - {{this.endDate}}</p> <ul> {{#each this.responsibilities}} <li>{{this}}</li> {{/each}} </ul> {{/each}} <h2>Education</h2> {{#each education}} <h3>{{this.degree}}</h3> <p>{{this.school}}</p> <p>{{this.startDate}} - {{this.endDate}}</p> {{/each}} </div> `; const template = handlebars.compile(source); // Define the data to be used in the template const data = { name: "John Doe", email: "john@example.com", phone: "123-456-7890", experience: [ { title: "Software Engineer", company: "Acme Inc.", startDate: "January 2018", endDate: "Present", responsibilities: [ "Developed and maintained web applications using Node.js and React", "Collaborated with cross-functional teams to design and implement new features", "Improved application performance and scalability through code optimizations", ], }, { title: "Intern", company: "XYZ Corp.", startDate: "May 2017", endDate: "August 2017", responsibilities: [ "Assisted with software development tasks", "Participated in team meetings and code reviews", "Learned about software engineering best practices", ], }, ], education: [ { degree: "Bachelor of Science in Computer Science", school: "University of California, Berkeley", startDate: "August 2014", endDate: "May 2018", }, ], }; // Render the HTML from the template and data const html = template(data); // Generate the PDF using Puppeteer const browser = await puppeteer.launch(); const page = await browser.newPage(); await page.setContent(html); const pdf = await page.pdf({ format: "A4" }); await browser.close(); // Send the PDF as a response res.set("Content-Type", "application/pdf"); res.send(pdf); }); |
As you can see we have the /resume endpoint in which we are defined the handlebars resume template and then we are passing the dynamic data to it. And then using the puppeteer library we are creating the pdf document from the html that we pass to the setContent() method and then we are sending the pdf document when we open the /resume endpoint as shown below
Now if you start the express server by the below command as shown below
node index.js
