Turn any page into an API

[atej]

Find yourself visiting a page often just to see what's new?

The list helper gets you the latest posts right within the Kit app.

Get Started

Install

In your ~/.kenv: npm install @aseemtaneja/kit-list

API-fy a page

Step 1: Go to the page
Step 2: Open up the Elements tab in Dev Tools and gather the required CSS selectors
Step 3: Make a script and you're done

For example, the following script allows you to browse Frontend Masters courses:

// Name: Frontend Masters
// Description: Browse courses from frontendmasters.com
// Author: Aseem Taneja
// Twitter: @aseemtaneja

import '@johnlindquist/kit';
const list = await npm('@aseemtaneja/kit-list');

const { choices } = await list('https://frontendmasters.com/courses/', {
        containerSelector: '.MediaItem',
        hrefSelector: 'h2 a',
        descriptionSelector: '.description',
        metaSelector: '.Instructor .name',
      });

const itemUrl = await arg('Go to', choices);

await $`open ${itemUrl}`;

To see everything you can do 👉🏽 View the docs on GitHub

[johnlindquist]

This looks great!

Would you mind adding a little bit more info to your post? It would really help the generated pages look much nicer:

https://www.scriptkit.com/atej/a-list-helper-to-consume-regular-html-pages-like-apis

[atej]

Updated the description. Thank you!

[cfritze64]

Cool-o. Initial test adapting it to 9to5mac.com is working great.