PHPackages                             fohn-group/fohn-ui - PHPackages - PHPackages  [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register)

1. [Directory](/)
2. /
3. [Framework](/categories/framework)
4. /
5. fohn-group/fohn-ui

ActiveLibrary[Framework](/categories/framework)

fohn-group/fohn-ui
==================

Web Component Framework written in PHP using Tailwind CSS. This project is an evolution of the original Agile Toolkit Ui project. (atk4-ui: https://github.com/atk4/ui)

1.62(2y ago)247↓100%2[3 issues](https://github.com/Fohn-Group/fohn-ui/issues)[1 PRs](https://github.com/Fohn-Group/fohn-ui/pulls)MITPHPPHP >=7.4.0CI passing

Since Apr 3Pushed 9mo ago1 watchersCompare

[ Source](https://github.com/Fohn-Group/fohn-ui)[ Packagist](https://packagist.org/packages/fohn-group/fohn-ui)[ Docs](https://github.com/fohn-group/fohn-ui)[ RSS](/packages/fohn-group-fohn-ui/feed)WikiDiscussions dev-develop Synced 1mo ago

READMEChangelog (10)Dependencies (19)Versions (23)Used By (0)

Fohn-ui
=======

[](#fohn-ui)

PHP Framework using Tailwind Css.

[Demo site](https://fohn-ui.com)

[Join Discord Channel](https://discord.gg/VwrPA8Nb3t)

History
-------

[](#history)

Fohn-ui is a direct evolution of Agile Toolkit (atk4/ui), thus you will find a lot of similarity with atk4/ui when using Fohn-ui. That being said, Fohn-ui cannot be used as a direct upgrade to your atk4/ui project.

Here are the main differences:

- Fohn-ui Views are decoupled from Data model. Some views, like Form or Table, will consume model data via ModelController class.
- Fohn-ui used its own javascript integration.
- Fohn-ui used Tailwind Css utilities in order to define Views look and feel.
- Fohn-ui Components are defined in a minimalistic way.

For example, you will not find a Crud component in Fohn-ui. In order to build a Crud, you need to define your own Crud class using the Table component. This is a little more work at first but allow greater flexibility in customization and better portability in future release of Fohn-ui.

Installation
------------

[](#installation)

To create a project using Fohn-ui simply install it using Composer.

```
composer require fohn-group/fohn-ui

```

### Setting up Ui::service

[](#setting-up-uiservice)

Ui::service class is the heart of Fohn-ui and therefore require to be setup properly in order to display page content.

Here is a minimal setup:

```