React Icon

React

React is an open source JavaScript library used for designing user interfaces.
107 Stories
All Topics

Slack github.com

"If you know React, you know how to make a Slack app"

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.

It’s crazy interesting to me how many of these “Use React for X” projects keep popping up. People are making CLIs with React, games with React, desktop apps with React. What else?

Josh Comeau joshwcomeau.com

A static future

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.

Brandon Bayer github.com

Blitz.js — a Rails-like framework for full-stack React apps without an API

Brandon Bayer:

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.

React github.com

A simplified Jira clone built with React and Node

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.

A simplified Jira clone built with React and Node

Go github.com

Rudder is an open source Segment alternative

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.

Rudder is an open source Segment alternative

JavaScript github.com

A Minecraft clone built entirely with JS

Having to open an additional app to play a game is sometimes too tiring. Therefore, I thought it’d be interesting to somehow implement Minecraft with javascript, essentially bringing the whole Minecraft game into the web. This not only takes away the tedious process of installing the game, it also brings the entire game to players within a couple clicks.

Words cannot describe how much I adore the thought that building this extremely ambitious piece of software was a better alternative to the tedious process of installing the game. 😆

A Minecraft clone built entirely with JS

Slack Engineering Icon Slack Engineering

When a rewrite isn’t: rebuilding Slack on the desktop

The Ship of Theseus is a thought experiment that considers whether an object that has had each of its pieces replaced one-by-one over time is still the same object when all is said and done. If every piece of wood in a ship has been replaced, is it the same ship? If every piece of JavaScript in an app has been replaced, is it the same app? We sure hoped so, because this seemed like the best course of action.

Fascinating look behind the scenes at both the process of rewriting a massively used application and the particular architectural choices made along the way. The approach used was at once incremental and all-encompassing, rewriting a piece at a time into a gradually growing “modern” section of the application that utilized React and Redux. And the results? 50% reduction of memory use and 33% improvement in load time… not too shabby.

Tom Warren The Verge

Slack’s new desktop app loads 33 percent faster and uses less RAM

Good news fellow Slack users, your productivity just got bumped by the perf gods of Slack thanks to their continued efforts and focus on the desktop app’s performance.

Slack is unveiling a new version of its desktop app for Windows and macOS today that promises big performance improvements. Slack has rebuilt its desktop app to focus on speed, and the company claims Slack will now launch 33 percent faster than before. The Slack app will even use 50 percent less RAM than before, according to the company.

Slack has been working on this overhaul for two years, slowly modernizing parts of its code along the way. While the desktop apps still run on Electron, all of the UI parts have been rebuilt using React to fix some of the shortcomings of the existing Slack app.

0:00 / 0:00