Top picks — 2017 June
A Unified Styling Language
https://medium.com/seek-blog/a-unified-styling-language-d0c208de2660
I need to admit that for a first time when I saw JSX in React I thought it is a joke. I really did my best to master famous separation of concerns. Then people started porting CSS into JavaScript — crazy idea I thought. Nowadays my mindset changed and I really love tha idea of real separation od concerns (not separation of technologies that I was practicing for years). Mark Dalgleish published a fantastic article about it. I have read many posts about this subject but non of them is as wll explained and convincing as this one is. It isn’t a three minutes read but it is wort it.
Stuff at the Top of an SVG
https://medium.com/@pnowelldesign/stuff-at-the-top-of-an-svg-f3ad198eb54e
Typical SVG exported straight from Adobe Illustrator, Sketch or any other software contains a lot of meta declarations. Should we keep it or should we safety delete bunch of stuff? Peter Nowell published a great explanation of all declarations and helps us to decide which parts of SVG we can bin.
Exploring ES2017 Decorators in JavaScript
https://www.sitepoint.com/exploring-es2017-decorators-javascript/
The title is very misleading as the spec for ES2017 is finalized and decorators are definitely not part of a new specification but this article is a very good primer to start with decorators. It is a mechanism well known in other programing languages, implemented and very heavily used in Angular 2 (thanks to power of TypeScript). It would be very cool to see decorators in the language.
Object rest and spread properties
https://developers.google.com/web/updates/2017/06/object-rest-spread
Mathias Bynens just joined the V8 team at Google and he managed to implement a new feature to Chrome’s engine — rest and spread are coming with the version 60. This post explains the details and shows practical examples.
Results of the Ultimate CSS Survey 2017
https://www.sitepoint.com/results-ultimate-css-survey-2017/
Annual CSS survey made by SitePoint is always a great source of front-end important insights. The most surprising for me is number of people still supporting IE8 (and even older browsers).
Webpack 3: Official Release!!
https://medium.com/webpack/webpack-3-official-release-15fd2dd8f07b
We saw a big release of webpack 2 just few months — perfect timing to release another major release. Webpack 3 just landed with few highly requested features like: scope hoisting and “magic comments”. Maintainers of this popular module bundler confirm that for 98% of users the migration from previous version to current one is smooth without any breaking changes (doesn’t apply to plugin creators). Cool cool!
Connect: behind the front-end experience
https://stripe.com/blog/connect-front-end-experience
Benjamin De Cock from stripe shares a number of useful advices and use cases for cool new browser features like: CSS grid module, 3D animations, Web Animation API and Intersection Observer. It is such a good read and it is really cool to see a project in the wild that is that heavily packed in modern features.
Embracing the power of styled-components
https://building.sentisis.com/embracing-the-power-of-styled-components-7b79a166c01b
If we are talking about styles in JavaScript — styled-components is one of the most frequently recommended way of doing it. Personally it took me a while to understand the concept of it but it finally clicked after this explanation! Thanks for writing it down Fernando.
Move Modal in on a Path
https://css-tricks.com/move-modal-path/
A cool little idea by Chris Coyier on CSS Tricks. I’m sure that the use case for this feature can be much more creative though. Works nice with native CSS feature detection using @supports keyword — I published a whole article about it if you are not familiar with it yet.