How can I set the value of a select input in React?
Learn of all the different ways to set the value of a selected input in React with this quick guide.
Code Articles
30 seconds of code contains a curated collection of code articles covering a wide range of development needs. The collection spans many topics, ranging from simple coding problems to theoretical concepts and development techniques.
-
React · -
React · React useBodyScrollLock hook
Do you need to lock the body scroll when a modal is open? Perhaps this custom hook can help.
-
React · Email and callable telephone links
Render links formatted to send an email (
mailto:link) or call a phone number (tel:link). -
React · Button with ripple effect
Learn how to create an animated button with a ripple effect when clicked.
-
React · Create a textarea React component with word or character limit
Create your custom textarea components, with a word or character limit in React.
-
React · Mapping data structures to React components
Ever wanted to transform an array into a table or an object into a tree view? Here are some React components that can help you do just that.
-
React · Collapsible content React components
Collapsible content is a common UI pattern. Learn how to create collapsible content components in React in this short guide.
-
React · Tooltips, alerts and modals in React
Dialog components like tooltips, alerts and modals are essential for user interaction. Learn how to create them in React.
-
React · Tag input field
Create a custom input field with selectable tags, using React.
-
React · Toggle component
Render a simple toggle component in React.
-
React · Lazy-loading images in React
Learn how to create your own lazy loading image component in React.
-
React · Show/hide password toggle component
Ever wanted to show the password the user is typing? Here's how you can create a password input field with a reveal button in React.
-
React · Stateful checkbox with multiple selection
Render a checkbox list that uses a callback function to pass its selected value/values to the parent component.
-
React · Countdown timer
Create a countdown timer that prints a message when it reaches zero, using React.
-
React · Star rating component
Create your very own star rating component in React.
-
React · Automatic text linking in React
Ever wondered how to detect links in plaintext strings and make them clickable? A little ingenuity combined with React can get you there.
-
React · File drag and drop area
Create a file drag and drop React component for a single file.
-
JavaScript · Check if a JavaScript collection is empty
Quickly determine if a collection of values is empty in JavaScript.
-
JavaScript · Invert the key-value pairs of a JavaScript object
Learn how to invert the key-value pairs of an object in JavaScript.
-
JavaScript · Convert between CSV and JavaScript arrays, objects or JSON
Serialize and deserialize CSV data in JavaScript with this in-depth guide.
-
JavaScript · Unwind a JavaScript object
Create an array of objects from an object and one of its array-valued properties.
-
JavaScript · Nest linked JavaScript objects
Learn how to recursively nest objects linked to one another in a flat array.
-
JavaScript · Walk through a JavaScript object depth-first
Create a generator that walks through all the keys of a given object.
-
React · React rendering
Take a deep dive into React's rendering process to understand the basics, performance optimization and the role of state management in it.