Semantic HTML- Grouping Things

In web development, it’s important to use semantic HTML elements to structure the content on web pages. Semantic HTML elements provide a way to ...

Conventional Commits

This document/workshop/tutorial was created to standardize and structure the commits made by our team. Doing so helps us maintain a cleaner and ...

The future of open-source artificial intelligences. Let's talk about Open Assistant

Artificial intelligence is one of the hottest topics of the year. Although millions of users already utilize the most famous and popular ones, t...

Software testing and the scientific method

An algorithm without a proof is not a theorem, it’s just a conjecture. In order to prove it, we have to resort to formal methods. As Boiten expl...

Creating Dynamic Data Visualizations with OpenAI's GPT-3 and React

For the past few years, I’ve been mainly developing solutions related to data visualization. When the latest OpenAI GPT model was released a few...

How to create a User Research plan

User research is an essential part of UX design. What all user research has in common is that it helps place people at the center of your design...

Create and host your first web app with Python and Flask - Part 2

Hello again, world! We are going to continue building the web app from the previous post. This time, we will be talking about templates, HTML a...

Create and host your first web app with Python and Flask - Part 1

​ Disclaimer: this tutorial assumes you have a basic knowledge of Python.

​ Have you ever wondered how to build an app to put t...

Design tokens: ABC

Design tokens are digital representations of design elements that can be used to create a consistent and cohesive visual style across a variety ...

UX/UI: What to do when you start with a new client

​ I’m starting on a new project, now what? 😅

If this is your first time joining a project or maybe not your first, but you don’t yet hav...

Semantic HTML- Document Sections

​ Semantic HTML makes it clear to the browser what the meaning of a document and its content is. It is important to use semantic elements to con...

7 common misconceptions about design systems

Design systems have been all the rage in the last years. Nowadays, Digital Products are being developed at fast pace and Product design has beco...

Leniolabs - When we get on board

Currently, in the systems environment, everything moves quickly. Those of us who work and collaborate in a company might have the perception tha...

Communities sharing knowledge - Metadocencia

Metadocencia is a beautiful community that we admire and to whom we are very grateful because they share all their content in an open way, willi...

7 reasons why you should have a Design System

Depending on your own work experience, the chances are that you have participated in many projects where you had to either design, develop, or c...

Top 5 Design Systems to learn from, use and re-use

At Leniolabs, we enjoy working and learning about Design Systems and we have collaborated with many clients in order to bring their DS projects ...

A generic and reusable redux state selector

In this post I want to share with all of you something I consider very important and that I’ve noticed in lots of code repositories regarding th...

Meet GraphQL from client-side

As you may know, the frontend often needs to get information to show, to update, to persist, etc. This is usually done through a layer called AP...

A walk through the Saga

The idea for this post is to show you Redux-Saga behind the scenes. Once you finish this post, you’ll have a complete understanding about the li...

Generators? Sure, let’s talk about them!

Have you seen a generator before? If not, I suggest you to really focus on this post. Generators are a really helpful feature in Javascript. The...

Building an SVG virtual stand

Nerdearla is an annual conference with talks and workshops about technology and science here in Buenos Aires.<...

How to Add a Double Border to SVG Shapes

Let’s say someone asks you to add a double border to some random geometric SVG shapes. For some reason, you can’t use any graph...

Git it done right

Many developers think git is just push, pull & merge, It’s more than just that! Here you’ll learn about undoing changes, rewriting history, ...

Building a bootcamp experience

One year after starting the Leniolabs_ bootcamp project, with everything learned along the way, I would like to tell you how the experience was ...

RESTGIS - New free tool to get geographical information for any place in the world

For the past two years, we’ve been working on the field of data visualization, and a considerable percentage of the viz world consists of maps: ...

Rust ❤️ Webassembly

There is a way to take the web to the next level using webAssembly. Being able to compile rust code into webAssembly is good practice to achieve...

Layoutit Grid v2

We are happy to announce the v2 release of grid.layoutit.com!
We have been working these past mont...

