To-do list app tutorial recommendations

Questions & Help General Questions
, ,
1

Hey Clojure friends :wave::slightly_smiling_face:

I’d like to ask what your recommendations are for to-do list app tutorials in Clojure/ClojureScript.

I did a cursory search on Clojureverse and it seems that there isn’t yet a thread of people’s recommendations (please do correct me if there is!).

In terms of to-do list app walkthroughs / tutorials: What has worked for you? What would you like to see that doesn’t yet exist? What have you wanted to try, but felt it was too challenging / inaccessible?

I’m personally interested in what are the typical student/learner app architectures/designs versus how people working in the industry tend to do, even if only for smaller / “trivial” apps.

Context / Rationale: I’m attempting to build my own (opinionated) to-do list app, and I’d like to learn from others on how they approached similar projects. You can see where it is today 2021/08/16 as well as hopefully some progress in the fuuuture :grin:

4 Likes
2

Here’s one I made GitHub - henryw374/firebase-clojurescript-todo-list: tutorial on setting up a simple todo list app with cl, the aim of which is to show that creating a Firebase app with Clojurescript doesn’t need any wrapper libraries.

2 Likes
3

A feature I’d like to see in a to-do list is for prioritization to be relative, not absolute. I’d like to be able to add 3 new, equal priority tasks above ‘Priority 1’. Or rather for them to be the new P1 and for everything else to move down a level.

2 Likes
4

@henry_w What would the rationales be for having auth and database?

I’m personally interested to go simpler as possible, to simply have a static host capable of serving a simple localstorage or cookie saving to-do list - and an even simpler app could do away with persistence.

5

@Andy_Wootton Have you heard of AutoFocus? It might be what you are looking for. Here’s a 3rd party summary as well as the original author themselves’ blog post on the method.

6

I am enjoying reading this post on a simple command line to-do list app here: Creating a TODO cli with Clojure - DEV Community

I believe this kind of simplicity is close to what I’m hoping to recreate in terms of architecture and scope.

7

Auth and database is probably what would start to differentiate a beginner/student/learner from what the industry will ask of a professional.

I doubt many people nowadays contract developers to have them build a local only application.

It’ll be pretty common to want at the minimum a way to sync across all your devices, if not straight up cloud storage.

And as soon as you ask for that, well auth will be needed, since people will tend to not want their data be made public or for anyone to get easy access of or to have it leak.

I think this is also where people will most struggle, since without a framework Clojure throws you in with the lions. Going from no DB to a DB with auth is a big jump, being able to run, maintain, and secure a DB, manage migrations, permissions, backups, scale, consistency, etc.

5 Likes
8

Todo list apps demonstrate some particular thing, with ‘todo’ being a common set of requirements that’s a step up from “hello, world” but not too complicated.

My one was demoing clojurescript+firebase (the ui lib and build tool are secondary), and e.g. this one is clojurescript+reagent+in-app-tutorial re-learn demo.

If the one you’re thinking of is just demoing clojurescript, that’s great too. Although it will inevitably be clojurescript+some-ui-lib+some-way-of-compiling

2 Likes
9

I have created a very basic introductory video to create a simple todo list app in Clojurescript here:

https://www.youtube.com/watch?v=tRYreGS53Z4

2 Likes
10

Have you heard of the TodoMVC project? Open source project where the same Todo app is implemented in a bunch of different languages/frameworks, so that developers can compare them.

I made an implementation in ClojureScript a while ago, and put up the entire development on YouTube.

2 Likes
11

I’ve built this one:

Here the corresponding blog post:

https://maxweber.github.io/blog/2019-08-20-introducing-db-view-part-3

The approach is still in use today in our 2 SaaS businesses.

3 Likes
12

Just a quick update, I wanted to share that I got stuck trying to refactor my code to work with a FSM. My intention was to avoid using imperative style loops and non-idiomatic Clojure code. I believe I need better study references to enable me to implement clean state changes in the program. So, towards that effort, here’s my research:

Research 2021_11_01 Todo List Apps (for CLI & Web)

Note: Starring is my way of “highlighting” my next items to investigate. I’m particularly interested in “tiny” apps with fewer technologies*

  1. Todo App w/ “clean architecture” & gentle intro to clojure.spec, made with Clojure, SQLite, re-frame https://github.com/brianium/clean-todos + retrospect: GitHub - brianium/clean-todos: 📋 A todo example leveraging clean architecture in Clojure :star::star::star:
    Todo CLI inspired by todo.txt w/ Clojure, environ, Ring, Compjure, Liberator, & hexagonal architecture: GitHub - mgryszko/todo-clj: TODO manager :star::star::star:
  2. Todo App using Posh & DataScript: GitHub - mpdairy/posh-todo: An example todo application using Posh
  3. Todo Service demoing the Hypermedia Application Protocol and Transit: GitHub - alexanderkiel/hap-todo: Example ToDo Service demonstrating HAP. + walkthrough: hap-todo/doc/walkthrough.md at master · alexanderkiel/hap-todo · GitHub :star::star::star:
  4. Tiny Todo CLI that works with a todo.txt file: GitHub - PrasannaGnanaraj/todo-cli: a todo cli utility made using clojure :star::star::star:
  5. Todo app using Reagent, Re-frame and Posh with DataScript sync: GitHub - kristianmandrup/todo-poshy: Todo app using Reagent, Re-frame and Posh with DataScript sync
  6. Todo Web App using ClojureScript & Om-Next for a talk at Clojure Meetup Düsseldorf: https://github.com/n2o/todo-cljs + talk slides https://n2o.github.io/todo-cljs/ + does a recording link exist? :star::star::star:
  7. Todo App using DataScript GitHub - tonsky/datascript-todo: DataScript ToDo Sample Application with working demo: https://tonsky.me/datascript-todo/ :star::star::star:
  8. MVC-style Todo App GitHub - marlabrizel/todo-clj: A simple todo app in clojure which uses Compojure, Ring, Hiccup, PostgreSQL, Lein Ring with short write-up on learning insights
  9. Todo App using: Clojure, AngularJS, Karma, Leiningen, Bower, Protractor, Liquibase, Midje, Korma, REST: GitHub - behrica/todo-clojure
  10. Todo App using Clojure & Ring: GitHub - hellokaton/clojure-todo-list: The todo-list application that used clojure + ring
  11. Todo App using ClojureScript, Reagent, and Bonsai: GitHub - Olical/cljs-todo: Simple ClojureScript to do list example using Reagent and Bonsai with live recording of dev on YouTube: https://youtu.be/NnXOGWttgOA
  12. Service Driven Todo Web App using: Clojure, ClojureScript, Monger, Enfocus, Noir, and Fetch. Created for CinJug April 2012 Presentation. GitHub - ckirkendall/The-Great-Todo: Sample service-driven web application using Clojure, ClojureScript, Monger, Enfocus, Noir, and Fetch. Created for CinJug April 2012 Presentation.
  13. Todo MVC App using the pedestal framework: GitHub - janherich/todo-mvc-pedestal: todo-mvc application implemented with pedestal framework
  14. Todo MVC App using vaadin UI library: GitHub - wizardpb/todo: Canonical ToDoMVC application built with Clojure and functional-vaadin UI library
  15. Todo Web App using Component, pedestal, and PostgreSQL (requires docker to run I think…): GitHub - n2o/component-todo-app: Create a Todo-Webapp with Clojure and Component
  16. Todo Backend using Compojure: GitHub - darrenhaken/todo-backend-clojure: Todo backend implemented using Clojure/Compusure http://www.todobackend.com/ based off of http://www.todobackend.com/ :star::star::star:
  17. Todo API: GitHub - dking1286/todo-cljs-api: The API server for the world's most overbuilt todo application built with Environ, Ring, Compjure, Transit, PostgreSQL, honeySQL, Cheshire, Ragtime
  18. Super Simple Todo Web App using Pedestal: GitHub - konrad-garus/pedestal-todo: Client-side only TODO app written in Pedestal (Clojure web framework) with awesome code comments!!! pedestal-todo/app/src/todo_app/app.cljs at master · konrad-garus/pedestal-todo · GitHub :star::star::star:
  19. Todo Backend API spec using Pedestal & Datomic: GitHub - mtnygard/todo-backend-pedestal: An implementation of the Todo Backend spec using Pedestal and Datomic
  20. Todo Backend API spec using Clojure, Ring, Reitit & next-jdbc: GitHub - prestancedesign/todo-backend-reitit: Clojure/Reitit/next.jdbc implementation of the Todo-Backend API spec with running demo: Todo-Backend client :star::star::star:
  21. Todo Web App built with ClojureScript, Reagent, re-frame, Kee-Frame: GitHub - alephyud/todo-split: A simple ClojureScript / re-frame app.
  22. Todo Web App built with Reagent with instructions on how to deploy to Heroku: GitHub - kakoi-to-pirat/todo-reagent: Todo list on reagent framework with demo: https://enigmatic-sands-22935.herokuapp.com/todo :star::star::star:
  23. Todo Web App in Portuguese (?): GitHub - souenzzo/todo-demo: from lambda.io from a Lambda.IO meetup: Login to Meetup | Meetup :star::star::star:
  24. Simple Todo Web App in Japanese built with Ring & Compojure: GitHub - daisea3e1203/todo-clj :star::star::star:
  25. Todo Web App (server-side) built with Ring & Compojure: GitHub - practicalli/clojure-todo-list-example: A Todo List server-side webapp built with Ring & Compojure :star::star::star:
  26. Todo App that can be run as a CLI (?): GitHub - plandes/todo-task: A Supervised Approach To The Interpretation Of Imperative To-Do Lists with a research paper: https://arxiv.org/pdf/1806.07999.pdf :star::star::star:
  27. Todo Web App built with ClojureScript, Reagent: GitHub - oxalorg/clojure-todo: Clojure, ClojureScript, Reagent end-to-end example with live coding: https://youtu.be/tRYreGS53Z4 :star::star::star:
  28. Todo CLI built in ONLY CLOJURE: GitHub - rsachdeva/todo-tasks-summer-holidays: Clojure Command line app to build entered todo lists for summer tasks. :star::star::star:
  29. Todo Web App Server (WIP ?) : GitHub - jg/todo-webapp-server
  30. Todo REPL (CLI ?) Web App built with Compojure, Ring, Hiccup, Prettytime-NLP, and Friend: GitHub - Pance/todo-repl-webapp: A web application that lets you manage todos in Clojure
  31. Todo Android App GitHub - alex-gherega/colored-todo: Simple Android app for training your memory and organize yourself via TODOs - it's all so colorful. :star::star::star:
  32. Todo App using ClojureScript and React-Native: GitHub - joshuamiller/map-todo-demo: A demo app using ClojureScript and React-Native (this shows how different builds are configured map-todo-demo/project.clj at master · joshuamiller/map-todo-demo · GitHub)
  33. Todo MVC App built with ClojureScript, ShadowCLJS, and Helix: GitHub - lilactown/helix-todo-mvc :star::star::star:
  34. Todo Backend API Spec built with Compojure, Ring, java-jdbc, and PostgreSQL: GitHub - akiellor/todo-backend-compojure
  35. Todo CLI with mouse support built with Membrane, Lanterna, & GraalVM: GitHub - phronmophobic/terminal-todo-mvc: An example project for a terminal app with mouse support :star::star::star:
  36. Todo Backend API Spec made with Pedestal, Vase, OSv, and Datomic: GitHub - mtnygard/todo-backend-pedestal-vase: A microservice built using Vase, Pedestal, OSv, and Datomic
  37. Todo Web App with DataScript: GitHub - tonsky/datascript-todo: DataScript ToDo Sample Application with demo: https://tonsky.me/datascript-todo/ :star::star::star:

* and then also I’m interested in command line apps, architectures designed to facilitate clean separation of concerns (Hexagonal, Polylith, Membrane, etc.), Full-stack Web Dev, Pedestal, Reagent, Re-frame, GraalVM, Datomic, DataScript, Datalevin… to name a few things.

5 Likes
13

Thanks but I was replying to the question, based on past experience. I’m not currently looking for anything.

14

Update: This exercise is still on-going. Currently, I am learning more about Hiccup, Reagent, Re-Frame, and full-stack development so I can answer some of my questions regarding how to approach the to-do list app within a GUI context.

2 Likes
15

Looks awesome! :smiley:

1 Like
16

Here is an update on my current to-do list experiments: AutoFocus Code Sketch Day 26

My goal is to refactor out of this code sketch a “MVP” or “SLC” of a “CRUD” to-do list app which has nothing extraneous to the goal of creating a simple, concise, and clear to-do list program using ClojureScript, a dash of CSS (I promise to exercise restraint), and Reagent Hiccup, while using none of the following: servers, databases, bespoke task management algorithms, or anything beyond what is needed to render DOM elements to the window as well as take in user inputs (also from the browser window). Since I’ve always been fascinated with terminals, shells, and command line interfaces, I’d love to make a CLI “port” as well :nerd_face:

