✨ QR Code Generator ✨

s

A React Native mobile application that allows you to easily generate QR codes from different types of content.

📱 Overview

This application allows you to generate QR codes in a simple and intuitive way from various sources:

• 📝 Text: create a QR code from any text
• 🔗 URL: generate a QR code for a website
• 🖼️ Image: incorporate an image into your QR code
• 👤 Contact: create a QR code to share your contact details

Once the QR code is generated, you can easily share it or save it to your gallery.

💻 Demo

Home screen with selection of QR code types    
QR code generation interface with customization options

🚀 Features

• Intuitive and modern user interface
• Support for multiple content types
• Smooth animations for better user experience
• Import images from gallery
• Capture photos with camera
• Share and save generated QR codes

🛠️ Technologies Used

• React Native - Mobile framework
• Expo - React Native development platform
• NativeWind - Tailwind CSS for React Native
• React Native QR Code SVG - QR code generation
• Iconsax React Native - Icon library
• React Native View Shot - Component screenshots
• Expo Sharing - File sharing
• Expo Image Picker - Image and photo selection

📋 Prerequisites

• React Native development environment
• Node.js LTS
• Git
• Watchman (for macOS or Linux only)
• Pnpm
• Cursor or VS Code ⚠️ Make sure to install all recommended extensions from .vscode/extensions.json

👋 Quick Start

Clone the repository and install dependencies:

git clone https://github.com/user/repo-name
cd ./repo-name
pnpm install

To launch the application on iOS:

pnpm ios

To launch the application on Android:

pnpm android

🧩 Project Structure

The project is based on Obytes starter and follows an organized structure:

🛠️ Architecture Technique

graph TD
  A[React Native Frontend] --> B[QR Code Generator - qrcode-svg]
  A --> C[Image Picker - Expo]
  A --> D[Capture - View Shot]
  A --> E[Share/Save - Expo Sharing]
  B --> F[QR Code Customization]
  D --> G[Gallery Save Option]

Loading

📦 Technologies Utilisées

Technologie	Utilisation
React Native	Base du projet mobile
Expo	Outils de développement et build
react-native-qrcode-svg	Génération des QR codes
Expo Image Picker	Choix et capture d'images
react-native-view-shot	Capture d'écran de composants
Expo Sharing	Partage de fichiers
NativeWind	Styling avec Tailwind pour React Native
Iconsax React Native	Librairie d’icônes

🚀 Installation

git https://github.com/kteken10/reactnative_qrcode_app
cd reactnative_qrcode_app
pnpm install

Pour lancer sur iOS :

pnpm ios

Pour lancer sur Android :

pnpm android

📋 Prérequis

• Node.js LTS
• pnpm
• Expo CLI
• VS Code ou Cursor

🤝 Contribution

Contributions are welcome! Feel free to open an issue or submit a pull request.

📄 License

This project is under MIT license.

✨ Credit

Developed with ❤️ using Obytes starter