민프

[React][TypeScript] QR코드를 생성해보자 (feat. qrcode.react) 본문

[React]

[React][TypeScript] QR코드를 생성해보자 (feat. qrcode.react)

민프야 2023. 3. 23. 13:27

https://www.npmjs.com/package/qrcode.react

 

qrcode.react

React component to generate QR codes. Latest version: 3.1.0, last published: 9 months ago. Start using qrcode.react in your project by running `npm i qrcode.react`. There are 691 other projects in the npm registry using qrcode.react.

www.npmjs.com

먼저, qrcode.react 라이브러리를 설치합니다. 이를 위해 npm을 사용하면 다음 명령어를 입력합니다:

npm install qrcode.react

설치가 완료되면, QR 코드를 생성할 컴포넌트에서 라이브러리를 불러온 후 

아래 코드와 같이 적용시켜보자

import QRCode from 'qrcode.react';


function QRCodeComponent() {
  const qrData = 'https://www.example.com';

  return <QRCode value={qrData} />;
}

결과화면은 아래와 같다

'[React]' 카테고리의 다른 글

[React] react-router-dom 에서 URL 파라미터를 받아와보자  (0) 2023.04.04
[React][TypeScript] useState 리스트 필터링 및 삭제  (0) 2023.03.31
[React][TypeScript] npm http-server은 무엇일까?  (0) 2023.03.21
[React][TypeScript][MUI] MUI TextField 커스텀해보자  (0) 2023.03.20
[React][TypeScript][MUI] MUI DatePicker를 커스텀 해보자  (0) 2023.03.20
'[React]' Related Articles more
Comments