meta_pixel
Tapesearch Logo
Log in
Syntax - Tasty Web Development Treats

775: Components We Need on Every Project

Syntax - Tasty Web Development Treats

Wes Bos

Tech News, News, Technology

4.9 • 1.2K Ratings

🗓️ 29 May 2024

⏱️ 56 minutes

🧾️ Download transcript

Summary

In today’s episode, Scott and Wes dive into the essential components they need on every web project, discussing whether to build them from scratch or leverage existing libraries—everything from navigation bars and modals to toast messages and icons. Show Notes 00:00 Welcome to Syntax! 01:48 Brought to you by Sentry.io. 02:53 Nav / Mobile Nav. 08:43 Header. 10:41 Toast message. Wes’ TikTok Demo. 18:51 Portal. 21:02 Drawer. 22:56 Auth forms. 28:49 Dialog / Modal. 31:30 Whats the difference between popover and dialog? 33:48 Confirm. Scott’s YouSureAboutThat. 35:46 Bonus tip on becoming a better developer. 36:29 Admin menu. Level Up Tutorials - Side Menu Demo. 37:51 Scott’s package directory rant. 40:26 Mobile only / Desktop only. 40:41 Client only. 40:57 Admin table. 41:23 The dump. 43:39 Share / Social links. Syntax ShareWindow. 45:44 Markdown renderer. 45:58 Tabs. 46:08 User menu. 46:18 Icon. 48:07 Loading. 49:21 Drop-down menu. 49:31 Accordion. CSS Tricks - How to Animate the Details Element. 52:13 Sick Picks + Shameless Plugs. Sick Picks Scott: Supercommunicators. Wes: Klack, Mech Vibes. Shameless Plugs Scott: Syntax on YouTube. Hit us up on Socials! Syntax: X Instagram Tiktok LinkedIn Threads Wes: X Instagram Tiktok LinkedIn Threads Scott:X Instagram Tiktok LinkedIn Threads Randy: X Instagram YouTube Threads

Transcript

Click on a timestamp to play from that location

0:00.0

Welcome to Syntax today. We have a show for you on components and utilities that we need for every project out there.

0:08.0

So whenever you're starting up a new project, I find myself making a lib folder and either copy,

0:14.6

pasting, mp. installing, making my own.

0:17.5

And then the same goes for like UI as well.

0:20.4

It's like, oh, I feel like I need these things in every single project that I work on, which A, is awesome that the browser is actually moving towards giving us those.

0:30.0

But we're not there yet. So we're going to talk about all the different components out there whether you should build it yourself or install something and a whole bunch of stuff around that.

0:39.0

My name's Wes. I'm from Canada with me as always. Scott how you doing Scott. Hey doing good doing super good. In fact I've been working really hard on a starter kit for myself. Wes when we we went to React Miami, I showed you the dance

0:55.5

app that I built, and I built it really rapidly.

0:58.1

Like I built it on the plane ride over.

1:00.0

I was impressed.

1:01.0

Like, very impressed at how quickly you put that together.

1:03.4

Yeah, so I figured, hey, you know what, I have this kind of starter that I work with typically,

1:10.0

like what if I were to just really formalize that?

1:12.6

So I've been working on a starter kit that kind of encompasses this stuff and it really has gotten

1:17.5

me thinking like, what are things that made that development process fast?

1:23.3

What are the things that I needed in that site build?

1:27.0

I end up needing in most builds over time

1:29.1

because when you start any project,

1:30.9

you can often feel like, hey hey I only need this and this and

1:34.2

and then oh wait never mind I need this as well I need a toast menu I need this I

1:39.0

need that yeah and next thing you know you're rebuilding or adding like the same components to every project. So yeah I thought it would be a great topic to go through some of this stuff. It's been on my mind and what else has been on my mind is the errors that come into our century because let me tell you they come into my

1:54.6

email and I see them come in all the time and some of them are ones that we need to

...

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.