How to make an Open Graph Scraper (Node, XPath, JavaScript)

In this tutorial, you're going to learn how to make an open graph scraper using Node, XPath and a VanillaJS front-end.

01:41 App Setup
04:57 Back end
14:07 Front end

— Follow Me —
Twitter: https://www.twitter.com/codebubb
Facebook: https://www.facebook.com/juniordevelopercentral/
Blog: https://www.juniordevelopercentral.com/
— Thanks! —

In the video we're going to make an open graph scraper which could potentially be created in just client-side code however most requests to access a web url would be blocked in the browser so we'll send a request for a URL from a Node.js back end.

The Node server will also parse our open graph data with XPath and reconstruct the data in to a JavaScript object which we can then send to the client as JSON data.

Our VanillaJS front-end will consume the response from our API endpoint and we'll display the open graph data using a simple front-end.

This might not be the kind of app that you create as a standalone project but there might be a need in a larger application to parse some data from an external web page and you can certainly use these principals of using an open graph scraper to get data from a web page into an object to be used in either your server side or client side code.

Check out the rest of the Junior Developer Central Full Stack Apps here: https://www.youtube.com/watch?v=m2ZzRZemc98&list=PLpc_YvcwbxaTSuBQZkJdt7UKsWAC9wyR2

#fullstackapps Channel Handle @codebubb