Meet useful Visual Studio Code extensions for web developers: little helpers to minimize slow-downs and frustrations, and boost developer’s workflow along the way. Recently, we’ve also covered CSS auditing tools, CSS generators and accessible front-end components — you might find them useful, too. In this post, we look into useful VS Code extensions for front-end development, from fine productivity boosters to advanced debugging helpers.
Read more…
While web builders have been around for a long time, it wasn’t until recently that they became practical for professional use. Closing the gap between design and code has become the north star for many companies and we are seeing a wave of tools that deliver on this promise. One such product is Editor X, which we’ll review in this article.
Read more…
Discover which SVG patterns we should avoid and which patterns are the most inclusive when comparing different combinations of OSs, browsers, and screen readers. Carie will also be running an online workshop on Accessible Front-End Patterns all around front-end accessibility.
Read more…
Mistakes. These cruel villains do not even stop at the beautiful world of software development. But although we cannot avoid making mistakes, we can learn to undo them! In this article, Tobias Günther will show you the right tools for your daily work with Git. You might want to check the first article of the series as well.
Read more…
Web fonts are often terrible for web performance and none of the font loading strategies are particularly effective to address that. If you want to use web fonts your choices are basically Flash of Invisible Text (aka FOIT) or Flash of Unstyled Text (FOUT). Neither option has really “won out” because neither is really satisfactory, to be honest. Upcoming font options may finally deliver on the promise of making it easier to align fallback fonts to the final fonts.
Read more…
CSS Container queries bring media queries closer to the target elements themselves and enables them to adapt to virtually any given container or layout. In this article, Adrian Bece is going to cover CSS container query basics and how to use them today with progressive enhancement or polyfills.
Read more…
In this article, Shalabh Vyas will show you how to build a WYSIWYG/Rich-Text Editor that supports rich text, images, links and some nuanced features from word processing apps. We will use SlateJS to build the shell of the editor and then add a toolbar and custom configurations. The code for the application is available on GitHub for reference.
Read more…
Our workshops bring in knowledgeable, kind folks from the community to explore real-life solutions to real-life problems, live, with you. Front-end and design are remarkably complex these days. That’s why we invite kind, smart folks from the community to run online workshops for all of us to learn together. And we have new ones coming up, and we’d like to kindly welcome you to join in.
Read more…
At the moment of adding authentication and authorization to our web applications, there are some things that we should evaluate, e.g. whether we need to create our own security platform or whether we can rely on an existing third-party service. Let’s see how we can implement authentication and authorization in Next.js apps, with Auth0.
Read more…
With such a complex multi-level navigation, showing the breadth of options requires quite a bit of space. Think of large eCommerce retailers and large corporate sites, catering to many audiences and having plenty of entry points. Do we need mega-dropdown hover menus in 2021? Probably not. Let’s explore things to keep in mind when designing and building a mega-dropdown, alternatives to hover menus and fine details for designing a better UX.
Read more…