
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>MwalaJS Documentation</title>
    <style>
        body {
            font-family: Arial, sans-serif;
            line-height: 1.6;
            margin: 20px;
            padding: 20px;
        }
        h1, h2, h3 {
            color: #333;
        }
        pre {
            background: #f4f4f4;
            padding: 10px;
            border-left: 4px solid #333;
        }
        .section {
            margin-bottom: 40px;
        }
    </style>
</head>
<body>
  
  <!-- Navbar -->
  <nav class="navbar navbar-expand-lg navbar-dark bg-dark">
    <div class="container-fluid">
      <a class="navbar-brand" href="/">MwalaJS</a>
      <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
        <span class="navbar-toggler-icon"></span>
      </button>
      <div class="collapse navbar-collapse" id="navbarNav">
        <ul class="navbar-nav">
          <li class="nav-item">
            <a class="nav-link active" href="#overview">Overview</a>
          </li>
          <li class="nav-item">
            <a class="nav-link" href="#installation">Installation</a>
          </li>
          <li class="nav-item">
            <a class="nav-link" href="#commands">Commands</a>
          </li>
          <li class="nav-item">
            <a class="nav-link" href="#structure">Project Structure</a>
          </li>
          <li class="nav-item">
            <a class="nav-link" href="#example">Example Application</a>
          </li>
          <li class="nav-item">
            <a class="nav-link" href="#conclusion">Conclusion</a>
          </li>
        </ul>
      </div>
    </div>
  </nav>

    <h1>MwalaJS - Complete Documentation</h1>
    <p>Welcome to MwalaJS! This guide will help you install, configure, and use MwalaJS efficiently.</p>

    <div class="section">
        <h2>1. Installation</h2>
        <p>You can install MwalaJS in multiple ways:</p>
        <h3>Using GitHub Repository</h3>
        <p>Clone the repository from GitHub:</p>
        <pre>git clone https://github.com/mwala400/mwalajs.git</pre>
        <h3>Using a ZIP, EXE, or RAR File</h3>
        <p>Download and extract the files from the available compressed format:</p>
        <ul>
            <li>ZIP: Extract using <code>WinRAR</code> or <code>7-Zip</code>.</li>
            <li>RAR: Extract using <code>WinRAR</code>.</li>
            <li>EXE: Run the installer and follow the instructions.</li>
        </ul>
    </div>

    <div class="section">
        <h2>2. Setting Up MwalaJS</h2>
        <h3>Initialize MwalaJS</h3>
        <pre>mwala init</pre>
        <h3>Creating a New Project</h3>
        <pre>mwala create-project</pre>
    </div>

    <div class="section">
        <h2>3. Running the Application</h2>
        <pre>mwala serve</pre>
    </div>

    <div class="section">
        <h2>4. Database Operations</h2>
        <h3>Creating a Database</h3>
        <pre>mwala create-db</pre>
        <h3>Creating a Table</h3>
        <pre>mwala create-table &lt;table_name&gt;</pre>
        <h3>Dropping a Table</h3>
        <pre>mwala drop-table &lt;table_name&gt;</pre>
    </div>

    <div class="section">
        <h2>5. Code Generation</h2>
        <pre>
            mwala generate model &lt;name&gt;
            mwala generate controller &lt;name&gt;
            mwala generate route &lt;name&gt;
            mwala generate view &lt;name&gt;
            mwala generate midware &lt;name&gt;
        </pre>
    </div>

    <div class="section">
        <h2>6. Additional Information</h2>
        <p>For more details, visit: <a href="https://github.com/mwala400/mwalajs" target="_blank">GitHub Repository</a></p>
    </div>
</body>
</html>

<!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="MwalaJS Framework Documentation - A lightweight Node.js framework for scalable web applications with MVC structure, built-in features, and easy database management.">
  <meta name="keywords" content="MwalaJS, Node.js, MVC framework, web development, database management, routing, middleware, template engine, Node.js framework documentation">
  <meta name="author" content="Hekima Ambalile Mwala">
  <meta property="og:title" content="MwalaJS Framework Documentation">
  <meta property="og:description" content="Learn how to use the MwalaJS framework to build scalable web applications with MVC architecture. Explore installation, commands, project structure, and more.">
  <meta property="og:url" content="https://your-website-url.com">
  <meta property="og:image" content="https://your-website-url.com/images/mwala-logo.png">
  <title>MwalaJS Framework Documentation</title>
  <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/css/bootstrap.min.css" rel="stylesheet">
  <style>
    body {
      font-family: Arial, sans-serif;
    }
    .section-title {
      margin-top: 40px;
      font-size: 1.5rem;
    }
    .code-block {
      background-color: #f8f9fa;
      padding: 10px;
      border-radius: 5px;
      border: 1px solid #ddd;
      font-family: 'Courier New', Courier, monospace;
    }
  </style>
