Every month, we present an overview of things the Smashing team has been working on — all in one place. We organized Smashing Meets on three days — events that were open to everyone in the web community. With sessions on performance, CSS, GraphQL, and creative courage, we made sure to leave plenty of time for Q&A, networking, competitions and prizes. The past few weeks have been quite challenging: COVID-19 crisis, #BlackLivesMatter, and so many other ongoing issues taking place all over the world. Here’s what’s been happening on our end in the meantime.
Read more…
A desk is an essential piece of equipment for a web designer. Without it, you’d end up working from wobbly tables at cafes or staring down at your lap all day — uncomfortable options, to say the least. Then again, your desk could also cause you discomfort if you sit in it the wrong way or for too long. Rather than feeling like your desk is a torture device, Suzanne Scacca shares some pointers for enjoying the time you spend there.
Read more…
Skeleton screens offer a better user experience by reducing loading-time frustration. By focusing on progress instead of wait times, it create the illusion for users that information will be incrementally displayed on the screen. In this tutorial, Blessing Krofegha will show you what a skeleton screen UI is and some types of skeleton screen libraries, along with their pros and cons. We’ll build a YouTube-like skeleton screen UI using React Loading Skeleton. Then, you can experiment on your own with the skeleton screen React package of your choice.
Read more…
React provides a few built-in Hooks like useState. You can also create your own Hooks to reuse stateful behavior between different components. The example below shows a counter whose state is managed using the useState() hook. Each time you click on the button, we make use of setCount() to update the value of count by 1. In this article, Adeneye David Abiodun covers the rules of React Hooks and how to effectively start using them in your projects. Please note that in order to follow this article in detail, you will need to know how to use React Hooks.
Read more…
In this article, Chidi Orji will create a set of API endpoints using Express from scratch in ES6 syntax, and cover some development best practices. Find out how all the pieces work together as you create a small project using Continuous Integration and Test-Driven Development before deploying to Heroku.
Read more…
You don’t need to know your trees from your dangling blobs. If you use Git every day and feel like it’s a juggling act, then here are some tricks and tips to help make your life a bit easier. There’s been a lot written about getting started with git, understanding how git works under the hood or techniques for better branching strategies. In this article, Shane Hudson will specifically target the stuff that just makes your life better in a small way.
Read more…
Making your tables sortable in React might sound like a daunting task, but it doesn’t have to be too difficult. In this article, Kristofer Giltvedt Selbbekk is going to show you how to implement all you need to sort out all of your table sorting needs. By the end of this tutorial, you will have found a way to model your state, wrote a generic sorting function, and wrote a way to update what our sorting preferences are. After making sure everything is performant and refactored you will provide a way to indicate the sort order to the user.
Read more…
Development workflows can easily get out of hand and start causing confusion and friction within teams — especially as they get bigger in size. There have been too many times when our code review was just about noticing that missing comma or the failing tests that never run before pushing to a remote repository. Thankfully, there are tools that can take this friction away, make developers’ workflows more straightforward and help us concentrate on the things that actually matter the most. Thanks to git and the hooks it provides, we have a great variety of automation with which we can set our development workflow and make our lives easier.
Read more…
Arguably the worst way to teach the fundamentals of programming, is to describe what something is, without mention of how or when to use it. In this article, Ryan M. Kay discusses three core concepts in OOP in the least ambiguous terms so that you may never again wonder when to use inheritance, interfaces, or abstract classes. Code examples provided are in Java with some references to Android, but only basic knowledge of Java is required to follow along.
Read more…
In JavaScript, the Number type cannot safely represent integer values larger than 253. This limitation has forced developers to use inefficient workarounds and third-party libraries. BigInt is a new data type intended to fix that. In this article, Faraz Kelhini will take a good look at BigInt and see how it can help overcome the limitations of the Number type in JavaScript.
Read more…
