JSON-ms · robson-muniz · Apr 16, 2026 · Apr 21, 2026 · Apr 21, 2026
diff --git a/package-lock.json b/package-lock.json
diff --git a/themes/jsonms-react-theme/.env.example b/themes/jsonms-react-theme/.env.example
@@ -0,0 +1,10 @@
+# JSON.ms React Theme — Environment Variables
+
+# The endpoint to fetch your JSON.ms profile data from.
+# Defaults to /mock-data.json (served from public/ by Vite for local development).
+# Replace with your real JSON.ms API endpoint in production.
+VITE_JSONMS_ENDPOINT=/mock-data.json
+
+# Examples:
+# VITE_JSONMS_ENDPOINT=https://api.json.ms/v1/data/your-project-uuid
+# VITE_JSONMS_ENDPOINT=http://localhost:9200/api/data/your-project-uuid
diff --git a/themes/jsonms-react-theme/dist/assets/index-C88zPcsS.js b/themes/jsonms-react-theme/dist/assets/index-C88zPcsS.js
diff --git a/themes/jsonms-react-theme/dist/assets/index-D3jU6TZV.css b/themes/jsonms-react-theme/dist/assets/index-D3jU6TZV.css
diff --git a/themes/jsonms-react-theme/dist/index.html b/themes/jsonms-react-theme/dist/index.html
@@ -0,0 +1,22 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <meta name="description" content="A minimalist About Me page powered by JSON.ms — fully dynamic, plug-and-play React theme." />
+    <meta name="theme-color" content="#6c63ff" />
+    <link rel="icon" type="image/svg+xml" href="/favicon.svg" />
+    <title>JSON.ms React Theme</title>
+    <link rel="preconnect" href="https://fonts.googleapis.com" />
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
+    <link
+      href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&family=JetBrains+Mono:wght@400;500&display=swap"
+      rel="stylesheet"
+    />
+    <script type="module" crossorigin src="/assets/index-C88zPcsS.js"></script>
+    <link rel="stylesheet" crossorigin href="/assets/index-D3jU6TZV.css">
+  </head>
+  <body>
+    <div id="root"></div>
+  </body>
+</html>
diff --git a/themes/jsonms-react-theme/dist/mock-data.json b/themes/jsonms-react-theme/dist/mock-data.json
@@ -0,0 +1,91 @@
+{
+  "settings": {
+    "theme": "dark",
+    "sections": {
+      "hero": true,
+      "about": true,
+      "skills": true,
+      "projects": true,
+      "contact": true
+    }
+  },
+  "profile": {
+    "name": "Alex Rivera",
+    "role": "Full-Stack Engineer & Open Source Contributor",
+    "bio": "I craft fast, accessible, and beautifully designed web products. Passionate about open-source ecosystems, developer tooling, and the intersection of great UX and solid engineering. When I'm not shipping features, I'm contributing to the tools I love — including JSON.ms.",
+    "avatar": "https://i.pravatar.cc/300?img=11",
+    "skills": [
+      "React",
+      "TypeScript",
+      "Node.js",
+      "GraphQL",
+      "Rust",
+      "Docker",
+      "PostgreSQL",
+      "Redis",
+      "Vite",
+      "Testing Library",
+      "Terraform",
+      "Linux"
+    ],
+    "projects": [
+      {
+        "title": "JSON.ms React Theme",
+        "description": "A plug-and-play React theme starter kit for the JSON.ms ecosystem. Dynamic rendering, zero hardcoded content, fully extensible.",
+        "tags": ["React", "TypeScript", "Vite", "JSON.ms"],
+        "url": "https://github.com/jsonms/react-theme",
+        "stars": 312
+      },
+      {
+        "title": "Forge CLI",
+        "description": "A blazing-fast scaffolding CLI written in Rust. Generates project boilerplate from Git templates in under 200ms.",
+        "tags": ["Rust", "CLI", "DevTools"],
+        "url": "https://github.com/alexrivera/forge-cli",
+        "stars": 1840
+      },
+      {
+        "title": "GraphQL Federation Gateway",
+        "description": "A lightweight, zero-dependency GraphQL federation gateway that stitches microservice schemas on-the-fly.",
+        "tags": ["GraphQL", "Node.js", "Microservices"],
+        "url": "https://github.com/alexrivera/gql-gateway",
+        "stars": 921
+      },
+      {
+        "title": "Pulse Dashboard",
+        "description": "Real-time infrastructure monitoring dashboard with WebSocket telemetry, metric graphs, and alert policies.",
+        "tags": ["React", "WebSockets", "PostgreSQL", "Docker"],
+        "url": "https://github.com/alexrivera/pulse",
+        "stars": 487
+      }
+    ]
+  },
+  "contact": {
+    "links": [
+      {
+        "label": "GitHub",
+        "href": "https://github.com/alexrivera",
+        "icon": "github"
+      },
+      {
+        "label": "LinkedIn",
+        "href": "https://linkedin.com/in/alexrivera",
+        "icon": "linkedin"
+      },
+      {
+        "label": "Twitter",
+        "href": "https://twitter.com/alexrivera",
+        "icon": "twitter"
+      },
+      {
+        "label": "Email",
+        "href": "mailto:alex@example.com",
+        "icon": "mail"
+      },
+      {
+        "label": "Website",
+        "href": "https://alexrivera.dev",
+        "icon": "globe"
+      }
+    ]
+  }
+}
diff --git a/themes/jsonms-react-theme/dist/mock.json b/themes/jsonms-react-theme/dist/mock.json
@@ -0,0 +1,58 @@
+{
+  "settings": {
+    "theme": "dark",
+    "sections": {
+      "hero": true,
+      "about": true,
+      "skills": true,
+      "projects": true,
+      "contact": true
+    }
+  },
+  "profile": {
+    "name": "Alex Developer",
+    "role": "Frontend Architect & UI Engineer",
+    "bio": "I am a passionate software engineer specializing in building exceptional digital experiences. I focus on modern web architecture, minimalist design, and scalable frontend solutions.",
+    "avatar": "https://i.pravatar.cc/300?img=68",
+    "email": "hello@example.com",
+    "location": "San Francisco, CA",
+    "skills": [
+      { "name": "React" },
+      { "name": "TypeScript" },
+      { "name": "Node.js" },
+      { "name": "GraphQL" },
+      { "name": "CSS/Sass" },
+      { "name": "Figma" }
+    ],
+    "projects": [
+      {
+        "title": "JSON.ms Theme Framework",
+        "description": "A robust, minimal framework for rendering dynamic websites from structured JSON data.",
+        "url": "https://example.com",
+        "tags": ["React", "TypeScript", "Vite"]
+      },
+      {
+        "title": "Minimal UI Kit",
+        "description": "A set of highly reusable, unstyled React components for building custom design systems.",
+        "repository": "https://github.com/example/ui-kit",
+        "tags": ["React", "CSS Variables"]
+      }
+    ],
+    "social": [
+      {
+        "platform": "GitHub",
+        "url": "https://github.com",
+        "label": "@alexdev"
+      },
+      {
+        "platform": "Twitter",
+        "url": "https://twitter.com",
+        "label": "@alex_codes"
+      },
+      {
+        "platform": "LinkedIn",
+        "url": "https://linkedin.com"
+      }
+    ]
+  }
+}
diff --git a/themes/jsonms-react-theme/dist/mock.yaml b/themes/jsonms-react-theme/dist/mock.yaml
@@ -0,0 +1,31 @@
+settings:
+  theme: system
+  sections:
+    hero: true
+    about: true
+    skills: true
+    projects: true
+    contact: true
+
+profile:
+  name: YAML Developer
+  role: Full Stack Engineer
+  bio: "I love writing clean configurations using YAML! This is a test to ensure the YAML parser is functioning correctly."
+  avatar: "https://i.pravatar.cc/300?img=12"
+  email: yaml@example.com
+  location: "YAML City"
+  skills:
+    - name: React
+    - name: TypeScript
+    - name: YAML
+    - name: Node.js
+  projects:
+    - title: "YAML Parser"
+      description: "A cool project that parses YAML into JSON.ms."
+      tags:
+        - React
+        - YAML
+  social:
+    - platform: GitHub
+      url: "https://github.com"
+      label: "@yamldev"
diff --git a/themes/jsonms-react-theme/index.html b/themes/jsonms-react-theme/index.html
@@ -0,0 +1,21 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <meta name="description" content="A minimalist About Me page powered by JSON.ms — fully dynamic, plug-and-play React theme." />
+    <meta name="theme-color" content="#6c63ff" />
+    <link rel="icon" type="image/svg+xml" href="/favicon.svg" />
+    <title>JSON.ms React Theme</title>
+    <link rel="preconnect" href="https://fonts.googleapis.com" />
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
+    <link
+      href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&family=JetBrains+Mono:wght@400;500&display=swap"
+      rel="stylesheet"
+    />
+  </head>
+  <body>
+    <div id="root"></div>
+    <script type="module" src="/src/main.tsx"></script>
+  </body>
+</html>