Hope your week was amazing. I'm just wrapping up a 2 week trip and this email is coming to you straight from an airport hotel in between 2 solid day of travel. I hope you'll forgive me if I'm a link or two short, as I'm definitely a brain cell or two short at this point. :)
In honor of our sponsor, we've got several great links on React Hooks this week, as well as an article on the hook-inspired Vue functions API. There's also a few quick hit CSS articles and some great accessibility pieces. Enjoy!
Best,
KBall from ZenDev
P.S. This is posting on the web a few days late due to the aforementioned travel. Sorry! If you want to make absolutely sure you get it on time, sign up for the email newsletter! :)
CSS & SCSS
Can you nest @media and @support queries?
Yes. Ask a simple question, get a simple answer. But for more details, read this article. :)
Bringing CSS Grid to WordPress Layouts
For those in wordpress land, this is a really neat tool to make it easy to take advantage of CSS Grid, particularly within a Gutenberg blocks oriented site. Check out out!
New CSS Features in Firefox 68
While I don't normally highlight individual browser releases, I am SUPER excited about the arrival of the ::marker pseudo-element. Being able to directly target list bullets with CSS would have saved me SO much time in the past, and I expect it to save me a ton of time in the future.
JavaScript
Why React Hooks?
A great look through the way that React has evolved over time, and some of the reasons and thinking behind the most
How to sync props to state properly in React Hooks
A bite-sized React hooks tutorial, this one tackling the common problem of how to copy props to local state, and keep the local state updated from changes.
Vue.js 3: Future-Oriented Programming
A great look at how Vue's new function oriented API makes it easier to write future-proof and future-oriented code. Code that is easy to adapt to new locations. And of course, while this API is proposed for Vue 3, you don't have to wait around because someone has written a plugin so you can use it today. Because that's how we roll in the JS world. :)
Learn JavaScript Closures in 6 Minutes
Solid explainer of how closures work. Closures are one of the key concepts to understand as you level up your JavaScript skills, and I like the phrase the author uses to describe them: 'closures are stateful functions'. From there he does a great step by step to help you understand. Well done!
How to group an array of objects through a key using Array reduce in javascript
Another good fundamentals tutorial, this one on implementing an extremely common pattern (grouping by a key) using an Array reduce.
Promoted Link
Announcing two new courses from TylerMcGinnis.com - React and React Hooks
The original React course from TylerMcGinnis.com launched in 2016 and has since been taken by over 80K students with an avg rating of 4.8/5. Today, they’re excited to launch its successor. Built from the ground up, their new React and React Hooks courses will teach you everything you need to know about writing React in 2019.Learn React Hooks
Other Awesomeness
Truths about digital accessibility
A great article to help you get inside the mindset required for building accessible web sites and applications. Accessibility often gets bundled into a single category in a developer's head, but it is a multifaceted challenge and there are many ways that assistive devices are different from a developer's standard environment.
Unexpected accessibility tips
This is bloody brilliant. One of the biggest challenges in learning to develop accessible websites is that no matter how hard you try, it's hard to plan for an experience you have trouble empathising with. The above article tries address this by getting you into the mindset... but this one instead gives you a set of tests and activities you can do that will essentially simulate directly the challenges people can face. I love the idea of using a moobile device on the train to let you experience high levels of disruptions, holding a mobile device with straight arms to simulate mobility challenges, and reviewing sites on a projector to simulate color challenges. Wonderful!
Branching Out from the Great Divide
I think this is one of the mots important conversations happening right now in the front-end world. As the range of responsibilities and tools expected in the front-end continues to grow, how to do we organize and make sense of people with different skill sets who all identify as front-end developers? This doesn't present any big answers, but a solid way of thinking about it.
The Real Dark Web
A good an important reminder that as much as we all like to focus on the cutting edge, the vast majority of folks in the industry are not on that cutting edge. So don't let yourself get psyched out by it, just keep doing good work. The end goal is a working product, not the latest & greatest JS Framework + CSS Grid + CSS-in-JS + whatever else magic that we might all want to be trying.
Happy Friday!
That's it for this week's Friday Frontend newsletter. If you enjoyed this, you should probably follow me on Twitter or join my mailing list. Sign up to get these newsletters straight to your inbox every Friday! Sign up here: https://zendev.com/friday-frontend.html
Top comments (0)