Refactor qrcoder

.devcontainer/qrcoder/devcontainer.json

@@ -0,0 +1,27 @@
+{
+    "name": "QR Code Generator",
+    "image": "mcr.microsoft.com/dotnet/sdk:9.0",
+    "features": {},
+    "workspaceFolder": "/workspaces/Ivy-Examples/qrcoder",
+    "postCreateCommand": "dotnet tool install -g Ivy.Console",
+    "postStartCommand": "dotnet watch",
+    "forwardPorts": [5010],
+    "portsAttributes": {
+      "5010": {
+        "label": "QR Code Generator",
+        "onAutoForward": "openPreview"
+      }
+    },
+    "customizations": {
+      "vscode": {
+        "extensions": [
+          "ms-dotnettools.csharp",
+          "ms-vscode.powershell",
+          "ms-dotnettools.csdevkit"
+        ]
+      },
+      "codespaces": {
+        "openFiles": ["Apps/ProfileApp.cs"]
+      }
+    }
+  }

qrcodeprofile/Apps/ProfileApp.cs → qrcoder/Apps/ProfileApp.cs

@@ -68,12 +68,13 @@ async void HandleSubmit()
             Layout.Vertical().Gap(6).Padding(2)
             | Text.H2("Create Your Profile")
             | Text.Block("Fill in your information to create a shareable profile")
-            | new Separator()
             | formView
             | Layout.Horizontal()
                  | new Button("Create Profile").HandleClick(new Action(HandleSubmit))
                     .Loading(loading).Disabled(loading)
                 | validationView
+            | Text.Small("This demo uses QRCoder library to generate vCard QR codes for contact sharing.")
+            | Text.Markdown("Built with [Ivy Framework](https://github.com/Ivy-Interactive/Ivy-Framework) and [QRCoder](https://github.com/codebude/QRCoder)")
         ).Height(Size.Full());
 
         // Main content - QR Code display

qrcodeprofile/Dockerfile → qrcoder/Dockerfile

@@ -9,17 +9,17 @@ ARG BUILD_CONFIGURATION=Release
 WORKDIR /src
 
 # Copy and restore
-COPY ["QrCodeProfile.csproj", "./"]
-RUN dotnet restore "QrCodeProfile.csproj"
+COPY ["QrCoderExample.csproj", "./"]
+RUN dotnet restore "QrCoderExample.csproj"
 
 # Copy everything and build
 COPY . .
-RUN dotnet build "QrCodeProfile.csproj" -c $BUILD_CONFIGURATION -o /app/build
+RUN dotnet build "QrCoderExample.csproj" -c $BUILD_CONFIGURATION -o /app/build
 
 # Publish stage
 FROM build AS publish
 ARG BUILD_CONFIGURATION=Release
-RUN dotnet publish "QrCodeProfile.csproj" -c $BUILD_CONFIGURATION -o /app/publish /p:UseAppHost=true
+RUN dotnet publish "QrCoderExample.csproj" -c $BUILD_CONFIGURATION -o /app/publish /p:UseAppHost=true
 
 # Final runtime image
 FROM base AS final
@@ -31,4 +31,4 @@ ENV PORT=80
 ENV ASPNETCORE_URLS="http://+:80"
 
 # Run the executable
-ENTRYPOINT ["dotnet","./QrCodeProfile.dll"]
+ENTRYPOINT ["dotnet","./QrCoderExample.dll"]

qrcodeprofile/GlobalUsings.cs → qrcoder/GlobalUsings.cs

@@ -25,4 +25,4 @@
 global using System.Globalization;
 global using System.Reactive.Linq;
 
-namespace QrCodeProfile;
+namespace QrCodeExample;

qrcoder/Program.cs

