My side-project recently reached ten thousand stars on Github. To be honest, the stars don’t really matter, but the lessons I learned do. In this post, I’m going to share four of the most important lessons I learned.

In 2017 I started a new project with a single goal: learn unit testing. Since then a lot of things happened with react-content-loader (a React skeleton package) and it reached a status that I could have never imagined. It had countless contributions, suggestions and discussions, and most of all I had the opportunity to interact with many awesome developers around the world.

Along that, the open-source community — especially the React one — taught me a couple of lessons that I’d like to share for present or future project maintainers.

Continue reading in my personal blog.

Template of a complete blog from scratch using React and Gatsby with pagination, categories, featured post, author, SEO and navigation.

Photo by Frederico Jesus

Original content moved to Significa’s blog.

How the Atomic Design methodology allowed me to create a great design system from scratch and made me a better developer, with principles of componentization, hierarchies, and reuses of code.

See the original content on my personal website.

I have recently had the opportunity to work on a new product from scratch made to React and PWA with the well-crafted and componentized UI at Cheesecake. However, when we discussed with the whole team the best way to approach the development, we ended up having the same old problems that have happened in most past projects, such as:

  • Lack of Styleguide…

Depending on your journey as a designer, you may be used to the freedom that graphic media allows: to create overlaps/overlays or to elaborate compositions and grids that fill all the paper with pretty organized photos and texts. However, why is it so hard to build a web page with this same freedom? Fortunately the capacity to build these layouts have been improving and what’s best: it is so simple that you can start using it right now!

How the web layout works

All the options mentioned above make sense when applied on static medias where all copies will be the same, for example, books and magazines. But on the web things usually work differently: there are infinite device sizes, pages need to load quickly, while being accessible for screen readers and you need the developer’s ability to build everything that was drawn in Sketch or Photoshop, using the minimum possible amount of code so it can be reusable as much as possible.

Having this structure in mind, it is easy to mentally picture the largely-adopted 12/16-column grid in order to build responsive…

Danilo Woznica

Brazilian frontend developer based in Porto, Portugal. Design-driven developer focused on crafting meaningful products.

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store