https://github.com/yehezkielgunawan/qr-generator

Simple QR Code Generator
https://github.com/yehezkielgunawan/qr-generator

frontend nextjs nextjs-typescript react react-typescript reactjs typescript

Last synced: 2 months ago
JSON representation

Simple QR Code Generator

• Host: GitHub
• URL: https://github.com/yehezkielgunawan/qr-generator
• Owner: yehezkielgunawan
• License: mit
• Created: 2022-11-30T13:38:55.000Z (over 2 years ago)
• Default Branch: main
• Last Pushed: 2025-04-11T02:53:25.000Z (2 months ago)
• Last Synced: 2025-04-11T03:36:01.318Z (2 months ago)
• Topics: frontend, nextjs, nextjs-typescript, react, react-typescript, reactjs, typescript
• Language: TypeScript
• Homepage: https://qr.yehezgun.com
• Size: 3.07 MB
• Stars: 36
• Watchers: 1
• Forks: 3
• Open Issues: 5
• Metadata Files:
  • Readme: README.md
  • Changelog: CHANGELOG.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# Simple QR Generator

![qr-generator](https://socialify.git.ci/yehezkielgunawan/qr-generator/image?logo=https%3A%2F%2Fcdn-icons-png.flaticon.com%2F512%2F1233%2F1233055.png%3Fw%3D740%26t%3Dst%3D1669899478~exp%3D1669900078~hmac%3Dcdb7088b7f105d5383eb605a29732548b0798f2895f3f4fe06afbb0ed5a35f17&name=1&owner=1&pattern=Solid&theme=Dark)

[![forthebadge](https://res.cloudinary.com/yehez/image/upload/v1635325228/made-by-typescript_mz1tue.svg)](https://forthebadge.com)

This is just a quick mini project of a QR Generator. The live demo can be accessed at [qr.yehezgun.com](https://qr.yehezgun.com)

## ⚡ What's included here?

- Toolings for linting, formatting, and conventions configured.

  `eslint`, `prettier`, `husky`, & `lint-staged.`

- The ESLint config is bundled in [`eslint-config-yehezgun`](https://www.npmjs.com/package/eslint-config-yehezgun)

- ✨Basic responsive layout configuration (through Tailwind CSS)

- 📜Basic `standard-version` to generate Changelog, you can run `npx standard-version --skip.bump --skip.commit --skip.tag`

- SEO Optimization (using next-SEO)

- Now using Next.js 13 with Rust Compiler Minification enabled (you can disable it at next.config.js)

## How to use it?

- Open [qr.yehezgun.com](https://qr.yehezgun.com)

- Write the string or url that you want to generate as QR Code

- You can select the QR Code style

- If you want it, you also can download the QR Code

- You also can generate the QR Code by passing the query param using `qr_value`, for example `https://qr.yehezgun.com?qr_value=https://google.com`, the default QR Value will be changed to `https://google.com`

- It's better to use the link shortener to shorten the QR Value url if the QR Value input is more than 30 characters.

## References

- [Tailwind CSS Official Docs](https://tailwindcss.com/)

- [html-to-image library](https://www.npmjs.com/package/html-to-image)