Listing Live Features
Live Featuers are Phoenix LiveView components that you can use in your own project. Every feature comes an interactive demo and a description on how to use them. I have made the components with Tailwind and in some cases I have sprinkled some AlpineJS. Every Feature has one or more files and also comes with some tests.
The reason I made them is to speed up development and make it easy for you to build your current or next project with LiveView.
There will be a bunch of free features and eventually I will add some premium features.
Published 23 Aug Free
Pretty notifications with LiveView and Alpine
This feature is about displaying in app notifications with Phoenix LiveView, Tailwind and AlpineJS.
Published 27 Jul Free
Sortable lists with sortable JS
This feature uses the javascript library sortable js to handle drag and drop sorting. The javascript is initiated with a LiveView hook. The idea is that the as soon the the sorting event is triggered, I send a push event to the component with the list of task ids and the sortorder. In this example, there are also two connected lists and the tasks can be sorted and drag between both lists.
Published 20 Jul Free
Basic LiveView form validation
Inline form validation basically comes out of the box if you generate a new LiveView app. However, if you want to try it out or add it afterwards, this feature can show you how you can very easily implement it.
Published 15 Jul Free
Simple Typeahead with LiveView and no JS
A simple typeahead that is very easy to implement. Just start with typing a character and LiveView will return a list of matching products. No javascript required.
Published 13 Jul Free
Reusable toggleable LiveView buttons
A lot of web apps need some sort of toggle buttons. So I have made a reusable toggleable LiveView buttons. As you can see they can have different kind of content and styling.
Published 09 Jul Free
Basic Modal with Alpine JS
Basic animated modal with Alpine JS. This feature needs a little help from the JS to get the nice animated effect.