17

Hey all, two updates from me:

Here is a MVP ClojureScript to-do list “mini-app”:

It supports item adding, item removing, marking items as complete, and undo’ing the marking of items as complete. This is the tiniest version of a to-do list app that I wanted to see back when I first started working on my to-do list passion project. While this version is runnable from Klipse, I’d like to see that I can (for the sake of curiosity) get a version of this to run locally on my machine from a Shadow-CLJS web app, from Maria Dot Cloud, and from Nextjournal, as well as other target platforms you guys may recommend.

Here is a more fully fleshed out version of my AutoFocus code sketch, now it’s own command line application, rather than a Maria Dot Cloud code sketch:

While AutoFocus-CLJ can be run from the REPL, running it from the terminal is ideal for its working-as-intended screen clearing behavior.

18

Would you say there is an effective order of learning progression for the adding of front-end UI, business logic, back-end systems/infrastructure (persistence/database, hosting, servers, auth, etc.)? I feel pretty comfortable currently with the front-end and general business logic of applications, but where it comes to the setting up, configuring, and connecting of servers and databases, I am not quite sure where best to start, and what builds upon what. Perhaps you have a book or course recommendation you could make with which to get started? For context, I’ve worked for a number of years as a front-end dev (ReactJS/Reagent/ReFrame), and a little bit inbetween front and back on some middleware as well.

Here is a chatGPT search that I did to supplement this question, would you let me know if you agree/disagree: Learning Software Engineering Order - A ShareGPT conversation

19

I am going to stop the AutoFocus Maria Dot Cloud code sketch here at day 34. I didn’t exercise as much restraint as I had intended overall :sweat_smile: That said, I had a lot of fun creating the jump link system to navigate the very long document. The next iteration of to-do list application work that I would like to focus my free time and energies on will be the ClojureScript SPA, most likely using Shadow-CLJS.

20

I’ve completed the minimum viable to-do list exercise for now, it’s up here on GitHub: GitHub - avidrucker/todos-pwa-mvp-cljs: a to-do list PWA & SPA written in ClojureScript

As a bonus, I’ve made a new AutoFocus to-do list sketch over on maria.cloud: AutoFocus Scratchpad 08/09/2023

I’d love to hear folks’ feedback on either/both :nerd_face: