Coding Challenge #84: Word Definition Extension

Published: 29 November 2017
on channel: The Coding Train
41,462
1k

In this coding challenge, I attempt to make a chrome extension that looks up a selected word’s definition using the Wordnik API. Code: https://thecodingtrain.com/challenges...

🎥 Previous video:    • Coding Challenge #83: Chrome Extensio...  
🎥 Next video:    • Coding Challenge #85: The Game of Life  
🎥 All videos:    • Coding Challenges  

References:
🔤 Programming from A to Z: http://shiffman.net/a2z
📚 chrome.extension reference: https://developer.chrome.com/extensio...
🔠 Wordnik: https://www.wordnik.com/

Videos:
🚂 My video on Cross Browser Extensions:    • 11.8: Cross-Browser Extensions - Prog...  
🔌 Chrome Extensions Playlist:    • Session 11: Chrome Extensions - Progr...  
🔴 Coding Train Live 107:    • Live Stream #107: Chrome Extensions C...  

Related Coding Challenges:
🚂 #82 Image Chrome Extension - The Ex-Kitten-sion!:    • Coding Challenge #82: Image Chrome Ex...  
🚂 #83 Chrome Extension with p5.js Sketch - Doodle Chrome Extension:    • Coding Challenge #83: Chrome Extensio...  

Timestamps:
00:00 Welcome to a Coding Challenge!
00:53 Content Script, Background Script and Pop-ups
04:08 Get the selected text in the Content Script
07:34 Send the selected text to the Background Script
08:57 Receive the selected text in the Background Script
10:38 Store the word in a global variable in the Background Page
11:47 Get the word in the Pop-up from the Background Page
13:10 Set the variable to window to make it globally accessible
15:04 Get the definition of the word from the Wordnik API
23:23 Final Output and adding Styles

Editing by Mathieu Blanchette
Animations by Jason Heglund
Music from Epidemic Sound

🚂 Website: http://thecodingtrain.com/
👾 Share Your Creation! https://thecodingtrain.com/guides/pas...
🚩 Suggest Topics: https://github.com/CodingTrain/Sugges...
💡 GitHub: https://github.com/CodingTrain
💬 Discord: https://thecodingtrain.com/discord
💖 Membership: http://youtube.com/thecodingtrain/join
🛒 Store: https://standard.tv/codingtrain
🖋️ Twitter:   / thecodingtrain  
📸 Instagram:   / the.coding.train  

🎥 Coding Challenges:    • Coding Challenges  
🎥 Intro to Programming:    • Start learning here!  

🔗 p5.js: https://p5js.org
🔗 p5.js Web Editor: https://editor.p5js.org/
🔗 Processing: https://processing.org

📄 Code of Conduct: https://github.com/CodingTrain/Code-o...

This description was auto-generated. If you see a problem, please open an issue: https://github.com/CodingTrain/thecod...

#chromeextensions #bookmarklets #wordnikapi #definition #javascript


Watch video Coding Challenge #84: Word Definition Extension online without registration, duration hours minute second in high quality. This video was added by user The Coding Train 29 November 2017, don't forget to share it with your friends and acquaintances, it has been viewed on our site 41,462 once and liked it 1 thousand people.