events/2025-02-25-front-end-study-hall
Front End Study Hall #022 was an IndieWeb meetup on Zoom held on 2025-02-25.
Front End Study Hall #022
February 25, 2025
Participants
Joe Crawford
Jeremy Cherfas
- Template:vanderwal
- Eric M
Paul Watson
mandaris
Fractalkitty
Tantek Γelik
zacharykai
Joe's Zoom Background
- A screenshot of greasemonkey.mozdev.org from 2005 or so.
- Greasemonkey is a browser extension for Firefox which allowed users to add scripts which could alter and extend the behavior of the web pages they visit. Common usages would be to hide advertisements, simplify layout, inject user stylesheets, allow for batch operations in web applications, etc. Or more fanciful usages like turning any flickr image into a puzzle
- See also:
Dark Mode Discussion
- Minimal dark mode styling: https://meyerweb.com/eric/thoughts/2023/01/16/minimal-dark-mode-styling/
- Adding a widget to trigger light/dark mode
- Adding a widget state with cookie storage would trigger the need to do privacy/cookie usage disclosure in the EU
- You can get much of dark mode out of doing
filter: invert(1)
against thehtml
element! Eric Meyer does on meyerweb.com
User Scripts
- Eric showed his user scripts which spin elements on the page using
rotate
- really fun art - ViolentMonkey
- What's the difference between a user script and a bookmarklet?
- They are very similar! Both can alter the page by injecting HTML, JS, and CSS to accomplish layout changes or functionality
Current IndieWeb Carnival
Conversation RSS β LaTeX & MathML & MathJax
- RSS Icon in Firefox Toolbar?
- Awesome RSS Toolbar in Firefox
- Is there a Feedreader that can read LaTeX? -
Fractalkitty
- Math equations
- LaTeX https://www.latex-project.org/about/
- Pronunciation can be "LAY-Tek"
- https://en.wikipedia.org/wiki/LaTeX
- https://www.desmos.com/
- https://www.mathjax.org/ (renders to SVG)
- I found this issue for the reader I use, Newsblur: https://github.com/samuelclay/NewsBlur/issues/948
- https://katex.org/
- https://en.wikipedia.org/wiki/TeX
- meta content usage: indicates maybe a good way to embed math in a "plain text" context
- In post content: potential use for an element with a class name, rather than looking for a string series to convert.
- Or even better (maybe?) potential use case for a LaTeX web-component.
- Possibly prior math/LaTeX web component efforts:
- https://latex.js.org/usage.html#webcomponent
- https://www.webcomponents.org/element/mathlive "A Web Component for Math Input"
- blog post about math web components: https://www.peterkrautzberger.org/0220/
- Additional references:
Joe Crawford's experience with mathml https://lab.artlung.com/mathml/
- Updated the day after FrESH! thanks participants!
- MathML makes the mathematical operations potentially more available
- MathML was and is heavily used in R notebooks, which is all markdown. In math and data disciplines
- maybe file feature requests in feed readers to support LaTeX
- e.g. in Thunderbird
And then, about "local first," syncing, hosting
- Local First
- POSSE
- SyncThing https://syncthing.net/
- TailScale https://tailscale.com/
- Sophia shared her journal https://www.streamof.me/
- Thomas' Model of Attraction
- https://www.vanderwal.net/essays/moa_outline1.html
- info clouds - zones of infoclouds, local / global / inaccessible
- https://personalinfocloud.com/
- "Sharing information got us out of caves"
- Do not restrict sharing
- Frameworks:
- React Svelte Vue
- Pair https://www.pair.com/
- OpalStack https://www.opalstack.com/
- https://vercel.com/
- Netlify https://www.netlify.com/
- Github to Netlify
- CodePen export the zip and then upload
- Teaching folks to make web pages in a mall:
- * https://ideastore.dev/blog/The-Rad-Web/
- Glitch templates great for learning server stufff
- Building web pages capstones for high school
- Kids can learn to make web pages
- Creative outlets
- Mob coding, Pair programming
How to teach kids about websites? How to let them play on a site, export from codepen, can use GitHub to Netlify workflow.
- Glitch is great - can be slightly glitchy - does require identity
- Kids may have Chromebooks - can use usb sticks?
- Teaching web longevity?
Links from the Front End Study Hall To Study List
- https://tantek.com/2024/263/t1/20-years-undohtml-css-resets
- https://piccalil.li/blog/how-i-build-a-button-component/
- https://cloudfour.com/thinks/justified-text-better-than-expected/
- https://nerdy.dev/6-css-snippets-every-front-end-developer-should-know-in-2025
- https://fullystacked.net/how-to-gif-2025/
Front End Study Hall (FrESH) | |
---|---|
Find upcoming Front End Study Hall Events on events.indieweb.org/tag/frontend | |
2025 | 01-02 β’ 01-16 β’ 01-30 β’ 02-13 β’ 02-25 |
2024 | 04-24 β’ 05-07 β’ 05-23 β’ 06-06 β’ 06-18 β’ 07-02 β’ 07-16 β’ 08-01 β’ 08-27 β’ 09-12 β’ 09-26 β’ 10-10 β’ 10-24 β’ 11-07 β’ 11-21 β’ 12-05 β’ 12-17 β’ |