@@ -0,0 +1,23 @@
+using IvyQrCodeProfileSharing.Apps;
+
+CultureInfo.DefaultThreadCurrentCulture = CultureInfo.DefaultThreadCurrentUICulture = new CultureInfo("en-US");
+var server = new Server();
+#if DEBUG
+server.UseHotReload();
+#endif
+server.AddAppsFromAssembly();
+server.AddConnectionsFromAssembly();
+var customHeader = Layout.Vertical().Gap(2)
+    | new Html(@"
+        <div>
+          <a href=""https://github.com/codespaces/new?hide_repo_select=true&ref=main&repo=Ivy-Interactive%2FIvy-Examples&machine=standardLinux32gb&devcontainer_path=.devcontainer%2Fqrcoder%2Fdevcontainer.json&location=EuropeWest"">
+            <img src=""https://github.com/codespaces/badge.svg"" alt=""Open in GitHub Codespaces"" />
+          </a>
+        </div>
+      ");
+var chromeSettings = new ChromeSettings()
+    .DefaultApp<ProfileApp>()
+    .UseTabs(preventDuplicates: true)
+    .Header(customHeader);
+server.UseChrome(chromeSettings);
+await server.RunAsync();

qrcodeprofile/QrCodeProfile.csproj → qrcoder/QrCoderExample.csproj

@@ -6,7 +6,7 @@
     <ImplicitUsings>enable</ImplicitUsings>
     <Nullable>enable</Nullable>
     <NoWarn>CS8618;CS8603;CS8602;CS8604;CS9113</NoWarn>
-    <RootNamespace>QrCodeProfile</RootNamespace>
+    <RootNamespace>QrCoderExample</RootNamespace>
   </PropertyGroup>
 
   <ItemGroup>

qrcodeprofile/QrCodeProfile.sln → qrcoder/QrCoderExample.sln

@@ -2,7 +2,7 @@ Microsoft Visual Studio Solution File, Format Version 12.00
 # Visual Studio Version 17
 VisualStudioVersion = 17.5.2.0
 MinimumVisualStudioVersion = 10.0.40219.1
-Project("{FAE04EC0-301F-11D3-BF4B-00C04F79EFBC}") = "Hello", "QrCodeProfile.csproj", "{039638F3-A6D7-FB67-E733-27BD896EFDC4}"
+Project("{FAE04EC0-301F-11D3-BF4B-00C04F79EFBC}") = "QrCodeExample", "QrCodeExample.csproj", "{039638F3-A6D7-FB67-E733-27BD896EFDC4}"
 EndProject
 Global
 	GlobalSection(SolutionConfigurationPlatforms) = preSolution

qrcoder/README.md

@@ -0,0 +1,78 @@
+# QR Code Generator
+
+<img width="1917" height="913" alt="image" src="https://github.com/user-attachments/assets/db0376d5-f4f7-4785-946a-214338c008f2" />
+
+
+## Created Using Ivy
+
+Web application created using [Ivy-Framework](https://github.com/Ivy-Interactive/Ivy-Framework).
+
+**Ivy** - The ultimate framework for building internal tools with LLM code generation by unifying front-end and back-end into a single C# codebase. With Ivy, you can build robust internal tools and dashboards using C# and AI assistance based on your existing database.
+
+Ivy is a web framework for building interactive web applications using C# and .NET.
+
+## Interactive Example For QR code generation
+
+This example demonstrates QR code generation using the [QRCoder library](https://github.com/codebude/QRCoder) integrated with Ivy. QRCoder is a pure C# Open Source.
+
+**What This Application Does:**
+
+This specific implementation creates a **Profile Creator** application that allows users to:
+
+- **Create User Profiles**: Fill out a form with personal information (name, email, phone, LinkedIn, GitHub)
+- **Generate vCard QR Codes**: Automatically creates contact cards (vCard format) encoded in QR codes
+- **Share Contact Information**: Users can scan the generated QR code to automatically add the contact to their phone
+- **Real-time Form Validation**: Validates email format and URL patterns for LinkedIn/GitHub profiles
+- **Interactive UI**: Split-panel layout with form on the left and QR code preview on the right
+
+**Technical Implementation:**
+
+- Uses QRCoder's vCard payload generator for structured contact data
+- Generates Base64-encoded PNG images for web display
+- Implements form validation with custom rules
+- Creates resizable panel layout for optimal user experience
+- Handles form submission with loading states and error display
+
+## One-Click Development Environment
+
+[![Open in GitHub Codespaces](https://github.com/codespaces/badge.svg)](https://github.com/codespaces/new?hide_repo_select=true&ref=main&repo=Ivy-Interactive%2FIvy-Examples&machine=standardLinux32gb&devcontainer_path=.devcontainer%2Fqrcoder%2Fdevcontainer.json&location=EuropeWest)
+
+Click the badge above to open Ivy Examples repository in GitHub Codespaces with:
+- **.NET 9.0** SDK pre-installed
+- **All Ivy Examples** available for exploration
+- **Navigate to `qrcoder` folder** to run this QR Code Generator
+- **Ready-to-run** development environment
+- **No local setup** required
+
+## How to Run
+
+1. **Prerequisites**: .NET 8+ SDK
+2. **Navigate to the example**:
+   ```bash
+   cd qrcoder
+   ```
+3. **Restore dependencies**:
+   ```bash
+   dotnet restore
+   ```
+4. **Run the application**:
+   ```bash
+   dotnet watch
+   ```
+5. **Open your browser** to the URL shown in the terminal (typically `http://localhost:5010`)
+
+## How to Deploy
+
+Deploy this example to Ivy's hosting platform:
+
+1. **Navigate to the example**:
+   ```bash
+   cd qrcoder
+   ```
+2. **Deploy to Ivy hosting**:
+   ```bash
+   ivy deploy
+   ```
+This will deploy your QR code generation application with a single command.
+
+## For more details, see the [Ivy Documentation](https://docs.ivy.app)