Introducing Boilerplate Builder
I have started a new project. Its a free PhoenixBoilerplate that you tweak and select features after your need and taste.
So, to fill my own need, I have started a boiler plate builder project. Its is not nearly done yet but it should save you at least an hour or two.
STEP 1 - Get Started
Go to the url: https://fullstackphoenix.com/boilerplates
Fill in the app name in snake case and select the options. In this example I will call my template my_example. Then click Save.
The process takes maybe 10 seconds and then a download link should appear.
Download the file and unpack it.
Rename the folder and cd into it. Run
mix deps.get && mix ecto.create
Install assets with:
cd assets && yarn
And then start the server with:
Visit localhost:4000 and you should see something like:
STEP 3 - Generating a resource
I have included a generator for the theme that where generated with Bootstrap or Tailwind. There is both a LiveView version and a vanilla Phoenix Html version.
I call these PrettyHtml or PrettyLive. Run the PrettyLive version by running the comman:
mix phx.gen.pretty_live Products Product products name content:text active:boolean
This should generate the normal context and tests, but also Bootstrap or Tailwind themed html templates.
First, I need to follow the instructions and add to my routes:
live "/products", ProductLive.Index, :index live "/products/new", ProductLive.Index, :new live "/products/:id/edit", ProductLive.Index, :edit live "/products/:id", ProductLive.Show, :show live "/products/:id/show/edit", ProductLive.Show, :edit
If you go to localhost:4000/products/new new you should see a modal form presented with Phoenix LiveView
And it should be stored:
STEP 4 - phx_gen_auth
If you selected that the app should be installed
phx_gen_auth a full user authentication system should also be installed. More on that later, but it looks like this:
This is just the initial version and I have plans to make this more featureful and usable. There will be an admin theme and integrated payment options high on my list. If you have any ideas or questions, reach out to me for a discussion.
Published 01 Apr
Create a reusable modal with LiveView Componentalpinejsliveviewmodalphoenixtailwind
To reduce duplicity and complexity in your apps, Phoenix LiveView comes with the possibility to use reusable components. Each component can have its..