Generators & Page Builder

Generators
mix petal.gen.live
This produces the same files as Phoenix's mix phx.gen.live . The only difference is that the templates use Tailwind and Petal Components. You can try it out with: 
1
mix petal.gen.live Todos Todo todos label:string is_done:boolean
Copied!
Add the routes from the output. 
If you're wondering where to put the routes, you can search in the router file for the text "page_builder:live:protected", and add them straight after that line.
1
def PetalProWeb.Router do
2
  ...
3
​
4
  scope "/", PetalProWeb do
5
    pipe_through [
6
      :browser,
7
      :require_authenticated_user,
8
      :kick_user_if_suspended_or_deleted,
9
      :onboard_new_users
10
    ]
11
    
12
    live_session :require_authenticated_user,
13
      on_mount: {PetalProWeb.UserOnMountHooks, :require_authenticated_user} do
14
      live "/todos", TodoLive.Index, :index
15
      live "/todos/new", TodoLive.Index, :new
16
      live "/todos/:id/edit", TodoLive.Index, :edit
17
    
18
      live "/todos/:id", TodoLive.Show, :show
19
      live "/todos/:id/show/edit", TodoLive.Show, :edit
20
    end
21
  end
22
  ...
23
end
Copied!
After running the generator: the "index" screen
The "new todo" screen
After creating a new todo
The "show" page
Page Builder
Usually, when you want to create a new page, you would have to create a new template file or live view file. Then you would create a route and point it either to the template's corresponding controller action, or directly to the live view. 
To skip these steps, we made it so if you navigate to a path with no route on it then it will show what we call "The Page Builder" 👏.  The Page Builder is simply a form that helps you construct a page at that route. Submitting the form will result in the route being automatically added to the router.ex file and either a template or live view file is created for you.
Me creating a new page at the route "my-cool-new-page"

Fundamentals - Previous

Extra Hex Libraries

Next - Fundamentals

Translations

Last modified 2mo ago

Copy link

Contents

Generators

Page Builder