Weekend JavaScript



ISSUE #130

Beyond React 16, Wepack 4, and more


TOP STORIES

Sneak Peek: Beyond React 16 - React Blog

Dan Abramov from our team just spoke at JSConf Iceland 2018 with a preview of some new features we’ve been working on in React. The talk opens with a question: “With vast differences in computing power and network speed, how do we deliver the best user experience for everyone?”


🎼webpack 4: released today!!✨

Today we’re happy to release that webpack 4 (Legato) is available today! Up to 98% faster builds, huge bundle size decreases, #0CJS, and more!! Upgrade today!


REACT

Redesigning Redux – Hacker Noon

Shouldn’t state management be a solved problem by now? Intuitively, developers seem to know a hidden truth: state management seems harder than it needs to be. In this article, we’ll try to answer some questions you’ve probably been asking yourself


Genuine guide to testing React & Redux applications

The times when a front-end was just a thin layer of static pages are long gone. Modern web applications grow ever more complex, and logic continues to shift from the back-end to the front-end. Yet…


Replacing redux with the new React context API – freeCodeCamp

The new context API coming with React 16.3 is pretty neat. It was built in the render props style trending last months. Let’s explore it: This talk from the excellent Jing Chen, has revolutionised…


Styled Starter | Starter Kit with React, Next.js and Styled ComponentsMy page

Starter Kit for creating Server-Side Rendered React Apps with Next.js and Styled System Components


Stress Testing React Easy State – Bertalan Miklos – Medium

Last week I announced React Easy State: a state management library based on ES6 Proxies. The announcement mentioned something, which deserves an article on its own. This was the last none vanilla…


Bringing Together React, D3, And Their Ecosystem — Smashing MagazineSearchClear SearchBack to top

React and D3.js are great tools to help us deal with the DOM and its challenges. They can surely work together, and we are empowered to choose where to draw the line between them.


TYPESCRIPT

TypeScript — JavaScript with superpowers – freeCodeCamp

TypeScript can — see that little red underline? That’s Typescript giving us a hint something is horribly gone wrong. You probably figured this one out (good job) — toUpperCase() is a type of String…



WORKFLOW

Debugging JavaScript with Source Maps

JavaScript source maps are the key to taking what you’ve narrowed down in the minified JavaScript, and then being able to map them back to the source code so that you can view and resolve the problem without having to figure it out in the minified code.


Efficiently snapshotting your single-page-apps with Puppeteer

Npmcharts is a mostly single-page app that shows the download trends of various npm packages. For example, if you were looking into which headless chrome library to use, you’ll see this graph in your…


MISC

Gitflow - Animated

So, I built a React app to visualize and animate the Gitflow


GitHub - QuadrupleA/private-secure-sharing-buttons

Privacy-respecting, simple social sharing buttons in native JavaScript.