TODO.md

TODO

• === release 2.0 ===
• Fixes for project template:
  • Fix indent on main function
  • Update nodemon watch list to include public dir and all file extensions
  • Fix gitignore not getting renamed to .gitignore
  • bump and release cli
• Try https://devenv.sh/
• v3 branch
  • Annoyance with needing a full program and multiple update cycles to run tasks since Response.send is a CMD...
    • Move SimpleRouter.defineProgram to Prettynice.defineSimpleRouter and remove SimpleRouter
    • Add Prettynice.defineRouter with Task Never Response
    • detour: experiment with sendAsTask in Node, see if it simplifies https://gist.github.com/blaix/106365cd437e776332ba15bab8a24c90 enough to be worth it
    • Update examples/next to use the new defineRouter, etc. where appropriate
    • Use this "ResponseReady" pattern for full program examples: https://gist.github.com/blaix/106365cd437e776332ba15bab8a24c90
  • Update README and gren package docs with changes
  • Create v3 website and update to show progression from defineSimpleRouter -> defineRouter -> defineProgram
    • Consider a diff-based approach like the README for https://github.com/edkelly303/elm-composer
    • Take some inspiration from: https://fresh.deno.dev/
    • Update v1 and v2 version of website with a banner pointing to prettynice.dev for redirect to latest version
  • Update examples/v2 to use hardcoded v2 of prettynice in gren.json
  • Address TODO comments
  • Merge
  • See notes/releasing.md
• == release 3.0 ==
• Look at https://github.com/edkelly303/elm-composer - may be ideas here that are useful
• Is it possible to have a websockets example yet?
• listen to lustre episode of developer voices and check out the links
• Options for project generator
  • default: defineSimpleRouter
  • router: defineRouter
  • program: defineProgram
• Add a component generator to cli
• Experiment/Idea: server-side TEA
• 2.0 doc site:
  • Think about versioning...
  • Update doc links to use major version prefix: gren-lang/package.gren-lang.org#39
  • Find appropriate place to include instructions for the "full program" version of generator
  • [o] Flesh out gren guide as needed:
    • Add applications section:
      • The Elm Architecture
        • See evan's original tutorial on this: https://github.com/evancz/elm-architecture-tutorial/tree/2ce0f550cb6331cd5659e6a39095ce8ebfef34c0
        • Good stuff in the lustre docs too: https://github.com/lustre-labs/lustre/blob/main/pages/guide/02-state-management.md
      • Browser Applications
      • Node Applications
    • Add "gren for elm programmers" to appendix?
    • Elaborate on the FAQ section about differences from elm
  • Flesh out remaining pages
  • Link on github project settings and README
  • Link to relevant sections from the example READMEs
  • Link in the error message for failed props parsing
  • https://www.youtube.com/watch?v=jIPZlrCpwiE should probably be in the docs somewhere...
  • Deployment example + docs.
    • sqlite vs postgresql (easy local dev vs easy management deployment?)
    • Fly.io vs Render.com
    • docker?
    • caddy as reverse proxy (and serving static)?
• Basic offline support with https://github.com/DannyMoerkerke/basic-service-worker ?
• Blog post about prettynice?
• RealWorld example? TodoMVC example? Blog? Live code it?
• Add more examples:
  • basic auth
  • cookies
  • HTMX?
• Vite support? (required for pencils?):
  • FIRST: consider web components to clean up the "isolate element" js
  • ALSO FIRST: consider esbuild instead of vite:
    • Worried vite is overkill, changes too rapidly, and has too much happening implicitly / under the hood
    • Stuff like this is very troubling (prod vs dev inconsistencies): https://twitter.com/ryanflorence/status/1782409358057603439
  • Use one of the gren vite plugins?:
    • https://github.com/gabriela-sartori/vite-plugin-gren (original?)
    • https://github.com/laurentpayot/vite-plugin-gren (links to gabriella's as "original". why was this created?)
  • Create a prettynice-specific plugin? https://vitejs.dev/guide/api-plugin
  • Replace CodeGen.copyPublicDir with vite:
    • Configure the public dir?
    • An assets dir? Lets you have a tailwind.css that's transformed.
    • Confusing to have both assets and public?
    • How to make it not suck to reference assets from gren code in a way vite will recognize?
  • Handle imports in ComponentName.js for (codemirror for pencils, etc.)
  • client/src/app.{js,ts} entry point?
  • Styling? See pencils/notes/UI.md
  • On the node side:
    • how does vite normally integration with node? https://www.npmjs.com/package/vite-node ?
    • Handle imports - wait how is prisma working now...?
    • server/src/app.{js,ts} entry point?
    • what does this mean for ports.js?
  • Nice to haves:
    • Full-color errors and jump to editor support? https://twitter.com/rhg_dev/status/1779998936578605493
• Experiment with nested TEA again e.g. standalone modules per route. See examples/next/tea-modules.
  • LOTS of potential here! => see https://dev.to/jmpavlick/for-lack-of-a-better-name-im-calling-it-the-module-pattern-5dfi
  • and https://dark.elm.dmy.fr/packages/lue-bird/elm-state-interface/latest/
  • and https://discourse.elm-lang.org/t/what-are-your-thoughts-on-the-translator-pattern-for-child-parent-communication/9730
