cblavier

cblavier

Phx_component_helpers - Extensible live_components, without boilerplate

Hey there :waving_hand:

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 :hugs:

Most Liked

cblavier

cblavier

A glimpse of some of the components we’re writing with phx_component_helpers :eyes:
A table with infinite scroll, sticky headers, sorting, filtering, placeholder, result counter … coming for really cheap to our front-end developpers :slight_smile:

Code source is really neat with proper component encapsulation :ok_hand:

10
Post #7
cblavier

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 :eyes:) we built our own storybook (inspired from React’s)

Here is a preview:

https://s3.gifyu.com/images/storybook.gif

cblavier

cblavier

0.8.0 :rocket:

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 :sweat_smile:

https://github.com/cblavier/phx_component_helpers/blob/main/CHANGELOG.md

Where Next?

Popular in Announcing Top

mischov
import Meeseeks.CSS html = HTTPoison.get!("https://news.ycombinator.com/").body for story <- Meeseeks.all(html, css("tr.athing")) do...
New
tfwright
After working on it for a couple of months and using it in production for most of that time, today I’ve released LiveAdmin, a LiveView ba...
New
devonestes
Introducing assertions, the library that helps you write really great test assertions! GitHub: GitHub - devonestes/assertions: Helpful a...
New
Crowdhailer
I have been updating a library that allows you to pipe between functions that use the erlang result tuple convention. Assuming you have ...
New
woutdp
Hi! I wanted to introduce my latest project LiveSvelte. It allows you to render Svelte inside LiveView with end-to-end reactivity. It’s ...
New
blatyo
The best overview for how things are tied together is this presentation. Modules and functions are pretty well documented at this point, ...
New
mbuhot
Leverage Open Api 3.0 (Swagger) to document, test, validate and explore your Plug and Phoenix APIs. Generate and serve a JSON Open API ...
New
treble37
Just looking for a little feedback on a tiny helper library I built - Sometimes I find the need to convert maps with atom keys to maps w...
New
Hal9000
Here is my first stab at this. README pasted below. https://github.com/Hal9000/elixir_random Comments and critiques are welcome. Thank...
New
pkrawat1
Hey guyz We at @aviabird are working on a payment library in elixir/phoenix. We are targeting March 2018 to add 56 Gateways to it. Have...
New

Other popular topics Top

AstonJ
Posting this to see if we can make things easier for people to get into Neovim. If you use Neovim and have a favourite distro please let ...
New
ovidiubadita
Hey all, I discovered Elixir and I love it. I always wanted to learn a functional programming and I intended to go for Haskell, but afte...
New
jononomo
I am trying to figure out how Mix knows whether the environment is test, dev, or prod – where is this set? Thanks.
New
chrismccord
Phoenix 1.4.0 released Phoenix 1.4 is out! This release ships with exciting new features, most notably with HTTP2 support, improved deve...
688 30877 112
New
vegabook
I’m brand new to Phoenix and I have stripped one of the demo applications to the bone. I just want to get an svg up on the screen. Here i...
New
alice
Hey, Just curious what are the main benefits of Elixir compared to Clojure? When is Elixir more useful than Clojure and vice versa? Th...
New
aalberti333
As the title describes, I’m trying to run Enum.map() over a list of key/value pairs, where the value is a map. My data looks like this: ...
New
freewebwithme
Using vs code and installed ElixirLS: support and debugger. And I got an error popped up on start up says Failed to run ‘elixir’ comma...
New
ashish173
I am using Ecto timestamps with postgres, I can see the timestamps() use the :naive_dateime but for my use case I wanted to store the ti...
New
nsuchy
Hi. I’ve noticed that Windows Powershell has it’s own IEX command and you cannot access Elixir’s IEX due to the conflict. This isn’t a cr...
New

We're in Beta

About us Mission Statement