Intro to React Select pt. 1

Cathy Casey-Richards - Jun 26 '21 - - Dev Community

Today is the first part of my series on React Select. This intro is perfect if you are completely new to React Select or React in general.

Setting things up

I started by setting up a base project using create-react-app. I called my app "demo-app".
npm create-react-app demo-app

Once my app is ready to use, I installed React Select and got to work!
npm i --save react-select

Utilizing React Select

Now that I have React Select installed, I can begin to use it by importing it and referencing it.
A simple implementation of React Select with a placeholder

Adding Options

Next, we can add an option to the select in the format of:
{ value: 'value1', label: 'Label 1'}
Now the React Select has a single option

Now that we have a simple implementation ready, I used GitKraken to view & commit my changes.

And there you have it! Keep an eye out for my follow-up articles that show you more advanced usages of React Select.

You can view of video walkthrough of this on YouTube!

. . . . . . . . . .
Terabox Video Player