인사

처음 뵙겠습니다. yui라고 합니다. 프로그래밍 초학자입니다. Qiita에의 투고는 이번이 처음이 됩니다. 잘 부탁드립니다. 그런데, 프로그래밍을 공부하고 있어 현재 좌절기에 들어가 있습니다. (작은 사춘기적인 말을 했습니다만, 여러분은 좌절기를 어떻게 극복했습니까?) 그런 가운데, 프로그래밍을 배우는데 있어서 주로 입력밖에 하고 있지 않다는 것을 깨달았습니다. 「아웃풋 해 배우기의 정착을 깊게 하고 싶다(울음)」라고 생각하고 있었는데, Qiita에의 투고를 지인에게 추천 받았습니다. 배움을 타인에게 공유하면서 자신의 배움을 정착을 깊게 할 수 있다면 최고일까! 라고 생각 지금에 이릅니다. 초학자이기 때문에 이해하기 쉬운 말로 씹으면서 설명할 수 있도록 유의합니다. 모두 함께 공부 노력하자!

구현 환경

MacOS(MacBookPro)

VScode

Chrom

React

JavaScript

저자 정보

1990년생 레디👩

2020년 3월부터 프로그래밍 학습을 시작했습니다.

도트 설치 ⇨Progate⇨JS 특화형 프로그래밍 스쿨 ⇨2021년 6월 졸업 예정

현재 학습 진행 - HTML ,CSS ,JavaScript ,React ,Github

현직은 일반 회사원

nanoid(나노ID)란?

중복되지 않는 id 를 만들 수 있는 녀석

예를 들어, TODO 리스트를 구현할 때, 리스트에는 「·청소를 한다·세탁을 하는·요리를 한다」등의 TODO 항목을 할 수 있다.

PG의 감정
유저가 「세탁 끝났다」라면 「・세탁을 한다」의 항목은 삭제(혹은 완료) 버튼으로 완료할 수 있도록(듯이) 하고 싶다
맞아! 「TODO의 항목에 각각 id 를 붙인 다음에, 「이 id의 항목의 버튼을 클릭하면, 이 id의 항목을 삭제(완료)한다」라고 하는 코드를 쓰면 좋구나(💡)」

거기서 1이라든가 2라든지 3라든지의 간단한 숫자의 id를 붙여도 됩니다만, 우연히 「세탁을 한다」에도 「요리를 한다」에도 같은 숫자의 id가 붙어 버리면, 유저 는 세탁 밖에 완료하고 있지 않는데, 동시에 같은 id를 붙인 「요리를 한다」도 삭제(완료)가 되어 버립니다. ⇦TODO리스트로서 치명상 😨

여기서 슈퍼맨처럼 등장하는 것이 nanoid (나노 ID)!

nanoid를 사용하면 랜덤한 20문자 정도의 문자열(영숫자가 섞인 것)을 마음대로 만들어 줍니다.

nanoid 설치 방법

위의 링크에서 설치할 수 있습니다. 설치하려면 아래의 빨간색 테두리를 클릭 복사하여 터미널에 붙여 넣습니다.

터미널에 붙여넣으면 Enter를 누르면 완료됩니다. 간단 간단♪

제대로 설치할 수 있는지 여부는 VScode의 "package.json"안에

package.json

"nanoid": "^3.1.21",

라는 기재가 있으면 OK입니다.

참고문헌

naoid htps //w w. 음 pmjs. 코 m / Pac 카게 / Nanoi d

랜덤 문자열을 만들고 싶을 때 편리한 js 라이브러리 "nanoid"htps : // 코. bsws. 네 t/아르치 cぇ/242