Build and Deploy a Web Application With React and Node.js + Express

To go through the steps of connecting and running together a Node.js server with a React application, we will build a simple web application to ...

Inversion of Control

Alfonso Concha talks about the inversion of control design pattern which is a way to give more flexibi...

Build trust to achieve results

Quoting Patrick Lencioni, "not finance, not strategy, not technology, it is teamwork that remains the ultimate competitive advantage, both becau...

Ref History Adventures - Part 3: Mark Raw Optimization

In this post, first published in patak.dev, @pat...

Management 3.0 - Feedback

Management 3.0 is a set of practices, games and tools intended to develop skills to help workers help in driving and shaping organizations. It i...

Ref History Adventures - Part 2: History and Persistence

In this post, first published in patak.dev, @p...

Demystifying Maps in React

In this talk, JC will try to demystify the creation of maps in React.
He will be live codin...

5 Common Pitfalls when building your React Enterprise Application

In these past years I have experienced a big shift in my career, as I transitioned from a developer writing code for startups to a managerial/ar...

Negotiation

We all negotiate on a daily basis. Maybe you ask for a change in a due date, you request a raise from your boss, one of your team members wants ...

Ref History Adventures - Part 1: Ignorable Watch

Releasing Layoutit Grid as open source has been tr...

Get Dockerized

Docker is one of the most powerful tools in DevOps by introducing the container concept as opposed to virtualizations. However, its use can also...

5 keys of Nearshoring success

When a company is planning to outsource part of its development workload, two options immediately come to mind: contracting a local organization...

DIY SVG Icons: Building your own efficient set with Basic Shapes

There are different ways to work with icons, but the best solution always includes SVG, either inline or linked up as a file. Sometimes the icon...

Open sourcing Layoutit Grid

Interactive CSS Grid generator powered by Vue 3

We started this project just three years ago, and it is now at the top ...

How to be the best teammate!

Is it about being smart? Is it about finishing your tasks in time? Or maybe it is just about reading people’s mind? Let’s see if this can clear ...

Quickly growing frontend teams with nearshoring

Traditional software development offshoring provides huge cost-reduction benefits; however, it has demonstrated to slow do...

Growing SVG Peppers

Using React and SVG together gives you a lot of power to easily express charts, graphics, and animations. Being able to explode complex designs ...

What is a SPIKE?

If you google “What is a Spike”, you will find the following definitions:

“A thin, pointed piece of metal, wood, or another rigid ma...

Docker part 2: Swarm and Docker Stack

In the previous post we learned about Docker’s basic concepts, how to use it,...

What is React Query?

React-Query is a library that allows you to make requests and handle response metadata. To make a query, define a unique key an...

My Leniolabs, recharged

We went over all the new features of our internal product MyLenio, to show our team how the company is run using this tool.

MyLenio is t...

Accessibility tools and tips for Designers

So you want to include accessibility in your design work-flow? Let’s explore how.

Accessibility Tools Series

Docker: definitions, example and Docker Compose

In the last few years, Docker has become very relevant in the app development and deployment world. If you still don’t know wha...

Svelte Reacts

What is reactive programming, and how React isn’t that reactive. Svelte is a new promising UI Framework option that focuses on performance, it d...

Going beyond automatic SVG compression with <use>

If you draw your own SVG files or if you download them from the internet, tools like these online SVG editors can compress your graphics in only...

Houdini

CSS will finally be extendable, with new tools to create and play with new syntax in the same way as we do with polyfills in Javascript. There w...

Accessibility tools for Developers & QAs

In this 2 part series, I’ll review Tools that can help us improve Accessibility in our projects.

Accessibility Tools...

How to use and reuse everything in SVG… even animations

If you are familiar with SVG and CSS animations and starting to work with them often, here are some ideas you might want to keep in mind before ...

Inter Meetup review

For those who don’t know what a Meetup is, they are sessions, supported in some cases by a platform, to share and promote information, knowledge...

Work from home

Many people may think that working from home just means not having to commute or staying in their pjs all day. However, there are a myriad of th...

