Skip to content

sidd0894/QR-Code-Generator-with-react

Repository files navigation

QR Code Generator

This project is built using React (Vite) and Tailwind CSS.
In React, it utilizes the useState() hook to manage the state of the text input field, background color of the QR code, the src of the image in the image tag, and the character warning that appears when the user enters the # or & characters. It also uses the useEffect() hook, which runs whenever its dependencies change.

How to Run This Project

  1. Install VSCode: Download and install VSCode if you haven't already.
  2. Install Node.js: Download and install Node.js (which includes npm).
  3. Clone or Download the Repository:
    • Clone the repository using Git: git clone <repository-url>, or
    • Download the ZIP file from the green "Code" button on the repository page.
  4. Open the Project:
    • Open VSCode and navigate to the folder containing the project files.
  5. Install Dependencies:
    • Open the terminal in VSCode using Ctrl + ` (or Cmd + ` on Mac), and run the command npm install (or npm i) to install the required packages.
  6. Run the Project:
    • After installation, run npm run dev in the terminal. This will start the development server and provide a URL (usually http://localhost:5173).
  7. View the Project:
    • Open your browser and navigate to the provided URL to see the project in action.