Project Library
Development Work
Search the catalog, select a project, and review its preview without leaving the Library.
Catalog
All Projects
No projects match this search.
Selected Project
Arrays and Collections
Compare typed collections and iteration across languages.
Technologies
What I Built
ROSETTA 03 — Implementation Comparison
What I Was Learning
Source Learning Project — TypeScript Lab: Typed Arrays Gallery src/datastore/types.ts
Selected Project
Bird Survival Simulation
2D Tile Map Survival System
Technologies
What I Built
Simple-Sprite Wildlife Simulation
What I Was Learning
Purpose Build a small bird-life simulation where survival and nesting behaviors drive visible sprite states.
Selected Project
Classification Machine
Compare canonical classification rules across languages.
Technologies
What I Built
ROSETTA 15 — Implementation Comparison
What I Was Learning
Source Learning Project — TypeScript Lab: Classification Machine src/generator/generate.ts → classificationOf(), classificationLabel()
Selected Project
Collection Renderer
Compare collection rendering across languages.
Technologies
What I Built
ROSETTA 32 — Implementation Comparison
What I Was Learning
Source Learning Project — TypeScript Lab: Grid Node Renderer src/generator/generate.ts → renderGrid()
Selected Project
Color Decision Engine
Compare ordered decision rules across languages.
Technologies
What I Built
ROSETTA 16 — Implementation Comparison
What I Was Learning
Source Learning Project — TypeScript Project: Technology Color Decision Engine src/generator/generate.ts → homeColorClass()
Selected Project
CRUD
Compare complete create, read, update, and delete workflows.
Technologies
What I Built
ROSETTA 14 — Implementation Comparison
What I Was Learning
Source Learning Project — TypeScript Project: CRUD Dashboard src/local-editor/client.ts, src/local-editor/server.ts
Selected Project
Data to HTML Card
Compare structured data rendering across languages.
Technologies
What I Built
ROSETTA 31 — Implementation Comparison
What I Was Learning
Source Learning Project — TypeScript Lab: Project Card Renderer src/generator/generate.ts → renderCollectionCard()
Selected Project
Data Transformation
Compare pure input-to-output transformations across languages.
Technologies
What I Built
ROSETTA 05 — Implementation Comparison
What I Was Learning
Source Learning Project — TypeScript Lab: Slug Factory src/generator/generate.ts → slugify()
Selected Project
Deduplication
Compare duplicate removal across collection types.
Technologies
What I Built
ROSETTA 22 — Implementation Comparison
What I Was Learning
Source Learning Project — TypeScript Lab: Unique ID List src/local-editor/server.ts → normalizeIdList()
Selected Project
DELETE
Compare DELETE request handling across server frameworks.
Technologies
What I Built
ROSETTA 28 — Implementation Comparison
What I Was Learning
Source Learning Project — TypeScript Project: HTTP Method Board src/local-editor/server.ts → handleApi()
Selected Project
Developer Sandbox
Personal development environment for projects, references, experiments, learning, and technical knowledge.
Technologies
What I Built
Project Overview
What I Was Learning
Purpose & Learning Objectives
Selected Project
Developer Sandbox 2.0
A complete redesign and expansion of the Developer Sandbox. The project preserves the original learning and experimentation environment while rebuilding the interface around clearer project discovery, searchable and filterable entries, technology-based browsing, featured projects, responsive layouts, improved navigation, and a unique visual mapping system for Rosetta Stones. The redesign also refines the project, lab, reference guide, and learning interfaces into a more cohesive static-site system backed by a structured SQLite datastore and TypeScript generator.
Technologies
What I Built
Rebuilt developer learning environment and project library
What I Was Learning
Developer Sandbox 2.0 redesign. Major additions include searchable and filterable content, technology filtering, Featured Project slider, redesigned project library, Rosetta Stone visual route mapping, improved Labs and Reference Guide presentation, responsive desktop/tablet/mobile behavior, and a more cohesive reusable UI system.
Selected Project
Filter Map Sort
Compare collection pipelines across languages.
Technologies
What I Built
ROSETTA 06 — Implementation Comparison
What I Was Learning
Source Learning Project — TypeScript Lab: Array Pipeline Conveyor src/generator/generate.ts
Selected Project
GET
Compare GET request handling across server frameworks.
Technologies
What I Built
ROSETTA 25 — Implementation Comparison
What I Was Learning
Source Learning Project — TypeScript Project: HTTP Method Board src/local-editor/server.ts → handleApi()
Selected Project
Get All Records
Compare reading complete record collections across data stacks.
Technologies
What I Built
ROSETTA 09 — Implementation Comparison
What I Was Learning
Source Learning Project — TypeScript Lab: Get All Records src/datastore/queries.ts → getRecords()
Selected Project
Get Record By ID
Compare parameterized single-record lookups across languages.
Technologies
What I Built
ROSETTA 10 — Implementation Comparison
What I Was Learning
Source Learning Project — TypeScript Lab: Find Record By ID src/datastore/queries.ts → getRecordById()
Selected Project
Group By Category
Compare grouping algorithms using the same project data.
Technologies
What I Built
ROSETTA 07 — Implementation Comparison
What I Was Learning
Source Learning Project — TypeScript Project: Group By Category Board src/generator/generate.ts → groupRecordsByCategory()
Selected Project
HTTP Status Handling
Compare HTTP status handling across server frameworks.
Technologies
What I Built
ROSETTA 29 — Implementation Comparison
What I Was Learning
Source Learning Project — TypeScript Lab: Status Code Viewer src/local-editor/server.ts → handleApi()
Selected Project
Interactive Scientific Data Explorer
Visual data lab
Technologies
What I Built
Visual data lab
What I Was Learning
Purpose Create a visual scientific-data exploration interface while sampling modern technologies used in data-heavy frontend engineering.
Selected Project
JSON Request
Compare sending JSON request bodies across web stacks.
Technologies
What I Built
ROSETTA 23 — Implementation Comparison
What I Was Learning
Source Learning Project — TypeScript Lab: Read POST JSON src/local-editor/server.ts → readJson()
Selected Project
JSON Response
Compare returning JSON responses across web stacks.
Technologies
What I Built
ROSETTA 24 — Implementation Comparison
What I Was Learning
Source Learning Project — TypeScript Lab: JSON Response src/local-editor/server.ts → sendJson()
Selected Project
Modern Agenda
One conference agenda application rebuilt across modern technologies to understand the difference in the technologies and implementation.
Technologies
What I Built
Rosetta Stone · Multi-Technology Application
What I Was Learning
See the full project page for documented learning notes.
Selected Project
Nested Data
Compare nested record structures across languages.
Technologies
What I Built
ROSETTA 04 — Implementation Comparison
What I Was Learning
Source Learning Project — TypeScript Lab: Nested Object Inspector src/datastore/types.ts
Selected Project
Rebuilding Fetch with XMLHttpRequest
Builds a simplified data request from scratch with XMLHttpRequest
Technologies
What I Built
This learning project reconstructs the basic request flow behind modern JavaScript data fetching. It creates an XMLHttpRequest, opens and sends a GET request, observes readyState, receives raw JSON as responseText, parses it with JSON.parse(), and accesses the resulting JavaScript objects and arrays. The goal is to understand the mechanics underneath higher-level APIs such as fetch() before returning to the Modern Agenda ECMAScript implementation.
What I Was Learning
See the full project page for documented learning notes.
Selected Project
Rosetta Core
Reusable comparison framework for implementing identical programming tasks across multiple languages.
Technologies
What I Built
General Cross-Language Comparison Framework
What I Was Learning
Purpose Turn “Rosetta Stone” into a learning system and architecture for learning across languages.
Selected Project
TypeScript Project: Mini Static Site Generator
Generate an index and individual pages from structured records.
Technologies
What I Built
PROJECT 120 — Static Generation
What I Was Learning
Objective Generate an index and individual pages from structured records.
Selected Project
Week at a Glance Component
Event schedule
Technologies
What I Built
Event schedule
What I Was Learning
See the full project page for documented learning notes.
Selected Project
Mini Browser / Rendering Engine
Experimental renderer exploring parsing, layout, styling, and drawing beneath browser interfaces.
Technologies
What I Built
Browser Internals and Rendering Experiment
What I Was Learning
Purpose Build a deliberately small browser-like renderer to understand what happens beneath normal frontend development.
Selected Project
TypeScript API Service
Typed REST service demonstrating backend architecture, validation, persistence, and HTTP workflows.
Technologies
What I Built
Node and TypeScript Backend Service
What I Was Learning
Purpose Build a real backend service in TypeScript so server architecture is learned independently from frontend frameworks.
Selected Project
TypeScript Library / Package
Reusable TypeScript package focused on public APIs, types, testing, and distribution.
Technologies
What I Built
Reusable Package and Public API Design
What I Was Learning
Purpose Learn to design code for other developers to consume instead of designing another standalone application.
Selected Project
Database Lab
Hands-on database laboratory for SQL, PostgreSQL, MongoDB, modeling, and query practice.
Technologies
What I Built
Relational and Document Database Practice
What I Was Learning
Purpose Create a repeatable hands-on environment for learning database commands, modeling, queries, and application integration.
Selected Project
API Explorer
Interactive HTTP request laboratory for methods, headers, payloads, responses, and debugging.
Technologies
What I Built
HTTP Request and Response Workbench
What I Was Learning
Purpose Build a visual request workbench that makes HTTP concepts inspectable instead of hidden inside application code.
Selected Project
Canvas Playground
Visual coding laboratory for Canvas rendering, animation, coordinates, and interaction experiments.
Technologies
What I Built
Browser Graphics Practice Laboratory
What I Was Learning
Purpose Create small isolated Canvas experiments that strengthen graphics concepts before larger rendering and game projects.
Selected Project
Portfolio Engine
Data-driven portfolio engine for reusable project content, metadata, and generated presentation.
Technologies
What I Built
Structured Portfolio Publishing System
What I Was Learning
Purpose Explore how structured professional content can generate consistent portfolio presentations without hand-maintaining every page.
Selected Project
API Gateway
Gateway experiment for routing requests, middleware, validation, proxying, and service boundaries.
Technologies
What I Built
Backend Routing and Integration Experiment
What I Was Learning
Purpose Learn the role of a gateway by routing and coordinating requests instead of building another CRUD service.
Selected Project
Game Framework
Reusable browser-game foundation for scenes, state, input, sprites, and simulation systems.
Technologies
What I Built
Reusable Browser Game Architecture
What I Was Learning
Purpose Extract reusable game architecture from small experiments so future browser games share a clean foundation.
Selected Project
PHP Request Lab
Focused PHP laboratory for cURL, forms, JSON, REST, GET, and POST requests.
Technologies
What I Built
PHP HTTP Request Practice
What I Was Learning
Purpose Turn familiar request patterns into a compact PHP practice project where every request step is visible.
Selected Project
Academy of Mastery Learning Engine
Structured mastery-learning system for curricula, resources, progress, approvals, and project integration.
Technologies
What I Built
Personal Structured Learning and Progress System
What I Was Learning
TS Project Academy of Mastery Learning Engine Preview coming soon
Selected Project
Data Science Lab
Python laboratory for data analysis, visualization, reproducible experiments, and dataset practice.
Technologies
What I Built
Python Data Practice Environment
What I Was Learning
Purpose Maintain a dedicated Python environment for practical data work while building toward deeper analysis projects.
Selected Project
TypeScript Lab: Hello TypeScript Browser
Compile TypeScript and display its result in a browser.
Technologies
What I Built
LAB 001 — TypeScript Toolchain
What I Was Learning
Objective Compile TypeScript and display its result in a browser.
Selected Project
TypeScript Lab: Source vs Dist Viewer
Show how source TypeScript becomes compiled JavaScript output.
Technologies
What I Built
LAB 002 — TypeScript Toolchain
What I Was Learning
Objective Show how source TypeScript becomes compiled JavaScript output.
Selected Project
TypeScript Lab: Build Button
Connect an npm build command to visible compiled output.
Technologies
What I Built
LAB 003 — TypeScript Toolchain
What I Was Learning
Objective Connect an npm build command to visible compiled output.
Selected Project
TypeScript Lab: package.json Explorer
Visualize scripts, module mode, and development dependencies.
Technologies
What I Built
LAB 004 — TypeScript Toolchain
What I Was Learning
Objective Visualize scripts, module mode, and development dependencies.
Selected Project
TypeScript Lab: npm Dependency Installer
Compare development dependencies with runtime dependencies visually.
Technologies
What I Built
LAB 005 — TypeScript Toolchain
What I Was Learning
Objective Compare development dependencies with runtime dependencies visually.
Selected Project
TypeScript Lab: package-lock Dependency Tree
Display locked package versions as a dependency tree.
Technologies
What I Built
LAB 006 — TypeScript Toolchain
What I Was Learning
Objective Display locked package versions as a dependency tree.
Selected Project
TypeScript Lab: ES Modules Connector
Connect exported values to imported browser modules.
Technologies
What I Built
LAB 007 — TypeScript Toolchain
What I Was Learning
Objective Connect exported values to imported browser modules.
Selected Project
TypeScript Lab: Compiler Target Switch
Compare TypeScript source with different JavaScript output targets.
Technologies
What I Built
LAB 008 — TypeScript Toolchain
What I Was Learning
Objective Compare TypeScript source with different JavaScript output targets.
Selected Project
TypeScript Lab: DOM and Node Library Map
Separate browser APIs from Node APIs in compiler configuration.
Technologies
What I Built
LAB 009 — TypeScript Toolchain
What I Was Learning
Objective Separate browser APIs from Node APIs in compiler configuration.
Selected Project
TypeScript Lab: Source Map Error Finder
Trace a runtime error back to its TypeScript source.
Technologies
What I Built
LAB 010 — TypeScript Toolchain
What I Was Learning
Objective Trace a runtime error back to its TypeScript source.
Selected Project
TypeScript Lab: Primitive Type Cards
Display string, number, and boolean values with type labels.
Technologies
What I Built
LAB 011 — TypeScript Data Modeling
What I Was Learning
Objective Display string, number, and boolean values with type labels.
Selected Project
TypeScript Project: Typed Profile Builder
Build a form that produces a typed object card.
Technologies
What I Built
PROJECT 012 — TypeScript Data Modeling
What I Was Learning
Objective Build a form that produces a typed object card.
Selected Project
TypeScript Lab: Required vs Optional
Show required properties and optional properties in a form.
Technologies
What I Built
LAB 013 — TypeScript Data Modeling
What I Was Learning
Objective Show required properties and optional properties in a form.
Selected Project
TypeScript Lab: Status Selector
Render a union type as a controlled status selector.
Technologies
What I Built
LAB 014 — TypeScript Data Modeling
What I Was Learning
Objective Render a union type as a controlled status selector.
Selected Project
TypeScript Lab: Invalid Value Gate
Show valid and invalid values against a TypeScript contract.
Technologies
What I Built
LAB 015 — TypeScript Data Modeling
What I Was Learning
Objective Show valid and invalid values against a TypeScript contract.
Selected Project
TypeScript Lab: Typed Arrays Gallery
Add typed items and render the collection as cards.
Technologies
What I Built
LAB 016 — TypeScript Data Modeling
What I Was Learning
Objective Add typed items and render the collection as cards.
Selected Project
TypeScript Lab: Nested Object Inspector
Expand nested typed objects into a visual hierarchy.
Technologies
What I Built
LAB 017 — TypeScript Data Modeling
What I Was Learning
Objective Expand nested typed objects into a visual hierarchy.
Selected Project
TypeScript Lab: Flexible Metadata Bag
Inspect arbitrary metadata stored behind unknown values.
Technologies
What I Built
LAB 018 — TypeScript Data Modeling
What I Was Learning
Objective Inspect arbitrary metadata stored behind unknown values.
Selected Project
TypeScript Lab: Type Narrowing Switchboard
Reveal fields only after a union value is narrowed.
Technologies
What I Built
LAB 019 — TypeScript Data Modeling
What I Was Learning
Objective Reveal fields only after a union value is narrowed.
Selected Project
TypeScript Lab: Generic Data Row Table
Render flexible typed rows with varying columns.
Technologies
What I Built
LAB 020 — TypeScript Data Modeling
What I Was Learning
Objective Render flexible typed rows with varying columns.
Selected Project
TypeScript Project: Record and Technology Connector
Attach technologies to records through a visual relationship board.
Technologies
What I Built
PROJECT 021 — Data Relationships
What I Was Learning
Objective Attach technologies to records through a visual relationship board.
Selected Project
TypeScript Lab: Tag Relationship Board
Attach and remove tags through junction records.
Technologies
What I Built
LAB 022 — Data Relationships
What I Was Learning
Objective Attach and remove tags through junction records.
Selected Project
TypeScript Lab: Media Attachment Map
Connect media objects to projects with visible roles.
Technologies
What I Built
LAB 023 — Data Relationships
What I Was Learning
Objective Connect media objects to projects with visible roles.
Selected Project
TypeScript Project: Record Relationship Graph
Draw source and target records as a relationship graph.
Technologies
What I Built
PROJECT 024 — Data Relationships
What I Was Learning
Objective Draw source and target records as a relationship graph.
Selected Project
TypeScript Lab: Parent and Child Node Tree
Render content nodes as a two-level hierarchy.
Technologies
What I Built
LAB 025 — Data Relationships
What I Was Learning
Objective Render content nodes as a two-level hierarchy.
Selected Project
TypeScript Project: Manifest Collection Browser
Generate navigation from a collection manifest.
Technologies
What I Built
PROJECT 026 — Data Relationships
What I Was Learning
Objective Generate navigation from a collection manifest.
Selected Project
TypeScript Lab: Slug Factory
Convert titles into safe lowercase URL slugs.
Technologies
What I Built
LAB 027 — Data Transformation
What I Was Learning
Objective Convert titles into safe lowercase URL slugs.
Selected Project
TypeScript Lab: HTML Escape Machine
Display the difference between raw and escaped markup.
Technologies
What I Built
LAB 028 — Data Transformation
What I Was Learning
Objective Display the difference between raw and escaped markup.
Selected Project
TypeScript Lab: CSS Class Composer
Combine optional class names into one clean class string.
Technologies
What I Built
LAB 029 — Data Transformation
What I Was Learning
Objective Combine optional class names into one clean class string.
Selected Project
TypeScript Lab: Numbered Position Generator
Generate padded node and child position classes.
Technologies
What I Built
LAB 030 — Data Transformation
What I Was Learning
Objective Generate padded node and child position classes.
Selected Project
TypeScript Lab: Classification Machine
Normalize legacy record types into current Sandbox classifications.
Technologies
What I Built
LAB 031 — Data Transformation
What I Was Learning
Objective Normalize legacy record types into current Sandbox classifications.
Selected Project
TypeScript Lab: Predicate Traffic Lights
Show which classification rules accept one record.
Technologies
What I Built
LAB 032 — Data Transformation
What I Was Learning
Objective Show which classification rules accept one record.
Selected Project
TypeScript Lab: Array Pipeline Conveyor
Visualize filter, sort, slice, map, and join stages.
Technologies
What I Built
LAB 033 — Data Transformation
What I Was Learning
Objective Visualize filter, sort, slice, map, and join stages.
Selected Project
TypeScript Lab: Sort Order Visualizer
Reorder records by sort order and title.
Technologies
What I Built
LAB 034 — Data Transformation
What I Was Learning
Objective Reorder records by sort order and title.
Selected Project
TypeScript Lab: Primary Category Picker
Choose one visual category from several related categories.
Technologies
What I Built
LAB 035 — Data Transformation
What I Was Learning
Objective Choose one visual category from several related categories.
Selected Project
TypeScript Project: Group By Category Board
Move loose records into category columns automatically.
Technologies
What I Built
PROJECT 036 — Data Transformation
What I Was Learning
Objective Move loose records into category columns automatically.
Selected Project
TypeScript Lab: Cache Before and After
Compare first database lookup with cached reuse.
Technologies
What I Built
LAB 037 — Data Transformation
What I Was Learning
Objective Compare first database lookup with cached reuse.
Selected Project
TypeScript Lab: Template Replacement Lab
Replace template placeholders with supplied values.
Technologies
What I Built
LAB 038 — Rendering & Generation
What I Was Learning
Objective Replace template placeholders with supplied values.
Selected Project
TypeScript Lab: Initials Badge Generator
Turn project titles into compact visual initials.
Technologies
What I Built
LAB 039 — Rendering & Generation
What I Was Learning
Objective Turn project titles into compact visual initials.
Selected Project
TypeScript Lab: Technology Short Label
Convert recognized technology names into compact labels.
Technologies
What I Built
LAB 040 — Rendering & Generation
What I Was Learning
Objective Convert recognized technology names into compact labels.
Selected Project
TypeScript Project: Technology Color Decision Engine
Choose project colors through ordered technology and classification rules.
Technologies
What I Built
PROJECT 041 — Rendering & Generation
What I Was Learning
Objective Choose project colors through ordered technology and classification rules.
Selected Project
TypeScript Lab: Project Card Renderer
Transform a record object into a visible project card.
Technologies
What I Built
LAB 042 — Rendering & Generation
What I Was Learning
Objective Transform a record object into a visible project card.
Selected Project
TypeScript Lab: Featured Project Renderer
Build a featured project panel from record relationships.
Technologies
What I Built
LAB 043 — Rendering & Generation
What I Was Learning
Objective Build a featured project panel from record relationships.
Selected Project
TypeScript Lab: Display Node Renderer
Render preview content beside project details.
Technologies
What I Built
LAB 045 — Rendering & Generation
What I Was Learning
Objective Render preview content beside project details.
Selected Project
TypeScript Lab: Standard Node Renderer
Render parent content and child command items.
Technologies
What I Built
LAB 046 — Rendering & Generation
What I Was Learning
Objective Render parent content and child command items.
Selected Project
TypeScript Lab: Grid Node Renderer
Arrange child records into visible metadata boxes.
Technologies
What I Built
LAB 047 — Rendering & Generation
What I Was Learning
Objective Arrange child records into visible metadata boxes.
Selected Project
TypeScript Lab: Split Layout Renderer
Render identical content through multiple split layouts.
Technologies
What I Built
LAB 048 — Rendering & Generation
What I Was Learning
Objective Render identical content through multiple split layouts.
Selected Project
TypeScript Lab: Collapse List Renderer
Turn child records into expandable documentation items.
Technologies
What I Built
LAB 049 — Rendering & Generation
What I Was Learning
Objective Turn child records into expandable documentation items.
Selected Project
TypeScript Lab: Code Renderer
Display source code as text instead of executing it.
Technologies
What I Built
LAB 050 — Rendering & Generation
What I Was Learning
Objective Display source code as text instead of executing it.
Selected Project
TypeScript Lab: Get All Records
Query Sandbox records and render them as browser cards.
Technologies
What I Built
LAB 051 — SQLite & Data Access
What I Was Learning
Objective Query Sandbox records and render them as browser cards.
Selected Project
TypeScript Lab: Find Record By ID
Enter a record ID and display one matching record.
Technologies
What I Built
LAB 052 — SQLite & Data Access
What I Was Learning
Objective Enter a record ID and display one matching record.
Selected Project
TypeScript Lab: Prepared Parameter Viewer
Show how a value replaces a SQL placeholder safely.
Technologies
What I Built
LAB 053 — SQLite & Data Access
What I Was Learning
Objective Show how a value replaces a SQL placeholder safely.
Selected Project
TypeScript Lab: Technology JOIN Explorer
Visualize records joining through record_technologies to technologies.
Technologies
What I Built
LAB 054 — SQLite & Data Access
What I Was Learning
Objective Visualize records joining through record_technologies to technologies.
Selected Project
TypeScript Lab: Category JOIN Explorer
Visualize records joining through record_categories to categories.
Technologies
What I Built
LAB 055 — SQLite & Data Access
What I Was Learning
Objective Visualize records joining through record_categories to categories.
Selected Project
TypeScript Lab: Search Records
Search multiple record fields and display matching results.
Technologies
What I Built
LAB 056 — SQLite & Data Access
What I Was Learning
Objective Search multiple record fields and display matching results.
Selected Project
TypeScript Project: Database Table Viewer
Choose an allowed table and render its rows.
Technologies
What I Built
PROJECT 057 — SQLite & Data Access
What I Was Learning
Objective Choose an allowed table and render its rows.
Selected Project
TypeScript Lab: Record Preview Query
Find a record's first visible display node.
Technologies
What I Built
LAB 058 — SQLite & Data Access
What I Was Learning
Objective Find a record's first visible display node.
Selected Project
TypeScript Lab: DOM Selector Type Helper
Return a typed DOM element from a reusable selector function.
Technologies
What I Built
LAB 059 — Browser State
What I Was Learning
Objective Return a typed DOM element from a reusable selector function.
Selected Project
TypeScript Lab: Current Record State Inspector
Display application state while selecting different records.
Technologies
What I Built
LAB 060 — Browser State
What I Was Learning
Objective Display application state while selecting different records.
Selected Project
TypeScript Lab: Expandable Parent State
Show expanded parent IDs inside a Set.
Technologies
What I Built
LAB 061 — Browser State
What I Was Learning
Objective Show expanded parent IDs inside a Set.
Selected Project
TypeScript Project: Search Select Load
Search, choose a result, and load its complete record.
Technologies
What I Built
PROJECT 062 — Browser State
What I Was Learning
Objective Search, choose a result, and load its complete record.
Selected Project
TypeScript Lab: Object to Form
Populate form controls from a loaded record object.
Technologies
What I Built
LAB 063 — Browser State
What I Was Learning
Objective Populate form controls from a loaded record object.
Selected Project
TypeScript Lab: Form to Object
Collect form values into a request payload.
Technologies
What I Built
LAB 064 — Browser State
What I Was Learning
Objective Collect form values into a request payload.
Selected Project
TypeScript Lab: Node Outline Tree
Render ordered parent and child nodes as an editor outline.
Technologies
What I Built
LAB 065 — Browser State
What I Was Learning
Objective Render ordered parent and child nodes as an editor outline.
Selected Project
TypeScript Project: Dynamic Form Factory
Change available form controls by selected node type.
Technologies
What I Built
PROJECT 066 — Browser State
What I Was Learning
Objective Change available form controls by selected node type.
Selected Project
TypeScript Lab: Dynamic Element Creator
Create and append a browser element with TypeScript.
Technologies
What I Built
LAB 067 — DOM & Async
What I Was Learning
Objective Create and append a browser element with TypeScript.
Selected Project
TypeScript Lab: Event Listener Light Switch
Change visible state when a button fires a click event.
Technologies
What I Built
LAB 068 — DOM & Async
What I Was Learning
Objective Change visible state when a button fires a click event.
Selected Project
TypeScript Lab: Attribute Inspector
Add and remove HTML attributes while viewing DOM changes.
Technologies
What I Built
LAB 069 — DOM & Async
What I Was Learning
Objective Add and remove HTML attributes while viewing DOM changes.
Selected Project
TypeScript Lab: Load Styles Dynamically
Insert a stylesheet link and show the resulting style change.
Technologies
What I Built
LAB 070 — DOM & Async
What I Was Learning
Objective Insert a stylesheet link and show the resulting style change.
Selected Project
TypeScript Lab: Load Script Dynamically
Insert a script element and report when it becomes available.
Technologies
What I Built
LAB 071 — DOM & Async
What I Was Learning
Objective Insert a script element and report when it becomes available.
Selected Project
TypeScript Lab: Promise Loading Board
Track several asynchronous resources on one visual status board.
Technologies
What I Built
LAB 072 — DOM & Async
What I Was Learning
Objective Track several asynchronous resources on one visual status board.
Selected Project
TypeScript Lab: Missing Image Alt
Add an alt attribute only when an image lacks one.
Technologies
What I Built
LAB 073 — Semantic HTML
What I Was Learning
Objective Add an alt attribute only when an image lacks one.
Selected Project
TypeScript Lab: Safe Button Type
Add type=button only when a button has no explicit type.
Technologies
What I Built
LAB 074 — Semantic HTML
What I Was Learning
Objective Add type=button only when a button has no explicit type.
Selected Project
TypeScript Lab: External Link Safety
Add safe rel tokens to links opening new tabs.
Technologies
What I Built
LAB 075 — Semantic HTML
What I Was Learning
Objective Add safe rel tokens to links opening new tabs.
Selected Project
TypeScript Lab: Icon Link Naming
Give icon-only links accessible names when reliable text exists.
Technologies
What I Built
LAB 076 — Semantic HTML
What I Was Learning
Objective Give icon-only links accessible names when reliable text exists.
Selected Project
TypeScript Lab: Iframe Title Repair
Add an iframe title when none is supplied.
Technologies
What I Built
LAB 077 — Semantic HTML
What I Was Learning
Objective Add an iframe title when none is supplied.
Selected Project
TypeScript Lab: Table Scope Repair
Assign column and row scope to structural table headers.
Technologies
What I Built
LAB 078 — Semantic HTML
What I Was Learning
Objective Assign column and row scope to structural table headers.
Selected Project
TypeScript Lab: Input Naming Assist
Use available placeholder text when a control lacks an accessible name.
Technologies
What I Built
LAB 079 — Semantic HTML
What I Was Learning
Objective Use available placeholder text when a control lacks an accessible name.
Selected Project
TypeScript Lab: Decorative SVG Assist
Hide unnamed decorative SVG icons from assistive technology.
Technologies
What I Built
LAB 080 — Semantic HTML
What I Was Learning
Objective Hide unnamed decorative SVG icons from assistive technology.
Selected Project
TypeScript Project: Semantic Repair Station
Apply all supported semantic repairs to pasted HTML.
Technologies
What I Built
PROJECT 081 — Semantic HTML
What I Was Learning
Objective Apply all supported semantic repairs to pasted HTML.
Selected Project
TypeScript Lab: Tiny HTTP Server
Serve a visible browser page from a TypeScript Node server.
Technologies
What I Built
LAB 082 — Node HTTP & APIs
What I Was Learning
Objective Serve a visible browser page from a TypeScript Node server.
Selected Project
TypeScript Lab: Route Parts Visualizer
Split an API path into meaningful route segments.
Technologies
What I Built
LAB 083 — Node HTTP & APIs
What I Was Learning
Objective Split an API path into meaningful route segments.
Selected Project
TypeScript Lab: JSON Response
Send a structured JSON response from server to browser.
Technologies
What I Built
LAB 084 — Node HTTP & APIs
What I Was Learning
Objective Send a structured JSON response from server to browser.
Selected Project
TypeScript Lab: Read POST JSON
Submit JSON and display what the server received.
Technologies
What I Built
LAB 085 — Node HTTP & APIs
What I Was Learning
Objective Submit JSON and display what the server received.
Selected Project
TypeScript Project: HTTP Method Board
Demonstrate GET, POST, PUT, and DELETE in one interface.
Technologies
What I Built
PROJECT 086 — Node HTTP & APIs
What I Was Learning
Objective Demonstrate GET, POST, PUT, and DELETE in one interface.
Selected Project
TypeScript Lab: Generic API Client
Fetch typed JSON and display success or server errors.
Technologies
What I Built
LAB 087 — Node HTTP & APIs
What I Was Learning
Objective Fetch typed JSON and display success or server errors.
Selected Project
TypeScript Lab: Status Code Viewer
Trigger common HTTP status codes and explain each response.
Technologies
What I Built
LAB 088 — Node HTTP & APIs
What I Was Learning
Objective Trigger common HTTP status codes and explain each response.
Selected Project
TypeScript Lab: MIME Type Server
Serve several file types with correct Content-Type headers.
Technologies
What I Built
LAB 089 — Node HTTP & APIs
What I Was Learning
Objective Serve several file types with correct Content-Type headers.
Selected Project
TypeScript Lab: Create Record
Submit a form and insert a new database record.
Technologies
What I Built
LAB 090 — CRUD & Persistence
What I Was Learning
Objective Submit a form and insert a new database record.
Selected Project
TypeScript Lab: Read Record
Load one database row and display its related metadata.
Technologies
What I Built
LAB 091 — CRUD & Persistence
What I Was Learning
Objective Load one database row and display its related metadata.
Selected Project
TypeScript Lab: Update Record
Edit a record and persist changed fields.
Technologies
What I Built
LAB 092 — CRUD & Persistence
What I Was Learning
Objective Edit a record and persist changed fields.
Selected Project
TypeScript Lab: Delete Record
Delete a selected record and remove it from the interface.
Technologies
What I Built
LAB 093 — CRUD & Persistence
What I Was Learning
Objective Delete a selected record and remove it from the interface.
Selected Project
TypeScript Project: CRUD Dashboard
Create, read, update, and delete records from one interface.
Technologies
What I Built
PROJECT 094 — CRUD & Persistence
What I Was Learning
Objective Create, read, update, and delete records from one interface.
Selected Project
TypeScript Lab: Auto Slug and Unique ID
Generate stable slugs and unique IDs from record titles.
Technologies
What I Built
LAB 095 — CRUD & Persistence
What I Was Learning
Objective Generate stable slugs and unique IDs from record titles.
Selected Project
TypeScript Lab: Ensure Category Exists
Reuse an existing category or create it when missing.
Technologies
What I Built
LAB 096 — CRUD & Persistence
What I Was Learning
Objective Reuse an existing category or create it when missing.
Selected Project
TypeScript Lab: Sync Tags
Replace a record's tag relationships from submitted values.
Technologies
What I Built
LAB 097 — CRUD & Persistence
What I Was Learning
Objective Replace a record's tag relationships from submitted values.
Selected Project
TypeScript Lab: Sync Technologies
Attach selected technologies to a record through a junction table.
Technologies
What I Built
LAB 098 — CRUD & Persistence
What I Was Learning
Objective Attach selected technologies to a record through a junction table.
Selected Project
TypeScript Lab: Next Sort Order
Calculate the next ordered position for a new node.
Technologies
What I Built
LAB 099 — Tree Structures
What I Was Learning
Objective Calculate the next ordered position for a new node.
Selected Project
TypeScript Lab: Normalize Sort Order
Renumber sibling nodes into consistent ordered intervals.
Technologies
What I Built
LAB 100 — Tree Structures
What I Was Learning
Objective Renumber sibling nodes into consistent ordered intervals.
Selected Project
TypeScript Lab: Move Node Up and Down
Swap ordered sibling positions with visible arrow controls.
Technologies
What I Built
LAB 101 — Tree Structures
What I Was Learning
Objective Swap ordered sibling positions with visible arrow controls.
Selected Project
TypeScript Lab: Reparent Node
Move a node between parents and show its new hierarchy.
Technologies
What I Built
LAB 102 — Tree Structures
What I Was Learning
Objective Move a node between parents and show its new hierarchy.
Selected Project
TypeScript Lab: Flatten Parent Tree
Move a parent under another parent while preserving two levels.
Technologies
What I Built
LAB 103 — Tree Structures
What I Was Learning
Objective Move a parent under another parent while preserving two levels.
Selected Project
TypeScript Lab: Delete Node Tree
Delete a parent and its immediate child nodes safely.
Technologies
What I Built
LAB 104 — Tree Structures
What I Was Learning
Objective Delete a parent and its immediate child nodes safely.
Selected Project
TypeScript Lab: Boolean Normalizer
Convert several boolean-like values into stored numeric flags.
Technologies
What I Built
LAB 105 — Validation & Safety
What I Was Learning
Objective Convert several boolean-like values into stored numeric flags.
Selected Project
TypeScript Lab: Comma List Parser
Convert comma-separated text into a clean string array.
Technologies
What I Built
LAB 106 — Validation & Safety
What I Was Learning
Objective Convert comma-separated text into a clean string array.
Selected Project
TypeScript Lab: Safe JSON Metadata Parser
Parse valid metadata and fall back safely on invalid input.
Technologies
What I Built
LAB 107 — Validation & Safety
What I Was Learning
Objective Parse valid metadata and fall back safely on invalid input.
Selected Project
TypeScript Lab: Unique ID List
Remove repeated IDs while preserving one instance of each.
Technologies
What I Built
LAB 108 — Validation & Safety
What I Was Learning
Objective Remove repeated IDs while preserving one instance of each.
Selected Project
TypeScript Lab: SQL Placeholder Factory
Generate the correct number of SQL parameter placeholders.
Technologies
What I Built
LAB 109 — Validation & Safety
What I Was Learning
Objective Generate the correct number of SQL parameter placeholders.
Selected Project
TypeScript Lab: SQL Safety Gate
Reject transaction-control commands from editor SQL batches.
Technologies
What I Built
LAB 110 — Validation & Safety
What I Was Learning
Objective Reject transaction-control commands from editor SQL batches.
Selected Project
TypeScript Lab: Safe File Path Gate
Allow project files only when resolved paths remain inside approved roots.
Technologies
What I Built
LAB 111 — Validation & Safety
What I Was Learning
Objective Allow project files only when resolved paths remain inside approved roots.
Selected Project
TypeScript Lab: BEGIN and COMMIT Simulator
Show changes becoming permanent only after a commit.
Technologies
What I Built
LAB 112 — Database Transactions
What I Was Learning
Objective Show changes becoming permanent only after a commit.
Selected Project
TypeScript Lab: ROLLBACK Simulator
Trigger an error and visibly restore pre-transaction data.
Technologies
What I Built
LAB 113 — Database Transactions
What I Was Learning
Objective Trigger an error and visibly restore pre-transaction data.
Selected Project
TypeScript Lab: Atomic Reorder
Reorder multiple values and roll everything back on failure.
Technologies
What I Built
LAB 114 — Database Transactions
What I Was Learning
Objective Reorder multiple values and roll everything back on failure.
Selected Project
TypeScript Lab: Safe Batch Delete
Delete several selected records as one controlled operation.
Technologies
What I Built
LAB 115 — Database Transactions
What I Was Learning
Objective Delete several selected records as one controlled operation.
Selected Project
TypeScript Lab: One Record to One HTML File
Generate one HTML document from one record object.
Technologies
What I Built
LAB 116 — Static Generation
What I Was Learning
Objective Generate one HTML document from one record object.
Selected Project
TypeScript Lab: Template to Generated Page
Fill a page template and write the completed HTML file.
Technologies
What I Built
LAB 117 — Static Generation
What I Was Learning
Objective Fill a page template and write the completed HTML file.
Selected Project
TypeScript Project: Database to Cards to Page
Query records, render cards, and assemble one page.
Technologies
What I Built
PROJECT 118 — Static Generation
What I Was Learning
Objective Query records, render cards, and assemble one page.
Selected Project
TypeScript Project: Category Page Factory
Generate grouped page sections from record categories.
Technologies
What I Built
PROJECT 119 — Static Generation
What I Was Learning
Objective Generate grouped page sections from record categories.
Selected Project
Object Record Builder
Build the same structured record object across languages.
Technologies
What I Built
ROSETTA 01 — Implementation Comparison
What I Was Learning
Source Learning Project — TypeScript Project: Typed Profile Builder src/datastore/types.ts
Selected Project
Status Validation
Compare restricted status values across language type systems.
Technologies
What I Built
ROSETTA 02 — Implementation Comparison
What I Was Learning
Source Learning Project — TypeScript Lab: Status Selector src/datastore/types.ts
Selected Project
Slug Generator
Compare title-to-slug transformation across languages.
Technologies
What I Built
ROSETTA 08 — Implementation Comparison
What I Was Learning
Source Learning Project — TypeScript Lab: Slug Factory src/generator/generate.ts → slugify()
Selected Project
SQL Parameter
Compare parameterized query APIs across languages.
Technologies
What I Built
ROSETTA 11 — Implementation Comparison
What I Was Learning
Source Learning Project — TypeScript Lab: Prepared Parameter Viewer src/datastore/queries.ts
Selected Project
SQL JOIN
Compare many-to-many JOIN handling across languages.
Technologies
What I Built
ROSETTA 12 — Implementation Comparison
What I Was Learning
Source Learning Project — TypeScript Lab: Technology JOIN Explorer src/datastore/queries.ts → getTechnologiesForRecord()
Selected Project
Search
Compare record search workflows across languages.
Technologies
What I Built
ROSETTA 13 — Implementation Comparison
What I Was Learning
Source Learning Project — TypeScript Lab: Search Records src/local-editor/server.ts → searchRecords()
Selected Project
Sort Order
Compare deterministic ordering across languages.
Technologies
What I Built
ROSETTA 17 — Implementation Comparison
What I Was Learning
Source Learning Project — TypeScript Lab: Sort Order Visualizer src/generator/generate.ts → recordSort()
Selected Project
Parent Child Tree
Compare hierarchical data modeling across languages.
Technologies
What I Built
ROSETTA 18 — Implementation Comparison
What I Was Learning
Source Learning Project — TypeScript Lab: Parent and Child Node Tree src/datastore/types.ts
Selected Project
Reorder
Compare sibling reordering across languages.
Technologies
What I Built
ROSETTA 19 — Implementation Comparison
What I Was Learning
Source Learning Project — TypeScript Lab: Move Node Up and Down src/local-editor/server.ts → reorderNode()
Selected Project
Reparent
Compare parent reassignment across languages.
Technologies
What I Built
ROSETTA 20 — Implementation Comparison
What I Was Learning
Source Learning Project — TypeScript Lab: Reparent Node src/local-editor/server.ts → reparentNode()
Selected Project
Validation
Compare defensive validation and fallback behavior across languages.
Technologies
What I Built
ROSETTA 21 — Implementation Comparison
What I Was Learning
Source Learning Project — TypeScript Lab: Safe JSON Metadata Parser src/local-editor/server.ts → parseMetadata()
Selected Project
POST
Compare POST request handling across server frameworks.
Technologies
What I Built
ROSETTA 26 — Implementation Comparison
What I Was Learning
Source Learning Project — TypeScript Project: HTTP Method Board src/local-editor/server.ts → handleApi()
Selected Project
PUT
Compare PUT request handling across server frameworks.
Technologies
What I Built
ROSETTA 27 — Implementation Comparison
What I Was Learning
Source Learning Project — TypeScript Project: HTTP Method Board src/local-editor/server.ts → handleApi()
Selected Project
Template Replacement
Compare template-value replacement across languages.
Technologies
What I Built
ROSETTA 30 — Implementation Comparison
What I Was Learning
Source Learning Project — TypeScript Lab: Template Replacement Lab src/generator/generate.ts → replaceTemplateValues()
Selected Project
Static Page Generator
Compare static page generation across languages.
Technologies
What I Built
ROSETTA 33 — Implementation Comparison
What I Was Learning
Source Learning Project — TypeScript Project: Mini Static Site Generator src/generator/generate.ts