symfony / ux

Symfony UX initiative: a JavaScript ecosystem for Symfony
https://ux.symfony.com/
MIT License
811 stars 295 forks source link

Clarify position relative to Bootstrap #210

Closed GPHemsley closed 4 months ago

GPHemsley commented 2 years ago

I'm not big into frontend development trends, so forgive me if this is an ignorant question.

Is the Symfony UX initiative – and, in particular, its use of Stimulus – meant to supplant the use of Bootstrap? Judging from the documentation of Stimulus and Bootstrap, it seems like there may be some overlap in functionality but mostly not? It's also unclear to me because there are tons of pages of Symfony documentation about Bootstrap but apparently none about Stimulus, or even UX, despite the fact that Stimulus/UX are included as part of the webpack-encore-bundle. Even more confusingly, the setup for UX/stimulus-bridge uses a file called bootstrap.js.

I'm also curious about Stimulus's apparently strong relationship to the Ruby/Ruby on Rails ecosystem. Is that a factor under consideration for its use as the foundation of an initiative for a PHP ecosystem?

94noni commented 2 years ago

@GPHemsley hey, passing by, allow me to give my 2cts

so forgive me if this is an ignorant question.

it is not ignorant at all :)

Bootstrap is a front-end (css oriented) framework to style your app/website, with addition of javascript on top to make things/interactive/fancy/user friendly

Stimulus is also a front-end framework but (javascript oriented) that adds easily some javascript way of writing/binding on top of your html dom, to push user experience more

ex: you can have an html, styled with bootstrap css (or tailwindcss or bulma or picocss), and on top add stimulus


    <div
        class="card" <!-- bootstrap css : will style your div as a card-->
        data-controller="article" <!-- stimulus js : will attach stimulus logic to this html element -->
    >
        <button
            class="btn btn-primary" <!-- bootstrap css : will style your button -->
            data-action="click->article#openModal" <!-- stimulus js : will attach stimulus logic to this html element -->
        >Show</button>
    </div>

you can see a PR of mine on the symfony demo app https://github.com/symfony/demo/pull/1284 I add some stimulus file on top of html already designed with bootstrap css :)

Indeed at first also ready the file name bootstrap.js perhaps can lead to confusion, it is just a bootstrapping file for stimulus, not relation with bootstrapcss :)

And yeah stimulus comes from the team of basecamp/hey, which are built on top of ruby/rails for what I understood, symfony (as rails) as a backend language/framework recommend to return html from the backend and add this small layer of javascript when needed (you can still boot a vuejs/react etc app full js from frontend, with backend serving json)

I've tested stimulus on some apps and I recommend it if you have some frontend ux to do, and you still want to have your full data served via backend as html/json and full control from backend, and keep the frontend easy/dumb ^^

cheers :)

Kocal commented 2 years ago

You are not required to use Bootstrap if you want to use Stimulus.

weaverryan commented 2 years ago

The documentation has now been written (I did it a few days before this issue, but it's not merged quite yet). I hope that will help: https://github.com/symfony/symfony-docs/pull/16323

About the naming of bootstrap.js to something like stimulus-bootstrap.js, that has been recommended at least once before. I'm not against it... changes like that are annoying for documentation, etc... but it may be a good idea to do, especially with the new recipes:update command, which would ease that updatae.

carsonbot commented 4 months ago

Thank you for this issue. There has not been a lot of activity here for a while. Has this been resolved?