QR Code Generator

SaaS Platform for Dynamic QR Codes & Branded Web Pages

QR Code Generator Project

This project is a full-scale SaaS web application designed for creating and managing dynamic QR codes connected to live, customizable web pages. The platform goes beyond basic QR generation and provides users with a structured system for building, publishing, and maintaining content through a personal dashboard.

Each QR code links to a dynamic public page that can be updated at any time without regenerating the QR itself. This allows content to evolve while keeping the physical or distributed QR code unchanged. The application includes standard SaaS workflows such as user registration and authentication, subscription and plan management, feature-based limitations, project organization, and public page rendering.

Product Functionality

Content and Web Page Builder

Users create content using a modular page builder that supports text blocks, links, structured sections, contact information, and other content modules. Pages are published under a public URL structure (/w/[qrId]) and are accessible without authentication. Content updates are handled dynamically through the dashboard, ensuring that published QR codes remain valid while the underlying content changes.

QR Code Generation and Custom Design

The system supports QR code creation for multiple use cases, including personal profiles, promotional pages, and campaign-based content. QR codes can be visually customized with color schemes, shapes, and styling options. Branded QR codes are supported and can be aligned with an organization's visual identity without affecting functionality.

QR Code Generator Screenshots - Image 1
1 / 23

User Dashboard

The dashboard provides structured management of projects and QR codes, including listing, filtering, editing, and content updates. Users can manage personal profile information and review subscription status, available features, and usage limits directly within the interface.

Subscriptions and Feature Limits

The platform implements plan-based access control, limiting the number of dynamic QR codes and available features depending on the selected subscription. Upgrade and downgrade flows, subscription status display, and access enforcement are handled consistently across the application.

Technical Architecture and Stack

The application is built using a modern frontend stack: Next.js 16 (App Router), React 19, TypeScript, React Query, Axios, React Hook Form with Zod, and SCSS Modules.

Architecture Structure

The architecture follows a clear layered structure: app/ — routing and page composition, features/ — domain-specific business logic (authentication, subscriptions, projects, QR management), shared/ — reusable UI components, configuration, and infrastructure. Strict import boundaries are enforced to maintain clear separation of concerns and prevent cross-layer dependencies.

API Layer

The API layer uses a centralized Axios instance with interceptors for consistent request handling, normalized error responses, refresh token logic, and protection against race conditions.

Authentication

Authentication is based on JWT, with access tokens stored in memory and refresh tokens stored in configurable storage. Automatic session refresh and controlled redirects are implemented to ensure stable user sessions.

State and Data Management

State and data management are handled through React Query, providing caching, controlled invalidation, centralized query keys, and unified network error handling.

UI System

The UI system is built with SCSS Modules and design tokens, ensuring consistent styling, predictable UI states, and a scalable component structure.

Positioning

This product is not a static QR code generator. Each QR code represents a managed digital entity with an associated live web page. Users retain control over content, presentation, and access while maintaining a stable QR reference. The platform is designed as a maintainable SaaS system with a focus on structured architecture, extensibility, and long-term use.

What We Delivered

  • Full-stack SaaS application with user authentication and subscription management
  • Dynamic QR code generation with custom design options
  • Modular page builder for creating and managing web pages
  • Public page rendering system with dynamic content updates
  • User dashboard with project and QR code management
  • Plan-based feature limitations and subscription workflows
  • Structured architecture with clear separation of concerns
  • Production-ready codebase with modern React patterns

Result

The platform successfully delivers a complete SaaS solution for dynamic QR code management, enabling users to create, customize, and maintain QR codes with associated web pages through an intuitive interface.

The structured architecture ensures maintainability and extensibility, making it easy to add new features and scale the platform as user needs evolve.

Case Studies

QR Code Generator — SaaS Platform for Dynamic QR Codes & Branded Web Pages | H-Studio