A simple HTMX + chi + templ page template layout to use as a starting point for a simple web application.
I used the sidebar example from the bootstrap documentation to create a simple layout with a sidebar and a main content area.
- chi/v5: https://github.com/go-chi/chi
- templ: https://templ.guide/
- htmx: https://htmx.org/
- bootstrap: https://getbootstrap.com/
In this folder we put the API handlers. The API is a simple REST API that returns JSON data or HTML text content. The API is used by the "frontend" to request a HTML content.
See the "api/example" folder for an example of a simple API handler.
- The
api/assets-files-watcher-apiis used to serve all assets files, who is "compiled" using the bindata tool (see the Makefile).- You can add your own assets files in the
assetsfolder and add to the Makefile if is necessary. - TODOS: add some cache control to the assets files avoiding reloading the files every time.
- You can add your own assets files in the
- Create the new API "folder" to handle the upcoming requests from client browser
- Inside the folder create the first templ like:
This template is used on the main "page" function and is used to render the initial layout of the page requested
templ ExamplePageTempl() { <div class="container-fluid p-5"> <div class="row mb-2"> <div class="col-6"> Example Page </div> </div> </div> } - You can see the example on the
api/example-apifolderfunc (h *WADashboardAPi) Register(r chi.Router) { r.Get("/example", h.GetExamplePage) } // GetExamplePage - Renders the main example page, loading all necessary first things.... func (h *WADashboardAPi) GetExamplePage(w http.ResponseWriter, r *http.Request) { err := wa_server_templs.RenderPageLayout( w, r, "Example Page", wa_server_templs.ExamplePage, ExamplePageTempl(), ) if err != nil { w.WriteHeader(http.StatusInternalServerError) } return }
- Compile the templates with
templ generatecommand or call the Makefilemake make_templto regenerate all templates. See the https://templ.guide/ documentation