</head>
<body>


  <div class="container">
    <header class="text-center my-5">
      <h1>MwalaJS Framework Documentation</h1>
      <p class="lead">A lightweight, easy-to-use Node.js framework to create scalable web applications with MVC architecture and powerful built-in features.</p>
      <p>GitHub Repository: <a href="https://github.com/mwala400/mwalajs" target="_blank">https://github.com/mwala400/mwalajs</a></p>
    
    
    </header>

    <!-- Overview Section -->
    <section id="overview">
      <h2 class="section-title">1. Overview</h2>
      <p>MwalaJS is a lightweight, easy-to-use Node.js framework designed to help you create scalable and organized MVC-based web applications. It comes with built-in features for handling routing, models, views, middleware, and database operations.</p>
      <a href="files/documentation.pdf" download="documentation.pdf" class="text">
        Download Documentation
    </a>

    <section id="release">
        <h2 class="section-title">1. VERSION RELEASE</h2>
    <a href="files/documentation.pdf" download="documentation.pdf" class="text">
         mwalajs.exe v1.0.0 for MWALAJS COMMAND SHELL (CLS) download here
    </a><br>
    <a href="files/documentation.pdf" download="documentation.pdf" class="text">
        mwalajs.zip v1.0.0 download here
   </a>
   <br>
   <a href="https://yourwebsite.com/path/to/mwalajs_installer.exe" download>
    <img src="https://yourwebsite.com/path/to/mwalajs4_RXv_icon.ico" alt="Download mwalajs" width="100">
</a>
<br>


      <h3>Key Features:</h3>
      <ul>
        <li><strong>MVC Architecture</strong>: Automatically generates models, controllers, routes, and views.</li>
        <li><strong>Database Management</strong>: Includes commands to create and drop tables, run migrations, and manage the database.</li>
        <li><strong>Middleware Support</strong>: Add custom middleware to handle requests.</li>
        <li><strong>EJS Template Engine</strong>: Integrated for view rendering.</li>
        <li><strong>Static File Support</strong>: Easily serve static assets like CSS, JavaScript, and images.</li>
      </ul>
    </section>

    <!-- Installation Section -->
    <section id="installation">
      <h2 class="section-title">2. Installation</h2>
      <p>To get started with MwalaJS, follow these steps:</p>

      <h3>Prerequisites:</h3>
      <ul>
        <li>Node.js (v12 or above)</li>
        <li>NPM (Node Package Manager)</li>
      </ul>

      <h3>Steps:</h3>
      <ol>
        <li><strong>Clone the Repository:</strong>
          <pre class="code-block">git clone https://github.com/mwala400/mwalajs</pre>
        </li>
        <li><strong>Install Dependencies:</strong>
          <pre class="code-block">npm install</pre>
        </li>
        <li><strong>Run the Framework:</strong>
          <pre class="code-block">mwala serve</pre>
        </li>
      </ol>
    </section>

    <!-- Available Commands Section -->
    <section id="commands">
      <h2 class="section-title">3. Available Commands</h2>

      <h3>General Command Syntax:</h3>
      <pre class="code-block">mwala <command> [options]</pre>

      <h3>Common Commands:</h3>
      <ul>
        <li><strong>Create a New MVC Project:</strong>
          <pre class="code-block">mwala create <appname></pre>
        </li>
        <li><strong>Start the Server:</strong>
          <pre class="code-block">mwala serve</pre>
        </li>
        <li><strong>Generate MVC Components:</strong>
          <pre class="code-block">mwala generate <model/controller/route/view> <name></pre>
        </li>
        <li><strong>Add Middleware:</strong>
          <pre class="code-block">mwala generate middleware <middlewareName></pre>
        </li>
        <li><strong>Show Available Commands:</strong>
          <pre class="code-block">mwala help</pre>
        </li>
        <li><strong>Database Commands:</strong>
          <ul>
            <li><pre class="code-block">mwala create-db</pre></li>
            <li><pre class="code-block">mwala migrate</pre></li>
            <li><pre class="code-block">mwala rollback</pre></li>
          </ul>
        </li>
      </ul>
    </section>

    <!-- Example Application Section -->
    <section id="example">
      <h2 class="section-title">5. Example Application</h2>
      <h2 class="section-title"> app.mjs</h2>
    
      <p>Here is an example of the default <code>app.mjs</code> file for starting the server:</p>
      <pre class="code-block">
import mwalajs from 'mwalajs';
import { homeRoutes } from './routes/homeRoutes.mjs';
import { fileURLToPath } from 'url';
import path from 'path';

const __filename = fileURLToPath(import.meta.url);
const __dirname = path.dirname(__filename);

mwalajs.set('view engine', 'ejs');
mwalajs.set('views', path.join(__dirname, 'views'));

