dwyl / technology-stack

🚀 Detailed description + diagram of the Open Source Technology Stack we use for dwyl projects.
287 stars 26 forks source link

`PETAL` Stack #87

Open nelsonic opened 2 years ago

nelsonic commented 2 years ago

We've recently heard some buzz about the "PETAL" stack: https://changelog.com/posts/petal-the-end-to-end-web-stack

Update: If you're new to this and want a fully functional example/tutorial App built with the PETAL stack, see: https://github.com/dwyl/mvp

nelsonic commented 2 years ago

https://underjord.io/getting-started-with-petal.html

ElixirConf 2020 - Patrick Thompson - Liven up your LiveViews (even further) with AlpineJS: https://youtu.be/Dv64_tGJhHo image

image

image

image

image This JS embedded in the HTML attributes does't look particularly maintainable/debuggable to me ... 🤷‍♂️ But keeping an open mind. 💭

image image image

SimonLab commented 2 years ago

Video setup on youtube: PETAL stack setup (Phoenix 1.6, Elixir, Tailwindcss, Alpinejs, LiveView)

nelsonic commented 2 years ago

Chris & Co @superfly are using PETAL for the Fly.io dashboard: https://fly.io/dashboard/hits fly-dashboard-PEATAL-stack-liveview-tailwind-alpine

Production/mission-critical use is the biggest endorsement for a technology/stack.

nelsonic commented 2 years ago

I feel like my Tailwind knowledge has come a long way in the past week while suffering through building the MVP. I specifically didn't know much about positioning ... 🙄 but with @RobStallion's help feel a lot more confident with using flex and feel like the MVP will look "OK" now: https://github.com/dwyl/app-mvp-phoenix/issues/89#issuecomment-1178767162 (keep scrolling ...)

@SimonLab how are you feeling about Alpine.js and Tailwind? 💭 I've assigned this Alpine.js side-quest/spike to you: https://github.com/dwyl/learn-alpine.js/issues/3 LMK what you think. 👍

nelsonic commented 2 years ago

Included in #80 🚀

nelsonic commented 1 year ago

@SimonLab recently added https://petal.build/components/ to the MVP 🚀 The PR was quite brief: https://github.com/dwyl/learn-tailwind/pull/21/files It would be amaze to get a more detailed example showing component re-use ... 💭