This site is built with Viewi itself. It is experimental and still in development. If you see any bugs please do not hesitate and open an issue or DM me on Twitter.

Rendering Components

Inline Tag

To render a component as a tag just use the component's name as the tag name. For example:



namespace Components\Views\Counter;

use Viewi\BaseComponent;

class Counter extends BaseComponent
    public int $count = 0;

    public function increment()

    public function decrement()


<button (click)="decrement()" class="mui-btn mui-btn--accent">-</button>
<span class="mui--text-dark mui--text-title">$count</span>
<button (click)="increment()" class="mui-btn mui-btn--accent">+</button>

Now you can use it as a tag <Counter /> wherever you

Direct Render

To render the specific component directly into a variable (or echoing it) use the next:

App::run($componentName, $params = []);

Where $params is an array of input parameters.

For example, let's render Counter component into a variable:

$html = App::run('Counter');

Render through Router

You can assign any component as a action parameter of Route. For example:

use Viewi\Routing\Route;
use Components\Views\Home\HomePage;

Route::get('/', HomePage::class);

And now every time Router matches the assigned url, the component will be rendered into response.

You can invoke url matching manually if you like, for example:

$response = Router::handle($url, $method = 'get');