Monster

SinglightJs can connect to API-Monster (A PHP framework for backend development) then you can create SPAs without working by APIs

NOTICE Reading API-Monster's Document before reading this page is required

Quick Start

For start create a API-Monster project by composer then, add SinglightJs to it by singlighter

composer create-project darkphp/apimonster myapp # Will creating a API-Monster project
cd myapp
npx singlighter@latest monsterize # Will adding SinglightJs to project

Get Data

In API-Monster you can pass data to JavaScript, How to?

And in SinglightJs's pages show it

<h1>Hi, {{ monster.name }}!</h1>

Update Data

You can update monster's data by remonster function

First import remonster in your page

import { remonster } from "../Lib/Monster.js";

And call it, you must pass a API-Monster's controller name as first parameter

remonster("HomeController@changeName");

Now you get an error with code 403, For fix it open ~/config/singlight.php and add controller's name to controllers_allowed

<?php

return [
    "controllers_allowed" => [
        "HomeController@changeName"
    ]
];

And in the controller you must return new data

class HomeController
{
    public function changeName() {
        return [
            "name" => "MohammadAli"
        ];
    }
}

Then your monster variable will updating

After Updated

You can pass a function to third remonster's parameter, this will calling after monster updated

remonster("HomeController@changeName", {}, () => console.log("monster updated!!!"));

NOTICE remonster don't refreshing the page after updating data, so always you must use this.refresh as third remonster's parameter

Send Data to Controller

You can send data (string) to controller by second remonster's parameter

remonster("HomeController@changeName", {name: "MohammadAli"});

And get data in controller

changeName($name) { /* ... */ }

Enjoy!