How To Create a Fully Automated Job Board Using No-Code Tools
In this tutorial, we'll learn to create a job board website in a few simple steps, using only no-code tools like Automatio, Webflow, Google Sheets, and Zapier.
Join the DZone community and get the full member experience.Join For Free
In this tutorial I'm going to show you how to create a job board website in a few simple steps, using only no-code tools. First I will scrape the data from the Dribbble job board, and list those jobs on my Webflow website. Then I will automate that process, to pick up the new jobs once a day and update my site.
For getting the jobs data, I will use Automatio - a no-code web automation and data extraction tool that allows you to create bots visually and without writing a single line of code. Once you build a bot, it will run from the cloud server. It has nothing to do with your browser anymore. You can shut down the computer, but Automatio will still run and do the work.
Other tools that I will use in this guide are Google Sheets and Zapier. And for the website, I will use the Webflow job board template made by Jetboost.
Let’s do this!
Use the Following Steps:
- Setup website in Webflow where jobs will be displayed (create CMS collection)
- Scrape jobs data from job board using Automatio
- Send the jobs data to Google Sheets
- Send the jobs data from Google Sheets to Webflow website, through Zapier
- Schedule Automatio to scrape jobs once a day and update the Webflow website
Setup the Webflow Website and CMS Collection
The first thing that we need to do is to create a new project on Webflow. What is Webflow? It’s an online visual editor platform that allows you to build and launch websites without writing the code. For the purpose of this tutorial, I used the cloneable job board template. It already has a CMS collection created, we just have to edit it a little bit to fit our needs.
Don’t forget to save the changes and publish!
Automatio Extension Overview
Now let’s go to the Dribbble job board and open the Automatio extension. As you can see, it has good UI/UX and it’s very easy to work with. On the side you can see the actions:
- Input action - used to input data into form fields, search bars, text editors
- Click action - used to interact with elements such as buttons, links, dropdowns, etc
- Extract action - used to extract the data from the website
- Toolbox action - basically a box with a bunch of tools inside it such as taking screenshots, solving the captcha, simulating keyboard strokes, and more
- Paginate action - used to paginate through pages
In this case, we are going to use the extract action mostly.
Creating Parent Instance
First, we will extract the links for all of the job posts and then go to each of the job post pages to scrape the data we need. I will click on the job title and select the option from the dropdown that says the link in order to take the link from it. Then I will give a proper name for each data point, for example, “job post URL”. When done, just click the Let’s go button, and Create and Run.
We just created our first/parent instance! Let’s see what we got. If we go into the Automatio dashboard we will see there all the URLs from the job posts. Now we will go to each one of these URLs and scrape the data that we need.
To do that, we will create the new/child instance.
Creating Child Instance
Let’s go to the single job post page now and open the Automatio extension again. In the start, action changes the data type to be dynamic. That will give us the option to use the previous instance that we created, as a source of URLs of pages that we want to visit and scrape. You can choose how many results you want to get, and I am going to say 40.
Now let’s state what information we need from the job posts.
Before you run the bot, you can click on the preview option to see if everything is okay. If all is good, go create and run the instance. In the dashboard, there is logs feature where you can see what is going on actually in real-time.
Connect Automatio with Google Sheets
Besides exporting your data, you can connect your Google Sheet account and send it in a new sheet directly. When you click on the google sheets button you will see few options. You can create a new sheet or select the existing one. I will select the existing one and also make sure to be updated in real-time.
Then just click sync and that is that!
You will now see the data in your Google Sheet document.
Google Sheets to Webflow Through Zapier
Now let's send this data to our Webflow website by using Zapier.
- Select the new spreadsheet row as a trigger
- Connect your Google Sheet account
- Choose the Google Sheet document and tab
- Test trigger and continue
Now let’s connect our Webflow
- Select action event to create live item
- Connect your Webflow account and website
- Choose the CMS collection
- Connect the CMS collection fields with the Google Sheet document cells
- Test action and turn on the zap
Connect CMS Collection With Elements
Now we can see the data sent to our Webflow CMS collection. What we have to do now is to connect these CMS fields with the elements in our Webflow page.
Schedule to Daily Scrape Jobs
Now let’s schedule this whole process to scrape jobs once a day, and update our website. First, we will edit the parent instance. At the start, the action selects the trigger option to be scheduled. Set it for example to run on every 12 hours. Also, make sure to select the option stop at duplicate, and for the deduplication, reference selects the job post URL. This means that Automatio will scrape only the new links.
Now just click update the instance and that is set.
We also have to edit the child instance. Go in the start action again and give it another trigger which will be On instance finish and select the parent instance. This means that the child instance will run right after the parent instance finishes.
That’s it! We’re done!
We created the fully automated job board which will update itself daily and all that without writing a single line of code. How amazing? That's it for this tutorial! I hope that you found it useful.
Good luck and have fun!
Published at DZone with permission of Jelena Jovanovic. See the original article here.
Opinions expressed by DZone contributors are their own.