lustre-labs / lustre

A Gleam web framework for building HTML templates, single page applications, and real-time server components.
https://hexdocs.pm/lustre
MIT License
1.21k stars 78 forks source link

Add docs about rendering lists #186

Closed josh-nz closed 2 months ago

josh-nz commented 2 months ago

This PR adds docs for considerations around rendering lists, discussing the duplicate image issue that can be seen in the quickstart tutorial, and how to solve this using element.keyed.

The quickstart tutorial page has a brief note explaining this, with a link to the new docs. Currently the docs are in the hints folder. I think all the hints docs probably warrant becoming links in the main pages menu of the docs, even if they remain in the hints folder (or add a hints menu section if that's possible). This increases their visibility (I only found the two exisiting hints from browsing the repo). This piece of work is not yet done, since I'm unsure if you'd prefer to structure the menu or file locations.

You are most welcome to change/edit any of the docs I've created to fit any preferred writing style, or otherwise change as desired. It's probably worth a check that my proposed solution to the quickstart tutorial duplicate image issue is a correct one

josh-nz commented 2 months ago

I think it might be useful to also have something in the intro or overview notes that Lustre uses a virtual DOM and diff patching, I don't think this is obviously mentioned anywhere.

hayleigh-dot-dev commented 2 months ago

This is excellent, thank you! I've requested some changes but these are mostly about stripping the content back a bit so the page is a bit more focused. I think folks will find this really helpful!