Quick Start

Table of contents

1. Prerequisites
2. Setup Project
3. Setup Database
4. Backend API
5. Frontend
   1. 1. Controller Logic
   2. 2. HTML Template
6. Summary

Welcome! We are thrilled to have you here.

“From zero to hero.” Every journey begins with a first step, and to make that step with confidence, you need a reliable manual to rely on. This section will guide you through a ~15-minute tutorial: “Creating a simple TODO web application” using the Puko Framework.

Prerequisites: PHP version >= 7.0, Composer, and MySQL installed on your machine.

Prerequisites

Import the following table into your MySQL database:

CREATE TABLE activities (
    id INT(11) NOT NULL AUTO_INCREMENT,
    task VARCHAR(255) NOT NULL,
    status TINYINT(1) DEFAULT 0,
    created_at DATETIME DEFAULT CURRENT_TIMESTAMP,
    PRIMARY KEY (id)
) ENGINE=InnoDB DEFAULT CHARSET=utf8;

Setup Project

First, create a new Puko project using Composer and start the development server:

composer create-project pukoframework/pukoframework todo-app
cd todo-app
php puko serve 8080

Visit http://localhost:8080 in your browser to verify that the framework is running correctly.

Setup Database

Configure your database connection in the .env file at the root of your project:

DB_DRIVER=mysql
DB_HOST=localhost
DB_PORT=3306
DB_NAME=todo_db
DB_USER=root
DB_PASS=yourpassword

Next, run the database setup wizard to generate the Data Object Wiring for our activities table:

php puko setup db

Follow the prompts (choose mysql, localhost, and the primary schema). Puko will automatically generate the model classes in the plugins/model/primary/ directory.

Backend API

Let’s create a Service controller to handle task data. Use the Puko CLI to scaffold a new route:

php puko routes service add api/tasks

Open controller/api/tasks.php and update the code to fetch all tasks from the database:

namespace controller\api;

use pukoframework\middleware\Service;
use plugins\model\primary\activitiesContracts;

class tasks extends Service {
    public function main() {
        return activitiesContracts::GetAll();
    }
}

Frontend

Now, let’s create a View controller to display our Todo list on a web page:

php puko routes view add tasks

1. Controller Logic

Open controller/tasks.php and pass the database data to the view:

namespace controller;

use pukoframework\middleware\View;
use plugins\model\primary\activitiesContracts;

class tasks extends View {
    public function main() {
        return [
            'title' => 'My Todo List',
            'activities' => activitiesContracts::GetAll()
        ];
    }
}

2. HTML Template

Open the generated template at assets/html/en/tasks/main.html and use PTE tags to render the dynamic list:

<h1>{!title}</h1>

<ul class="task-list">
    <!--{!activities}-->
    <li>
        <strong>{!task}</strong> 
        <span class="badge">{!status}</span>
    </li>
    <!--{/activities}-->
</ul>

Summary

In just 15 minutes, you have:

1. Scaffolded a new project and routing system.
2. Wired a database table to a PHP Data Object.
3. Built a functional JSON API endpoint.
4. Rendered a dynamic frontend using PTE tags.

We hope this provides a clear picture of what the Puko Framework is, its mechanism, and its strengths. May the Puko Framework be the perfect match for your upcoming projects! 😊