meta_pixel
Tapesearch Logo
Log in
Syntax - Tasty Web Development Treats

Hasty Treat - Keyboard Events Are Surprisingly Interesting

Syntax - Tasty Web Development Treats

Wes Bos

Tech News, Technology, News

4.9 • 1.2K Ratings

🗓️ 8 February 2021

⏱️ 22 minutes

🧾️ Download transcript

Summary

In this Hasty Treat, Scott and Wes talk about keyboard events and some of the fascinating things you can do with them! Prismic - Sponsor Prismic is a Headless CMS that makes it easy to build website pages as a set of components. Break pages into sections of components using React, Vue, or whatever you like. Make corresponding Slices in Prismic. Start building pages dynamically in minutes. Get started at prismic.io/syntax. LogRocket - Sponsor LogRocket lets you replay what users do on your site, helping you reproduce bugs and fix issues faster. It’s an exception tracker, a session re-player and a performance monitor. Get 14 days free at logrocket.com/syntax. Show Notes 03:04 - The Events http://keycode.info/ keydown beforeInput Keypress - deprecated inputType tells you whether the event is inserting text, replacing text, inserting a line break, etc. keyup change event - only fires when you focus out https://github.com/w3c/uievents/issues/220 08:02 - Event meta data "key": "c", "keyCode": 67, "which": 67, "code": "KeyC", "location": 0, "altKey": false, "ctrlKey": false, "metaKey": true, "shiftKey": false Others: .locale .repeat 16:46 - Media keys https://developers.google.com/web/updates/2019/02/chrome-73-media-updates play, pause, ect Overkill app: https://krausefx.com/blog/introducing-overkill-dont-let-itunes-interrupt-your-workflow 18:32 - When might you use key codes? Space bar to stop a video on a page Building a game Making a web app feel more like an app Links Better Touch Tool Syntax 315: Hasty Treat - Hyper Productivity with Keyboard Shortcuts + Window Management Tweet us your tasty treats! Scott’s Instagram LevelUpTutorials Instagram Wes’ Instagram Wes’ Twitter Wes’ Facebook Scott’s Twitter Make sure to include @SyntaxFM in your tweets

Transcript

Click on a timestamp to play from that location

0:00.0

Monday Monday Monday open wide dev fans get ready to stuff your face with javascript CSS node module barbecue tips get work flows break dancing soft skills web development the hastiest the

0:13.5

Carrazius the tastiest web development treats coming in hot. Here is West

0:19.2

Barracuda boss and Scott L. Toro Lungo to Lenski

0:25.2

Welcome to syntax and this Monday hasty treat we're going to be talking about keyboard events now

0:32.7

This is something that is surprisingly interesting and one of those topics that you don't really get into until you have to write

0:39.5

Some sort of a keyboard event and then you got a Google everything and figure out what's going on there

0:45.2

So we're going to give you a little bit of a a heads up or a look into the wide world of keyboard events and

0:51.1

And some of the more fascinating and interesting things about that my name is Scott Lenski

0:55.1

I'm a developer from Denver, Colorado and with me as always is the keyboard master

0:59.8

West boss. Hey

1:01.8

What's up? What's up, West? This episode is sponsored by two of our favorite sponsors here at syntax and that's prismic and

1:08.9

Log rocket now log rocket is the perfect place for you to see all of your errors and exceptions happen in real time in a

1:17.2

Scrubbable video replay even gives you a network request tab and your redux store and your error logs and anything you'd like to see when you are

1:26.5

Scrubbing through a video, you know a lot of these new tools use video and headless browsers

1:32.2

This way to really understand how people are using the site and log rocket is one of those tools that is just really really

1:38.7

Stepping up the game here and allowing you to solve bugs

1:41.4

So if you want to try log rocket head on to log rocket.com for slash syntax

1:46.0

So I don't think you'll get 14 days for free also sponsored by prismic

1:49.6

Prismic is the headless CMS that makes it easy to build websites

1:54.0

With a set of components. It's kind of interesting. I talked about their slices feature a couple episodes again

1:59.8

I don't talk about it a little bit more because the more I was like I like did that ad read and and I

2:05.8

Played with it myself before the ad read and then I just sort of like been thinking about it over the last couple weeks

...

Please login to see the full transcript.

Disclaimer: The podcast and artwork embedded on this page are from Wes Bos, and are the property of its owner and not affiliated with or endorsed by Tapesearch.

Generated transcripts are the property of Wes Bos and are distributed freely under the Fair Use doctrine. Transcripts generated by Tapesearch are not guaranteed to be accurate.

Copyright © Tapesearch 2026.