Rationale
The front-end React examples provided in Urbit's developer documentation (i.e. the "Chat Lightning Tutorial" and "App School II: Full-Stack" pages) use legacy, class-based React patterns that have largely been phased out over the past few years in favor of modern, hook-based React style. These examples should be refactored to use this modern style to improve the developer onboarding experience (as increasing amounts of React learning materials use hooks) and future-proof the material presented (as the official React documentation eventually migrates to primarily present the modern style).
Overview
The content for the Urbit React examples is split across two repositories:
urbit/doc-examples: Contains the source code for the React examples.
urbit/developers.urbit.org: Contains the web-hosted documentation for the React examples, which can be viewed at developers.urbit.org.
Within these repositories, the content associated with the following examples needs to be updated to the modern React style:
"Chat Lightning Tutorial": Will require edits primarily in the source references, particularly those in the "Additional commentary" section.
"App School II: Full-Stack": Will require nearly a full rewrite, though many source references will look similar.
Features in scope
Refactor the "Chat" example to replace React classes with React hooks wherever possible.
Refactor the "Journal" example to replace React classes with React hooks wherever possible.
Revise the "Chat Lightning Tutorial" documentation to update source references and add commentary to any new and nontrivial references.
Rework the "App School II: Full-Stack" documentation to explain the flow and key operations (i.e. peeks, pokes, and subscriptions) of the refactored React "Journal" code.
Implementation Notes
The refactored React examples will take architectural inspiration and library
cues from popular React applications in the Urbit ecosystem (e.g. %landscape
and %sphinx
) to further improve their utility for learning developers.
Milestones and Compensation
The grantee will receive 1 star upon fulfillment of this grant.