Web Portfolio Projects: API-Based Chrome Developer Tool

Course details

Building web applications on APIs has become more and more standard, but it remains a difficult skill to master for developers. Working with the intricate connections of API-based applications can be challenging; however, you can build a developer tool, built into your browser, that communicates with web content and shows your skills to prospective employers. In this course, instructor Leigh Lawhon helps you combine two critical skills: APIs calls and developer tool creation. Using practical examples, Leigh demonstrates how to build a Chrome Developer Tool (DevTool) that interacts with the GitKraken Glo Board API. Along the way, she steps through the basics of working with APIs, how to authenticate using personal access tokens, and how to use Fetch and Promises to get data from the Glo Board API.

Concepts

0. Introduction

01 - Create a Chrome developer tool
02 - What you should know
03 - Use the GitHub exercise files

1. Understand the Tools

04 - Learn about Chrome DevTools
05 - Work with APIs
06 - Learn the Chrome API
07 - Learn the Glo API and Swagger documentation

2. Build a Chrome Developer Tool

08 - Build a dev tool in five minutes
09 - Sending messages with the Chrome API
10 - Challenge - Communicate between panel and content
11 - Solution - Communicate between panel and content

3. Authenticate with Glo

12 - Authenticate with personal access tokens
13 - Use Fetch and Promise to get data
14 - Use Fetch to get Glo Boards
15 - Challenge - Promises and loops
16 - Solution - Promises and loops
17 - Connect the data to the interface

4. Build the Comment Interface

18 - Use Glo API to save comments
19 - Challenge - Create new comments
20 - Solution - Create new comments

Conclusion

21 - Learn more and thank you