It’s been a little over a week since the iPhone X was announced, so there’s been time for a ton of commentary and reactions. “The Notch” definitely got its share of haters, but boy they’ve packed some interesting things in there. Everyone is scrambling to figure out the implications, but no doubt about it this will influence mobile web design & development in the coming years.

Happy Friday!
KBall from ZenDev

P.S. I’m heading to Toronto this weekend to speak at Web Unleashed 2017. Going to be there? Shoot me an email at [email protected] and let's meet up for a chat!

CSS & SCSS

“The Notch” and CSS

With the big Apple announcements and the new screen structure announced in the iPhone X, figuring out how to update your CSS and designs to handle it is a hot topic.


Discover the Power of CSS Transforms

An excellent tutorial on CSS tutorials with codepen examples each step of the way so you can tinker and experiment as you go.


Writing CSS with Accessibility in Mind

Accessibility is a multi-faceted topic, especially when you consider the many different ways someone can need more accessible websites. My eyes are terrible, so font size is a big one for me! This is a great read through of the myriad ways your CSS influences the accessibility of your website.


Intriguing CSS Level 4 Selectors

A fascinating look through some of the less-well-known pseudo-classes from the CSS Level 4 spec. :user-error anyone?


Solve Your Specificity Headaches With CSS Modules

I tend to be a little bit opinionated about CSS in JS, but there are definitely some scenarios where enforcing your component scope in code can be valuable. if you’re going to go that route the CSS Modules approach has a lot going for it.


JavaScript

What's new in Node.js 8.5?

The big news here is native support for ECMAscript modules. The compromise outcome of using the mjs file extension is a big gotcha though, especially given all of the existing tooling utilizing babel with simple js extensions.


How JavaScript works: memory management + how to handle 4 common memory leaks

With the rise of single-page applications, memory management in JavaScript is more important than ever before.


Top 10 ES6 features by example

Simple, straightforward, to the point, and contains great working examples of 10 of the most popular new features in the ECMAScript 6 spec (AKA “modern JavaScript” 😉)


Strapping React.js on a WordPress Backend: WP REST API Example

I have a love/hate relationship with WordPress. Hate it as a developer - love it as a CMS for non-technical folks. But even Wordpress is coming into the modern world - here’s a great walkthrough of how to build a JS app in React on top of the Wordpress backend.


How to Create Filters in Vue.js with Examples

I keep hearing more about Vue.js, and things like this beautifully simple approach to defining template filters is probably why.


Other Awesomeness

Introducing iPhone X — Apple

In case you missed it, here’s the announcement from Apple about the iPhone X. The “Notch” may be ugly, but damn this is a sweet looking piece of hardware.


‘Notch’ crazy, iPhone X mad

A great list of reactions, whimsical ideas, and resources to use when beginning to design and develop for the iPhone X.


How to View and Edit CSS in Chrome Developer Tools

If this had come out sooner it would have been a great fit for last week’s developer tools edition, but regardless if you aren’t already familiar with how to interact with CSS within the developer tools this is a MUST READ.


On React and Wordpress

Automatic (the parent company behind Wordpress) abandons React for Wordpress related applications due to the React patents clause. Worth reading.


BABEL - Planning for 7.0

Babel has more or less singlehandedly re-enabled rapid innovation the JavaScript language, as it allows developers to use new JavaScript features ahead of browser support. They’re pushing forward towards a 7.0 release - check out what’s in the plan!


Happy Friday!

That's it for this week's Friday Frontend newsletter. If you enjoyed this, be sure to sign up to get these newsletters straight to your inbox every Friday!