We’re back with another edition of the FEDSA Feed!
The front-end world doesn’t stand still; it restructures itself. Cloudflare rebuilt Next.js in a week (really). React moved into a foundation model. And designers are rethinking prop-heavy components.
This edition is all about control: of your runtime, your components, and your ecosystem.
Recreate NextJS. Make no mistakes.
Cloudflare gave the entire Next.js codebase to one engineer and an AI and rebuilt it from scratch in one week. Why? Next.js is tightly coupled to Vercel’s infrastructure and Node-specific features, making deployment to other platforms, especially edge runtimes, complex and constrained. Cloudflare effectively reworked Next.js into Vinext to make it Vite-native and fully compatible with their edge-first Workers runtime. Apparently, it’s already running a US .gov site in production. Approach with caution.
Read more here
Less Props, More Composition.
As Figma rolls out native slots for components, Nathan Curtis has written a fascinating article where he argues that slots let teams replace prop-heavy, brittle components with leaner, composable ones, collapsing excessive configuration into a small core of essential controls while moving layout and visibility decisions into flexible composition. Must read for the UI designers.
Learn more here
A new home for React.
React has moved to the React Foundation, a meaningful governance shift that gives it a more neutral home and reduces reliance on any single company’s priorities. Looking at you, Meta. With players like Vercel and Shopify formally at the table, the ecosystem builders now have clearer influence, and while Vercel has recently felt especially close to React’s centre of gravity, a foundation model may help ensure no one company sets the direction on its own.
Read about it here
Mind the gap
by Abigail Ball (KRS Software Engineer)
Ever wondered why that full-width hero image on your first website had an annoying white border? Or why adjusting the width on your carefully crafted component caused unexpected horizontal scrollbars? If you're new to HTML and CSS, this pitfall can eat hours of debugging time.
The culprit: browsers quietly add an 8px margin to the <body> element by default, preventing backgrounds from reaching the viewport edges and throwing off full-width designs. Developers often debug the wrong element - tweaking component width/height instead of finding the real culprit: the <body> margin itself.
When starting a new project, many developers unset the body margin of the body tag: <visual of CSS code>
This one-line reset is exceedingly common: margin: 0;.
Open your dev tools and inspect the <body> on any professional site (even MDN's own documentation page!), and you'll find margin: 0; is nearly universal.
UPCOMING EVENTS:
Keen to share your knowledge at an upcoming FEDSA event? Sign up to be a contributor.
JOB OPPORTUNITIES:
Capitec is hiring full-stack software engineers. It is a hybrid position with office days in Stellenbosch. Apply here
LekkeSlaap is looking for an intermediate full-stack engineer to work in their Laravel & React environment, using AI tooling and modern DevOps. Apply here
Yoco is currently advertising a senior full-stack engineer role to help scale their POS system and work on other merchant-facing payment systems. Apply here
IO is looking for a senior software developer (full-stack) to join their fully remote team. Apply here
Ozow is on the lookout for a Junior UX Designer to join their fintech team. Apply here
If you found this useful, remember sharing is caring, so tell your friends to subscribe so they can learn along with you!
Did we miss something? Just hit “reply” and help us set the record straight!
P.S. Wish you could hear from us more often? Just join our FREE community on Discord and bring all your questions.