Blitz.js creator Brandon Bayer joins Jerod to dive deep into the foundational principles of this fullstack React framework. We talk about its inspiration (Ruby on Rails), its differentiation (a “no-API” data layer), and its aspirations (built-in auth, plugins, recipes, and more).
This provides responsive UI components from 15 different app categories (commerce, blog, pricing, etc) with dark/light modes and differing color variants.
Recoil provides several capabilities that are difficult to achieve with React alone, while being compatible with the newest features of React.
Straight outta Facebook. See also the conference talk where it was announced at React Europe 2020.
This is a very detailed article on:
directly comparing Ember and React, using the latest idioms and best practices from both frameworks.
It goes really deep into the differences and the developer experiences of both frameworks and is a really good read for someone who is curious about what modern Ember looks like, especially if they have some previous React knowledge.
This week Feross and Emma chat with Segun Adebayo about Chakra UI, a modular React component library that’s changing the game for design systems and app development.
Phelia transforms React components into Slack messages by use of a custom React reconciler. Components (with their internal state and props) are serialized into a custom storage. When a user interacts with a posted message Phelia retrieves the component, re-hydrates it’s state and props, and performs any actions which may result in a new state.
A fun walkthrough of creating a mini data viz component in React, which teaches useful concepts like drawing with SVG and d3.js scales.
Super-simplified reimplementations of complex pieces of software are a great way to learn for the author and reader alike. When you can boil it down to just 33 lines like this, the surface area is minimal enough that reading it shouldn’t be too tough, but there’s definitely some code golf going on.
Why is static the future? How do you define “static”? Read this deep dive from Josh Comeau to find out…
The term “static” can be a little overloaded, and occasionally a little misleading. Here’s how I’d define it:
“A static website is a website where the initial HTML is prepared ahead of time, not dynamically generated by a server on request.”
When you make a request to this website, for example, Netlify serves pre-generated HTML to you. I don’t have a Node server dynamically rendering HTML documents on-the-fly.
The central thesis is that most apps don’t need a REST or GraphQL API. Blitz brings back the simplicity of server rendered frameworks like Ruby on Rails while preserving everything we love about React.
Additionally, Blitz is bringing other Rails goodness that’s missing in the React ecosystem like file structure and routing conventions, a really nice console REPL, intelligent code-scaffolding, and a fine-tuned out-of-the-box setup with Prettier, Typescript, ESlint, Jest, Cypress, etc.
The framework ‘wars’ continue right alongside the monolith-vs-microservices debate. For more on the principles behind Blitz, check out the manifesto.
Tom Preston-Werner (co-founder of GitHub, board member at Netlify) joins the party and brings his new, opinionated, full-stack, serverless web app framework with him. Will Redwood help usher in the future Tom predicted back in 2018? We discuss that and a whole lot more on this must-listen episode.
Want great developer experience and easy scaling? Redwood is here! Built on React, GraphQL, and Prisma, Redwood works with the components and development workflow you love, but with simple conventions and helpers to make your experience even better.
Supports too many languages to list here, but all of the usual suspects are there. Maybe you’re hoping for a web-based demo? No 🎲
Do not run the Web UI on a port open to public traffic! Doing so would allow remote code execution on your machine.
This looks like an excellent read for anyone looking to level up their fullstack JS chops:
I do React consulting and this is a showcase product I’ve built in my spare time. It’s a very good example of modern, real-world React codebase.
There are many showcase/example React projects out there but most of them are way too simple. I like to think that this codebase contains enough complexity to offer valuable insights to React developers of all skill levels while still being relatively easy to understand.
This is a super-cool tool for getting your ideas on “paper” quickly. It’s pretty rough around the edges, but that’s forgivable for now since it’s pretty new. Try it for yourself right here.
A nice side-by-side comparison of a simple todo app built with both frameworks. If you’ve experimented with these tools, you’ll probably find this article too elementary to be useful, but if either is unfamiliar to you, definitely give it a read.
KBall connects with Katie Sylor-Miller to talk about migrating OhShitGit to the JAMStack, migrating legacy codebases to modern front-end technologies, and design systems.
Blocks UI is in alpha, but definitely impressive already. You drag/drop components, tweak their properties/style, and it spits out “production-ready” React code. Try the demo right here.
We are going to rewrite React from scratch. Step by step. Following the architecture from the real React code but without all the optimizations and non-essential features.
If you think you’ve seen this before, look again. This post is based on React 16.8, which means it uses hooks and drops all the code related to classes.
I do love the hand-drawn style for charts like these. It almost feels like you worked harder on them for some reason.
Make your site editable in five minutes.
Every day, the moat around React gets bigger, deeper, and filled with more 🐊🐊s
I’ve been a big fan of Segment since way back before they became our sponsors. The adapter pattern for marketing/analytics tools is a great idea and they’ve executed on it very well. I’m also a big fan of open source alternatives to commercial products. 😀
If the “Why Rudder?” section of the README (privacy & security, processing flexibility, unlimited events) has you nodding in agreement, this is worth a deeper look.