weeklyfoo #7 is here: your weekly digest of all webdev news you need to know! This time you’ll find 48 valuable links in 6 categories! Enjoy!
🚀 Read it!
- The Architecture Behind A One-Person Tech Startup: Super nice, very smart! / saas / 28 min read
- How to scale a large codebase: Good advices by Vercel, lots of things I’m personally also do since ages. Nevertheless a good read! / structure, codebase / 13 min read
- Traits I Value: by the CTO of Meta / traits / 6 min read
📰 Good to know
- 67 Weird Debugging Tricks Your Browser Doesn’t Want You to Know: A list of useful, not-obvious hacks to get the most out of your browser’s1 debugger. Assumes an intermediate-level-or-higher understanding of the developer tools. / debugging / 12 min read
- HTML First: It’s like going back to the roots / html / 7 min read
- 5 Skills the Best Engineers I Know Have in Common: Obvious, but good! / skills / 7 min read
- URL explained - The Fundamentals: Differences between URI, URL, URN, and URC. / url / 8 min read
- READme or READ-meh? 4 Tips & Tools to engage: Good tips! / readme / 3 min read
- The Tech Stack of a One-Man SaaS: I love these insights / saas, tech / 13 min read
- Inside OpenAI: How does ChatGPT Ship So Quickly?: Since it arrived a year ago, ChatGPT has been shipping at breakneck speed. / ai, openai / 12 min read
- Node.js CLI Apps Best Practices: The largest Node.js CLI Apps best practices list / nodejs, cli / 39 min read
- Four Kinds of Optimisation: Good read! / optimisation / 21 min read
- My Journey to 3x Faster Builds: Trimming Barrel File Imports: Optimize your imports! / imports / 3 min read
- Google Search will let you leave and read ‘Notes’ on web pages: Sticky notes everywhere ;) / google / 8 min read
- Wasm By Example: Hands-on introduction to WebAssembly / wasm / 0 min read
- A faster web in 2024: Good views! / web, 2024 / 20 min read
- Vite 5.0 is out!: Next major version of Vite! / vite / 7 min read
- Prettier 3.1: New experimental ternaries formatting and Angular control flow syntax!: New minor version of prettier / prettier / 12 min read
- Navigating around in your shell: If you’re using the shell, read this blog post. / shell / 8 min read
- Planning for unplanned work: All about the intro and outro of unplanned work. / planning / 12 min read
- Introducing Pitch 2.0: The future of visual business: Pitch is such a wonderful tool, now with AI / pitch, ai / 9 min read
🧰 Tools
- deck.gallery: We curate nicely designed decks, slides, keynotes, guidelines — or whatever you call them. / slide decks
- usehooks-ts: React hook library, ready to use, written in Typescript. / react, typescript
- draw-a-ui: Draw a mockup and generate html for it / tldraw, ai, html, tailwind
- wavefront: Typeface for rendering waveform/data / fonts, charts
- Loro: Make your app state synchronized and collaborative effortlessly. Powered by CRDTs (Conflict-free replicated data type). Built for local-first software. / crdt, loro
- Recraft: Generative AI for professional design / images, ai
- getmac: Get the mac address of the current machine you are on via Node.js / nodejs, mac
- GPT Crawler: Crawl a site to generate knowledge files to create your own custom GPT from a URL / ai, gpt, crawler
- xmind copilot: Mindmaps with AI / ai, mindmaps
- react-datasheet-grid: An Airtable-like / Excel-like component to create beautiful spreadsheets. / react, table, grid
- Plasmic: Plasmic is an open-source platform for building production-grade apps, websites, and content incredibly fast, without compromise. Integrate with existing codebases. Break through the low-code ceiling. / no-code
- visx: visx a collection of expressive, low-level visualization primitives for React / visualization
- perfect-freehand: Super nice small app to quickly draw something / images, vector, svg
- ribbon-shapes: Get a CSS-only Ribbon Shape made with a single-element and customizable using CSS variables. / css, ribbon
- bug: A new way of working with Protocol Buffers. / proto buffers
- denoKV: A self-hosted backend for Deno KV / deno
- Plasmo: The Browser Extension Framework / browser extensions
- Screenshots to Code: Drop in a screenshot and convert it to clean HTML/Tailwind/JS code / ai, code, screenshots
- draw my ui: That’s really really cool - use tldraw to draw a UI, set your OpenAPI key and see how it becomes real. / ai, tldraw
- vercel style guide: prettier, eslint und typescript config from vercel / prettier, eslint, typescript
- SVG Company Logos: A free collection of popular SaaS company logos in SVG format. Copy to your clipboard or download in SVG format. / svg, logos
- knock: Knock is flexible, reliable notifications infrastructure that’s built to scale with you. / notifications
🎨 Design
- Storefront: We curate the best digital storefronts on the internet. / websites / 1 min read
- HTMLrev: 1000+ free HTML templates / websites, templates / 7 min read
- Performing a Web Accessibility Audit: We all know accessibility is critical, but where to start? An audit will point you in the right direction. / a11y / 14 min read
🤪 Fun
- Nyan cat coworker: Nyan cat!!! / meow / 1 min read
📚 Tutorials
- Glowy Border Shimmer Button: Looks hot! / css, javascript / 1 min read