Preventing a user from accessing some parts of an application is a common use case on the Web. With React and the SPA (Single Page Application) pattern, you have to deal with it twice: from the API side and from the frontend side. We’ll focus on the frontend part in this article.

There are two ways for a user to access a view: through a link or directly by entering a URL in the browser. Let’s see how we can handle both cases properly.

Prevent a link from being rendered

The first way that comes to mind when you want to prevent part of your component…

Motivation 🤓

At MeilleursAgents, we use a lot of maps to display real estate prices and market activity in a meaningful way for our users. We first used Google Maps and then decided to move to Mapbox because of the sudden price increase last May, making an opportunity from necessity.

After a quick search, we tried the Uber Mapbox GL React wrapper but found some strange behaviors with map controls and fullscreen display with our markers and layers. So we decided to develop a library from scratch, having an open-source release in mind.

Features 🚀

In our previous article, we have seen how to automate basics actions with a simple hook. We’re now diving into a more complex use-case of hooks: the pre-commit we use at MeilleursAgents

Goal

JavaScript in 2018 is a set of frameworks, tools and best practices. It can be hard to remember each rules on a daily basis. For example, we use yarn for our dependencies, prettier in conjonction of eslint for JavaScript code style.

All these tools rely on configuration files or have an option that can directly modify files. …

At MeilleursAgents, we follow the GitFlow principles to create “features” or “fixes” branches. We also have a set of guidelines for using git in a frictionless way, and one of them is to prepend every commit message with the JIRA's identifier, in the form of [PROJECT]-[NUMBER].

In order to fullfil this guideline in a seamless manner, we wrote a prepare-commit-msg that handles it automagically if the branch's name respects a given pattern.

#!/usr/bin/env bashBRANCH_NAME=`git symbolic-ref --short HEAD`if [[ -n "${BRANCH_NAME}" && "${BRANCH_NAME}" =~ (features|fixes)/([A-Z]+[-_][0-9A-Z]+) ]]; then PREFIX="${BASH_REMATCH[${#BASH_REMATCH[@]}-1]}"
 if [[ ! `cat ${1}` =~ ^${PREFIX} ]]; then…

If you’re not a vim user, you work mostly with a local version of your code. And sometimes, you can’t run your project locally (large and/or confidential data, os-specific binary, security concerns, etc.). In this case, you have to synchronize your local folder to a remote one.

TL; DR

Add this gist to your .bashrc

Let’s start by writing a simple loop that handles git diff entries.

The main advantage of this solution is that it natively respects .gitignore configuration and you synchronize only your code modification, not the noise around. …