mwalajs.static(path.join(__dirname, 'public'));

mwalajs.use('/', homeRoutes);

const port = process.env.PORT || 3000;
mwalajs.listen(port, () => {
  console.log(`Server running on http://localhost:${port}`);
});
      </pre>

      <h2 class="section-title">homeRoutes.mjs</h2>
    
      <p>Here is an example of the default <code>homeRoutes.mjs.mjs</code> :</p>
      <pre class="code-block">
        import mwalajs from 'mwalajs';
        import { homeController,Steps,welcome,about } from '../controllers/homeController.mjs';
        
        const router = mwalajs.constructor.Router(); // Corrected Router usage
        
        router.get('/', homeController.getHomePage);
        router.get('/steps',Steps.getSteps);
        router.get('/welcome',welcome.getwelcome);
        router.get('/about',about.getabout);
        
        
        export { router as homeRoutes };
        
      </pre>

      <pre>
        <h2 class="section-title">homeController.mjs</h2>
    
        <p>Here is an example of the default <code>homeController.mjs</code> :</p>
   
        //homeController.mjs
export const homeController = {
  getHomePage: (req, res) => {
    res.render('index', { title: 'Welcome to MwalaJS MVC' });
  }

};


export const Steps = {
getSteps: (req, res) => {
  res.render('steps', { title: 'Welcome to MwalaJS MVC' });
}
};

export const welcome = {
  getwelcome: (req, res) => {
    res.render('welcome', { title: 'Welcome to MwalaJS MVC' });
  }
  };

  
  export const about = {
    getabout: (req, res) => {
      res.render('about', { title: 'Welcome to MwalaJS MVC' });
    }
    };
    
      </pre>
    </section>
    <style>
      body {
          font-family: Arial, sans-serif;
          line-height: 1.6;
          margin: 20px;
          padding: 20px;
      }
      h1, h2, h3 {
          color: #bfd6d5;
      }
      pre {
          background: #eff1f0;
        
      }
      .section {
          margin-bottom: 60px;
      }
  </style>
    <!-- Conclusion Section -->
    <section id="conclusion">
      <pre>
      <h2 class="section-title">6. Conclusion</h2>
      <p>MwalaJS is designed to streamline the development of MVC-based applications with its easy-to-use commands for setting up projects, generating components, and managing the database. It's a great choice for anyone looking for a simple and scalable framework.</p>
      <p>For full documentation and to contribute, visit the <a href="https://github.com/mwala400/mwalajs" target="_blank">GitHub repository</a>.</p>
   
   <h1>SUMMARRY</h1>
   mwala help

   🛠️  MwalaJS CLI - List of Commands:
 
   General Commands:
   - mwala -v | mwala --version → Show the MwalaJS version.
   - mwala help | mwala h       → Show this help message.
 
   Project Management:
   - mwala create-project       → Create a new MwalaJS project.
   - mwala init                 → Initialize MwalaJS in the current project.
 
   Running the Application:
   - mwala serve | mwala app.mjs → Start the MwalaJS application.
 
   Database Operations:
   - mwala create-db            → Create the database specified in the .env file.        
   - mwala create-table <name>  → Create a specific database table.
   - mwala drop-table <name>    → Drop a specific database table.
   - mwala migrate all          → Run all pending migrations.
   - mwala rollback all         →to undo  migration
 
   Code Generation:
   - mwala generate model <name>       → Create a new model.
   - mwala generate controller <name>  → Create a new controller.
   - mwala generate route <name>       → Create a new route.
   - mwala generate view <name>        → Create a new view file.
   - mwala generate midware <name>     → Create a new middleware.
 
   🔹 Use "mwala <command>" to execute a command.
 
 
 HP@mwala MINGW64 ~/OneDrive/Desktop/mwalajsm (main)
 $</pre>
    </section>
  </div>
<pre>
  # MwalaJS - The Next Evolution in Web Development

## Introduction
MwalaJS is a powerful and modern JavaScript framework designed to simplify web application development while offering high performance, scalability, and flexibility. Unlike traditional frameworks, MwalaJS introduces a new way of handling routing, state management, and database interactions.

## Why Choose MwalaJS?
### 🚀 High Performance
- Optimized for speed and efficiency
- Minimal memory usage
- Faster execution compared to traditional frameworks

### 🔥 Simplicity & Flexibility
- Easy to learn and use
- Clean and modular code structure
- Supports both small-scale and enterprise-level applications

### 🛠️ Built-In Features
- Automatic API routing
- Integrated database management
- Scalable real-time processing
- Simple yet powerful templating engine

