How to manage Webpack configurations

Configuring Webpack is quite easy but it may become more difficult if there are many environments and requirements. I’ve included Webpack in different projects recently and I would like to share with you an easy way to configure it. I’m sure there are many different ways to configure Webpack, maybe better, but I’m just going to compare two of them:

  • One file to rule them all
  • Extended configurations

Read More

Introduction to Node modules and ES Modules.

In one project I’m working on, we have migrated from a non-standard building tool to Webpack. This change has allow us to use a standard module system to import/export our code instead of the legacy builder we were using to just concatenate code.

Why is useful to use Javascript Modules?

Javascript modules are needed to maintain the principles of encapsulation and dependency.

As a project grows, it is useful to reuse pieces of software developed in isolation. When one of these pieces of software is brought into a project, a dependency between them is created. For example, many projects nowadays relay in some JS framework like Angular, ReactJS, VueJS or others. This concept is known as dependency.

When a dependency is created between these pieces of software it is of importance that no conflicts arise. This is known as encapsulation. Encapsulation is important because it isolates and guarantees that there won’t be any interference between different pieces of code.

Read More

How I secured my server with Fail2Ban.

The other day I received a lot of alerts from the service I use to monitor the uptime of my blogs, all of them were down without an apparent reason. My blogs are hosted in a virtual private server configured with just a basics configuration, a LAMP server running in Ubuntu, no Webmin, no PhpMyAdmin, just the basic stack. Basics are the best, but that’s a topic for another post.

No worries, I have a solution for these kind of situations…

Read More

My conclusions using Angular 2 for the first time

I’ve been working these days using Angular2 for the first time and this is what I have to say.

It hasn’t been easy to get used to Angular2 and I still don’t really know how some things are working. My rule of thumb: If it works, don’t touch it.Adrián Gómez

Before starting with this text, I have to say this opinion is totally personal and based in my own experience. Talking about my experience: I’ve been working with Angular 1 for more than three years. I started with Angular 1.2.3 and I’m currently using version 1.5.8 with these rules:

  • I use a Component based architecture and Components only deal with “scope”.
  • I only use Factory for services and they usually have all the business logic.
  • Directives just for small DOM things.
  • John Papa styleguide is a good ruleset to follow.

Read More

Put yourself on internet with Jekyll, GitHub and Cloudflare

Having a website on internet is a very powerful tool, you can create a tech blog, like mine, a site with your curriculum vitae, a portfolio, whatever you want. Being on internet increases your visibility and let other people know who you are, what do you do, or other information you consider important. But if you dedicate yourself to technology, computers, development and so on, you must have your space on internet. No excuses.

There are literally a lot of ways (platforms, CMS, etc.) to create your own site on internet: WordPress, Medium, Ghost… But today, I’m introducing you an static site generator named Jekyll.

Read More

Build a secure API with Auth0, ExpressJS and AngularJs

Many modern projects separate the backend from the frontend user interface. The bakend usually handles incoming requests and responses with some information in JSON or XML.

When you are working with an architecture like this, your API needs to be exposed in a secure way and here is where Auth0 will simplify your design.

In this post I’m going to explain how I have integrated a website made with AngularJS with an API using ExpressJS and secured with Auth0.

Read More

Solar system simplified (HTML + LESS)

Summer has arrived. I can’t forget those summer nights at my village when I was young, looking at a bright night sky with a lot of glittering stars.

The infinite of the sky made me small, leaving my mind at a point I thought about anything and everything at the same time, braindead, stunned, relaxed.

I looked at a whole sky without paying attention to any specific star, seeing satellites crossing the sky in a “perfect” straight line. I loved those nights as much as I loved the universe although I don’t know as much I’d like about it.

Read More

To bind nor not to bind

If you have read my previous article about chaining promises, you’ll know I love using small functions in “then” methods, but sometimes chaining is not that simple.

For example, when you have to execute in your “then” method a function receiving two parameters it is not possible… or it is?

In these cases you can use some alternatives as seen below:

  1. Using an anonymous function to chain our second promise
  2. Use “bind”  to pass the second parameter to our second function
  3. Wrap our second function into another function and chain this wrapper instead.

Read More

CSS gears project

Since a few weeks ago I wanted to design a gear using only CSS. I wanted to use these gears in a future project but after finishing them, I think this is not going to be as easy as I expected ?

As I have said, this is just a CSS gear, not Javascript, nothing else, just CSS and HTML (actually is Less). Every gear is composed of 3 parts:

  • The colored part of the gear
  • Four bars rotated every 45 degrees to build teeth
  • A smaller centered circle that simulates the hole of the gear.

Every gear is created using this less mixin and the HTML code below:

You can take a look to the final result below. Of course you are free to fork this code or use it wherever you want.

See the Pen CSS Gears by Adrián Gómez (@adgllorente) on CodePen.0

Avoid idling in Openshift with UptimeRobot

Yesterday I prepared a presentation for my coworkers comparing two PaaS services, Heroku and OpenShift, and now, an idea has come to my mind.

If this is the first time you’ve heard about a PaaS I would tell you that a PaaS is a platform that abstracts you from all infrastructure needs to host an application and also offers some extras like NodeJS, Python, MongoDB, MySQL, etc. If this explanation is not enough you can read what Tom’s IT wrote about it.

These services usually have free plans where applications are idling if they not receive a request in a period of time, for example:

  • Heroku: Idling on 30 minutes of inactivity (6 hours sleeping daily, so bad)
  • Openshift: Idling o 24 hours of inactivity (App never sleeps, so good)

Reading above, please migrate your services to Openshift because it has a 24 hours idling and not sleep time on its free plan.

If you want to avoid application idling but you don’t want to hear about paying, (I would recommend you to pay a plan or buy a cheaper host like OVH) you can try UptimeRobot.

Read More

Hi! I’m back


Welcome to my blog!

If you are here, you probably know me in person, but If you don’t, you should know that my name is Adrián, I’m currently working as a full stack JS developer at Telefónica I+D, I sometimes configure our CI system but I feel more comfortable developing in frontend.

I’ve decided to reopen my website and start writing about some topics I’m interested in. These topics will include some tech things, some dev tutorials, quotes from other places, music, science, offtopics, Internet… You know, “another tech lover blog”.

if you want to know more about me swipe me right have a look to my about page.