TLDR Web Dev

TLDR WEB DEV 2024-10-22

5 sections17 entrieslinks blockcomplete parse

Parse notes

  • Subscription/account footer truncated before parsefooter_truncated

01ARTICLES & TUTORIALS

REACT FOLDER STRUCTURE IN 5 STEPS [2024]

When organizing React folder structure, devs should separate components, features, and technical concerns into dedicated folders and files for better organization and maintainability. A "barrel file" approach should be used for public APIs, but this is becoming less popular in JavaScript due to its impact on tree shaking.

robinwieruch.de22 min read

HOW WE GENERATED MILLIONS OF CONTENT ANNOTATIONS

Spotify has built a platform to manage and scale its content annotation processes. It focuses on three key areas: scaling human expertise, developing flexible annotation tools, and establishing a robust infrastructure for integration. The platform allows Spotify to generate millions of high-quality annotations efficiently, letting it develop and iterate on ML models faster.

engineering.atspotify.com6 min read

HEADLESS, BONELESS, SKINLESS, & LIFELESS UI

There are four categories of UI abstractions: Headless UI, Boneless UI, Skinless UI, and Lifeless UI. "Headless UI" is a common term where the abstractions often have underlying functionality and structure. "Boneless" refers to UI libraries that provide composable styles but no markup, while "skinless" provides functioning markup with no styling. "Lifeless" UI abstractions, like TanStack, offer typesafe hooks and logic without rendering actual UI elements, leaving the developer responsible for applying those functions to elements and styles.

nerdy.dev5 min read

02OPINIONS & ADVICE

HOW I USE GIT

A good Git workflow has frequent commits, well-structured pull requests, and a focus on the main branch. This developer personally prefers using the CLI and advocates for a simple branching strategy. Pull requests should also have clear commit messages with descriptions that explain the "Why" behind the changes made.

registerspill.thorstenball.com16 min read

USING AI GENERATED CODE WILL MAKE YOU A BAD PROGRAMMER

Using AI to generate code hinders personal growth and undermines programming skills. AI-generated code is comparable to "script kiddie" behavior. Developers may potentially develop a dependence on AI tools, which can lead to job displacement.

slopwatch.com11 min read

SOME IMPORTANT LEARNINGS FROM MY 20 YEARS OF ENGINEERING LIFE

While the industry constantly evolves, fundamental principles remain timeless. Good developers practice avoiding premature optimization, thinking critically before coding, and mastering good practices like clean code, design patterns, and SOLID principles.

newsletter.techworld-with-milan.com16 min read

03LAUNCHES & TOOLS

Sponsored

SOLVING PPM CHALLENGES IN JIRA WITH BIGPICTURE — FROM COMPLEX DEPENDENCIES TO ACCURATE TIMELINES

Curious about upping your PPM game? Join an Appfire Solution Advisor for a live session [10] on how to turn Jira into the ultimate Project/Product Portfolio Management tool. Learn about creating informative timeline and roadmaps, allocating resources, and tailoring your approach to fit your organization's goals. Register for tomorrow's event [10] to have your questions answered live.

appfire.registration.goldcast.ioSponsor

NEXT.JS 15

Next.js 15 is now stable and ready for production use, with a range of updates such as a new @next/codemod CLI for smoother upgrades, asynchronous request APIs, and caching semantics changes. It also supports React 19 and includes performance improvements with Turbopack Dev. Next.js 15 has better observability with a new Static Route Indicator and APIs like unstable_after and instrumentation.js.

nextjs.org22 min read

FAST GRID

Fast Grid is a high-performance web table library that utilizes multithreading and a shared array buffer to be fast and efficient. It can render millions of rows in constant time and maintain 120 frames per second even while sorting, filtering, and scrolling simultaneously.

github.comGitHub repository

REPOPACK

Repopack is a tool that can convert an entire code repository into a single file optimized for use with AI models like ChatGPT and Claude. It automatically formats code for AI understanding, counts tokens for context limits, and offers options for inclusion, exclusion, and security checks.

github.comGitHub repository

04MISCELLANEOUS

HOW I FAILED TO MAKE A GAME

This developer attempted to create a raycasting engine for the GameBoy Advance. The project was initially successful, with a focus on technical development, but ultimately failed due to the developer's lack of interest in creating content. The process of building assets, designing controls, and addressing the limitations of the GBA screen was too tedious and frustrating.

mcejp.github.io7 min read

LISKOV'S GUN: THE PARALLEL EVOLUTION OF REACT AND WEB COMPONENTS

Web components, though technically useful, have been hampered by over-aggressive promotion and a lack of early support from major browser vendors. Meanwhile, React gained popularity by promising a magical solution to UI development and by inadvertently commodifying developers. This situation has led to a schism within the web development community, with three factions: standards-oriented developers, web component framework implementers, and other reactive framework developers.

baldurbjarnason.com57 min read