Labas vakaras Smashing Friends,
Let’s talk JavaScript! With React 19, Next.js 14 and Node.js 21, the world of JavaScript seems to be ever evolving, spinning faster and changing rapidly. In this newsletter, we take a look at some of the useful things to keep in mind if you spend most of your time in JavaScript.
If you’d like to deep-dive into front-end, you can take a look at Addy’s wonderful new Developer Experience Book (free book), recently published Success at Scale, or React Field Guide. And if you are all into Next.js, there is a free Learn Next.js course as well. Now, this should have you covered for a while!
Meet SmashingConf NYC 2024 (Oct 7–10), a friendly conference all around front-end and UX.
And, of course, if you’d like to dive deeper into JavaScript and web performance, we have SmashingConf New York 2024 🇺🇸 — Front-End & UX, Oct 7–10, a wonderful lil’ conference — with friendly bundle tickets for friendly teams!
In the meantime, let’s explore a few helpful goodies for front-end engineers! 🎉🥳
— Vitaly
1. Front-End Developer/Engineer Handbook 2024
What’s the front-end landscape like these days? What are common job titles and areas of focus for front-end engineers? The Front End Developer/Engineer Handbook 2024 explores these and many other questions in a comprehensive guide written by Cody Lindley and published by Front-End Masters.
The guide explores frontend-related job titles and resources for learning, education, and training, as well as foundational aspects, core competencies and tooling. A handy reference to keep close when exploring and explaining what front-end engineering is all about. One for the bookmarks! (vf)
2. Interactive JavaScript Cheatsheet
A good cheatsheet can be worth gold. If you are looking for a JavaScript cheatsheet to help you master your daily coding challenges while getting a better understanding of the JavaScript language, the interactive JS CheatSheet is for you.
The JS CheatSheet contains useful code examples for anything from the very basics of the JavaScript syntax to working with loops and variables to using data types, strings, events, and more. The code examples all come with comments (you can switch them on and off with just a click) which makes the cheatsheet particularly helpful for anyone who’s just getting started with JavaScript. One for the bookmarks. (cm)
From our sponsor
Stop Coding Forms With Fully-Integrated Drag-and-Drop Form Builder
SurveyJS is a product suite of open-source JavaScript client-side components designed to simplify the creation of a full-cycle form management system fully integrated in your IT infrastructure.
The libraries utilize JSON objects for form metadata and results, and seamlessly integrate with any backend system. The JSON form builder component offers a user-friendly drag-and-drop interface, GUI for form branching, and an integrated CSS theme editor for customizing form design.
Check the free full-featured demo to explore its capabilities firsthand.
3. Upgrading jQuery
Since its introduction in 2006, jQuery has played a major role in the evolution of web standards and browser capabilities. And while developers often turn to modern JavaScript frameworks instead of jQuery these days, jQuery is still in use on 90% of all websites, as the OpenJS Foundation estimates. However, about a third of those websites use an outdated jQuery version. Let’s change that!
Timmy Willison wrote a practical guide to safely upgrading jQuery. It dives deeper into how upgrading jQuery improves the security of your application and walks you through the upgrading process step-by-step. A great reminder to keep your codebase up to date to address security vulnerabilities and maintain the performance and compatibility of your web application. (cm)
4. Upcoming Workshops and Conferences
That’s right! We run online workshops on frontend and design, be it accessibility, performance, or design patterns. In fact, we have a couple of workshops coming up soon, and we thought that, you know, you might want to join in as well.
With online workshops, we aim to give you the same experience and access to experts as in an in-person workshop from wherever you are.
As always, here’s a quick overview:
5. File System APIs
Let’s say you are developing a feature that can save directories of files to the user’s file system. With the right API, it should be an easy challenge to solve, right? But which one is the right “File System API”? If you search for “File System API,” you’ll get many results, all with similar names.
Scott Vandehey was in the same situation recently and decided to get to the bottom of the many confusing file system APIs. As he found out, the different APIs build on each other, adding different layers of functionality — from simply adding the ability to read a file to reading directories and prompting the user for access to their file system. Scott summarized his findings in a blog post to help developers make an informed decision on which API to use. (cm)
From our sponsor
Learn The Story Structure That Made Toy Story A Success At Sanity Connect
Matthew Luhn, creative force behind Toy Story, Finding Nemo, and more, joins Sanity Connect. He’ll share tips on telling compelling stories in the AI age, so you can scale content while preserving your brand’s unique voice. Join us and get a chance to win Matthew’s book “The Best Story Wins”.
6. A Look Into The Future: Invokers
HTML is for meaning, CSS is for presentation, and JavaScript is for interaction. So the theory. In reality, things often aren’t that clear. In particular, a seemingly mundane task like adding basic interactivity can turn out to be much harder than it should be. With invokers on the horizon, this could soon be a problem of the past. Robin Rendle wrote a comprehensive blog post in which he explains why he already loves invokers today and why you should, too.
A proposal from Open UI, invokers extend HTML in a smart way. For example, they allow simple things like pausing and playing a video without the need for boilerplate code. You can write custom behavior to make your own actions for invokers, but they also come with smart default behaviors. Exciting times! Fingers crossed that it won’t take too long until invokers will finally make it into browsers. (cm)
7. A TC39 Proposal For Signals
What does the future of JavaScript look like? A promising initiative to move JavaScript — and the web — forward comes from Rob Eisenberg, Daniel Ehrenberg, and a team of dedicated minds: a potential standard for signals. What started out as an idea in August last year is now publicly available as a v0 draft of a proposal, along with a spec-compliant polyfill.
As Rob points out in the proposal, complicated user interfaces commonly involve more than just managing simple values for different application states. The goal of the signals standard is to provide infrastructure for managing such application state so that developers can focus on business logic rather than repetitive details. Signals can also be useful in non-UI contexts — to avoid unnecessary rebuilds in build systems or to remove the need to manage updating in applications in reactive programming, for example. If you want to learn more about signals, the current state of the proposal, and how to get involved, be sure to check out Rob’s post on Medium. (cm)
From our sponsor
Zeplin Is Where Teams Go To Unite Design And Development 🤝
Doing developer handoff in your design tool might consolidate one workflow, but your team pays for it elsewhere — with file bloat, rework, and losing critical details across modes and pages. Zeplin is an equal, dedicated space for the entire team to align on the build, faster. Try it for free.
8. News From The Smashing Library 📚
Promoting best practices and providing you with practical tips to master your daily coding and design challenges has always been at the core of everything we do at Smashing.
In the past few years, we were very lucky to have worked together with some talented, caring people from the web community to publish their wealth of experience as printed books. Have you checked them out already?
It’s here, and it’s shipping! Success At Scale, a new book by Addy Osmani. Get the book or browse the complete library.
9. Recent Smashing Articles
That’s All, Folks!
Thank you so much for reading and for your support in helping us keep the web dev and design community strong with our newsletter. See you next time!
This newsletter issue was written and edited by Cosima Mielke (cm), Vitaly Friedman (vf) and Iris Lješnjanin (il).
Sent to truly smashing readers via Mailchimp.
We sincerely appreciate your kind support. You rock.
Follow us on Twitter • Join us on Facebook