Skip to content

docs: replace Learn Effection with Hydra tutorial#1119

Open
taras wants to merge 5 commits intov4from
hydra-tutorial-docs
Open

docs: replace Learn Effection with Hydra tutorial#1119
taras wants to merge 5 commits intov4from
hydra-tutorial-docs

Conversation

@taras
Copy link
Member

@taras taras commented Feb 18, 2026

Motivation

The existing Learn Effection documentation, while functional, lacked a progressive learning path and comprehensive examples. The Hydra tutorial content from the thefrontside/hydra repo provides a more thorough, step-by-step approach to learning Effection with real-world examples culminating in a capstone project.

This PR replaces the existing docs with Hydra's content to:

  • Provide a progressive 11-chapter learning path from basics to advanced
  • Add a quick-start guide for developers who want to get up and running fast
  • Include a capstone project (Multiplex HTTP Proxy) demonstrating real-world patterns
  • Merge events content into the signals chapter (as requested)

Approach

New Tutorial Structure (11 chapters):

  1. The Problem with Promises - motivation for structured concurrency
  2. Operations - fundamentals of lazy async
  3. Actions - bridging callback-based APIs
  4. Spawn - concurrent task management
  5. Combinators - race, all, and composition patterns
  6. Resources - long-lived services with cleanup
  7. Channels - inter-operation communication
  8. Signals - bridging sync callbacks into streams (merged with events)
  9. Streams - unified async iteration
  10. Context - dependency injection for operation trees
  11. Scope API - framework integration (Express, React, tests)

New Examples Section (Capstone Project):

  • Multiplex Proxy overview
  • Server Resource - Express as a resource
  • Server Pool - dynamic server management
  • Switchboard - HTTP routing
  • Final Assembly - putting it all together

Getting Started Changes:

  • Replaced Tutorial with Quick Start (~50 lines)
  • Removed Thinking in Effection (content integrated into tutorial)
  • Kept Installation, TypeScript, Async Rosetta Stone, Upgrade

Deleted Old Files:

  • operations.mdx, spawn.mdx, resources.mdx, collections.mdx
  • context.mdx, actions.mdx, scope.mdx
  • thinking-in-effection.mdx, events.mdx, tutorial.mdx

All code examples are inlined in MDX (no separate .ts files needed).

Replace existing Learn Effection documentation with comprehensive
Hydra tutorial content. The new tutorial provides:

- Progressive 11-chapter learning path from basics to advanced
- New quick-start guide (~50 lines condensed hello world)
- Capstone project examples (Multiplex HTTP Proxy)
- Merged events content into signals chapter

Structure changes:
- Getting Started: Installation, TypeScript, Quick Start, Rosetta Stone, Upgrade
- Tutorial: 11 chapters covering operations, actions, spawn, combinators,
  resources, channels, signals, streams, context, and scope API
- Examples: Multiplex proxy capstone with server resource, pool, switchboard
- Reference: Error handling, FAQ, Processes

Removed old files: operations.mdx, spawn.mdx, resources.mdx, collections.mdx,
context.mdx, actions.mdx, scope.mdx, thinking-in-effection.mdx, events.mdx,
tutorial.mdx
@pkg-pr-new
Copy link

pkg-pr-new bot commented Feb 18, 2026

Open in StackBlitz

npm i https://pkg.pr.new/thefrontside/effection@1119

commit: 5536a8c

Add hand-crafted SVG diagrams with dark/light mode support to replace
ASCII art diagrams in the tutorial documentation.

New SVG files:
- diagrams/_template.svg - reusable template for doc diagrams
- diagrams/multiplex-proxy-architecture.svg - architecture overview
- diagrams/switchboard-request-flow.svg - request flow sequence
- diagrams/resources-lifecycle.svg - resource provide/cleanup lifecycle
- diagrams/streams-hierarchy.svg - Stream type hierarchy
- diagrams/final-assembly-tree.svg - operation tree structure
- diagrams/final-assembly-fire-doors.svg - scoped() isolation pattern

Updated MDX files to use <img data-inline-svg> for SVG embedding.
All diagrams adapt to system light/dark mode preference.
Move diagrams from docs/diagrams/ to www/assets/diagrams/ so they are
served at /assets/diagrams/ URLs. Update all MDX files to use absolute
paths.

The inline-svg plugin resolves relative paths against the request URL,
not the source file location, so diagrams need to be in the www assets
directory to be found correctly.
- Replace yield* Promise.resolve() with yield* call() in scope-api docs
- Replace await inside function* with yield* call() in server-pool example

These patterns would not compile - yield* Promise doesn't work (as noted
in the FAQ) and await cannot be used inside generator functions.
@cowboyd
Copy link
Member

cowboyd commented Feb 18, 2026

This complicates the navigation on the left. We either need to sort that, or maybe have the tutorial be a separate top-level item.

@taras
Copy link
Member Author

taras commented Feb 19, 2026

We need to improve the left sidebar anyway.

I want to do a bit of a A/B testing on this content. I don't know if this is better than what we have right now.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants