To-do list app tutorial recommendations

avidrucker · August 16, 2021, 1:27pm

Hey Clojure friends

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

henry_w · August 16, 2021, 2:18pm

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.

Andy_Wootton · August 16, 2021, 4:52pm

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.

avidrucker · August 17, 2021, 4:03pm

@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.

avidrucker · August 17, 2021, 4:16pm

@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.

avidrucker · August 17, 2021, 11:45pm

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.

didibus · August 18, 2021, 12:46am

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.

henry_w · August 18, 2021, 6:00am

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

oxalorg · August 20, 2021, 3:06pm

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

tombowden · August 21, 2021, 12:16pm

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.

maxweber · August 21, 2021, 8:16pm

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.

avidrucker · November 1, 2021, 2:13pm

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*

Todo App w/ “clean architecture” & gentle intro to clojure.spec, made with Clojure, SQLite, re-frame GitHub - brianium/clean-todos: A todo example leveraging clean architecture in Clojure + retrospect: GitHub - brianium/clean-todos: A todo example leveraging clean architecture in Clojure
Todo CLI inspired by todo.txt w/ Clojure, environ, Ring, Compjure, Liberator, & hexagonal architecture: GitHub - mgryszko/todo-clj: TODO manager
Todo App using Posh & DataScript: GitHub - mpdairy/posh-todo: An example todo application using Posh
Todo Service demoing the Hypermedia Application Protocol and Transit: GitHub - alexanderkiel/hap-todo: Example ToDo Service demonstrating HAP. + walkthrough: hap-todo/walkthrough.md at master · alexanderkiel/hap-todo · GitHub
Tiny Todo CLI that works with a todo.txt file: GitHub - PrasannaGnanaraj/todo-cli: a todo cli utility made using clojure
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
Todo Web App using ClojureScript & Om-Next for a talk at Clojure Meetup Düsseldorf: GitHub - n2o/todo-cljs: Small todo application written in ClojureScript and om-next for my talk at Clojure Meetup Düsseldorf + talk slides ClojureScript und om-next - Christian Meter + does a recording link exist?
Todo App using DataScript GitHub - tonsky/datascript-todo: DataScript ToDo Sample Application with working demo: ToDo
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
Todo App using: Clojure, AngularJS, Karma, Leiningen, Bower, Protractor, Liquibase, Midje, Korma, REST: GitHub - behrica/todo-clojure
Todo App using Clojure & Ring: GitHub - biezhi/clojure-todo-list: The todo-list application that used clojure + ring
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: Simple todo list with ClojureScript and Reagent - YouTube
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.
Todo MVC App using the pedestal framework: GitHub - janherich/todo-mvc-pedestal: todo-mvc application implemented with pedestal framework
Todo MVC App using vaadin UI library: GitHub - wizardpb/todo: Canonical ToDoMVC application built with Clojure and functional-vaadin UI library
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
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/
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
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.cljs at master · konrad-garus/pedestal-todo · GitHub
Todo Backend API spec using Pedestal & Datomic: GitHub - mtnygard/todo-backend-pedestal: An implementation of the Todo Backend spec using Pedestal and Datomic
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
Todo Web App built with ClojureScript, Reagent, re-frame, Kee-Frame: GitHub - alephyud/todo-split: A simple ClojureScript / re-frame app.
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
Todo Web App in Portuguese (?): GitHub - souenzzo/todo-demo: from lambda.io from a Lambda.IO meetup: https://www.meetup.com/Lambda-I-O-Sampa-Meetup/events/255279405/
Simple Todo Web App in Japanese built with Ring & Compojure: GitHub - daisea3e1203/todo-clj
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
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
Todo Web App built with ClojureScript, Reagent: GitHub - oxalorg/clojure-todo: Clojure, ClojureScript, Reagent end-to-end example with live coding: ClojureScript with React (Reagent) - A simple todo app - YouTube
Todo CLI built in ONLY CLOJURE: GitHub - rsachdeva/todo-tasks-summer-holidays: Clojure Command line app to build entered todo lists for summer tasks.
Todo Web App Server (WIP ?) : GitHub - jg/todo-webapp-server
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
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.
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)
Todo MVC App built with ClojureScript, ShadowCLJS, and Helix: GitHub - lilactown/helix-todo-mvc
Todo Backend API Spec built with Compojure, Ring, java-jdbc, and PostgreSQL: GitHub - akiellor/todo-backend-compojure
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
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
Todo Web App with DataScript: GitHub - tonsky/datascript-todo: DataScript ToDo Sample Application with demo: ToDo

* 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.

Andy_Wootton · November 1, 2021, 3:53pm

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

avidrucker · February 11, 2022, 12:13pm

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.

Shaffan · July 7, 2022, 8:14pm

Looks awesome!

avidrucker · November 4, 2022, 1:56am

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

avidrucker · March 6, 2023, 2:55am

Hey all, two updates from me:

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

gist.github.com

https://gist.github.com/avidrucker/35b7118b65f64c989f24ae4e6d948da8

todo-mvp.clj

;; this code will work in Klipse if and only if the URL is http://app.klipse.tech/?container=1
;; original program source: https://orgpad.com/o/BSZ05PGN1PMbIjmwIT3Vhs?s=clojure-tutorial
(require 
  '[reagent.core :as r]
  '[reagent.dom :as r-dom])

(def todos (r/atom 
             [{:text "Start Clojure tutorial" :id 0}
              {:text "Finish Clojure tutorial" :id 1}
              {:text "Create a video for it" :id 2}

This file has been truncated. show original

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.

avidrucker · May 17, 2023, 3:40pm

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

avidrucker · May 17, 2023, 4:35pm

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 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.

avidrucker · August 10, 2023, 3:26pm

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