This Is The Perfect Project For Your React/TypeScript Resume

Select components are one of the most important components you will use in React, but how exactly do you create a good select component. In this video I will breakdown how to create a select component in React using only TypeScript and no additional React libraries.

📚 Materials/References:

🌎 Find Me Here:

⏱️ Timestamps:

00:00 - Introduction
00:25 - Sponsor - PropelAuth
01:12 - Setup
02:14 - Single Select HTML
11:05 - CSS
20:13 - Single Select Logic
29:08 - Multiselect Logic
37:16 - Multiselect CSS
39:45 - Keyboard Accessibility

#ReactJS #WDS #ReactCustomSelect

[akshatsheth]

bro great work... not just for this but for all the stuff .... learned a lot

[the_lee_effect]

I created something similar for my organization some few months ago since already made libraries couldn't serve our needs and they were a little difficult to overwrite or should I say hack into.. It had option to select all options, clear all options, scroll any selected option into view, an input field at the bottom of the list to add one extra option to the list with the ability to edit that one option, plus all the accessibility as well.. GREAT WORK KYLE 💪👍👍👍

[alphabutbeta]

Learned much more through this tutorial than the hours of online courses i purchased. Almost feel guilty for being able to watch this for free. Thanks King!

[royhyde]

What a wonderful video.. my knowledge of Typescript is low but I was able to follow your tutorial with alot of ease because of how well you teach. Keep up the great work.👏👏

[Кашель-оу]

Gold video, i used that instead react-select npm, great work!

[susmitobhattacharyya]

Super awesome man. You helped me by solving two bugs.... The keyboard accessibility was just the best!!!

[richnimbu]

You're such a good guy. I LOVE that I can always learn something from your videos.

[diweshkr]

Newly entered into javascript and react world... Great video 👏 keep up this great work 🙏

[Nil-jsbf]

Super helpful. I always reach for libraries for this kind of stuff so I had no idea how one would even begin implementing something like this. Your explanation was extremely concise and clear.

[waleedsharif]

Wow, today i actually needed this functionality in my project, thanks !

[pavelasafov]

Thank you! Very lucidly explained. I did it on jsx files, everything worked as I need for my project. Great!

[alecs]

I’ve learned so many things in this little amount of time ! Thank you so much !

[anshikgupta]

This is what I have been looking for. Thanks you have our back 🙌

[abdellatif.x]

As always, great content that make developers improve their knowledge 👏

[runngun]

I've had to make a similar component but I needed to add links in each selection and links for adding new items at the bottom without js and it took me 2 hrs to make it work without bugs

[eddyelamin]

Kyle, can we get a learn Typescript in 30 minutes video 🥲

[oleksandrluchytskyi]

Very interesting! 👍 But for resume i suggest few things. 1. Apply some sort order to the component's props (it is hard to read mix of func and props ) 2. To use " double quotes only for attribute's values (remove them from JS) 3. Move event handler logic from JSX to the separate event handler function.

[alexzhu]

using it for a few years and now I want to upgrade and I'm happy I did that.

[wdsenjoyer]

Amazing tutorial, .. as always to be fair. Loved it!

[cool_scatter]

Good stuff using vite instead of CRA! It's so much better in every single way.