adportal
Val Town is a collaborative website to build and scale JavaScript apps.
Deploy APIs, crons, & store data β all from the browser, and deployed in milliseconds.
Viewing readonly version of main branch: v288View latest version
This project provides a utility to periodically fetch stylesheets from dev.to and make them available for use in your own projects.
A cron job that:
- Periodically fetches the dev.to homepage
- Extracts the stylesheet links using regex
- Stores the extracted links in blob storage
- Keeps track of changes and maintains a version history
- Sends email notifications when changes are detected
An HTTP endpoint that:
- Serves the latest stylesheet links in various formats
- Provides JavaScript and CSS embed options
- Offers an API to access current and historical stylesheet data
- Includes documentation and usage examples
-
Set up the Stylesheet Fetcher:
- Set the cron trigger on
devto-stylesheet-fetcher.tsto run at your desired interval (e.g., daily) - The first run will fetch the initial stylesheets
- Set the cron trigger on
-
Set up the Stylesheet Provider:
- Set the HTTP trigger on
devto-stylesheet-provider.ts - Access the root URL for documentation and usage examples
- Set the HTTP trigger on
There are several ways to use the dev.to stylesheets in your project:
<script src="https://your-val-town-url.val.run/embed.js"></script>
This will dynamically load all the dev.to stylesheets into your page.
<link rel="stylesheet" href="https://your-val-town-url.val.run/embed.css">
This loads a CSS file that imports all the dev.to stylesheets.
Fetch the stylesheets programmatically:
fetch("https://your-val-town-url.val.run/api/stylesheets")
.then(res => res.json())
.then(data => {
// Use the stylesheet URLs as needed
console.log(data.stylesheets);
});
GET /- Documentation and status pageGET /api/stylesheets- Get the current stylesheets as JSONGET /api/history- Get the history of stylesheet changesGET /embed.js- JavaScript snippet to load the stylesheetsGET /embed.css- CSS file that imports all the stylesheets
The utility uses Val Town's blob storage with the following keys:
devto_stylesheets- Current stylesheet datadevto_stylesheets_last_updated- Timestamp of last updatedevto_stylesheets_history- History of stylesheet changes
- The utility relies on the current structure of dev.to's HTML. If dev.to changes their HTML structure, the regex extraction may need to be updated.
- The utility only extracts stylesheet links and does not handle inline styles or dynamically loaded stylesheets.
- Dev.to may have usage restrictions or rate limits that could affect the fetcher.
- Add support for selective stylesheet inclusion
- Implement stylesheet minification and combination
- Add support for custom CSS overrides
- Implement more robust error handling and retry logic