💡 Label completed quests and labs on Qwiklabs webpages
Qwiklabs is a great online self-paced learning platform for getting hands-on experience of the Google Cloud Platform. It has over 400 hands-on labs and quests for learn and practice.
As a Qwiklabs user, I figure out it is messy and damp to look up unenrolled quests or incompleted labs from the Qwiklabs Catalog page or Search Results. I desired to make a straight-forward way to identify the catalog items, by adding a green check-circle next to those completed.
🎯 Objectives of this project
- To develop a handy way to implement the enhancement to Qwiklabs website in a web browser.
- To indicate completed labs and quests in Qwiklabs Catalog pages, thereby easier to inspect the self-learning progress and look for unenrolled quests or incompleted labs.
- To design a location to store and update the name list of the completed items.
For more information, please read this post on my GitHub Pages.
This script requires an userscript manager to run it in your browser, such as Tampermonkey for Google Chrome. Click on the following button to download and install the script via your userscript manager.
Retrieve the local records and annotate each card in “My Favorites”, “Featured Learning”, and “What’s Hots” sections with badges.
-
Screenshot:
Retrieve the local records and annotate each lab and quest item as the following:
-
Label the completed labs and quests with a green check-circle.
-
Highlight any new labs and quests that you have not yet explored in yellow color.
- Automatically add a record for the quest or update the info to the local database
- Add a green check-circle at the end of the page title if the quest is completed.
-
Automatically add a record for the lab or update the info to the local database.
-
Add a green check-circle at the end of the lab title if the lab is completed.
-
Annotate each table row in Activities tab with colors.
-
Offer pagination links for you to view all previous activities.
-
One-click update the labs and quests status from the activity table to your browser database.
-
Show 🔍 quick links to search activities that are ⚠ mismatched with database records.
[ ] Sync IndexedDB across computers (#7)
Would you like to buy me a coffee? I would really appreciate it if you could support me for this projects.
Pull requests for new features, bug fixes, and suggestions are welcome!
Distributed under the GNU General Public License v3.0
![dependabot[bot] avatar](https://avatars.githubusercontent.com/in/29110?v=4 "dependabot[bot]")
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent
