Before we get started, let me point out that I won’t be getting lengthy on how to open the tools in each browser since everyone can do that with Google, and the easiest way is to right click the web page and select Inspect Element or Inspect, if you're using Chrome.
The following is a brief, but detailed, and rapidly escalating tutorial of things any Canvas User can do with Developer Tools. Along the way, I will share some community resources that will help guide you with additional information.
My primary resources are the encyclopedia (Mozilla Developer Network documentation) and the commentary on it (Stack Overflow), using Google to get me to the content I need. I often start with a solution from Stack Overflow and then go look up the right way to do it using MDN.
I'll also add that W3 andW3Schools are great resources for what we're doing.
If you have questions or need assistance, please ask in a comment, it will help others.
If you work through these tutorials and find any issues (or Canvas breaking changes) please let me know and I will get it fixed right away.
Please let me know if you would like to contribute, I would be happy to add new tutorials and information. Contribute new tutorials with API endpoints that work for user/student roles, no advanced permissions.
I used to develop web applications and content management systems; since 2013 I've been cobbling together Canvas integrations and features for K12 Online & Blended Learning...KOBL. From LAMP stack to Canvas stack(?), and trying to make it portable one project at a time.