This is a demo app because I couldn't resist trying. I saw the challenge that Ryan Florence put out for other framework authors, or anyone, to remake his Trellix demo (inspired by Trello) and see if they can make it better than Remix. No one was making anything quite as Ryan's demo (or at least enough to get an A from him). So I picked up the challenge.
Other Trellix Demos:
- Next.js - Ryan's reaction
- Tanstack - Ryan's reaction
- Replicache - Ryan's reaction
I am not a framework author, so the goal with this demo is to see if I can make it without a framework. One further, I thought I could make it without a build step. I wanted to see if I could do this with zero dependencies. Not even tailwind!
And I did it. There are zero (production) dependencies. Just development dependencies for typescript for the bun server, and prettier because I'm not a mad man.
I used bun for my backend and only used the built in APIs. Admittedly this is kind of cheating since it has a lot built in, including SQLite. So maybe this would be better called Trellix-Bun ¯\_(ツ)_/¯
One final note: Remix is awesome. Don't make things like this. Make them with Remix.
Obviously.
Take a look at the live demo: https://trellix-vanilla.fly.dev/
And roast me on Twitter if I don't live up to Ryan's demo: @kbitgood
I noticed Ryan's Trellix demo was missing some features. I'd give his demo an A- 😉. So I added a couple of things.
- I added ability to delete columns from a board.
- How can you use this without that?
- I also added the ability to reorder columns with drag and drop.
- I made it work without javascript!
- I was inspired by Remix's use of forms. If everything is a form then this is easy peasy. I just had to do some css trickery with
focus-within
instead of buttons that show forms.
- I was inspired by Remix's use of forms. If everything is a form then this is easy peasy. I just had to do some css trickery with
- I made it work without an internet connection!
- It's not fully local-first or a PWA, but if you disconnect, everything will still work and it will sync up when you reconnect.
Install bun then run:
# 👇 not needed! zero dependencies baby!
# bun install
bun run dev