SVG + CSS animations

SVG has been around since the late ’90s, but it was ignored by many until 2017 when it came back in full swing. This graphics file format fulfil...

Hygen: D.R.Y. the smart way!

_Hey Yuri, what is Hygen?

I hear you asking. Worry not for I have the answers you seek and more! Hygen is a CLI Tool, or going ...

Sprint Retrospectives - Don't look back in anger

If you have worked in an agile project most likely you have been in a retrospective meeting.

We all know that in these meetings we are s...

Contact form with animated feedback

Animations are the best way to bring life to our websites: they help us tell stories and communicate what is happening at that moment. They natu...

Layoutit! CSS Grid ♥️

CSS Grid is a game changer for the web, we can finally do proper layout for our web apps and media content. To help devs embrace it, we created...

How to handle click on rotated containers

First let’s capture user’s click to move a square on a non-rotated container. For this we’ll build a very basic vanilla JavaScript app which con...

Styled Components - Style your apps without stress

Styled-components library is one of the new ways to write and use CSS in modern JavaScript. “CSS-in-JS” lets you have all your code in just one ...

Mind the gap

All of those who had the chance to visit London and take the tube, aka subway, will remember the voice on the PAs warning users to be careful wi...

Slack Training - Building up our working space

Slack is our main communication hub. We use it to tie together our distant offices and homes in a unified working experience. This video explore...

Nerding out at Nerdear.la 2019!

Nerdear.la is the so called “event for nerds from nerds”: it is a place where IT professionals, college grads, and students mee...

Agiles 2019 in first person

Ágiles is the largest Latin-American community that works on not only knowledge but also experience sharing pertaining to agile methodologies. I...

Gamification! lets p̶l̶a̶y̶ work!

Imagine walking into your boss’ office and saying: “What if we buy a game for the business?”; and then your boss looks up at you and says: y...

Blazing fast code with Emmet

Emmet is a powerful plugin for web developers that can be used in many text editors, and allows us to type abbre...

How to use async/await in React props

Given two react components Parent and Child, we want to find a way to communicate from the child to the parent and viceversa. First one is prett...

IE debugging with Virtual Machines and VPN

This guide has all the links and steps necessary to install and configure a Virtual Machine to debug with Internet Explorer (from 8 to 11), usin...

Essential roles of a leadership position

For many of us developers, the team leader is a role filled with an air of mystery: we all know that you need to have a lot of experience to bec...

HTML Form Secrets

Whether you are a developer or designer, you’re used to working with HTML, CSS and JS to code the look and feel of websites and apps. You usuall...

Why do we need Kubernetes?

Kubernetes (k8s) is an open-source system for automating deployment, scaling, and management of containerized applications, but before you start...

Story points in 3 minutes

Not always used and understood by the whole team, story points are a great way to quickly determine the complexity of a task along its entire li...

Mapshaper - A must have when working with geo-based datasets

We were working with Mapbox GL and our app required to have a polygon for every postal code in the US. Of course, we were having performance iss...

Leniolabs_ en la MWC 2019

Del 24 al 28 de Febrero, se celebró en Barcelona el MWC 2019 (Mobile World Congress) donde Leniolabs_ particip...

Identifying risks in our software development projects

Risks are everywhere around us in our life and our brain has a way of determine whether we should react to it or not. Let’s see some examples: y...

Leniolabs_ at NodeConf Argentina

¡Participamos de la nodeconfar! Suena raro escrito todo junto, pero hablamos de la Node Conference en Argentina que se hizo en ...

From React components to React Native!

Many times, as developers we are working on a React website and suddenly the clients ask for a mobile version of the same App, thats when React ...

Running cron jobs on instances with Elastic Beanstalk

En nuestra migración de Docker Cloud a Elastic Beanstalk, nos encontramos con la necesidad de correr tareas de rake periódicamente en los ambien...

How to download a file from the server on React?

Good evening young adventurers, we all know the link tag of HTML, and some of us have faced the issue of needing to download a file directly fro...