{"id":46061825,"url":"https://github.com/ephect-io/framework","last_synced_at":"2026-03-01T11:31:39.868Z","repository":{"id":37983041,"uuid":"431017287","full_name":"ephect-io/framework","owner":"ephect-io","description":"Effective PHP","archived":false,"fork":false,"pushed_at":"2025-12-17T16:12:18.000Z","size":2551,"stargazers_count":1,"open_issues_count":0,"forks_count":0,"subscribers_count":0,"default_branch":"main","last_synced_at":"2025-12-21T04:29:16.638Z","etag":null,"topics":["functional-components","php"],"latest_commit_sha":null,"homepage":"","language":"PHP","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"gpl-3.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/ephect-io.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null,"notice":null,"maintainers":null,"copyright":null,"agents":null,"dco":null,"cla":null}},"created_at":"2021-11-23T08:22:15.000Z","updated_at":"2025-12-17T16:12:23.000Z","dependencies_parsed_at":"2023-12-03T10:25:12.833Z","dependency_job_id":"c2de5550-4639-485e-96e9-c6ed6cc3f29e","html_url":"https://github.com/ephect-io/framework","commit_stats":{"total_commits":634,"total_committers":2,"mean_commits":317.0,"dds":"0.21451104100946372","last_synced_commit":"62749c0453cf0621d0a775b0b28f99b841ab0c42"},"previous_names":[],"tags_count":32,"template":false,"template_full_name":null,"purl":"pkg:github/ephect-io/framework","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ephect-io%2Fframework","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ephect-io%2Fframework/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ephect-io%2Fframework/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ephect-io%2Fframework/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/ephect-io","download_url":"https://codeload.github.com/ephect-io/framework/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ephect-io%2Fframework/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":29968453,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-03-01T10:55:55.490Z","status":"ssl_error","status_checked_at":"2026-03-01T10:55:55.175Z","response_time":124,"last_error":"SSL_read: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["functional-components","php"],"created_at":"2026-03-01T11:31:39.223Z","updated_at":"2026-03-01T11:31:39.861Z","avatar_url":"https://github.com/ephect-io.png","language":"PHP","readme":"![Ephect](assets/images/salamandra.png)\n\n## What is Ephect ?\n\n**E**ffective **P**rogramming in **H**ybrid **E**nvironment using **C**omponents-based **T**emplates.\n\nIt's a comprehensive solution that combines a lightweight PHP framework and a JavaScript library.\n\nEphect allows you to design backend pages and components a fluent way as well as web components.\n\nIt integrates a build process based on webpack.\n\n## Featured concepts\n\n### The components\n\nBasically, components are custom HTML tags. All concepts of HTML tags on backend side are applicable to components except the naming convention: a component name must begin with a capital letter.\n\nThe logic of the component is coded in a simple funcion returning a template.\n\n#### Example 1\n\nHere is an open component that can surround children components or just HTML code.\n\n```html\n\u003cMyComponent\u003e\n    Hello World!\n\u003c/MyComponent\u003e\n```\n\nThe code would look like this:\n\n```php\n\u003c?php\n\nnamespace QuickStart;\n\nfunction MyComponent($children) {\n\n    return (\u003c\u003c\u003c HTML\n    \u003ch1\u003eMy component\u003c/h1\u003e\n    \u003cp\u003e\n    {{ children }}\n    \u003c/p\u003e\n    HTML);\n}\n```\n\nIt will render:\n\n```html\n    \u003ch1\u003eMy component\u003c/h1\u003e\n    \u003cp\u003e\n    Hello World!\n    \u003c/p\u003e\n```\n\n#### Example 2\n\nA closed component to which we pass arguments:\n\n```html\n\u003cAnotherComponent with=\"Some argument\" /\u003e\n```\n\nThe code would look like this:\n\n```php\n\u003c?php\n\nnamespace QuickStart;\n\nfunction AnotherComponent($props) {\n\n    return (\u003c\u003c\u003cHTML\n    \u003ch2 id=\"with\"\u003e\n        {{ props-\u003ewith }}\n    \u003c/h2\u003e\n    HTML);\n}\n```\n\nIt will render:\n\n```html\n    \u003ch2 id=\"with\"\u003e\n    Some argument\n    \u003c/h2\u003e\n```\n### Cascading and reusing components\n\nThe components can be declared in cascade and the same component can be reused in each cascading component.\n\nIf we combine examples 1 and 2:\n\n```html\n\u003cMyComponent\u003e\n    \u003cAnotherComponent with=\"Some argument\" /\u003e\n\u003c/MyComponent\u003e\n```\n\nIt will render:\n\n```html\n    \u003ch1\u003eMy component\u003c/h1\u003e\n    \u003cp\u003e\n    \u003ch2 id=\"with\"\u003e\n        Some argument\n    \u003c/h2\u003e\n    \u003c/p\u003e\n```\n\n## The component Slot\n\nA parent component with named placeholders can be inherited to change the content of its placeholders. The component in charge of managing placeholders is called *Slot*.\n\nHere is a Mother component containing slots to be overriden:\n\n```php\n\u003c?php\n\nnamespace QuickStart;\n\nfunction Mother($children)\n{\n\n    return (\u003c\u003c\u003c HTML\n    \u003c!DOCTYPE html\u003e\n    \u003chtml\u003e\n        \u003chead\u003e\n            \u003cmeta charset=\"UTF-8\"\u003e\n            \u003ctitle\u003e\n            \u003cSlot name=\"title\"\u003e\n                Mother!\n            \u003c/Slot\u003e\n            \u003c/title\u003e\n\n            \u003cSlot name=\"stylesheets\"\u003e\n            \u003c/Slot\u003e\n        \u003c/head\u003e\n\n        \u003cbody\u003e\n            \u003cdiv class=\"App\" \u003e\n                {{ children }}\n            \u003c/div\u003e\n            \u003cSlot name=\"javascripts\"\u003e\n            \u003c/Slot\u003e\n        \u003c/body\u003e\n    \u003c/html\u003e\n    HTML);\n}\n```\n\nAnd here is a component inheriting from Mother component:\n\n```php\n\u003c?php\n\nnamespace QuickStart;\n\nuse QuickStart\\Components\\Mother;\n\nfunction Home()\n{\n    return (\u003c\u003c\u003c HTML\n    \u003cMother\u003e\n        \u003cSlot name=\"title\"\u003eEphect in action !\u003c/Slot\u003e\n        \u003cSlot name=\"stylesheets\"\u003e\n            \u003clink rel=\"stylesheet\" href=\"/css/app.css\" /\u003e\n        \u003c/Slot\u003e\n        \u003c!-- \n            The children container of the parent component\n            is filled with all that is not nested in slots\n        --\u003e\n        \u003cdiv class=\"App-content\" \u003e\n            \u003ch1\u003eWelcome Home!\u003c/h1\u003e\n        \u003c/div\u003e\n        \u003c!-- end of children code --\u003e\n        \u003cSlot name=\"javascripts\"\u003e\n            \u003cscript src=\"/js/ephect.js\"\u003e\u003c/script\u003e\n        \u003c/Slot\u003e\n    \u003c/Mother\u003e\n    HTML);\n}\n```\n\nIt will render:\n\n```html\n    \u003c!DOCTYPE html\u003e\n    \u003chtml\u003e\n        \u003chead\u003e\n            \u003cmeta charset=\"UTF-8\"\u003e\n            \u003ctitle\u003e\n                Ephect in action !\n            \u003c/title\u003e\n\n            \u003clink rel=\"stylesheet\" href=\"/css/app.css\" /\u003e\n        \u003c/head\u003e\n\n        \u003cbody\u003e\n            \u003cdiv class=\"App\"\u003e\n                \u003cdiv class=\"App-content\"\u003e\n                    \u003ch1\u003eWelcome Home!\u003c/h1\u003e\n                \u003c/div\u003e\n            \u003c/div\u003e\n            \u003cscript src=\"/js/ephect.js\"\u003e\u003c/script\u003e\n        \u003c/body\u003e\n    \u003c/html\u003e\n```\n\n\n### Hooks\n\n**Ephect** introduces *hooks* to manage the data workflow. Additionally to well-known useEffect and useState hooks in the **ReactJS** realm, **Ephect** comes with 3 new basic hooks:\n\n- useState: to store data in a file and get it back as is,\n- useStore: to store data in a file and get it back as object,\n- useMemory: to store data in a memory registry and get it back as is,\n- useQueryArgument: to filter the value passed as parameter to the query,\n\n## CLI tool *use*\n\n**Ephect** comes with a CLI tool called *use* which provide you with a bunch of practical `make` commands. You can see the full list of commands by typing `php use help`. The primary role of **use** is to build the code of the whole application at once. This is done in one command: `php use build`. The benefits of this approach are the errors management and the increase of velocity of the application.\n\n### Error handling\n\nEvery syntax error is handled as a fatal error which stops the compilation process. An explicit message is displayed on the console output to help you fix it quickly.\n\n### Headless page generator\n\nThe compiler parses the templates of every component owned by a page comprising the cascading components. Each component is translated from **Ephect** template code to pure functional **PHP** code and cached. The code of each component is light and fast to run.\n\nOnce the pages are prepared in cache, browsing them is as fast as possible. The only bottleneck that you should be aware of is the data resources calls.\n\n## Requirements\n\nSince Ephect is an hybrid environment, you need both PHP and NodeJS installed.\n\nIt's highly recommended to use the last versions.\n\nEphect is compatible with PHP 8.3 and Node.js LTS 20.x.x.\n\nYou may also need to install some PHP extensions, if it's not done yes, like PDO/Sqlite, cUrl, Iconv, etc.\n\n## Install the framework\n\nIt's recommended to use the composer create-project command in order to get all the needed stuff.\n\nThere's a dedicated project you can find here **[ephect-io/create-app](https://github.com/ephect-io/create-app)** that will help you for a quick start.\n\nJust do:\n\n    composer create-project ephect-io/create-app myproject\n\nwhere *myproject* is the name of your project.\n\n## Install the sample application\n\nMove to *myproject* directory and type:\n\n    php use make:quickstart\n\nYou will see a **app** directory in which you will find the standard structure of an Ephect application and a **public** directory in which is stored the index.php.\n\n## Build the application\n\nFirst, install all needed modules.\n\n```bash\nnpm install\n```\n\nTo run the application without setting up a web server, you need to serve the application in a separate terminal.\n\nOpen another terminal, move to your project directory and type:\n\n```bash\nphp use serve\n```\n\nCome back to the first terminal and type\n```bash\nnpm run dev\n```\n\nIf you installed the QuickStart application as said previously, you should see something like this:\n\n\n```bash\n\u003e create-app@0.7.0 dev\n\u003e run-script-os\n\n\u003e create-app@0.7.0 dev:darwin:linux\n\u003e bash scripts/unix/dev.sh all\n\nscripts/unix/dev.sh: line 13: warning: here-document at line 11 delimited by end-of-file (wanted `LIST')\nRunning webpack...\nasset app.min.js 2.32 KiB [emitted] (name: main)\nruntime modules 274 bytes 1 module\n./app/JavaScripts/index.js 212 bytes [built] [code generated]\nwebpack 5.91.0 compiled successfully in 306 ms\n\nPublishing assets...\n'app/Assets/bootstrap.php' -\u003e 'public/bootstrap.php'\n'app/Assets/css/setup.css' -\u003e 'public/css/setup.css'\n'app/Assets/css/index.css' -\u003e 'public/css/index.css'\n'app/Assets/css/app.css' -\u003e 'public/css/app.css'\n'app/Assets/favicon.ico' -\u003e 'public/favicon.ico'\n'app/Assets/img/salamandra.png' -\u003e 'public/img/salamandra.png'\n'app/Assets/index.php' -\u003e 'public/index.php'\n'app/Assets/web.config' -\u003e 'public/web.config'\n\nSharing modules...\n'node_modules/human-writes/dist/web/human-writes.min.js' -\u003e 'public/modules/human-writes.min.js'\n\nBuilding the app...\nCompiling App ... 037ms\nCompiling Home, querying http://localhost:8000/ ... 065ms\nCompiling Hello, querying http://localhost:8000/hello/1/2 ... 013ms\nCompiling World, querying http://localhost:8000/world ... 011ms\nCompiling Matriochka0, querying http://localhost:8000/matriochka/1 ... 052ms\nCompiling Info, querying http://localhost:8000/info ... 007ms\nCompiling Callback, querying http://localhost:8000/callback ... 037ms\n```\n\n## The sample pages\n\nThe available page routes are:\n\nA simple page with 2 children components; the first passes values to the second with useState hook.\n- http://localhost:8000/\n\nA sample to show how to manage parameters passed in the URL path.\n- http://localhost:8000/hello/arg1/arg2\n\nA sample to show how to manage parameters passed in the query string with a parent component for the style.\n- http://localhost:8000/world?name=arg1\u0026lname=arg2\n\nA sample to show how to use the same component in cascade.\n- http://localhost:8000/matriochka/arg1\n\nA sample to show PHP info\n- http://localhost:8000/info\n\nA sample to show how to make a JavaScript callback with a PHP JSON response.\n- http://localhost:8000/callback\n\n\n## To be continued...\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fephect-io%2Fframework","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fephect-io%2Fframework","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fephect-io%2Fframework/lists"}