Design
Atomic Design
Since the early days of the web, we talk about what goes into creating a Web “page”. This term shows how our vision of the web was informed since the 90s: it came from an architecture that was structured as a series of documents, like if they were printed pages of an encyclopedia.
However, for several years now, the multitude of available platforms in the Web ecosystem continues to grow and to become more complex. From the computer to the smartphone, and without forgetting the television or even smart watches, it has become clear that the concept behind the design and structure of Web pages is now obsolete.
There is a new methodology of design available that can take this into account. It is called Atomic Design, and the term was coined by Brad Frost. Thus, instead of thinking about content in the form of a page, each design element is created starting with its smallest component element (such as a call to action) and builds up to create something much bigger. We start from the atom to create the molecules, and these molecules come together in order to create a coherent and modular Web organism.
As each atom is placed individually in a library, Atomic Design saves a lot of time and makes for a more coherent and simplified end result.
Web Development
Makefiles, or How to Avoid Reinventing the Wheel
By Samuel Sirois
After having taken a break from frontend Web application development, I’ve recently jumped back into the field through two projects that I am working on. It represents a great opportunity to revisit my preconceived notions and old work habits, through a codebase that already exists and that is up-to-date with the latest stylish tools to use, ready after a simple git clone
.
Wow, things do change quickly! (Even from the first line) From new versions of ECMAScript supported in modern Web clients – a panoply of pseudo-languages based on JavaScript – to the multitude of CSS pre-processors available… In addition to all these new automated build pipelines specifically created by and for JavaScript developers.
With all of these new shiny things, these automated build pipelines become essential to ensure that the minification, linking, compilation?!, of all of these files won’t cancel out the efficiency gains given by these tools which are now a necessity for the development of modern Web applications.
I still can’t keep myself from wondering if there hasn’t been a little bit of a lack of communication between those that have recently needed these complex tools in their projects (front-end developers) and those who have already faced these same requirements in the past and have discovered a solution (not the only one, mind you) to this problem, way back in the 70s!
I’ve never yet felt the need to use these new tools, as I already know Make, and having already been confronted with new, shiny, stylish solutions around the turn of the century, only to have taken some steps backward from something that already worked well. Indeed, I often insist on manually creating these Makefiles for projects I contribute to and I don’t hesitate to spend the time necessary to manage this tool.
Reinventing the wheel, i.e. to fall into the same traps and mistakes, or to really improve the situation? Here are a few interesting links to help you make your own opinions on the subject:
Contribution
From Contributions to Inno Hackfest
While evaluating the success of the afternoons we spend once per month on contributing to open source projects, we’ve decided to revise our formula a bit. Starting now, these afternoons will be held biweekly under the banner of “Hackfest”.
Our First Few Hackfests
While working in small groups (and never alone), our SFLians have had the opportunity to learn about new technologies, to contribute to projects that they love or even to work on some new “side projects”.
In and amongst these contributions we find: initiations to the world of virtual reality (VR) through the creation of a dominos simulator using Unity and Oculus Rift; a workshop on blockchain technology and the connection with a concrete case study using the Ring software’s username database; the creation of a proof-of-concept client for a document-oriented database.
Upgrade Review
The Drupal 8 migration report page, on which the modules that require migration are listed, was in sore need of a refresh in order to improve the user experience (UX). During our afternoon Hackfest, I wrote an initial patch that reuses certain design elements of the Drupal administration interface. Also, in adding just a few new descriptive icons, it is far easier to quickly find what requires our attention in this report.
Helpful Link: