How to Generate QRCode in React JS using Ant Design Components | Antd Custom QRCode Style

#reactjs #antd #qrcodegenerator
In this video tutorial I have explained how to generate QRCode in React JS using Ant Design components and how to customize Antd QRCode UI Style
This video focuses on
- How to generate QRCode in React JS using Ant Design components
- How to customize Antd QRCode UI Style
- How to create qr-code for any string or link in different colors
- How to add icon inside qr code in react app
- How to insert logo inside qr code in react app
- How to implement react qr code generator with logo
- How to change size of QRCode using antd v5 components ui in react app
- How to customize qr code color to match our theme color
- How to show loading on react qrcode generator component
- How to set react qrcode as expired
- How to refresh react qr code generator with logo to fetch the latest qrcode
- How to set status of antd QRCode generator component in react js app
- How to make react qrcode bordered or borderless
- How to add onRefrsh callback for antd qrcode to re-generate or refresh react js qr code generator
- How to implment ant design v5 QR Code Generator in react JS
If you are new to ant-design, I have already added an intro video on ant-design and overview of its components at • Ant Design UI library ... link, please go through that video to set up the ground for further components implementation.
For more details on ant-design, please visit its documentation at ant.design/components/qrcode
Happy Coding!

[@alifaditya1547]

thankyou sir, really helpfull

[@CodeWithAamir]

So nice of you ❤ keep watching

[@hakan126]

My best youtube content creator.

[@CodeWithAamir]

Thank you so much @Hakan Ahmet
Really appreciate your encouragement!

[@balenziphillip8410]

i really appreciate your effort, great work

[@CodeWithAamir]

So nice of you!

[@deadmaxmax8632]

Hii amir actually I was facing one issue is that onClick of download I passing documentID through get api call so how to download that file in zip format can you please help?

[@CodeWithAamir]

Hi @Deadmax,
Can you share the response of that API call, what it returns back, a file or a link or what?

[@deadmaxmax8632]

@@CodeWithAamir it returns a download file onclick file(zip) gets downloaded bottom like how normally does

[@CodeWithAamir]

Hi @Deadmax,
I still can not fully understand what you got when you call the api by passing the documentID? If it returns link to the file you can just mimic the tag click to download it or if its a proper file you can create blob out of it and then download. So not sure what you exactly get from server?
Thanks

[@deadmaxmax8632]

@@CodeWithAamir see I m passing the the document id to api to check whether file is ready to download like if document id has value then file is downloadable so in body response I m getting download file highlighted with blue when I m clicking on that my file gets downloaded in zip so this I want to on my download I'm UI so could please help me with snippet 🙏it will be helpful

[@CodeWithAamir]

If I understood correctly you have the link of the file that to be downloaded something like www.example.com/linkForFile and when you click on this link then file gets downloaded Right?