About Nanoid

The nanoid

Nanoid is a npm package that generates a unique string each time we call the nanoid function.

Note: You can read more about the nanoid function on the official NPM website.

Why we need nanoid

Each time we pass the props item in a component, it generates a child element. React needs a unique key to uniquely distinguish these child elements.

How to install

Like all packages, we simply run the following command:

npm install nanoid

Note: This step has already been done here.

How to use

To generate the unique string, we simply call nanoid and pass this value as a prop, as we did in the code snippet below.

import {nanoid} from "nanoid"

id: nanoid()

Observe this in the following code: