Internationalization and localization is more than just writing your content in multiple languages. You need a strategy to determine what localization to send, and code to do it. You need to be able to support not just different languages, but different regions with the same language. Your UI needs to be responsive, not just to screen size, but to different languages and writing modes. Your content needs to be structured, down to the microcopy in your UI and the format of your dates, to be adaptable to any language you throw at it. Doing all of this with a static site generator, like Eleventy, can make it even harder, because you may not have a database, nonetheless a server. It can all be done, though, but it takes planning.
Read more…
Do you have a hard time throwing away mockups, logos and other content you’ve created for clients? The good news is that you don’t have to see rejected or unused designs as a sign of failure or waste. You can actually repurpose them and give them new life on other projects, for other customers, and even within your own business. I’ll explain four ways to do this in this post.
Read more…
In this episode of The Smashing Podcast, we’re talking about Eleventy. What is it and how does it fit into your Jamstack workflow? I spoke to David Darnes to find out.
Read more…
There is now a specification for native CSS masonry layout, as part of the Grid Layout spec. In this article, Rachel Andrew will explain the draft spec, with examples that you can try out in Firefox Nightly. While this is a feature you won’t be able to use in production right now, your feedback would be valuable to help make sure it serves the requirements that you have for this kind of layout. So let’s take a look.
Read more…
Give your desktop a makeover with this new collection of wallpapers. Designed by the community for the community, the wallpapers come in versions with and without a calendar for November 2020. Since so many beautiful and inspiring designs have seen the light of day as a part of this ongoing series, we browsed through our archives on the look for November goodies from the past. You’ll find a selection of almost-forgotten favorites compiled at the end of this post. Enjoy!
Read more…
We’re taught to communicate with words. We write essays, prepare speeches, and take written notes. But words aren’t always the best option for conveying information and ideas. Sometimes the best way to tell stories is through thoughtfully crafted visuals, not long paragraphs of text. Visual storytelling is the process of conveying ideas using things you can see. In this article, Elizabeth Lin will explore visual principles, highlight why visual storytelling is a valuable skill for everyone to learn, and demonstrate how you can improve your visual storytelling through play.
Read more…
With this guide, Ibrahima Ndaw will teach you the basics of Next.js API Routes. He will start by explaining what they are and why API Routes are useful compared to REST or GraphQL APIs. Then, he will guide you through a step by step tutorial on how to build your very first GraphQL server with Next.js and the Github API. If you want to extend your React or Next.js skills to the server-side and be able to build as well their first full-stack app with Next.js and GraphQL, this tutorial is for you!
Read more…
Many companies had to struggle in one way or another in the last couple of months. We had to get creative, and we had to rethink our conferences and workshops altogether. In this article, CEO and co-founder Vitaly Friedman shares how Smashing runs online workshops and online conferences these days, and the lessons learned along the way.
Read more…
Every web application that handles user-specific data needs to implement authentication. Knowing how to do this is important for Vue developers, and that’s what this article aims to shed the spotlight on. Today, Precious Ndubueze brings you a tutorial that will prove to be useful for beginner developers who want to learn about authentication in Vue. In order to be able to follow along, you’ll need to have a good knowledge of Vue and Vuex.
Read more…
Animations, when done right, are powerful. However, creating eye-catching animations with CSS can be tricky. In comes Framer Motion. With Framer Motion, you don’t need to be a CSS expert to make beautiful animations. Framer Motion provides us with production-ready animations and a low-level API we can interact with to integrate these animations into our applications.
Read more…