Skip to content

build todo app with htmx tailwindcss templ go sqlite

Notifications You must be signed in to change notification settings

noor-tg/todo-htmx-go

Repository files navigation

TODO APP

Features

  • add task
  • list tasks
  • edit task
  • remove task
  • toggle task status
  • filter
    • by status
    • by description
  • counters
    • total tasks
    • completed tasks
  • pwa with https

Dependances

  • htmx (already installed in static directory)
  • tailwindcss
  • templ
  • go
    • can use chi implementation
    • can use echo implementation
  • sqlite as db engine
  • mkcert setup ssl cert for development and test pwa

Installation

  • go dependances
go mod tidy
  • tailwind

  • install air

go install github.com/cosmtrek/air@latest
  • install make
  • install mkcert from releases page
  • run
  mkcert -install
  mkcert todo.local

Run

air

NOTES:

  • hx-delete accept StatusOk to delete hx-target element
  • do not use htmx put, delete requests with proxy without cors setup
  • you may write the name of attributes wrong (i.e ht-post)
  • it is better to use oob than js code with hx events

TODO

  • refactor using echo framework
    • install framework
    • integrate with templ
    • integrate static assets
    • refactor handlers
      • index
      • create
      • edit
      • patch
      • delete
      • counters
    • add integration tests
    • validate user acceptance tests

E2E Tests (with rod)

  • add task
  • remove task
  • edit task
  • list tasks
  • toggle task status
  • filter tasks
    • by status
    • by description
    • by status and description
  • counters

License

It is free and open source. use it however you want.