/topic Each week, the Web Applications Team (WAT) at WillowTree uses Slack to post interesting articles, share development tricks, and discuss technologies used in our world. Here’s a breakdown of what we talked about this week.
@beautify: Maintainable Styling with CSS in JS
Follow one developer’s journey through the chaotic CSS maze that leads to some combination of ITCSS, Aphrodite, CSSNext, CSSModules, React, Webpack, Babel, and postcss. He demonstrates how dynamic JS can be for styling and, in his opinion, when CSS perseveres over JS.
@standards: Consistent Code Clarity in JS
Title sounds too good to be true? Enter standardJS. Its goal is to provide a series of unchangeable rules. No linters, no decisions — it’s just an easy way to keep your code consistent. This is an excellent tool for open source projects and makes open source contributions accessible.
@accessibility: Coding while Blind
Learn about how one blind developer codes and his take on accessibility (it’s easy and you should do it). He even includes an insanely fast soundcloud clip of him coding from his screen reader.
@react-native: React Native for Web
Spoiler alert: React Native for Web is not ready for production. In concept, React Native for Web could be very useful for budget projects. It allows developers to reuse styles and code across platform. However, it’s not fully built out and there are many unsupported components. If you’re interested in learning and seeing a bit more React Native code cross-platform, head over to the blog post for some code snippets.
@routing: Stop Using React-Router
In a previous blog post of mine, I share an article that shows how to create a custom router in under 50 lines of code. If you’re still opposed to creating a custom router but want a lightweight solution, check out Universal Router. It’s compatible with both client-side and server-side applications and simple to use.
@performance: Transpiling ES2015
There are many tools that will compile your es2015 code into es5 or lower, but are they all performance-friendly? This github repo experiments with a variety of tools to test overall compile size, runtime, and JS compile and execution time on page load. The biggest take away? “When choosing your compile stack you should be aware that tools that perform tree shaking and topological sorts of your code dependencies will result in smaller code bundles and faster js execution times.” If you want more proof, check out Nolan Lawson’s take on the issue.