A note about this document

This PDF is a static snapshot of a fully interactive cover letter. See how it's built – and how I approach development – at link to web app.

[w3c-wccg-spec-ctx]: https://github.com/webcomponents-cg/community-protocols/blob/d81a5fb5/proposals/context.md "W3C’s Web Components Community Group Community Protocols spec." [w3c-wccg]: https://www.w3.org/community/webcomponents/ "W3C’s WCCG Home Page" [impl-ctx]: https://github.com/renoirb/renoirb-esm-modules/tree/main/packages/context-api "Link to Context API source in renoirb-esm-modules on GitHub" [impl-vd]: https://github.com/renoirb/renoirb-esm-modules/tree/main/packages/value-date-element "Link ValueDateElement source in renoirb-esm-modules on GitHub" [impl-cm]: https://github.com/renoirb/renoirb-esm-modules/tree/main/packages/content-markdown-element "Link ContentMarkdownElement source in renoirb-esm-modules on GitHub" [impl-al]: https://github.com/renoirb/renoirb-esm-modules/blob/main/packages/app-layout-element/src/browser/element.mjs "Link to AppLayout source on GitHub" [impl-root]: https://github.com/renoirb/renoirb-esm-modules [ref-pjc-vat]: https://github.com/PanJiaChen/vue-admin-template/pull/449 "First proposal AppLayout" [ref-eui]: https://element.eleme.io/#/en-US [yt-ref-pjc-vat]: https://youtu.be/C39eZYD-7Ow "Video on YouTube" This is a live web application. View the page source (right-click, "*View Page Source*") to see how I build with modern web standards: - **Context API for Simplified Components:** The [``][impl-vd] and [``][impl-cm] elements (which renders this note) use the [W3C *Web Components* Community Group][w3c-wccg]’s [*Context API* protocol][w3c-wccg-spec-ctx] to request contextual data. I'm a strong advocate for this approach (distinct from React's Context) because it simplifies components and avoids prop *drilling*. * See my [`@renoirb/context-api` module][impl-ctx] - **Reusable Application Shell:** The ` element provides a reusable application *shell* (header, navigation, footer, etc.), a key component in micro-frontend architectures and other modern web apps. It promotes consistent UI and independent development. * [`app-layout` source code][impl-al] * Earlier Vue.js implementation that's adapting from [Element UI][ref-eui], using a starter template (See [in action][yt-ref-pjc-vat], [PR][ref-pjc-vat]) - **Buildless Development:** This app uses HTTP JavaScript modules directly (e.g., `import { ValueDateElement } from 'https://...'`). See my [renoirb-esm-modules project on GitHub][impl-root]. - **CV as Code:** My CV is also code generated: * It is currently being reworked, using Web Components [rendered from a JSON Resume](https://renoirb.com/resume/rework.html). * [YAML source](https://renoirboulanger.com/resume/as-code/) * [JSON Resume registry](https://registry.jsonresume.org/renoirb) * Other formats: See footer