Demo App for Symfony Twig & Live Components

Overview

Twig & Live Components Demo

Hi there! You've stumbled across a treasure of demos for the the TwigComponent and LiveComponent libraries! Fun!

If you want to see how this system works - including watching forms automatically validate themselves as you type... with zero custom JavaScript, it's all waiting for you here.

Screenshot of the Demo

Setup

Let's get going!

git clone [email protected]:weaverryan/live-demo.git
cd live-demo

composer install
yarn install --force
yarn watch

Prep the SQLite database:

php bin/console doctrine:schema:create
php bin/console doctrine:fixtures:load

Then start the built-in web server:

symfony serve -d
symfony open:local

Have fun!

If you have ideas or find a problem, you can open an issue on https://github.com/symfony/ux

Comments
  • CollectionTypeFormComponent disappears

    CollectionTypeFormComponent disappears

    When trying the demo, the CollectionTypeFormComponent suddenly disappears. It shows in the debug bar: The identifier id is missing for a query of App\Entity\Post

    Clean build

    opened by parijke 2
  • Submitting RegistrationForm renders new page

    Submitting RegistrationForm renders new page

    If you submit the registration form and have a form error, it will render a new /register page with only the registration form on it.

    I thought it would have updated the form inside the current page (without rendering a new page). I would think it should be possible an I'm interested to know how to do this. I can't figure it out so far, maybe you can point me in the right direction?

    opened by dbrekelmans 2
  • Source path

    Source path "./ux/src/TwigComponent" is not found in composer install

    Hi, I just cloned the repo and tried composer install

    The following error popped :

    [RuntimeException]                                                                       
      Source path "./ux/src/TwigComponent" is not found for package symfony/ux-twig-component
    

    Am I missing something ?

    Inspiring keynote by the way ;)

    opened by atouzard 2
  • PHP 7.4 compat

    PHP 7.4 compat

    Cannot be tested with PHP 7.4..

    $ composer install
    Loading composer repositories with package information
    Installing dependencies (including require-dev) from lock file
    Your requirements could not be resolved to an installable set of packages.
    
      Problem 1
        - Installation request for psr/cache 2.0.0 -> satisfiable by psr/cache[2.0.0].
        - psr/cache 2.0.0 requires php >=8.0.0 -> your PHP version (7.4.16) does not satisfy that requirement.
      Problem 2
        - Installation request for psr/link 1.1.1 -> satisfiable by psr/link[1.1.1].
        - psr/link 1.1.1 requires php >=8.0.0 -> your PHP version (7.4.16) does not satisfy that requirement.
      Problem 3
        - psr/cache 2.0.0 requires php >=8.0.0 -> your PHP version (7.4.16) does not satisfy that requirement.
        - doctrine/orm 2.9.3 requires psr/cache ^1 || ^2 || ^3 -> satisfiable by psr/cache[2.0.0].
        - Installation request for doctrine/orm 2.9.3 -> satisfiable by doctrine/orm[2.9.3].
    
    opened by radutopala 1
  • Change for Live/Twig components 2.1

    Change for Live/Twig components 2.1

    Change for the unreleased 2.1 version.

    • https://github.com/symfony/ux/pull/232

    TODO:

    • Use PostMount to fix mount() in ComponentWithFormTrait.
    • Need to document CollectionType once it's smoothed out.
    opened by weaverryan 0
  • Unable to compile frontend assets with npm

    Unable to compile frontend assets with npm

    Running webpack ...

    ERROR Failed to compile with 2 errors 2:05:31 PM

    Module build failed: Module not found: "./assets/bootstrap.js" contains a reference to the file "@symfony/ux-live-component". This file can not be found, please check it for typos or update it if the file got moved.

    "./assets/bootstrap.js" contains a reference to the file "@symfony/ux-live-component/styles/live.css". This file can not be found, please check it for typos or update it if the file got moved.

    opened by straho99 1
Owner
Ryan Weaver
Symfony docs lead, writer at SymfonyCasts, Symfony evangelist, husband of @Leannapelham and a dad!
Ryan Weaver
This package adds artisan commands to create VueJS components and InertiaJS components.

Laravel Vue Commands This package adds artisan commands to create VueJS components and InertiaJS components. Installation You can install the package

ArielMejiaDev 3 Sep 10, 2021
There is no better way to learn than by watching other developers code live. Find out who is streaming next in the Laravel world.

Larastreamers This is the repository of https://larastreamers.com. It shows you who is live coding next in the Laravel world. Installation Steps clone

Christoph Rumpel 201 Nov 24, 2022
live chat with laravel and react mix

About Laravel Laravel is a web application framework with expressive, elegant syntax. We believe development must be an enjoyable and creative experie

Bayzid Aman 4 Oct 21, 2022
Laravel Vue SPA, Bulma themed. For demo login use `[email protected]` & `password` -

Laravel Enso Hit the ground running when building your new Laravel SPA project with boilerplate and extra functionality out of the box! click on the p

Laravel Enso 1k Jan 3, 2023
Laravel Vue SPA, Bulma themed. For demo login use `[email protected]` & `password` -

Laravel Enso Hit the ground running when building your new Laravel SPA project with boilerplate and extra functionality out of the box! click on the p

Laravel Enso 1k Jan 3, 2023
Demo and practice application with Laravel 8 and InertiaJS. (From laracasts course)

InertiaJS playground ⚽️ Started with the Laracasts: Build Modern Laravel Apps Using Inertia.js course and decided to share all my code here, I'll be a

Kasper Ligthart 1 Dec 2, 2021
PinteClone - Pinterest clone using Symfony 5

PinteClone PinteClone can be used: to find the best picture that you need. Programming languages & Frameworks used: PHP Javascript Twig Css (Bootstrap

Iliass Alami Qammouri 3 Apr 26, 2021
Easiest way to create beautiful administration backends with Symfony.

☂ Umbrella framework Easiest way to create beautiful administration backends with Symfony. Demo website • Demo repository Create a new project with Um

Adrien Cantepie 116 Dec 18, 2022
A simple Symfony 5 CRUD

A basic Symfony 5 CRUD application

Stavros Vergos 1 Nov 1, 2021
Reverse proxy skeleton built for docker with traefik, showcasing a Symfony + React application

Decoupled Backend(Symfony) + Frontend(React ts) built with Traefik & Docker Reverse proxy skeleton built for docker with traefik, showcasing a decoupl

Sergiu 1 Dec 13, 2021
A PHP notebook application build with PHP Symfony as back-end API and VueJS/Vuetify front-end.

PHPersonal Notes ?? - BETA RELEASE PHPersonal notes is an application to store your personal notes! PHPersonalnotes is build with Symfony/VueJS/Vuetif

Robert van Lienden 3 Feb 22, 2022
An example of Laravel app that runs in a docker container with RoadRunner

This repository contains an example of Laravel (PHP Framework) application that runs in a docker container with RoadRunner (high-performance PHP appli

Paramtamtam 117 Dec 20, 2022
Simple App Project

SimpleProject(CRUD) by Melvs Clone the repository with git clone Copy .env.example file to .env and edit database credentials there Run composer insta

Melvs 3 Apr 22, 2021
App & Models Settings for Laravel

App & Models Settings for Laravel This package allows you to store application wide and model specific Laravel settings. Settings values are type-cast

Mohammed Isa 42 Aug 12, 2022
Identify app models with a URI. Inspired by the globalid gem.

Identify app models with a URI. Heavily inspired by the globalid gem. Global ID - Reference models by URI A Global ID is an app wide URI that uniquely

Tony Messias 31 Nov 18, 2022
todolist app with vueJS frontend and laravel backend

todolist-vuejs-laravel A todolist app with vue.js frontend and laravel backend Demo demo Installation To run this locally, you'll need to clone the re

Isaac Kojo Yeboah 2 May 10, 2022
Simple web app with laravel build from scratch

Find Me Simple Web Application This "Find Me" matchmaking web-based application is useful for facilitating people who are looking for new relationship

Jieyab 15 Nov 26, 2022
Boilerplate for a standard tested resourceful Laravel app

Gold Standard A Laravel boilerplate resource This repo is an example of what I consider to be my "gold standard" of a resource-oritented application w

Dwight Watson 25 Mar 19, 2019
A Dashboard Panel for Shop Admins to control customers using Hyperstream App

Overview ?? Hyperstream is an application that facilitates simple and easy self-service at supermarkets, eliminating long lines for customers and redu

null 1 Oct 27, 2021