Puppeteer tutorial — installing Puppeteer on AlmaLinux
Liquid Web customers often have a requirement to install Puppeteer on Linux — AlmaLinux specifically. Related to this need, discover this helpful article that comes from our team of internet experts, who support a diverse set of web hosting environments. Due to its user-friendly and powerful capabilities, Puppeteer is widely used in web development, quality assurance, and web scraping applications. Keep reading to learn more!
Puppeteer is a Node (Node.js) framework created by Google that provides a high-level API for managing headless Chrome or Chromium browsers via the Chrome DevTools Protocol (CDP). It streamlines frontend development and testing by automating screenshot creation, web page scraping, form submissions, and website performance testing.
Takeaways provided in this content
There are several takeaways for readers of this Puppeteer tutorial. They include the following items:
- An insightful overview of Puppeteer’s functionality
- Installing Puppeteer and its supporting components on AlmaLinux
- Writing and using a simple Puppeteer script
- Updating Node.js and Puppeteer
- Uninstalling Node.js and Puppeteer
- Taking your Puppeteer projects to the next level
About this provided Puppeteer tutorial
Installing Puppeteer on AlmaLinux on your Liquid Web server involves setting up the necessary dependencies and configurations to enable Puppeteer’s functionality. The process lets you control headless browsers, automate tasks, and perform various web-related operations.
You can easily integrate Puppeteer into your web development workflow by following the provided Puppeteer tutorial tailored for Liquid Web customers. This installation opens up possibilities for automating browser interactions, testing web applications, and enhancing the efficiency of your web development and deployment processes.
Prerequisites
Here is a list of the prerequisites to line up before walking through our Puppeteer example setup in this help documentation post:
- Operating System: AlmaLinux 8 installed on your Liquid Web server.
- SSH Access: The required root or sudo access to your Liquid Web server to install Puppeteer.
- Disk Space: Minimum: 5 GB free disk space.
- Recommended: 10 GB or more free disk space.
- CPU: Minimum: 1 CPU core.
- Recommended: 2 CPU cores or more.
- RAM: Minimum: 1 GB RAM.
- Recommended: 2 GB RAM or more.
To install Puppeteer on a Liquid Web server running AlmaLinux, follow the steps covered in this article. They are laid out as a series of high-level tasks in this Puppeteer tutorial for your benefit.
Step #1. Access your Liquid Web server
To access your Liquid Web server via SSH for Puppeteer installation as a Liquid Web customer, follow the subsequent instructions.
1.1. Open the Terminal (Mac/Linux) or Command Prompt (Windows)
You can find the Terminal and Command Prompt applications on your system by searching for them in the start menu or equivalent area of the OS.
1.2. Connect to your Liquid Web server
To connect to your Liquid Web server, run the ssh command followed by your server’s IP address or hostname. Replace your_username with your SSH username provided by Liquid Web and your_server_ip with your server’s IP address or hostname:
ssh your_username@your_server_ip1.3. Enter your password
You’ll be asked to enter the SSH password that was provided by Liquid Web.
1.4. Verify your connection
Once you have established a connection, you will be shown a command prompt indicating that you are now logged into your Liquid Web server via SSH. You can now proceed with installing Puppeteer on your Liquid Web server.
Step #2. Update your AlmaLinux system
As a Liquid Web customer, it’s essential to keep your server’s operating system updated for security and performance reasons before installing Puppeteer. To update the AlmaLinux system, run the following dnf update command:
sudo dnf updateStep #3. Install Node.js and NPM
Puppeteer is a Node.js library so you’ll need Node.js installed on your Liquid Web server.
3.1. Check available Node.js streams
Before installing Node.js and Node Package Manager (NPM) check available Node.js streams by running the following dnf module list nodejs command:
sudo dnf module list nodejsHere is the output:
[root@mnk ~]# sudo dnf module list nodejs
Last metadata expiration check: 0:11:01 ago on Sun 03 Mar 2024 08:10:41 AM UTC.
AlmaLinux 8 - AppStream
Name Stream Profiles Summary
nodejs 10 [d] common [d], development, minimal, s2i Javascript runtime
nodejs 12 common [d], development, minimal, s2i Javascript runtime
nodejs 14 common [d], development, minimal, s2i Javascript runtime
nodejs 16 common [d], development, minimal, s2i Javascript runtime
nodejs 18 common [d], development, minimal, s2i Javascript runtime
nodejs 20 common [d], development, minimal, s2i Javascript runtime
Hint: [d]efault, [e]nabled, [x]disabled, [i]nstalled3.2. Install Node.js
Then, install Node.js by running the following command (dnf module install nodejs:18) where 18 represents the version. The version of Node.js you opt to use may be different:
sudo dnf module install nodejs:18Here is the output:
[root@mnk ~]# sudo dnf module install nodejs:18
Last metadata expiration check: 0:20:25 ago on Sun 03 Mar 2024 08:10:41 AM UTC.
Dependencies resolved.
====================================================================================================================================================
Package Architecture Version Repository Size
====================================================================================================================================================
Installing group/module packages:
nodejs x86_64 1:18.19.0-1.module_el8.9.0+3732+3b9a77a7 appstream 14 M
npm x86_64 1:10.2.3-1.18.19.0.1.module_el8.9.0+3732+3b9a77a7 appstream 2.1 M
Installing weak dependencies:
nodejs-docs noarch 1:18.19.0-1.module_el8.9.0+3732+3b9a77a7 appstream 10 M
nodejs-full-i18n x86_64 1:18.19.0-1.module_el8.9.0+3732+3b9a77a7 appstream 8.2 M
Installing module profiles:
nodejs/common
Enabling module streams:
nodejs 18
Transaction Summary
====================================================================================================================================================
Install 4 Packages
—-
—-
Installed:
nodejs-1:18.19.0-1.module_el8.9.0+3732+3b9a77a7.x86_64 nodejs-docs-1:18.19.0-1.module_el8.9.0+3732+3b9a77a7.noarch
nodejs-full-i18n-1:18.19.0-1.module_el8.9.0+3732+3b9a77a7.x86_64 npm-1:10.2.3-1.18.19.0.1.module_el8.9.0+3732+3b9a77a7.x86_64
Complete!3.3. Verify the version of Node.js installed
Once successfully installed, verify the version of Node.js installed by running one of the following commands:
node -vAlternatively, you can be run:
node --versionHere is the output:
[root@mnk ~]# node -v
v18.19.0
[root@mnk ~]# node --version
v18.19.03.4. Check the version of NPM
To check the version of NPM, issue one of the following commands:
npm -vOr, the alternative can be used:
npm --versionHere is the output:
[root@mnk ~]# npm -v
10.2.3
[root@mnk ~]# npm --version
10.2.3Step #4. Create a Node.js project
To create a directory for your Node.js project, run the following mkdir sample-puppeteer-project command:
mkdir sample-puppeteer-projectThen, change the current directory to sample-puppeteer-project by running the following command.
cd sample-puppeteer-projectStep #5. Initialize the Node.js project
To initialize the Node.js project, run the npm init command.
npm initThis command initializes the project with default settings, creating a package.json file if one does not already exist. Here is the output:
[root@mnk ~]# mkdir sample-puppeteer-project
[root@mnk ~]# cd sample-puppeteer-project
[root@mnk sample-puppeteer-project]# npm init
This utility will walk you through creating a package.json file.
It only covers the most common items, and tries to guess sensible defaults.
See `npm help init` for definitive documentation on these fields
and exactly what they do.
Use `npm install <pkg>` afterwards to install a package and
save it as a dependency in the package.json file.
Press ^C at any time to quit.
package name: (sample-puppeteer-project) sample-puppeteer-project
version: (1.0.0) 1.0.0
description: This is a sample puppeteer project
entry point: (index.js)
test command:
git repository:
keywords:
author:
license: (ISC) ISC
About to write to /root/sample-puppeteer-project/package.json:
{
"name": "sample-puppeteer-project",
"version": "1.0.0",
"description": "This is a sample puppeteer project",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "",
"license": "ISC"
}
Is this OK? (yes) yes
[root@mnk sample-puppeteer-project]#Step #6: Install Puppeteer
To install Puppeteer using npm, run this npm install puppeteer command:
npm install puppeteerHere is the output:
[root@mnk sample-puppeteer-project]# npm install puppeteer
up to date, audited 119 packages in 753ms
9 packages are looking for funding
run `npm fund` for details
found 0 vulnerabilitiesStep #7: Write a simple Puppeteer script
Let’s write a simple Puppeteer script to get started.
7.1. Create the JavaScript (JS) file
Create a new JavaScript file, for example, sample_script.js, and require Puppeteer at the top:
const puppeteer = require('puppeteer');7.2. Write the Puppeteer script inside an async function
Then, write the Puppeteer script inside an async function:
(async () => {
// Launch a new browser instance
const browser = await puppeteer.launch();
// Create a new page
const page = await browser.newPage();
// Navigate to a website
await page.goto('https://liquidweb.com');
// Take a screenshot
await page.screenshot({ path: 'liquidweb.png' });
// Close the browser
await browser.close();
})();7.3. Review the final Puppeteer script
The final Puppeteer script should look like the following:
Step #8: Run the new Puppeteer script
To run the new Puppeteer script, run the node sample_script.js command:
node sample_script.jsThis script will open a new instance of the Chrome browser (or Chromium) controlled by Puppeteer, then navigate to https://liquidweb.com, take a screenshot of the page, and save it as liquidweb.png in the same directory as your script. The browser window itself may not be visible on your screen because Puppeteer runs in headless mode by default, which means it runs without a visual user interface.
How to use Puppeteer
To use Puppeteer, please follow the steps in the section below.
1. Import Puppeteer
After you’ve installed Puppeteer in your project, you must import it into your JavaScript file:
const puppeteer = require('puppeteer');2. Launch a browser
To start using Puppeteer, you need to launch a browser instance. You can do this using the puppeteer.launch() method:
const browser = await puppeteer.launch();This method will launch a new session of the Chrome browser (or Chromium).
3. Open a page
Once you have a browser instance, you can open a new page/tab using the browser.newPage() method:
const page = await browser.newPage();This method will open a new blank page in the browser.
4. Navigate to a website
You can use the page.goto() method to navigate to a specific website:
await page.goto('https://liquidweb.com');This method will open the specified website in the browser.
5. Take screenshots
You can also take screenshots of the page using Puppeteer. For example, to take a screenshot of the entire page, you can use the page.screenshot() method:
await page.screenshot({ path: 'liquidweb.png' });6. Close the browser
Finally, don’t forget to close the browser instance when you’re done using Puppeteer using the await browser.close() method:
await browser.close();
This method will close the browser and end the Puppeteer session.
How to update Node.js and Puppeteer
To update Node.js, run the command dnf update nodejs:
sudo dnf update nodejsTo update Puppeteer, navigate to your project directory and run the following npm update puppeteer command:
npm update puppeteerHow to uninstall Node.js and Puppeteer
To uninstall Node.js, run the following dnf remove nodejs command:
sudo dnf remove nodejsTo uninstall Puppeteer, navigate to your project directory and run the npm uninstall puppeteer command:
npm uninstall puppeteer