@salmansaeed/nexa 1.0.0 → 1.0.2

package/README.md

@@ -1,17 +1,3 @@
-Here is your **full Nexa README**, upgraded from SG, aligned with your actual CLI behavior, and including:
-
-- correct commands (`nexa`, not `sg`)
-- global install instructions (very important)
-- npx usage
-- your new UI philosophy (Cleaner UI, prebuilt structure)
-- new component system
-- your branding
-
----
-
-# 📦 `README.md`
-
-````md
 # Nexa CLI
 
 **React Power. Angular Simplicity. Vite Speed. Cleaner UI. Prebuilt structure.**
@@ -51,7 +37,6 @@ it gives you a **fully structured application shell** with:
 ```bash
 npx --verbose @salmansaeed/nexa@latest new app <app-name>
 ```
-````
 
 ---
 
@@ -108,6 +93,12 @@ This will:
 
 Inside your project:
 
+```bash
+npm run nexa
+```
+
+or:
+
 ```bash
 npm run dev
 ```
@@ -279,15 +270,4 @@ Built and maintained by **Salman Saeed**
 ---
 
 # 🚀 Next step (highly recommended)
-
-Now that your README is strong:
-
-👉 Next best move:
-- add screenshots (massive impact on adoption)
-- or I can help you write:
-  - **npm page description**
-  - **GitHub landing page hero**
-  - **CLI demo GIF script**
-
-Just tell me 👍
 ```

package/bin/nexa.js

@@ -262,12 +262,51 @@ function createService(serviceName) {
 
   const content = `/**
  * File: src/services/${finalName}.js
- * Purpose: Service module stub for ${finalName}.
+ * Purpose: Service module for ${finalName}.
+ * Handles API calls and external integrations.
  */
 
