Why {useState} Is Wrapped In Curly Bracket When Importing in React

I encountered an error while importing "useState" in my react app, the correct way is to wrap it in a curly bracket, but somehow, I forgot to include the curly bracket and was thrown an error in my browser.

Here's what happened, I am importing useState from react, from where it was exported. When exporting, there are two ways to do that; it's either a named export or a default export.

From the code above, you can see that the difference between both is the export method, and named export is quite specific. For named export you can have zero, one or more export per module, and when importing, the import name is strictly the same as the export name and it has to be wrapped in a curly bracket.

While for a default module, it's only one default export per module, also your import name can vary from the export name and it's not wrapped in curly bracket.

Since useState is a named export, it should be imported wrapped in a curly bracket.

Need more clarity on modules, check out this article on it