## File Structure
MwalaJS follows a well-organized directory structure for maintainability and scalability:
```
Here's how your MwalaJS file structure looks based on your provided output:

perl
Copy
Edit
mwalajsm/               # Root directory
│── app.mjs             # Main application file
│── runMigrations.mjs   # Handles database migrations
│── createProject.mjs   # Script for creating new projects
│── setupMwalajs.mjs    # Setup script for MwalaJS
│── start.bat           # Batch script to start the server
│── setup.bat           # Batch script for installation
│── setup.bash          # Bash script for installation (Linux/macOS)
│── setup.sh            # Another installation script
│── package.json        # Dependencies and project metadata
│── package-lock.json   # Dependency lock file
│── README.md           # Documentation for MwalaJS
│── migrations/         # Database migration files
│── models/             # Database models
│── controllers/        # Handles application logic
│── routes/             # Defines API routes
│── middlewares/        # Custom middleware for authentication, logging, etc.
│── config/             # Configuration files (e.g., database, app settings)
│── public/             # Static assets like CSS, JavaScript, and images
│── views/              # Template views (if using server-side rendering)
│── mwalajs/            # Core framework files
│── dist/               # Compiled or built files
│── node_modules/       # Dependencies installed via npm
│── ATTENDANCE/         # Possible attendance tracking module
│── installer/          # Installation-related files
│── installerimg.png    # Image used during installation
│── mwalajs5.png        # Framework branding/image
│── mwalajs4_RXv_icon.ico # Framework icons
│── mwalajs4_lyh_icon.ico # Another framework icon
│── mwalajsm.iss        # Installer script for Windows
│── background.bmp      # Background image (possibly for setup UI)
│── background.png      # Another background image
│── bin/                # Executable files or scripts
This structure makes MwalaJS a well-organized and scalable framework. To make it even more convincing, you could add:

A "tests/" folder – To show built-in support for unit and integration tests.
A "docs/" folder – Dedicated to documentation with detailed guides.
A "scripts/" folder – For automation scripts instead of having them in the root directory.
A "logs/" folder – To store logs instead of scattering them.


```

## Getting Started
### Installation
1. **Install MwalaJS globally:**
   ```sh
   npm install -g mwalajs
   ```
2. **Create a new project:**
   ```sh
   mwalajs create myApp
   cd myApp
   npm install
   ```
3. **Run the development server:**
   ```sh
   npm start
   ```

## Sample Code
A simple MwalaJS route example:
Your MwalaJS file structure is well-organized, but to make it more convincing for developers to switch, consider:

1. Clean File Structure Explanation
Here’s a structured breakdown:

FOLDERS

📂 mwalajsm/              # Root directory  
│── 📜 app.mjs           # Main application entry point  
│── 📂 ATTENDANCE/       # Attendance-related files (clarify purpose)  
│── 📂 bin/              # Executable scripts  
│── 📂 config/           # Configuration files  
│── 📂 controllers/      # Business logic controllers  
│── 📂 middlewares/      # Request middlewares  
│── 📂 migrations/       # Database migrations  
│── 📂 models/           # Database models  
│── 📂 mwalajs/          # Core framework code  
│── 📂 public/           # Static assets (CSS, JS, Images)  
│── 📂 routes/           # API & web routes  
│── 📂 views/            # Frontend templates (if using templating)  
│── 📂 dist/             # Compiled or bundled output  
│── 📜 package.json      # Dependencies & scripts  
│── 📜 README.md         # Project documentation  
│── 📜 start.bat         # Windows startup script  
│── 📜 setup.sh          # Unix-based setup script  
│── 📜 createProject.mjs # Automates project creation  
│── 📜 runMigrations.mjs # Database migration script  
│── 📂 installer/        # Installer-related files  
│── 📂 node_modules/     # Dependencies  
2. Why Developers Should Switch to MwalaJS
MwalaJS should highlight:
✅ Better modular structure (prevents spaghetti code)
✅ Built-in migrations & models (reduces DB setup time)
✅ Simplified setup scripts (automates installation)
✅ Performance optimizations (mention key tech choices)
✅ Security-first approach (middleware for authentication, validation)

3. Preventing Module Repetition
Are there duplicate functionalities in middlewares/, controllers/, or mwalajs/?
If mwalajs/ is the core framework, maybe avoid repeating similar logic inside controllers/


## Future of Web Development
MwalaJS is designed to replace traditional frameworks by offering a modern, easy-to-use, and high-performance alternative. Whether you are building a simple website or a complex web application, MwalaJS provides the tools you need for success.

## Contribute
We welcome contributors! Feel free to fork the repository, submit issues, and make pull requests.

## License
MwalaJS is open-source and licensed under the MIT License.


</pre>
  <footer class="text-center py-4 mt-5">
    <p>&copy; 2025 MwalaJS Framework. All Rights Reserved.</p>
  </footer>

  <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/js/bootstrap.bundle.min.js"></script>
</body>
</html>