-export default function ${finalName}() {
-  return null;
+const BASE_URL = "Add your url here for further use";
+
+/**
+ * Example GET request
+ */
+export async function get${finalName}() {
+  try {
+    const res = await fetch(\`\${BASE_URL}\`);
+    if (!res.ok) throw new Error("Failed to fetch ${finalName}");
+    return await res.json();
+  } catch (err) {
+    console.error("${finalName} GET error:", err);
+    throw err;
+  }
 }
+
+/**
+ * Example POST request
+ */
+export async function create${finalName}(payload) {
+  try {
+    const res = await fetch(\`\${BASE_URL}\`, {
+      method: "POST",
+      headers: {
+        "Content-Type": "application/json",
+      },
+      body: JSON.stringify(payload),
+    });
+
+    if (!res.ok) throw new Error("Failed to create ${finalName}");
+    return await res.json();
+  } catch (err) {
+    console.error("${finalName} POST error:", err);
+    throw err;
+  }
+}
+
+export default {
+  get${finalName},
+  create${finalName},
+};
 `;
 
   writeFileSafe(servicePath, content);
@@ -327,6 +366,7 @@ function createComponent(componentName) {
   );
 
   const jsxContent = `import React from "react";
+import logo from "../../assets/nexa.svg";
 import "./${finalName}.css";
 import ${childName} from "./${childName}";
 
@@ -337,7 +377,7 @@ const ${finalName} = () => {
         <div className="nexa-logo-wrap">
           <div className="nexa-logo-convex" />
           <div className="nexa-logo-shine" />
-          <h1 className="nexa-logo">N</h1>
+          <img src={logo} alt="Nexa Logo" className="nexa-logo-img" />
         </div>
 
         <h2 className="nexa-wordmark">${finalName}</h2>
@@ -426,16 +466,12 @@ export default ${childName};
   pointer-events: none;
 }
 
-.nexa-logo {
-  margin: 0;
-  font-size: 7rem;
-  line-height: 1;
-  font-weight: 800;
-  letter-spacing: -0.08em;
-  color: var(--nexa-primary);
-  text-shadow:
-    0 0 10px rgba(62, 231, 255, 0.28),
-    0 0 24px rgba(62, 231, 255, 0.14);
+.nexa-logo-img {
+  width: 112px;
+  height: 112px;
+  object-fit: contain;
+  position: relative;
+  z-index: 1;
   transform: scale(0.2);
   opacity: 0;
   filter: blur(14px);
@@ -577,8 +613,9 @@ export default ${childName};
     border-radius: 22px;
   }
 
-  .nexa-logo {
-    font-size: 5.8rem;
+  .nexa-logo-img {
+    width: 92px;
+    height: 92px;
   }
 
   .nexa-wordmark {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@salmansaeed/nexa",
-  "version": "1.0.0",
+  "version": "1.0.2",
   "description": "Nexa CLI for scaffolding React/Vite apps, components, services, and contexts with a cleaner UI and prebuilt structure",
   "bin": {
     "nexa": "bin/nexa.js"

package/template/public/index.html

@@ -1,9 +1,9 @@
-<!DOCTYPE html>
+<!doctype html>
 <html lang="en">
   <head>
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <link rel="icon" type="image/png" href="/favicon.png" />
+    <link rel="icon" type="image/svg+xml" href="/nexa.svg" />
     <link rel="manifest" href="/manifest.json" />
     <title>AG App</title>
   </head>

package/template/public/manifest.json

@@ -1,20 +1,15 @@
 {
-  "name": "AG App",
-  "short_name": "AG",
+  "name": "Nexa",
+  "short_name": "Nexa",
   "start_url": ".",
   "display": "standalone",
-  "background_color": "#0a0f24",
-  "theme_color": "#ffd700",
+  "background_color": "#07111f",
+  "theme_color": "#3ee7ff",
   "icons": [
     {
-      "src": "/logo.png",
-      "sizes": "192x192",
-      "type": "image/png"
-    },
-    {
-      "src": "/logo.png",
-      "sizes": "512x512",
-      "type": "image/png"
+      "src": "/nexa.svg",
+      "sizes": "any",
+      "type": "image/svg+xml"
     }
   ]
 }

package/template/public/nexa.svg

@@ -0,0 +1,55 @@
+<svg width="512" height="512" viewBox="0 0 512 512" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <defs>
+    <linearGradient id="bg" x1="0" y1="0" x2="512" y2="512" gradientUnits="userSpaceOnUse">
+      <stop offset="0%" stop-color="#040B16"></stop>
+      <stop offset="100%" stop-color="#07111F"></stop>
+    </linearGradient>
+
+    <linearGradient id="leftStroke" x1="110" y1="120" x2="220" y2="390" gradientUnits="userSpaceOnUse">
+      <stop offset="0%" stop-color="#F4F8FF"></stop>
+      <stop offset="55%" stop-color="#C9D7E8"></stop>
+      <stop offset="100%" stop-color="#7E8FA8"></stop>
+    </linearGradient>
+
+    <linearGradient id="rightStroke" x1="260" y1="120" x2="415" y2="390" gradientUnits="userSpaceOnUse">
+      <stop offset="0%" stop-color="#4EEBFF"></stop>
+      <stop offset="55%" stop-color="#1788FF"></stop>
+      <stop offset="100%" stop-color="#0A2A8B"></stop>
+    </linearGradient>
+
+    <filter id="blueGlow" x="120" y="80" width="320" height="340" filterUnits="userSpaceOnUse">
+      <feGaussianBlur stdDeviation="18" result="blur"></feGaussianBlur>
+      <feColorMatrix in="blur" type="matrix" values="0 0 0 0 0.18
+                0 0 0 0 0.74
+                0 0 0 0 1
+                0 0 0 0.45 0"></feColorMatrix>
+    </filter>
+
+    <filter id="whiteGlow" x="70" y="80" width="230" height="340" filterUnits="userSpaceOnUse">
+      <feGaussianBlur stdDeviation="16" result="blur"></feGaussianBlur>
+      <feColorMatrix in="blur" type="matrix" values="0 0 0 0 0.85
+                0 0 0 0 0.9
+                0 0 0 0 1
+                0 0 0 0.22 0"></feColorMatrix>
+    </filter>
+  </defs>
+
+  <rect width="512" height="512" rx="96" fill="url(#bg)"></rect>
+
+  <g filter="url(#whiteGlow)">
+    <path d="M126 370L178 145C182 129 196 118 213 118H225C242 118 258 127 267 141L332 249L305 292L213 154L165 364L126 370Z" fill="url(#leftStroke)" opacity="0.9"></path>
+  </g>
+
+  <g filter="url(#blueGlow)">
+    <path d="M233 140C242 127 258 118 275 118H387L316 393H280C262 393 245 384 236 369L170 262L198 219L289 356L345 154H275C258 154 246 148 233 140Z" fill="url(#rightStroke)"></path>
+  </g>
+
+  <path d="M126 370L178 145C182 129 196 118 213 118H225C242 118 258 127 267 141L332 249L305 292L213 154L165 364L126 370Z" fill="url(#leftStroke)"></path>
+
+  <path d="M233 140C242 127 258 118 275 118H387L316 393H280C262 393 245 384 236 369L170 262L198 219L289 356L345 154H275C258 154 246 148 233 140Z" fill="url(#rightStroke)"></path>
+
+  <path d="M322 156L358 156L300 380L279 380L322 156Z" fill="white" opacity="0.12"></path>
+
+  <circle cx="355" cy="143" r="10" fill="white" opacity="0.95"></circle>
+  <circle cx="355" cy="143" r="22" fill="#5BEFFF" opacity="0.18"></circle>
+</svg>

package/template/src/assets/nexa.svg

@@ -0,0 +1,55 @@
+<svg width="512" height="512" viewBox="0 0 512 512" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <defs>
+    <linearGradient id="bg" x1="0" y1="0" x2="512" y2="512" gradientUnits="userSpaceOnUse">
+      <stop offset="0%" stop-color="#040B16"></stop>
+      <stop offset="100%" stop-color="#07111F"></stop>
+    </linearGradient>
+
+    <linearGradient id="leftStroke" x1="110" y1="120" x2="220" y2="390" gradientUnits="userSpaceOnUse">
+      <stop offset="0%" stop-color="#F4F8FF"></stop>
+      <stop offset="55%" stop-color="#C9D7E8"></stop>
+      <stop offset="100%" stop-color="#7E8FA8"></stop>
+    </linearGradient>
+
+    <linearGradient id="rightStroke" x1="260" y1="120" x2="415" y2="390" gradientUnits="userSpaceOnUse">
+      <stop offset="0%" stop-color="#4EEBFF"></stop>
+      <stop offset="55%" stop-color="#1788FF"></stop>
+      <stop offset="100%" stop-color="#0A2A8B"></stop>
+    </linearGradient>
+
+    <filter id="blueGlow" x="120" y="80" width="320" height="340" filterUnits="userSpaceOnUse">
+      <feGaussianBlur stdDeviation="18" result="blur"></feGaussianBlur>
+      <feColorMatrix in="blur" type="matrix" values="0 0 0 0 0.18
+                0 0 0 0 0.74
+                0 0 0 0 1
+                0 0 0 0.45 0"></feColorMatrix>
+    </filter>
+
+    <filter id="whiteGlow" x="70" y="80" width="230" height="340" filterUnits="userSpaceOnUse">
+      <feGaussianBlur stdDeviation="16" result="blur"></feGaussianBlur>
+      <feColorMatrix in="blur" type="matrix" values="0 0 0 0 0.85
+                0 0 0 0 0.9
+                0 0 0 0 1
+                0 0 0 0.22 0"></feColorMatrix>
+    </filter>
+  </defs>
+
+  <rect width="512" height="512" rx="96" fill="url(#bg)"></rect>
+
+  <g filter="url(#whiteGlow)">
+    <path d="M126 370L178 145C182 129 196 118 213 118H225C242 118 258 127 267 141L332 249L305 292L213 154L165 364L126 370Z" fill="url(#leftStroke)" opacity="0.9"></path>
+  </g>
+
+  <g filter="url(#blueGlow)">
+    <path d="M233 140C242 127 258 118 275 118H387L316 393H280C262 393 245 384 236 369L170 262L198 219L289 356L345 154H275C258 154 246 148 233 140Z" fill="url(#rightStroke)"></path>
+  </g>
+
+  <path d="M126 370L178 145C182 129 196 118 213 118H225C242 118 258 127 267 141L332 249L305 292L213 154L165 364L126 370Z" fill="url(#leftStroke)"></path>
+
+  <path d="M233 140C242 127 258 118 275 118H387L316 393H280C262 393 245 384 236 369L170 262L198 219L289 356L345 154H275C258 154 246 148 233 140Z" fill="url(#rightStroke)"></path>
+
+  <path d="M322 156L358 156L300 380L279 380L322 156Z" fill="white" opacity="0.12"></path>
+
+  <circle cx="355" cy="143" r="10" fill="white" opacity="0.95"></circle>
+  <circle cx="355" cy="143" r="22" fill="#5BEFFF" opacity="0.18"></circle>
+</svg>

package/template/src/components/Home/Home.css

@@ -51,17 +51,12 @@
   pointer-events: none;
 }
 
-.nexa-logo {
-  margin: 0;
-  font-size: 7rem;
-  line-height: 1;
-  font-weight: 800;
-  letter-spacing: -0.08em;
-  color: var(--nexa-primary);
-  text-shadow:
-    0 0 10px rgba(62, 231, 255, 0.28),
-    0 0 24px rgba(62, 231, 255, 0.14);
-
+.nexa-logo-img {
+  width: 112px;
+  height: 112px;
+  object-fit: contain;
+  position: relative;
+  z-index: 1;
   transform: scale(0.2);
   opacity: 0;
   filter: blur(14px);
@@ -175,8 +170,9 @@
     border-radius: 22px;
   }
 
-  .nexa-logo {
-    font-size: 5.8rem;
+  .nexa-logo-img {
+    width: 92px;
+    height: 92px;
   }
 
   .nexa-wordmark {

package/template/src/components/Home/Home.jsx

@@ -1,4 +1,5 @@
 import React from "react";
+import logo from "../../assets/nexa.svg";
 import "./Home.css";
 
 const Home = () => {
@@ -8,7 +9,7 @@ const Home = () => {
         <div className="nexa-logo-wrap">
           <div className="nexa-logo-convex" />
           <div className="nexa-logo-shine" />
-          <h1 className="nexa-logo">N</h1>
+          <img src={logo} alt="Nexa Logo" className="nexa-logo-img" />
         </div>
 
         <h2 className="nexa-wordmark">Nexa</h2>