July 29, 2020 — Ever tried interacting with a GraphQL server in a client-side application and felt like giving up even before getting anywhere? Ever declined an invitation to join a code base that requires working with GraphQL API because you had no idea? Ever felt like the only front-end engineer who hasn’t learned how to consume GraphQL APIs? If you answered yes to any of these questions, then this tutorial is for you. We’ll be taking a closer look at a few basics of GraphQL and Apollo Client, as well as how to work with both of them. By the end, we’ll have built a pet shop app that uses Apollo Client. Then, you can go on to build your next project. Read more…

July 28, 2020 — Emmett McBain was a Black American graphic designer whose work had a remarkable impact on the representation of Black Americans in advertising. He co-founded what became the biggest Black-owned agency in the USA. McBain designed almost 75 record covers by the time he was 24, and in the penultimate of his Inspired Design Decisions series, Andy Clarke will explain how his work can inspire what we design for the web. Read more…

July 28, 2020 — We’re asking if modern best practices are bad for the web? Are modern frameworks taking us down the wrong path? Drew McLellan speaks to Lean Web expert Chris Ferdinandi to find out. Read more…

July 27, 2020 — With Angular Material and ng2-charts, you can take advantage of schematics to cut down the effort and time you may spend building a dashboard. Schematics in Angular 9 are code generators that can create components and patterns in projects using predetermined templates and layouts. In this article, Zara Cooper explains how to take advantage of schematics in Angular Material and ng2-charts to substantially reduce the time and work that goes into building a dashboard. Read more…

July 24, 2020 — This tutorial is for illustrators who also happen to be passionate car enthusiasts. If you follow along, you will learn how to draw from scratch in Sketch the legendary Porsche 911 — all in vectors. Read more…

July 23, 2020 — Styled components are “visual primitives for components”, and their goal is to give us a flexible way to style components. The result is a tight coupling between components and their styles. While the component-driven approach has ushered in a new frontier in the way we build web applications, it isn’t without its imperfections — one being its usability and scalability with CSS. This has given birth to a new way to construct and manage our styles in a component-specific manner, otherwise knows as CSS-in-JS. Read more…

July 22, 2020 — Which aspects should we take into consideration when designing and developing for reading? How can we create accessible, comfortable, inclusive experiences for all readers, including the most challenged and those affected by dyslexia? In this article, Edoardo Cavazza will cover how we can improve websites legibility using some modern CSS techniques, great new technologies like variable fonts and putting into practise what we learned from doing scientific researches. Read more…

July 21, 2020 — Electron is an open-source software framework developed and maintained by GitHub. It allows for the development of desktop GUI applications using web technologies. In this tutorial, Timi Omoyeni explains what you need to keep in mind when building a desktop application with Vue.js using the Vue CLI Plugin Electron Builder. Read more…

July 21, 2020 — The most efficient way to build accessible websites and apps is to “shift left” by incorporating accessibility testing into the earliest stages of your development and design process. In this article, Harris Schneiderman will walk you through the process of analyzing a wireframe from an accessibility perspective and making coding decisions to optimize for accessibility in both design and development phases. Read more…

July 20, 2020 — In this article, Kelvin Omereshone is going to be looking at how to use Chakra UI and NuxtJS in building accessible front-end applications. In order to follow along, you should be familiar with using the progressive front-end framework Vue.js with Nuxt. If not, see the Vue.js and NuxtJS docs to get started. In order to make the web more accessible, there are a couple of best practices and standards that you will have to implement in your applications. Learning to implement these standards can seem like a daunting task when you factor in project deadlines and other constraints that you have to work with as a developer. Read more…