create-aziz-app 3.1.0 → 3.1.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-aziz-app",
-  "version": "3.1.0",
+  "version": "3.1.1",
   "description": "Create Aziz.js apps — lightweight Next.js clone with file-based routing, React hooks, and API routes",
   "keywords": [
     "aziz.js",

package/template/app/page.js

@@ -4,7 +4,7 @@ export default function Page() {
 
     return (
         <div style={{ padding: '40px 32px', maxWidth: '900px', margin: '0 auto' }}>
-            <h1>Welcome Home 👋</h1>
+            <h1>Welcome to Aziz.js</h1>
 
             <div class="card">
                 <h2>Counter</h2>

package/template/api/contact.js

@@ -1,39 +0,0 @@
-// API Route: POST /api/contact  (classic style — api/contact.js)
-//
-// Demonstrates validation, cookies, and NextResponse helpers.
-
-const { NextResponse } = require('../_framework/next-response');
-
-// In-memory store (replace with a real database in production)
-const messages = [];
-
-async function GET(request) {
-    return NextResponse.json({ count: messages.length, messages });
-}
-
-async function POST(request) {
-    let body;
-    try {
-        body = await request.json();
-    } catch (err) {
-        return NextResponse.json({ error: 'Invalid JSON body' }, { status: err.status || 400 });
-    }
-
-    const { name, email, message } = body;
-
-    if (!name || !email || !message) {
-        return NextResponse.json(
-            { error: 'name, email and message are required' },
-            { status: 400 }
-        );
-    }
-
-    const entry = { name, email, message, at: new Date().toISOString() };
-    messages.push(entry);
-
-    const res = NextResponse.json({ message: `Thanks, ${name}! We received your message.`, entry }, { status: 201 });
-    res.cookies.set('last_contact', name, { path: '/', maxAge: 60 * 60 });
-    return res;
-}
-
-module.exports = { GET, POST };

package/template/api/createUser.js

@@ -1,69 +0,0 @@
-// API Route: /api/createUser
-// Next.js App Router style
-
-const { NextResponse } = require('../_framework/next-response');
-
-// Mock database
-let users = [
-    { _id: '1', name: 'Aziz Ahmed', email: 'aziz@example.com', role: 'admin', phone: '123-456-7890' }
-];
-
-// POST handler
-async function POST(request) {
-    try {
-        // Parse request body
-        const body = await request.json();
-        const { name, email, password, role, phone } = body;
-
-        // Validation
-        if (!name || !email || !password) {
-            return NextResponse.json(
-                { 
-                    error: 'Validation failed',
-                    message: 'Name, email, and password are required'
-                },
-                { status: 400 }
-            );
-        }
-
-        // Check if email already exists
-        if (users.find(u => u.email === email)) {
-            return NextResponse.json(
-                { error: 'User with this email already exists' },
-                { status: 409 }
-            );
-        }
-
-        // Create new user
-        const newUser = {
-            _id: String(users.length + 1),
-            name,
-            email,
-            password, // In production, hash this with bcrypt!
-            role: role || 'user',
-            phone: phone || '',
-            createdAt: new Date().toISOString()
-        };
-
-        users.push(newUser);
-
-        // Return user data (without password)
-        const { password: _, ...userData } = newUser;
-
-        return NextResponse.json(
-            {
-                message: 'User created successfully',
-                user: userData
-            },
-            { status: 201 }
-        );
-    } catch (error) {
-        console.error('Create user error:', error);
-        return NextResponse.json(
-            { error: 'Failed to create user' },
-            { status: 500 }
-        );
-    }
-}
-
-module.exports = { POST };

package/template/api/hello.js

@@ -1,17 +0,0 @@
-// API Route: /api/hello
-// Next.js App Router style
-
-const { NextResponse } = require('../_framework/next-response');
-
-async function GET(request) {
-    const { searchParams } = new URL(request.url);
-    const name = searchParams.get('name') || 'World';
-    
-    return NextResponse.json({
-        message: `Hello, ${name}!`,
-        timestamp: new Date().toISOString(),
-        method: request.method
-    });
-}
-
-module.exports = { GET };

package/template/api/loginUser.js

@@ -1,61 +0,0 @@
-// API Route: /api/loginUser
-// Next.js App Router style
-
-const { NextResponse } = require('../_framework/next-response');
-
-// Mock database
-const users = [
-    { _id: '1', name: 'Aziz Ahmed', email: 'aziz@example.com', password: 'admin123', role: 'admin' },
-    { _id: '2', name: 'John Doe', email: 'john@example.com', password: 'user123', role: 'user' }
-];
-
-// POST handler
-async function POST(request) {
-    try {
-        // Parse request body
-        const body = await request.json();
-        const { email, password } = body;
-
-        // Validation
-        if (!email || !password) {
-            return NextResponse.json(
-                { error: 'Email and password are required' },
-                { status: 400 }
-            );
-        }
-
-        // Find user
-        const user = users.find(u => u.email === email);
-        
-        if (!user) {
-            return NextResponse.json(
-                { error: 'Invalid credentials' },
-                { status: 401 }
-            );
-        }
-
-        // Check password (in production, use bcrypt!)
-        if (user.password !== password) {
-            return NextResponse.json(
-                { error: 'Invalid credentials' },
-                { status: 401 }
-            );
-        }
-
-        // Return user data (without password)
-        const { password: _, ...userData } = user;
-        
-        return NextResponse.json({
-            ...userData,
-            message: 'Login successful'
-        });
-    } catch (error) {
-        console.error('Login error:', error);
-        return NextResponse.json(
-            { error: 'Failed to login' },
-            { status: 500 }
-        );
-    }
-}
-
-module.exports = { POST };

package/template/api/users.js

@@ -1,59 +0,0 @@
-// API Route: /api/users
-// Next.js App Router style
-
-const { NextResponse } = require('../_framework/next-response');
-
-let users = [
-    { id: 1, name: 'Aziz Ahmed', email: 'aziz@example.com', createdAt: new Date().toISOString() },
-    { id: 2, name: 'John Doe', email: 'john@example.com', createdAt: new Date().toISOString() },
-    { id: 3, name: 'Jane Smith', email: 'jane@example.com', createdAt: new Date().toISOString() }
-];
-
-async function GET(request) {
-    const { searchParams } = new URL(request.url);
-    const id = searchParams.get('id');
-
-    if (id) {
-        const user = users.find(u => u.id === parseInt(id));
-        if (!user) return NextResponse.json({ error: 'User not found' }, { status: 404 });
-        return NextResponse.json(user);
-    }
-
-    return NextResponse.json({ users, total: users.length });
-}
-
-async function POST(request) {
-    const { name, email } = await request.json();
-
-    if (!name || !email) {
-        return NextResponse.json({ error: 'Name and email are required' }, { status: 400 });
-    }
-
-    if (users.find(u => u.email === email)) {
-        return NextResponse.json({ error: 'Email already exists' }, { status: 409 });
-    }
-
-    const newUser = {
-        id: Math.max(...users.map(u => u.id)) + 1,
-        name, email,
-        createdAt: new Date().toISOString()
-    };
-    users.push(newUser);
-
-    return NextResponse.json({ message: 'User created', user: newUser }, { status: 201 });
-}
-
-async function DELETE(request) {
-    const { searchParams } = new URL(request.url);
-    const id = searchParams.get('id');
-
-    if (!id) return NextResponse.json({ error: 'ID required' }, { status: 400 });
-
-    const idx = users.findIndex(u => u.id === parseInt(id));
-    if (idx === -1) return NextResponse.json({ error: 'User not found' }, { status: 404 });
-
-    const deleted = users.splice(idx, 1)[0];
-    return NextResponse.json({ message: 'User deleted', user: deleted });
-}
-
-module.exports = { GET, POST, DELETE };

package/template/app/about/page.js

@@ -1,41 +0,0 @@
-// About page — route: /about
-export default function Page() {
-    return (
-        <div style={{ padding: '40px 32px', maxWidth: '900px', margin: '0 auto' }}>
-            <h1>About 📖</h1>
-
-            <div class="card">
-                <h2>What is Aziz.js?</h2>
-                <p>
-                    A lightweight Next.js clone — file-based routing, React hooks,
-                    server-side API routes, and ES module imports. Zero dependencies.
-                </p>
-            </div>
-
-            <div class="card">
-                <h2>File Structure</h2>
-                <pre style={{ background: '#282c34', color: '#61dafb', padding: '16px', borderRadius: '8px', fontSize: '13px' }}>
-{`app/
-  layout.js       ← root layout
-  page.js         ← /
-  about/
-    page.js       ← /about
-  blog/
-    [slug]/
-      page.js     ← /blog/:slug
-
-api/
-  users.js        ← /api/users
-
-components/
-  Navbar.js
-  Footer.js`}
-                </pre>
-            </div>
-
-            <button class="btn btn-primary" onClick={() => navigate('/')}>
-                ← Back Home
-            </button>
-        </div>
-    );
-}

package/template/app/blog/[slug]/page.js

@@ -1,31 +0,0 @@
-// Blog post page — route: /blog/:slug  (dynamic segment)
-export default function BlogPost() {
-    const { slug } = useParams();
-    const search = useSearchParams();
-    const from = search.get('from');
-
-    return (
-        <div style={{ padding: '40px 32px', maxWidth: '900px', margin: '0 auto' }}>
-            <p style={{ color: '#888', marginBottom: '8px' }}>
-                <a href="/blog/hello-world" onClick={(e) => { e.preventDefault(); navigate('/blog/hello-world'); }}>hello-world</a>
-                {'  ·  '}
-                <a href="/blog/aziz-js" onClick={(e) => { e.preventDefault(); navigate('/blog/aziz-js'); }}>aziz-js</a>
-            </p>
-
-            <h1>Blog: {slug}</h1>
-
-            <div class="card">
-                <h2>Dynamic routing works!</h2>
-                <p>
-                    This page is <code>app/blog/[slug]/page.js</code> and it matches any
-                    <code>/blog/&lt;anything&gt;</code> URL. The matched value is available
-                    through the <code>useParams()</code> hook.
-                </p>
-                <p><strong>useParams().slug</strong> = <code>{slug}</code></p>
-                {from && <p><strong>?from=</strong> = <code>{from}</code></p>}
-            </div>
-
-            <button class="btn btn-primary" onClick={() => navigate('/')}>← Back Home</button>
-        </div>
-    );
-}

package/template/app/contact/page.js

@@ -1,68 +0,0 @@
-// Contact page — route: /contact
-// Demonstrates the global `api` client calling a server route handler.
-export default function ContactPage() {
-    const [name, setName]     = useState('');
-    const [email, setEmail]   = useState('');
-    const [message, setMessage] = useState('');
-    const [status, setStatus] = useState(null); // { type, text }
-    const [sending, setSending] = useState(false);
-
-    const handleSubmit = async (e) => {
-        e.preventDefault();
-        setSending(true);
-        setStatus(null);
-        try {
-            const res = await api.post('/api/contact', { name, email, message });
-            setStatus({ type: 'ok', text: res.message || 'Message sent!' });
-            setName(''); setEmail(''); setMessage('');
-        } catch (err) {
-            setStatus({ type: 'error', text: err.message || 'Something went wrong' });
-        } finally {
-            setSending(false);
-        }
-    };
-
-    return (
-        <div style={{ padding: '40px 32px', maxWidth: '640px', margin: '0 auto' }}>
-            <h1>Contact 📬</h1>
-
-            <div class="card">
-                <h2>Send us a message</h2>
-                <p>This form posts to <code>/api/contact</code> using the global <code>api</code> client.</p>
-
-                <form onSubmit={handleSubmit} style={{ display: 'flex', flexDirection: 'column', gap: '12px', marginTop: '16px' }}>
-                    <input
-                        type="text"
-                        placeholder="Your name"
-                        value={name}
-                        onInput={(e) => setName(e.target.value)}
-                        required
-                    />
-                    <input
-                        type="email"
-                        placeholder="Your email"
-                        value={email}
-                        onInput={(e) => setEmail(e.target.value)}
-                        required
-                    />
-                    <textarea
-                        placeholder="Your message"
-                        value={message}
-                        onInput={(e) => setMessage(e.target.value)}
-                        rows={4}
-                        required
-                    />
-                    <button type="submit" class="btn btn-primary" disabled={sending}>
-                        {sending ? 'Sending…' : 'Send message'}
-                    </button>
-                </form>
-
-                {status && (
-                    <p style={{ marginTop: '12px', color: status.type === 'ok' ? '#1a7f37' : '#c0392b' }}>
-                        {status.text}
-                    </p>
-                )}
-            </div>
-        </div>
-    );
-}

package/template/app/not-found.js

@@ -1,15 +0,0 @@
-// Custom 404 page — rendered when no route matches (like Next.js app/not-found.js)
-export default function NotFound() {
-    return (
-        <div style={{ padding: '80px 24px', textAlign: 'center' }}>
-            <h1 style={{ fontSize: '96px', margin: '0 0 8px', color: '#61dafb' }}>404</h1>
-            <h2 style={{ margin: '0 0 16px' }}>Page not found</h2>
-            <p style={{ color: '#888', marginBottom: '32px' }}>
-                We couldn't find the page you were looking for.
-            </p>
-            <button class="btn btn-primary" onClick={() => navigate('/')}>
-                ← Back to Home
-            </button>
-        </div>
-    );
-}

package/template/app/test/page.js

@@ -1,52 +0,0 @@
-// Test page — route: /test
-export default function Page() {
-    const [count, setCount] = useState(0);
-    const [name, setName]   = useState('');
-    const [email, setEmail] = useState('');
-
-    const handleSubmit = (e) => {
-        e.preventDefault();
-        alert(`Name: ${name}\nEmail: ${email}\nCount: ${count}`);
-    };
-
-    return (
-        <div style={{ padding: '40px 32px', maxWidth: '900px', margin: '0 auto' }}>
-            <h1>Test Page 🧪</h1>
-
-            <div class="card">
-                <h2>useState</h2>
-                <div class="count-display">{count}</div>
-                <div class="counter-actions">
-                    <button class="btn btn-primary" onClick={() => setCount(c => c + 1)}>+</button>
-                    <button class="btn btn-danger"  onClick={() => setCount(0)}>Reset</button>
-                </div>
-            </div>
-
-            <div class="card">
-                <h2>Form</h2>
-                <form onSubmit={handleSubmit}>
-                    <input
-                        type="text"
-                        placeholder="Your name"
-                        value={name}
-                        onInput={(e) => setName(e.target.value)}
-                    />
-                    <input
-                        type="email"
-                        placeholder="Your email"
-                        value={email}
-                        onInput={(e) => setEmail(e.target.value)}
-                    />
-                    <button type="submit" class="btn btn-primary">Submit</button>
-                </form>
-            </div>
-
-            <div class="card">
-                <h2>State</h2>
-                <p>Name: <strong>{name || '—'}</strong></p>
-                <p>Email: <strong>{email || '—'}</strong></p>
-                <p>Count: <strong>{count}</strong></p>
-            </div>
-        </div>
-    );
-}

package/template/components/Footer.js

@@ -1,7 +0,0 @@
-export default function Footer() {
-    return (
-        <footer>
-            <p>Made with ⚡ Aziz.js</p>
-        </footer>
-    );
-}

package/template/components/Navbar.js

@@ -1,28 +0,0 @@
-// navigate and useRouter are globals — no imports needed
-export default function Navbar() {
-    const { pathname } = useRouter();
-
-    const links = [
-        { href: '/',                 label: 'Home'    },
-        { href: '/about',            label: 'About'   },
-        { href: '/blog/hello-world', label: 'Blog'    },
-        { href: '/test',             label: 'Test'    },
-        { href: '/contact',          label: 'Contact' },
-    ];
-
-    return (
-        <nav>
-            <span class="brand" onClick={() => navigate('/')}>⚡ Aziz.js</span>
-            {links.map(({ href, label }) =>
-                <a
-                    key={href}
-                    href={href}
-                    class={pathname === href ? 'active' : ''}
-                    onClick={(e) => { e.preventDefault(); navigate(href); }}
-                >
-                    {label}
-                </a>
-            )}
-        </nav>
-    );
-}

package/template/lib/db.js

@@ -1,67 +0,0 @@
-// Database connection helper
-// This is a mock - replace with real database connection
-
-let isConnected = false;
-
-async function connectDB() {
-    if (isConnected) {
-        console.log('✅ Using existing database connection');
-        return;
-    }
-
-    try {
-        // In production, connect to real database here:
-        // await mongoose.connect(process.env.MONGODB_URI);
-        // or
-        // db = await new Database(process.env.DATABASE_URL);
-        
-        console.log('✅ Database connected (mock)');
-        isConnected = true;
-    } catch (error) {
-        console.error('❌ Database connection failed:', error);
-        throw error;
-    }
-}
-
-module.exports = connectDB;
-
-// Example usage with MongoDB:
-/*
-const mongoose = require('mongoose');
-
-async function connectDB() {
-    if (mongoose.connections[0].readyState) {
-        return;
-    }
-
-    await mongoose.connect(process.env.MONGODB_URI, {
-        useNewUrlParser: true,
-        useUnifiedTopology: true,
-    });
-    
-    console.log('✅ MongoDB connected');
-}
-
-module.exports = connectDB;
-*/
-
-// Example usage with PostgreSQL:
-/*
-const { Pool } = require('pg');
-
-const pool = new Pool({
-    connectionString: process.env.DATABASE_URL,
-});
-
-async function connectDB() {
-    try {
-        await pool.query('SELECT NOW()');
-        console.log('✅ PostgreSQL connected');
-    } catch (error) {
-        console.error('❌ PostgreSQL connection failed:', error);
-        throw error;
-    }
-}
-
-module.exports = connectDB;
-*/

package/template/models/User.js

@@ -1,102 +0,0 @@
-// User Model
-// This is a mock - replace with real database model
-
-// Mock in-memory database
-let users = [
-    { _id: '1', name: 'Aziz Ahmed', email: 'aziz@example.com', role: 'admin', phone: '123-456-7890' },
-    { _id: '2', name: 'John Doe', email: 'john@example.com', role: 'user', phone: '098-765-4321' }
-];
-
-class User {
-    // Find one user
-    static async findOne(query) {
-        const user = users.find(u => {
-            return Object.keys(query).every(key => u[key] === query[key]);
-        });
-        return user || null;
-    }
-
-    // Find by ID
-    static async findById(id) {
-        return users.find(u => u._id === id) || null;
-    }
-
-    // Find all users
-    static async find(query = {}) {
-        if (Object.keys(query).length === 0) {
-            return users;
-        }
-        return users.filter(u => {
-            return Object.keys(query).every(key => u[key] === query[key]);
-        });
-    }
-
-    // Create new user
-    static async create(userData) {
-        const newUser = {
-            _id: String(users.length + 1),
-            ...userData,
-            createdAt: new Date().toISOString()
-        };
-        users.push(newUser);
-        return newUser;
-    }
-
-    // Update user
-    static async findByIdAndUpdate(id, updates) {
-        const index = users.findIndex(u => u._id === id);
-        if (index === -1) return null;
-        
-        users[index] = { ...users[index], ...updates, updatedAt: new Date().toISOString() };
-        return users[index];
-    }
-
-    // Delete user
-    static async findByIdAndDelete(id) {
-        const index = users.findIndex(u => u._id === id);
-        if (index === -1) return null;
-        
-        const deleted = users.splice(index, 1)[0];
-        return deleted;
-    }
-
-    // Select specific fields
-    select(fields) {
-        // This is a chainable method for field selection
-        // In real Mongoose, this would be: User.findOne().select('name email')
-        return this;
-    }
-}
-
-module.exports = User;
-
-// Example usage with Mongoose:
-/*
-const mongoose = require('mongoose');
-
-const userSchema = new mongoose.Schema({
-    name: {
-        type: String,
-        required: true
-    },
-    email: {
-        type: String,
-        required: true,
-        unique: true
-    },
-    password: {
-        type: String,
-        required: true
-    },
-    role: {
-        type: String,
-        enum: ['user', 'admin'],
-        default: 'user'
-    },
-    phone: String
-}, {
-    timestamps: true
-});
-
-module.exports = mongoose.models.User || mongoose.model('User', userSchema);
-*/