cblavier
Phx_component_helpers - Extensible live_components, without boilerplate
Hey there 
A few days ago I extracted a lot of functions I’m using in 2 different projects (one large phoenix LiveView project and a small PETAL app)
https://github.com/cblavier/phx_component_helpers
It basically answers to the following needs:
- quickly package UI code into live_components
- make components extensible from the templates (in the spirit of Tailwind & Alpine)
- less boilerplate possible.
I first tried Surface, and even if I was impressed, it felt too heavy for me (btw it has more line of codes than LiveView itself) and I’d really prefer to stay closer to the underlying library (LiveView)
Let me know what you think of this lib 
First Post!
cblavier
Most Liked
cblavier
A glimpse of some of the components we’re writing with phx_component_helpers 
A table with infinite scroll, sticky headers, sorting, filtering, placeholder, result counter … coming for really cheap to our front-end developpers 
Code source is really neat with proper component encapsulation 
cblavier
As we started to get an ever growing list of components and were also looking to get stronger UI guidelines (I’m looking at you Tailwind colors ) we built our own storybook (inspired from React’s)
Here is a preview:
cblavier
0.8.0 
I’m still (I guess) the sole user of this library, but for whatever reason I’m polishing it as if it were to be used by thousands 
https://github.com/cblavier/phx_component_helpers/blob/main/CHANGELOG.md
Last Post!
cblavier
Just released 1.1.0 with a new, more explicit, behavior of extend_class/3 which fixes the issue mentioned in this topic.
Changelog:
extend_class/3 behavior has been updated and will soon no longer replace default css classes based on their prefix (this behavior is still working but deprecated). To switch to the new behavior and suppress warning messages, pass the prefix_replace: falseoption and use the new ! based syntax to explicitly remove default CSS classes. (ex: !border-* border-red-500)
Popular in Announcing
Other popular topics
Latest on Elixir Forum
Sponsor Spotlight
Courses that'll move you from confusion to "Aha, now I get it!"
Categories:
Sub Categories:
Forums
Popular Tags
- #ecto
- #liveview
- #troubleshooting
- #learning-elixir
- #deployment
- #library
- #erlang
- #testing
- #genserver
- #mix
- #absinthe
- #remote-other
- #otp
- #plug
- #how-to-question
- #macros
- #postgres
- #channels
- #elixirconf
- #exunit
- #discussion
- #code-sync
- #javascript
- #podcasts
- #onsite
- #dialyzer
- #docker
- #authentication
- #umbrella
- #full-time-contract
- #podcasts-by-brainlid
- #ecto-query
- #elixir-ls
- #phoenix_html
- #iex
- #blog-post
- #graphql
- #genstage
- #ai
- #websockets
- #supervisor
- #elixirconf-us
- #advent-of-code
- #distillery
- #processes
- #api
- #forms
- #metaprogramming
- #security
- #hex
Our Sponsors
Build Elixir applications with speed and confidence.
Supporting innovation across the BEAM ecosystem.
We build reliable cloud platforms for business-critical systems.
Catch errors, track performance, monitor hosts and more.
Error tracking, logs, uptime, and Just Enough APM. Built for developers.
Practical resources that improve the lives of professional developers.
Producing high quality Elixir screencasts since 2017.
The deployment platform built for Elixir: PaaS ease, VPS control.
The team behind Membrane, Popcorn, LiveDebugger. Available for hire.
Courses that'll move you from confusion to "Aha, now I get it!"