In Part I of this tutorial series we became acquainted with Axiom's user interface, and got to see one of the simplest forms that browser automation can take: namely, opening new tabs.

Here in Part II, we'll go over how to take your browser bots to the next level by instructing them to interact with individual web pages, and to navigate through multiple pages according to the ground rules that we define upfront.

In the process, we'll see how Axiom is able to pick up on the underlying patterns behind the data, and use those patterns to potentially save you hours upon hours of tedious clicking, copying, and pasting.

For our sample data, we'll scope out some dinner recipes from Allrecipes.com (opens new window) and let Axiom do the heavy lifting of scraping all the information we need (recipe name, prep time, ingredients, directions) to "automate" our weekly meal prep. This info can be automatically fed into a Google Sheet for safe keeping, but for our purposes here we will just have our browser bot display the scraped data in a popup window.

Once you get the hang of this kind of scraping functionality, you'll wonder how and why you ever performed tasks like this by hand in the first place!

1. Get ready to build

This tutorial assumes that you already completed Part I, and as such, you've already done the prerequisite work of installing Axiom and familiarizing yourself with how to get started.

If needed, you can review these introductory steps in the first half of Part I.

2. Create a new Axiom

Click Create New Axiom on the main menu.

Then select Start blank

3. Create a list of links to pages

On the screen that follows, select Get a list of links to pages as the first step in your automated process.

Enter the following URL in the corresponding field:

https://www.allrecipes.com/recipes/201/meat-and-poultry/chicken/ (opens new window)

I. Select links

Below the URL field, click on the Select links button.

This will redirect you to the tab you have open, but now you've got an extra superpower: the magic orange selector box.

With this power, you can click on any element on the page that contains a link, and it will be added to your list of data to be scraped.

That's not all, though: this selector box also picks up on repeated patterns if you feed it a few items. So after you click on the first three recipes at this top of this list, Axiom will automatically select all of the links that follow below.

How's that for artificial intelligence? 😁

Once Axiom has caught on to your pattern, click the Confirm button in the lower right corner.

II. Set a maximum number of results

We really don't need to scrape every single link from this list. For our purposes, 10 links should be plenty here.

To limit the maximum number of results, simply enter that number under Max results:

4. Interact with a page's interface

Click the + sign at the bottom of the menu to add another step. Select Interact with a page's interface.

I. Go to page

This will automatically add the first "step within the step," if you will, named Go to page. When you click on the Enter URL field, a sidebar will open up on the right to give you access to the data you scraped in the previous step.

Click on the yellow button in the sidebar to insert that data into the URL field.

II. Get data from a webpage

Within Step 2 - Interact with a page's interface, click on Sub step immediately below the Go to page section:

This will add another step within Step 2, rather than creating a Step 3.

For this step, select Get data from a webpage.

The process here is similar to what we did to select the links in Step 1, but now we will tell Axiom which specific bits of data we are interested in on each of the pages.

To do this, we'll start by navigating to this URL:

https://www.allrecipes.com/recipe/279987/sheet-pan-sweet-and-sour-chicken/ (opens new window)

Back on the Axiom menu, click the Select data button to regain your orange selector-box superpower.

But instead of scraping just one kind of data, this time we'll collect information for four separate fields:

• Recipe name
• Recipe summary
• Image
• Cook time
• Prep time

Start by selecting the name at the top of the page. This will be our first field.

Click the Add column sign on the selection menu to add another field.

Set the selector to html and click on the Recipe image

Click Add column again and repeat this process for the Ingredients section, followed by the Directions section.

You may have to play around with your orange selector boxes to get them just right. Don't get discouraged if you make a mistake—it's easy enough to undo and try again.

When all four fields are selected, your selection menu will look like this:

Click Confirm in the bottom-right corner when you're done.

5. Display the scraped data.

For our third and final step in the automation, we will tell Axiom to display the data we've gathered in a popup window. This is a simpler (though temporary) alternative to storing the data in a Google Sheet, which is also possible.

Back in the Axiom UI, click the green Add step sign below Step 2 in order to add Step 3. Select Display a message.

Click the yellow stadium in the Display message field, select Interact data. Clicking on it will open a popup to show us what the data actually looks like. Click Close and Save to confirm.

When the bot is fully assembled, your workflow should look like this:

6. Click the 'Play' button.

With all three steps in place, you're ready to run your new browser bot. Click the Play button at the bottom of the screen to fire it up.

When the automation is complete (this may take a few minutes), you'll be presented with a popup that looks like this:

...And that's all there is to it!

Congratulations, now you've got a list of some of the best chicken recipes you can find on the internet, without all of the tedious navigating, copying, and pasting you'd have to do otherwise.

In the process of automating our meal prep research, we encountered a core concept in computer programming: the loop.

This is where we begin to see Axiom's true power shining through—it enables us to take advantage of the tools that software engineers use to make our lives easier, without having to write a single line of code ourselves.

Indeed, you would need some pretty sophisticated coding skills to pull off a comparable feat. With Axiom, you can harness the power of an engineering team with just a few mouse clicks.

If we can be of help, please don't hesitate to contact us for one-on-one help or take a look at are Documentation.