In this article, Cosima Mielke has collected tips, tricks, and tools To give you a head start into Flexbox and provide you with ideas on how to use it to master common coding challenges, that will help you get the most out of its power already today. Flexbox gives us a new kind of control over our layouts, making coding challenges that were hard or impossible to solve with CSS alone straightforward and intuitive. It provides us with the means to build grids that are flexible and aware of dynamic content. The list is by no means complete but includes the resources which we found helpful and useful.
Read more…
Was there a tool Steve Hickey could use to help people quickly model content in a platform-agnostic manner and simultaneously build an artifact that was ideal for communicating intent to a client or team? There are some great further features that can established by digging into the Jekyll docs in more detail, but what we have here are the basics of a good content modeling prototype: the ability to define different types of objects, the attributes attached to those objects, and IDs that allow us to call specific objects from anywhere. Best of all, the whole system is simple and human-readable, and outputs plain HTML for use elsewhere if necessary.
Read more…
What’s going on in the industry? What new techniques have emerged recently? Anselm Hannemann is collecting everything that popped up over the last week in his web development reading list so that you don’t miss out on anything. The result is a carefully curated list of articles and resources that are worth taking a closer look at.
Read more…
Developers are lazy by nature: adhering to the DRY principle, writing scripts to automate things we’d otherwise have to do by hand, making use of third-party libraries. The traditional approach to cross-browser testing doesn’t align well with these ideals. Either you make a half-hearted attempt at manual testing or you expend a lot of effort on doing it “properly”. Once you’ve put in the effort of knowing your enemy, you’re able to attack in three steps: reconnaissance, raid and clearance. In this article, Chris Ashton hopes to save you hours of wasted effort by describing a testing strategy which is not only less labour-intensive, but more effective at catching bugs.
Read more…
In this article, Rachel Andrew will look at the basics of HTTP2 as they apply to web designers and developers. She’ll explain some of the key features of the new protocol, look at browser and server compatibility, and detail the things you might need to think about as we see more adoption of HTTP2. You will get an overview of what to consider changing in your workflow in the short and long term. Rachel will also include plenty of resources if you want to dig further into the issues raised. Her aim is to give you enough of the background to be able to make good decisions as you plan your move to HTTP2.
Read more…
What’s going on in the industry? What new techniques have emerged recently? Anselm Hannemann is collecting everything that popped up over the last week in his web development reading list so that you don’t miss out on anything. The result is a carefully curated list of articles and resources that are worth taking a closer look at.
Read more…
In this article, James Miller and Mate Marschalko cover the basics of how to get started building for your own IoT devices using JavaScript. When building IoT devices, the task is typically divided between two roles: A hardware engineer creates the physical device, and a developer the ecosystem. However, this is not always necessary. In the case of JavaScript, its isomorphic nature allows for one language to be used across multiple platforms — including hardware. While the prospect of building your own hardware can be daunting, hopefully, after working through these two examples, you’ll be already thinking about the possibilities and planning your next project. Many components are compatible with the Johnny-Five library, meaning that the only limit is your imagination.
Read more…
Ideally, we’d love to have one tool that would either generate “smart enough” crops and plug in the responsive images markup in the build automatically, or provide one interface to visually adjust the focal point of images and output “ready-to-go” markup. We aren’t quite there yet, but we might be soon. In the meantime, the tools listed in this article could be good enough options to consider when tackling a quite daunting task of producing art-directed variants of images — either manually or by building custom CMS plugins.
Read more…
There have been some amazing quantum leaps in JavaScript tooling which have made it possible for you to dive head first into writing fully ES6 modules, without compromising on the essentials like testing, linting and (most importantly) the ability for others to easily consume what we write. In this article, Jim Cowart is going to focus on how to create a JavaScript package written in ES6 that’s usable in a site or app regardless of whether you’re using CommonJS, asynchronous module definition (AMD) or plain browser global modules.
Read more…
Service workers do a lot of different things; there are myriad ways to harness their powers. In this article, Lyza Danger Gardner explains what a service worker is and how to put together your own by registering, installing, and activating it without any hassle. She decided to build a simple service worker for her website that roughly mirrors the features (provide a customized offline fallback experience, make the website function offline, and increase online performance by reducing network requests for certain assets) that the obsolete Application Cache API used to provide.
Read more…