• Experiment with htmx and hyperview:
  • https://hypermedia.systems/
  • https://htmx.org/essays/when-to-use-hypermedia/
  • See this experiment / write-up by Mario: https://github.com/supermario/elm-htmx
  • May be able to incorporate the core 80% without using the library: https://joshi.monster/posts/build-your-own-htmx/
  • Server-side only dynamic interactions. All logic in one place. Grug like.
  • Use case: add/edit/delete items from todo list.
  • Hyperview for mobile...?
  • Also look at liveview
  • ...and SSE
• See notes/js-task.md. Do I need some kind of composable, Task-like interface for js functions yet (will pencils need this for db calls?)?
  • Would JTD be any help here? See https://github.com/BrianHicks/elm-duet
• Consider the list of sveltekit features which mirror a lot of what I want out of a framework: https://kit.svelte.dev/ (see "features? we got em.")
• Test Sourcemaps
• Gren compiler errors losing colors in "npm run dev" output?
• Post video(s) showing off full-stack type safety
• See https://github.com/MaeBrooks/gren-webserver - there's some cool ideas in here.
• Look at mdgriffith's elm-prefab: https://github.com/mdgriffith/elm-prefab/tree/main/guides - cool ideas here too
• Add a Dockerfile to the project template?
• Add tests to the template app
• Add __filename to Node env, splitPath to FileSystem, and replace cli's dirname port call: https://gren.zulipchat.com/#narrow/stream/376306-ideas/topic/Node.20bindings.20to.20__dirname.3F/near/425878041
• just publish-cli that runs build-cli and validates similar to gren package validate
• Unit Tests. Especially Prettynice.Internal.Props
• Functional browser tests with playwright or similar
• Windows support: Remove POSIX path coupling from CodeGen (Shikensu's *Posix functions and hardcoded "/")
• Think about CSS post-processing:
  • tailwind? (meh)
  • bulma.io looks nice (no js!), maybe worth a UI package? look at https://package.elm-lang.org/packages/surprisetalk/elm-bulma/
  • look at https://www.npmjs.com/package/@ryannhg/css-in-elm
• Think about JS bundling/transpiling:
  • vite? support importing .gren files?
  • swc?
• Cookies & Sessions
• Consider: what if I want traditional Flags from js? (right now prettynice controls this to do Props)
• RealWorld example app
• Redirect helpers?
• Handle multipart/form-data and file uploads
• Responses that align with the request content-type (e.g. 404 that returns html, string, or json depending on the request)
• Support records and custom types in component Props field types? See https://github.com/stil4m/elm-syntax for possible reference/example. Or worth waiting for gren-in-gren?
• Future ideas / Experiments:
  • component events that can trigger server-side messages: https://gist.github.com/blaix/5184b52b28f53c8019eca4a91e2fa868
  • HTM[X|Z] integration:
    • Form submissions? See https://remix.run/docs/en/main/components/form
    • Server-side components?
    • toBackend/toFrontend messages?
    • replacing the generated script tag with an hx-trigger? https://twitter.com/RustyVermeer/status/1784972656749768739
    • If I just need to replace elements on the page: https://leanrada.com/htmz/
    • What about slow connections / failed js loading? See https://www.youtube.com/watch?v=EzLGleT1yrY
• Speed up build step. Parallelize build tasks? (codegen has to happen before client/server builds)
• Experiment with portals. Would this help with components at all?
  • https://react.dev/reference/react-dom/createPortal
  • https://wolfgangschuster.wordpress.com/2023/06/21/bring-your-own-dom-part-1-portals/)?
• Audit error messages

Open questions and future ideas

• No good way to get port and host from env vars for Prettynice.startProgram. Currently must be hard-coded or passed in via argv[].
• Is there anything that can be done about the duplication between Prettynice.gren and Prettynice.SimpleRouter.gren?
• Should there be a prettynice cli "serve" command?
  • Originally tried to do this but having trouble getting server's stdout to pass through the parent process
  • Is there any benefit over running the built server with node directly?
• Databases:
  • db-over-http once node HttpClient lands:
    • couchdb / pouchdb
    • AWS RDS Data API: https://docs.aws.amazon.com/rdsdataservice/latest/APIReference/API_ExecuteSql.html
    • sqlite-over-http? https://github.com/proofrock/ws4sqlite
  • expand on ports/prisma example?
  • direct connection over tcp?:
    • kernel bindings for node's 'net' api
    • webcrypto for passwords? (joeybright working on this?)
    • example here: https://github.com/Asaye/PgDriverDemo (explanation here: https://info.deal-corner.com/post/311c1057-f94b-4b48-aadc-02de4ee5f0e0)
    • see this old package for a simpler reference than the current node pg package: https://github.com/creationix/postgres-js
  • See https://github.com/pghttp and elm-pghttp channel in incremental elm discord
• SSE? Websockets?
• SSR + hydration for components? Is there value?
• Emails? (Mario from Lamdera recommends https://postmarkapp.com/)
• Metrics and observability?
  • Prometheus (integrates with Caddy https://caddyserver.com/docs/metrics)?
  • https://opentelemetry.io/ ?
• New Temporal API coming for dates/times? https://github.com/tc39/proposal-temporal
• Anything to do with webcomponents?: shoelace?
• Any ideas to steal from Lustre server components?
• Look at mdgriffith's elm-prefab: https://github.com/mdgriffith/elm-prefab/blob/main/guides/
• Look at elm-duet and json type definitions
• gren run package-name to replace npm package and stop exposing Prettynice.Internal
• offline-first PWA experiment
  • https://docs.yjs.dev/
  • Learn about CRDTS. Start here: https://docs.yjs.dev/api/internals