DEV Community: Marc Philippe Beaujean

Use these 7 Tips to increase the Speed of your Site

Marc Philippe Beaujean — Sun, 26 Apr 2020 19:55:25 +0000

Page speed is important if you want to rank on google. I recently managed to do this:

In this article, I'll share how I managed to make my site fast and some of the things I noticed that slowed it down.

Bundling your Scripts to reduce their File Size

When scripts are sent across the web, they contain a lot of unnecessary bloat. Unlike humans, computers can read code even if its just a bunch of characters, so reducing any excess is going to help increase the speed of your page. There are many bundlers like webpack, which will automatically take your scripts and optimize the file size. Make sure you are using them!

Use Purge CSS

Purge CSS checks your entire code for unused selectors and removes them from your style sheet.

Prefer regular Stylesheets over Styling with JavaScript

One of the biggest surprises for me was the fact that removing styled components, a framework that made it possible to use CSS in React, significantly increased the speed of my site. I was not aware that there was actually so much client-side JavaScript being executed by styled components, given that I assumed it was compiling to CSS on the server. The JavaScript execution time was reduced by 1.3 seconds, which could easily be the difference between a medium or good lighthouse score.

Reduce the Size of your Images

Images are some of the biggest files that you send across the network. You want to have your images to be as low resolution as possible, without reducing the quality.

Avoid unnecessary Libraries

Often, I would throw a library or package at a problem I was having. I really advise against this, because you end up having to undo a lot of the implementation once you want to increase the page of your site and these excess libraries are increasing the overhead.

Render the Website on the Server instead of the Browser

When you are using a single page framework, the content of the site is built from within the browser via JavaScript. There are services, however, that allow you to render these JavaScript based websites into HTML documents on the server and send them to the client. When you are rendering the content on the server, you gain multiple benefits: your website is easier to read for web crawlers like those from google and your users browser no longer has to do the heavy lifting of building the content. This is significant, because it means that the user can see and interact with content much faster, which is one of the most significant metrics that make up your page speed score ("Time to Interactive" and "First Contentful/Meaningful Paint"). Personally, I use Gatsby to render and process the content, but there many other good ones.

Avoid iFrame Embeddings if possible

It can be tempting to include a social media iFrame widget, but these are going to slow down your site considerably. Although you took care of adjusting the size of all your images to fit your website, Facebook and Twitter are not, so be ready to take a speed hit when you embed their content.

Practical Introduction to Vectors for Game Development

Marc Philippe Beaujean — Sun, 05 Apr 2020 19:30:04 +0000

Want to make a cool game? Great! (un)Fortunately, a lot of interesting game mechanics are going to require a bit of maths. In this tutorial, I'll be showing you some of the most common operations that are used when working with vectors in game development, a mathematical unit that is integral to most types of games. Specifically, I will be covering what they are in a general sense and how some common operations can help you implement interesting mechanics for your game.

What is a Vector?

Its important to distinguish between vectors in traditional mathematics and in game engines, in this tutorial I will be discussing the practical parts for game development only. Vectors have a "length" or "magnitude" (you can find out how to calculate that here) that can be used to quantify the vectors total size.

In game development, vectors have two or three dimensions (depending on whether you are making a 2D or 3D game) and are generally used to represent geometrical properties of objects within the game world (rotation, position, etc.).

Vectors used to represent position, scale and rotation in the game engine Unity3D

I will be describing the following topics in the context of game development rather than theoretical maths, but many of the things discussed are obviously rooted there and studying both will give you a better foundation of understanding.

Vectors for Positioning

In game development, the most common use of a vector is for positioning. Say I am creating a 2D game, then a positional Vector (0, 0) might indicate that a given object is at the center of the game world. Now, lets say that I want to manipulate the vector by adding to its position. This works just as you would expect - here is an example where a vector (2, 3) is added to our current one (it works as expected for subtraction).

Displacement that occurs when adding a Vector (3,3) to a Vector (0, 0)

Operations like multiplication or division can only be performed on Vectors using scalars, single values that we apply to all dimensions of the vector. For example, we can take the value 2 as our scalar. We can then multiply a vector (3, 3) by our scalar to get a vector (6, 6). This can be really useful for positioning as well, especially when we combine it with directional vectors.

Vectors for Directions

Knowing the directions of objects can allow us to manipulate them in interesting ways. Vectors can also be used to indicate direction. A directional vector has one important property in game engines that distinguishes it from vectors used to represent other properties - it is always normalized. Normalized vectors have the property their length (or magnitude) is always equal to 1. The reason that this is desirable, is because we want to make sure that we have all our directional vectors standardized in some way to prevent unwanted behavior. Most game engines come with a function that lets us normalize a Vector.

Getting the Directional Vector pointing from one position to another

A common use case for directional vectors is to calculate the vector that tells us the direction of one object relative to another. Let's take the simple example of moving one object (Object A) towards another (Object B). Our first step is to subtract the position from Object A (our origin) from the position of Object B (the position we want to have direction from our origin). Then, we just need to normalize our resulting Vector!

public Transform otherObject; // This is set externally via the Unity GUI
    void Update(){
        float speed = 3.0f;
        Vector3 dirToObject = (otherObject.position - this.transform.position).normalized;
}

Moving an Object along a particular Direction

Now, let's say we want our Object A to move towards Object B. We know that we can multiply our vectors by scalars. Since we have our directional vector, we can start moving towards it by multiplying our directional, normalized vector by a speed scalar and continuously add the result to our object's current position. Here is how this would look in the code for Unity:

public Transform otherObject; // This is set externally via the Unity GUI
    void Update(){
        float speed = 3.0f;
        Vector3 movementDir = (otherObject.position - transform.position).normalized;
        transform.position += movementDir * Time.deltaTime * speed;
    }

Vectors to analyse relations between Objects (Dot Product)

The dot product can be used to multiply vectors, but is generally used in game development to determine the difference between vectors (again, something I'd suggest reading more on). In the case of directional vectors, that difference is very useful, because it gives us a measurement of the degree to which two vectors are pointing in the same direction! Our dot product can have values in the range -1 to 1, with 1 meaning that the two vectors are pointing in the exact same direction and -1 that they are pointing in opposite directions, while a value near 0 means that they are at a 90° angle (for two dimensional vectors that is). How is this useful?

Checking whether two Objects are facing one-another

Let's say I am making a game where the player is trying to hide from some guards. I want to make sure that the guard can't see my player i.e. the player is standing behind the guard. We already learned how to calculate the direction of one object to another, we need to subtract the position of the guard from the player's and normalize the resulting vector.

If we want to see if our guard is facing the player, we are going to need the directional vector that represents the forward facing direction. We can calculate this using the previous methods, but fortunately the most common game engines (Unity, Unreal) offer methods out of the box that gives this vector. Now, we know that if our dot product has a value of 1, the two vectors are going to be facing the same direction. If our player is behind the guard, the dot product must be negative! It's best shown with a diagram:

Diagram showing how the dot product changes with the position of the player (yellow) in relation to the guard (dark blue)

Right now, our guard has a perfectly horizontal line of sight. If we wanted to have something that is more cone-like as we are used to in most games, we can add a threshold that checks that the dot product is not at least over a certain value:

Diagram showing how adding a minimum threshold can allow for a cone-like field of vision

Here is some Unity code to replicate this:

   public Transform otherObject;
    // Start is called before the first frame update
    void Start()
    {
        Vector3 dirTowardsOtherObject = (otherObject.position - transform.position).normalized;
        float dotProduct = Vector3.Dot(dirTowardsOtherObject, transform.forward);
        if (dotProduct > 0.1f) // our threshold is 0.1
        {
            Debug.Log("Can see object!");
        }
        else
        {
            Debug.Log("Cant see object!");
        }
    }

Calculating the Angle between the two Vectors

Maths avid readers that went through the external link on the dot product and looked at the formula might also realize that the reason for our normalized value range of (-1 to 1) is because we are moving within the cosine range. For everyone else, the tldr is that we can use the acosine operator on the dot product to calculate the angular difference between these two vectors. We just got to extend the previous code like this:

Debug.Log(Mathf.Acos(dotProduct) * Mathf.Rad2Deg);

Conclusion

I hoped you enjoyed this short introduction to what you can do with vectors for game development! There are still a lot more things that I could cover (projections, interpolation, etc.), so please leave a comment if you would want to learn more.

Is wearing a Posture Corrector worth it?

Marc Philippe Beaujean — Sun, 29 Mar 2020 18:43:11 +0000

As a knowledge worker, chances are that you will be spending a great amount of time sitting in front of the computer. Being a software developer myself, I quickly noticed that whenever I worked for a few hours, I had to have the bad tendency to hunch over the keyboard. Having several more mature relatives and acquaintances that had vocalized back issues caused by working at a desk for a long period of time, I realized that the sooner I started doing something about my posture the better. I had heard of posture correctors but never considered getting till I realized how badly posture could impact my life - I decided to give it a try.

What is a Posture Corrector?

For those that do not know what it is: the premise is that you are wearing a strap around your shoulders, which is designed to make it uncomfortable to slouch. Note that it is NOT designed to keep your posture in shape via force, it simply acts as a reminder not to slouch and helps your subconscious adapt to keeping a better posture even when you are not wearing it.

How should you wear the Posture Corrector?

You should make sure the straps are on fairly tightly, but loose enough that you can still type comfortably and aren't in pain (remember: it serves to remind you to keep a good posture, not enforce it). I wouldn't suggest wearing it the whole day, after work I immediately take it off to give my shoulders a rest.

Won't it look weird if I wear this?

One of the biggest positive surprises was that the posture corrector is barely visible underneath just a single layer of clothing. I would recommend two layers of clothing, however, if you want to make sure nobody notices that you are wearing it.

Side picture of posture corrector worn under shirt (left side) and over

Front picture of posture corrector worn under shirt (left side) and over

Is it effective?

Now, lets get to the verdict. Given that it is designed to be, wearing a posture corrector for the first time is very uncomfortable, but this actually helped me realize just how bad my posture actually was. Over time, as you start sitting straight, you will start to notice it less and less when you are just working at your desk. So yes - it does work pretty well! As aforementioned, I was really positively surprised with the fact that it is also very hard for others to detect that you are wearing one.

One thing that does get annoying is that it remains harder to use your hands for reaching stuff and can lead to some awkward gestures (though this has not been a big issue for me). I should also note that if you stop wearing the device for a week or so, you will probably start slipping back to your old slouching habits fairly quickly. As the following article mentions, the back brace does not actually strengthen your back muscles as it is only designed to remind you to maintain your posture, so I encourage you to do proactive exercises to strengthen your back, regardless of whether you decide to purchase one or not.

Overall, I think it is a good product and given that its actually fairly cheap to buy, I don't see any problem with giving it a try.

Alternatives to the Posture Corrector

I just discussed my thoughts on the posture corrector, but also wanted to share some other alternatives that seem promising and you can consider as well.

Standing Desk

Having a desk that is designed for standing can be very good for your posture, since standing is much healthier than sitting. Some more advanced desks can alternate between height levels for standing and sitting, but they are pretty expensive.

Reclining Chairs

Some chairs are designed to be more flexible and allow you to lean back in them, which is a significant improvement over chairs that require you to sit upright and thus encourage slouching.

Posture Software

New advancements in AI have led to new software that can detect your posture through the webcam and send you notifications when you are slouching! This is still very much in the early stages though and most will have some warranted privacy concerns with this sort of technology.

What are your thoughts - do you use a posture corrector or a similar product? I'd love to hear your thoughts!

Container Networks with Docker Compose

Marc Philippe Beaujean — Sun, 22 Mar 2020 11:39:08 +0000

One of the best things about Docker is that containers have built-in features for connecting with one-another. In this way, if I wanted to create a complicated system that consists of several different components (databases, microservices, etc.), then Docker gives me a convenient way to setup that system very quickly. This is where Docker Compose comes in, an add-on to Docker that lets us create multiple containers at once in a pre-configured manner.

Installing Docker Compose

As mentioned, Docker Compose is an add-on and doesn't come with Docker by default. You can install it with the following command on Linux (or check out other installation methods):

sudo curl -L "https://github.com/docker/compose/releases/download/1.25.4/docker-compose-$(uname -s)-$(uname -m)" -o /usr/local/bin/docker-compose
sudo chmod +x /usr/local/bin/docker-compose
docker-compose --version

Docker Compose Files

Just with regular containers, Docker lets us use files to define how we want to create our container networks. We have to create compose files for this, which are based on a standard called yaml. Yaml, for simpler terms, can be thought of as JSON but with indentation instead of brackets. You can use tabs or spaces, but need to make sure you stay consistent. Here is a simple example that I hope gets the idea across:

my_object:
  my_values: helloworld
  my_list_of_values:
    - value1
    - value2

The docker compose yaml file needs to follow a certain structure. At the top of the file, we need to define what version of compose we are going to be using. Then, we need to define the services object, which is the list of all the different containers we wish to use in our composition. Finally, we are going to define networks, which make it easier for us to define what services can talk to each other.

Docker Compose Commands

Docker compose also comes with its own set of commands. Here are the two most important ones:

Command	Functionality
docker-compose up	Starts building and setting up containers based on the compose file in the directory specified as the argument. If blank, looks in the current directory.
docker-compose build	Builds all the containers in the specified directory. If blank, looks for file in current directory.

Creating our first Service

For starters, let's include the version of compose that we will be using (right now, the latest version is 3):

version: "3"

Next, we want to define our first service. For this example, I'm going to create a simple WordPress setup with a MySQL database. Let's start with the database, since that can pretty much stand on its own.

version: "3"
services:
  db:
    container_name: mariadb
    image: mariadb:10.4.7
    restart: always
    environment:
      MYSQL_ROOT_PASSWORD: password
      MYSQL_DATABASE: mydb
    ports:
      - 3306:3306

If you read my previous tutorial on the Docker command line, a lot of these terms will be quite familiar. This is because what we are doing here is very similar to building a single container and customising it by setting the various available parameters (exposed ports, environment variables, etc.). We can see that we have our services object, and inside we are defining a service that I named "db". I'm giving it the name "mariadb", so that when I start my compose I can refer to it using that name (for example using command "docker stop maria" to stop the container). I'm also defining an image for the container, setting the environment variables etc. The only part that we cannot set via the command line is the "restart" attribute. Setting this to "always" means that whenever we use the command to build and start our compose, the maria container that is currently running is stopped and restarted (as opposed to being ignored). Let's try it! Go into a new folder, copy paste the code into a file named docker-compose.yaml and execute the docker-compose up command. You should see that a new instance of the MariaDB container is started!

Adding a second Service

We just saw how a compose file can be used to create a single container and for some more complex configurations, it can often make sense to use compose files if you are just trying to start one container despite it being designed to start multiple at once. But now you will see how easy it is to start two of them! We will add a simple Wordpress configuration. We are also going to look into the networks and how they are useful. First, let's take a look at the code:

version: "3"
services:
  db:
    container_name: mariadb
    image: mariadb:10.4.7
    restart: always
    environment:
      MYSQL_ROOT_PASSWORD: password
      MYSQL_DATABASE: mydb
    ports:
      - 3306:3306
    networks:
      - wpsite
  wordpress:
    depends_on:
      - db
    container_name: wp
    image: wordpress:php7.2
    ports:
      - "9000:80"
    expose:
      - 9000
    restart: always
    volumes: [".:/var/www/html"]
    environment:
      WORDPRESS_DB_HOST: db:3306
      WORDPRESS_DB_NAME: mydb
      WORDPRESS_DB_PASSWORD: password
    networks:
      - wpsite
networks:
  wpsite:

You'll notice that I added a wordpress service. The first thing I do is indicate that our Wordpress server "depends" on the database, this means that our database container will always be built and started first. Besides doing a port mapping, I'm also exposing port 9000 to the host machine, so that we can actually see the Wordpress server running. I'm also setting up a volume, which is just going to map the Wordpress config files to the same directory that we are executing our compose command from. The environment variables are used to setup the connection with the database. Notice how our WORDPRESS_DB_HOST is using db:3306 as the value, instead of something like 127.0.0.1. This is because containers in the same network (more about this in a bit) know about each other and can be referenced by their service names.

Finally, we now see that both services have a new networks attribute, in which both have a value of "wpsite". At the bottom of the document, we have another "networks" object and a definition of "wpsite". Through this, we are telling docker compose that we want to create a network (connection between containers) and allows us to indicate which containers should know about each other. If networks is not defined, then a container is part of the global network and thus can be accessed by any containers - this is generally not a great practice, because it can lead to unwanted side effects for larger compositions.

Now, let's try this out! Run docker-compose up again and voila! At localhost:9000, we can see that our Wordpress server is now running.

Deploying my Django + React Boilerplate to Heroku

Marc Philippe Beaujean — Sun, 15 Mar 2020 10:25:43 +0000

Recently, I developed a new boilerplate for Django apps with React. A boilerplate refers to a project that can be used as a base that you start from, allowing you to skip a lot of configuration. The project I developed has the following pre-built features:

Project configuration that easily lets you toggle between production and local development mode
Integration with powerful React modules (styled components, react bootstrap, redux)
Use of TypeScript to allow for a more maintainable code base
Includes implementations for the most common user access flows that most apps need (sign up, password reset, login, sessions with tokens)
Page layout with common components that most apps use (cookie banner, footer, nav bar, loading bar)
Out-of-the-box instant CI/CD with Heroku

In this tutorial, I am going to cover how you can deploy this boilerplate to Heroku very easily.

Setting up the Project

If you don't already have an account, head down to the sign up. We then want to create a new app.

Go to the Deploy section on the App dashboard and choose GitHub as the Deployment method. You can then setup Heroku to sync with your GitHub repository - this is the simplest method in my opinion, because you don't need to install the Heroku CLI and the boilerplate is designed to work without it.

Adding a Postgres Database

For this tutorial, I will be using a postgres database, as the boilerplate is laid about by default to use it. Heroku lets you use a free instance of postgres, simply go to the resources tab and search for it in the search bar.

Heroku will configure the database for us, so we need to store the credentials and inject them into our app. Click on your postgres add-on and you will be taken to a new dashboard for your database. Hit the Settings tab and click on view credentials.

Now, you should see all the information, for your database. Take a screenshot or keep it open in a separate tab.

Setting up Environment Variables

The boilerplate project uses so-called environment variables that are injected into the project when you deploy in production mode.

The os.environ.get method is used to grab any variables from the surrounding system. Heroku lets us define these, as those any typical operating system or hosting platform. Important is that we use the same key names as are in the code. You will also see from the code that the boilerplate is using amazon SES configuration to send emails - I have a tutorial on this if you are not sure how to set it up or you can replace that code with any email provider of your choosing. Same thing applies to the type of database, as you can see it is configured to Postgres here.

To configure environment variables in Heroku, go back to the Settings tab of your app. You will see a Config Vars option - click Reveal Config Vars. We can now add the environment variables that we need, this is where we enter the database information that Heroku gave us earlier.

...and that should be it! You can go to the Deploy tab, start deployment and enjoy the magic.

Getting a Side Project Idea – my Story

Marc Philippe Beaujean — Sun, 08 Mar 2020 10:08:20 +0000

CastSpot has now soft launched and although I am struggling to get traffic onto the site, I wanted to share how I got the idea, as well as some self reflection regarding what I think I missed in hindsight.

The Idea

CastSpot is a platform designed to help Podcasters connect with the goal of speaking on each others shows. This has many benefits, the primary one being that getting exposure for a podcast is hard, but can be made easier when speaking on another podcast. I'll get more into all the other details further into the article.

Choosing a Target Audience

I love podcasts – after discovering them, I started listening to different shows and episodes every day, while I was studying or (nowadays) on my way to work. Around Summer 2019, I noticed a trend – companies on my LinkedIn were all beginning to start their own podcasts. It was then that I realized Podcasts were going to be a big medium in the future and I wasn’t the only one starting to get a taste for them. I was also looking for a new side project since I finished University and thought that the podcasting space would be a great way to start – it had a lot of wind behind it, given all the attention that podcasts were starting to get.

Research

Of course I had no idea what the actual problems were that a podcaster faced day-to-day, so I decided the best way to find out was to become a podcaster myself! I quickly got set up and created “The Junior Developer Podcast”, a show focused on teaching new developers like myself what it is like to start fresh in a new programming career. I ended up deleting the Podcast (might recover it at some point), but it helped me immensely in coming up with my final idea!

My first podcast episodes were just monologues, unscripted and slightly edited. It was the editing that took quite a while, so my initial thought was to create an AI based audio service. The problem with this is that the editing did not really compensate for the overall lack of structure in the episodes, so while tedious, a lot of it could have been avoided if I had given more time to preparing each recording (which I struggled to do due to time constraints). After I uploaded my first episode, I headed down to a podcaster meetup. Here, I talked to one of the most successful German podcasters, who was signing deals with Spotify. I asked him on some tips for growing a new Podcast and he dropped a lot of gems, one that stuck the most with me was this: “if you find a podcaster who is in a similar space as you are, don’t see them as an enemy – collaborate with them, get them on your show! It’s a great way for both of you to grow your audience”. This seemed really smart, but even though I had already pitched an idea to some of the podcasters there and met 0 excitement (idea for a Wordpress plugin that lets users sell advertisement space that I ended up dropping after the meetup), it didn’t strike me that this was what I should be focusing on.

After the Meetup, I also hung around Reddit, where I started looking for new ideas and ways to improve my podcast. I had created around 3 episodes at the time, all had required heavy editing and because they were monologues instead of conversations, they were honestly a bit dull to listen to even though they were pretty short. To look for a new idea, I searched for phrases like “how do you” in the podcasting subreddit. I stumbled upon a post that caught my eye:

“How do you get good guests on your show?”

That was a great question and the gears started turning. I started to realize that having good guests on my show could be the solution to my own podcasting dilemma. Was it really that hard? I switched to the web developer subreddit and posted that I was looking for a junior developer that was willing to speak on my show – I immediately got bombarded with requests, most people had never heard of my podcast and didn’t even care. “Okay”, I thought, “this is really a non-issue”. But then I noticed that while I had people who wanted to speak on my show, figuring out who these people were and how suited they would be to speak as a guest could turn out be very time consuming. Most didn’t have referential audio or video material online that I could use, so I’d either need to follow my gut entirely or do a vetting interview for each potential candidate – this would take ages! I thought to myself how much easier it would be if all the applicants simply had their own podcasts…bingo.

Reflection

Over the past weeks, I have struggled to obtain even a single user and although I was able to organize some PR, I feel that ultimately the idea is not going to pick up in the way I hoped. I think that my reasons for picking up the idea were solid and backed by a pretty good amount of research and personal experience. However, I think that there is also a huge issue with the idea that I am forced to face now: getting a community based platform off the ground is extremely hard. Even though everything is free and very simple to use, people are not going to sign up for something that they see no value in. In turn, if nobody is using a platform like CastSpot, there really is no value! This is why I believe that to start this type of project, you need to have one (and ideally all) of these competitive advantages:

An existing audience in that field
Marketing budget for ads or paying influencers/early adopters
An existing product that you can attach this service to (for example in this case, a podcast hosting service which already has several users)
A lot of time that you can spend spamming forums and other podcasters to get more exposure via PR

Overall, I personally wouldn't start another project that depends on user interaction exclusively.

I hope you enjoyed this short overview and hope this has given you some insights into how you can come up with a side project idea of your own. Did you think that my approach was reasonable? Do you have your own side project that is successful and would like to share your strategies for getting ideas? I'd love to hear your thoughts in the comments!

Unix Command Basics new Developers should know

Marc Philippe Beaujean — Sun, 16 Feb 2020 17:23:19 +0000

At my first internship for an IT firm, I was very confused when asked to work with the terminal (or "shell"). It seemed very intimidating and the sure mass of different commands I was seeing people using while googling for answers to problems was very overwhelming. In this tutorial, I will break down some of the fundamental commands that you should know, so that you can have a much easier time than I did! Also, in case you didn't know: you can use unix shell command if you are working with a machine running Linux or Mac!

Why learn how to use the Terminal

Most common use for the terminal is for server administration on remote machines. This is important for developers who are running their applications on remote servers that need to be setup, maintained, etc. Another use is various development applications and tools that do not have their own GUI, so the command line is used instead (most commonly NPM and Git). Finally, it can also be much faster to work from the shell once you are comfortable with it (which will take time but is ultimately very much worth it). These aren't the only reasons, but hopefully they are good enough to keep you motivated in learning this stuff!

Breaking down a Unix Command

When we open a terminal and write something inside, our computer will try to look through a list of installed applications or commands and will attempt to initiate a sequence of processes based on that. Most commands require some level of user input, on Linux these come in the form of Options (also referred to as Flags) and Arguments. Options/flags are going to allow us to customize how the command is executed, while arguments are going to give the command vital input. We usually use options interchangeably, whereas arguments can sometimes be invalid or missing, causing the command to throw up an error. Let's take a look at a simple example, don't worry if you are not familiar with the command:

ls -l /bin

In this case, our command is ls, which lists files in a directory - try executing it and note what you are seeing. Options follow after a hyphen, in this case the option is a single l, which stands for "long" and makes sure that all files are listed in the long file format. Try removing the option and see how the output changes. The amount of available options is often overwhelming, so let's look at a site that has all the options for ls. We can see that we can also combine options, like allowing hidden files to be visible by appending the "a" character to our options. Finally, we have the argument, which in this case is just a single directory path (the directory we want to view).

Manpages

Pretty much every command has a "manpage", which stands for "Manual Page". These are designed to give you a detailed explanation of what exactly the command does and all of the flags. Let's use it on the previous command:

man ls

Entering the previous command, we can see that our terminal is now listing all the different options for the ls command, along with useful descriptions on what each does. You can scroll around or press "q" to quit the reading view once you are done.

Navigating the Filesystem via the Terminal

I am now going to give you a short introduction to how we can navigate the file system with our terminal. This is important, since most work on a server will require you to move around and inspect directories or files. Our terminal always has an absolute location, which tells us where we are located right now in the file system. We can view this location with the command pwd (short for "print working directory"). Type pwd into your terminal and you will see the directory you are currently in!

For moving around the most common command is cd, short for "current directory", which allows us to move from our current directory to another. For example, in my "Home" folder (the default directory when opening a new terminal), I have a folder called "Documents". If I enter the "cd" command and pass Documents as the arguments, you will see that your have been moved to this directory. You can also do absolute paths, by starting off the argument path with a dash (i.e. cd /bin will take you to the bin folder, no matter where you are in the file system). Here is a quick overview, you can see the terminal directory on the next to where I entered the commands:

Basic File manipulation

In unix, you can create files with the touch command, which takes the filename as an argument. Using the command cat, we can pass a filepath as the argument and have the contents of that file displayed in our console. The rm command is used to delete the file that is passed as the argument. Remember: it is always relative to the location of your current terminal. The cp command is used to copy files. You can move files with the mv command, the first argument is the relative path to the file or directory you are trying to move, the second is the target directory. You can also use mv to rename files. For this, you need to add the original file as the first argument and have the second argument be that same file only with the name adjusted at the end (e.g. mv helloworld.txt hello.txt will rename a file helloworld.txt to hello.txt). All files within a directory can be manipulated using the "wildcard" symbol *, which is used to select multiple files that follow similar patterns (useful for operations like moving or copying all files in a directory). For example, mv ./*.jpeg ./my-images will move all files ending with .jpeg into a directory named "my-images".

Viewing System Information

The command w requires no arguments and simply gives us a list of information on the user for our current session. uname displays details on the operating system we are running, but is only really useful when combined with different flags that let you output everything in a more detailed fashion (uname -a shows you the exact version of your operating system and distro, for example).

Commandline tricks to make you work faster

Your commandline's history is saved to a file, meaning you can access previous commands quickly. Press Ctrl + R to go into history mode where you can type in the beginnings of commands and have a type of auto-completion available, based on recent commands you entered (press Ctrl + C to exit it again if you cant find what you are looking). Because of this, you can also toggle between last commands very quickly using the up and down arrow keys - this will significantly increase the rate at which you can work with the terminal. I also suggest looking into how you can quickly change positions on the terminal while you are working on it i.e. hopping to the start or end of the line using 7 and 1 on the numpad respectively.

I hope you enjoyed this quick intro to the command line! If you want to learn more, want to share some of your own tricks or think that something is wrong/missing, please leave a comment.

Deploying your Django App (on Render)

Marc Philippe Beaujean — Sat, 08 Feb 2020 14:33:51 +0000

When I finished my first Django app, I found it hard to publish it on the web, because there seemed to be no end-to-end tutorial explaining all the different components. As a result, I decided to create the tutorial I wish I could have accessed at the time. It's going to be very beginner friendly, taking you through each process step by step and explaining everything in detail along the way! By the end, you should not only have a running website or app, but also understand what is going on to make it run. I'm assuming that you know Django, are a GitHub/GitLab user and have a good grasp of some basic software development concepts. Commandline knowledge is a nice-to-have! Also note that the hosting option I will be explaining in this tutorial is cheap, but not free, meaning you will get charged at the end of the month.

The basic Components of deploying a Website/Webapp

I'm sure you heard of a server before, but perhaps are not fully aware of what it actually is. The concept is quite simple - it is a computer who's primary (and sometimes sole) task is to listen for requests sent out by other computers and send back a response based on that request. Every part of the web runs on servers and to deploy our Django app, we will need a server of our own.

You might be thinking that having your own computer running all the time seems like a lot of maintenance and hassle - this is where the concept of the "cloud" comes in. A cloud is really just a collection of servers managed by a larger corporation, that has the necessary resources and means to keep the servers running all the time. This is why most new companies opt to deploy their web apps on a cloud provider, rather than running their own servers.

Finally, we also need an application server. This is where things can get confusing - unlike a regular server, an application server is NOT a physical computer. It is a piece of software that is constantly running and listening on a specified port for any requests coming in from the users. When a request comes in, our application server communicates with the application (Django), which figures out how the server should respond. After our application has created a response, the application server will serve that response back to the user in the form of some files (HTML, an image, a JSON payload, etc.).

What is Render?

Render is going to be our cloud host for this tutorial. I chose it because it makes deploying and updating a web app very simple (we will get into how it does that later on in the post). This makes it great for new developers! Render is often compared to its closest competitor Heroku, which is a lot more established, renowned and mature. I have used both platforms and find Render to match up a bit better with my personal preference, as I find the user interface to be more intuitive than that of Heroku. The main benefit of Heroku is that it has a free tier, but gets very expensive quickly, while Render remains comparatively cheap as your web app grows in users. If you want to use Heroku for this tutorial because of its free tier, you still can since it is very similar to Render. I definitely don't think Heroku is a bad choice and you can host serious apps on either of these platforms!

Development Environment Setup

I'm going to start with the default Django project, but I hope my explanations will help you adjust your own project as well (if there are issues, please leave a comment!). For reference, I'm setting up my project by following the official tutorial and my current file structure looks like this:

├── db.sqlite3
├── manage.py
└── mysite
├── asgi.py
├── init.py
├── settings.py
├── urls.py
└── wsgi.py

Setting up the Application Server (Gunicorn)

As you are probably aware, Django ships with an application server of its own, that you can use while you are developing your app. This is not suitable for deploying your app, because it is not designed to be secure and handle large traffic. Instead, we are going to be using Gunicorn, an application server built for Python apps. Run the following command to install it:

pip install gunicorn

We can now run our app using the application server, which has it's own command line interface. The good thing about application servers is that they often come with a lot of configuration options, but this can often confuse beginners. I am going to share the basic configurations for Gunicorn that are going to help you get started.

If you navigate into your projects main folder, you will see a file called wsgi.py. If you haven't made any changes to it, you should see something like this:

import os
from django.core.wsgi import get_wsgi_application

os.environ.setdefault('DJANGO_SETTINGS_MODULE', 'mysite.settings')
application = get_wsgi_application()

In the last line, we can see an application variable being assigned - you can imagine this like your built Django app. We now need to hook it up with Gunicorn, so that we can start taking and responding to requests. Navigate, to your projects root folder and run the following command:

gunicorn -w 4 mysite.wsgi:application

Lets go through it step by step - we have two arguments. The first is marked with the w flag and is assigned the value 4. This is simply telling Gunicorn that we want to have four workers running in parallel. A worker is an instance of the application server, so the more workers we have running the more requests we can theoretically handle at the same time. The optimal value for this depends on how many threads you can run and how much RAM your computer has available, but I find 4 to be a good default.

The second argument is the path from our current directory to the Django application variable that we talked about just before. As mentioned, this is just telling Gunicorn what it needs to be running. After hitting enter, you should see that we have our app running at port 8000, just like with the normal development server!

Adding Support for Static Files

While our application server is already working fine, it does have a major limitation - Django does not support serving static files (images, CSS, JavaScript) in production! Fortunately, there is a really simple fix using a library called WhiteNoise. Let's install it:

pip install WhiteNoise

To make it work in our application is also really easy - simply extend your settings.py file in your main project directory with this code:

MIDDLEWARE = [
    'whitenoise.middleware.WhiteNoiseMiddleware',
    # ... all your other middleware
]
STATICFILES_STORAGE = 'whitenoise.storage.CompressedManifestStaticFilesStorage'

How we are going to deploy our App - a quick Overview

At this point, I think its good to get a quick overview of what we are trying to do, so the next steps make sense. I will be covering how you can use Render to synchronize your app over the web by simply committing to your master branch! This is why knowledge of Git, as well as having a GitHub or GitLab account, are mandatory for this tutorial. This is how it works:

We push our code to the remote repository
Render will recognize that we have made a change and download all the latest updates from GitHub/GitLab to the server
Render will execute the Gunicorn command just like we did before on our local machine

As you can see, working with Render is really simple! But we still need to do a few more things. If you haven't already, please create a new repository for your application.

"Freezing" our Libraries/Dependencies

When we push our code to a server on Render, we are limited by the files in our repository. You don't want to have your entire development environment and libraries in the repository, but a good alternative is to simply have Render install all of these for us on the fly. The way we can do this is by using pip to write all our dependencies into a file (which is a best practice anyway, when working with Git and Django). We can then use this file to install all of these dependencies on the server. Execute the following command:

pip freeze > requirements.txt

You should know see a new file that was created in your directory. For me, this file has the following contents:

asgiref==3.2.3
Django==3.0.3
gunicorn==20.0.4
pytz==2019.3
sqlparse==0.3.0
whitenoise==5.0.1

As you can see, it has all the different libraries that are being used and their versions. This file is formatted in a way that pip will be able to read this file and install them again, with the exact versions of each library.

Getting Started on Render

Go to https://render.com/ and hit Sign Up. Create a new account and go to the Dashboard. You should see a few options - click on New Web Service.

Render will ask you to connect with your Git provider of choice, if you haven't already. Once that is done, pick out the repo that you have been working on for this tutorial.

Now, you are being taken to a configuration menu. In this menu, we are declaring how the render server should initialize the application, when a change is made to the git repository. Important is that we tell Render to install all of our dependencies that we stored in the requirements.txt file we created earlier and start the application with gunicorn.

Choose the cheapest plan. Then, hit the build button and watch how render goes through the process of installing the app. You'll notice that after the build process, Render created a subdomain for us where we can view the application. This is where we run into a problem:

If you are seeing this error, there are two problems:

You didn't add the Render domain to your allowed hosts (obviously)
You have debug mode enabled in production

This is fixed easily by going to back to your settings.py and making the following changes:

DEBUG = True
ALLOWED_HOSTS = ['render-tutorial.onrender.com']

Now, push this new version via Git and notice how Render automatically updates the server! You can also use a manual deploy if that does not work.

Voila! The app is running. I hope you enjoyed this quick introduction to deployments with Django and Render. Obviously, there are still quite a few ways we can improve upon this, like using environment variables to dynamically toggle Debug mode in our settings.py based on whether we are in production mode or not. If you want me to cover these as well, please leave a comment!

Choosing the right Software Developer Specialization

Marc Philippe Beaujean — Sun, 02 Feb 2020 13:05:18 +0000

When I was 17, I was told to figure out what I should study and do for the rest of my life. Obviously, I had no idea at the time, but having played around with game engines like Unity, I thought - why not try to become a games programmer? I ended up enrolling in University to become a games programmer, but ended up working in enterprise software development upon graduating- both are technical and challenging fields, but completely different in many ways. I wanted to share some of my personal opinions on specializing in software development and how to choose the right one for you!

Defining Specialization

Specialization, to me, is the acquisition of knowledge within a field that allows an individual to solve a specific set of problems that others in the same field might lack the knowledge to solve. In the field of software development, there are many ways that an individual can specialize and specialization to at least some degree is going to be inevitable - your skills are inevitably going to differ from others. It's important then to understand how the knowledge that you choose to acquire for your specialization can benefit you - or backfire!

Ultimately, how you choose to specialize should be based on your professional and personal goals. When I mention the word "specialization", people often associate this with picking a narrow and niche skillset. I honestly think that specializing in having a broad skillset is absolutely valid as well!

What Specializations are there?

In such a diverse field as software development, it can be hard to keep an overview of what types of specialisations exist. Here are just a few of many ways you can specialise:

Frontend - help shape the user interface and experience
Backend - create database optimisations and business logic
Embeded Systems - work on hardware specific software
Data Pipelines - produce effective data flows for machine learning and storage
Consulting - communicate how software can help a client's needs (or discover their needs for them)
Project Management - delegate work effectively between members of a team
Games/Graphics - help implement technical game mechanics and effects

Every specialization can have a very big impact on your career, opening doors and closing others. It's important to have a very good understanding of the tradeoffs that you are making by choosing what skillset you want to focus on.

Going for a niche Specialization

The first big tradeoff I want to discuss is going to be the rarity of a particular skillset. Usually, the reason why a given skillset might not be as common as others is because it allows you to solve problems that most businesses do not face. When a business does end up facing these problems or is simply in a particular industry where this niche skillset is needed, that knowledge becomes a lot more valuable. One of the biggest reasons people go for a niche specialization is because they are hoping to increase their earning potential and job security, by being harder to replace and the reduced competition. These are good reasons, but there are also some problems with this approach and pitfalls you should be aware of before going down this path.

If you are looking to specialize by obtaining a skillset that most people do not have, you need to make sure that there is enough demand, otherwise you don't have the leverage to charge a premium price. I was surprised to find that graphics developers don't actually earn more money than web developers (in some cases, they earn less). This is because although their skillset is not as common, fairly niche and requires a lot of knowledge that is hard to obtain, there is also less demand, meaning quite a few developers will still be competing for the same position.

Having a niche specialization is also going to narrow down your opportunities to work wherever you like. Developers are in demand everywhere, but if your specialization means you can only work with certain technologies or industries, you might find yourself needing to relocate.

Choosing a Specialization that is hard to acquire

Nowadays, there are not many skills and professions that one cannot learn online. This means that those which do require some type of formal qualification are going to be better paid as well. If you are still very early in your career (perhaps you haven't even studied yet and are just looking into whether you want to get into software development) it can be a great idea to get a degree qualification that allows you to work in areas that others can't. Of course simply choosing a skillset that does not require a degree but is much harder and intricate is also going to make you more valuable to your potential employee.

Let's take two examples - frontend web development and embedded software for automotive vehicles. For the first, it is possible to learn everything online and there are no qualifications that are necessary to do the job. For the latter, depending on the country, an employee will often require an engineering degree, because of the fact that customers are potentially in danger if there is a bug in the software. Furthermore, it requires a better, overarching understanding of multiple expert fields, like mathematics (AI), hardware and low level programming. This means that someone working in this field can expect a much higher salary, job security and less competition.

Specializing - by not Specializing (in one particular thing)

I already hinted at the fact that having a wide range of skills can also be deemed as specializing. Individuals that are very knowledgeable about the entire software development process are highly desirable for small companies and startups, because these businesses often lack the resources to hire specialists for everything and require their employees to "wear many hats". I also consider this to be a great option if you are just trying to learn a bunch of stuff and narrow down later on in your career. Although you might be less attractive to employers doing very specific types of software, I think that this option keeps you open to as more opportunities.

When should you Specialize?

As I mentioned, you can start thinking about specializing as early as when you are making a choice on what to study, which can have some serious advantages. My issue with this is that I don't think many young people have a good grasp of what they really want to do (myself included). There are many downsides to choosing a niche specialization, which I already mentioned earlier and while it is not impossible to pivot into something else, it can be much harder than if you had just begun with a more broad skillset.

This was exactly how it was for me, as someone who decided to specialize without getting a good understanding of what it was that I wanted. I had gotten a great job opportunity at a triple A games studio after I finished my studies and essentially achieved my childhood dream of becoming a game developer. The problem is that it was no longer what I wanted, I had different goals and ideals than when I was younger - that is part of growing up. It wasn't too hard for me to pivot into the field I wanted to, but I think that it is still important to point out this mistake and I suggest any young people reading this to avoid choosing something narrow too early.

"How should I proceed?" Some Practical advice.

If I was asked to give some definite advice on this matter for young developers, I would suggest trying out as much different stuff as possible. Get a good idea of what you enjoy, discover what lines up best with the job market's demands and choose a skillset according to that. It could be that you find a niche that you find interesting and is well paying. On the other hand, you might discover that you value flexibility more and get a broad skillset.

On the contrary, if a more mature individual looking to get into coding asked me what they should learn, I would suggest getting into a more broad field and not worry about a niche specialization just yet. Your primary focus should be to land a job and gain experience (which web development is best for, due to the demand).

If you are already in a developer career and thinking about specializing, I think it is important that you do your research before making a big move. Write down what your professional goals are and evaluate how choosing a particular specialization lines up with achieving these goals.

Sending Email with SMTP on AWS (and Django)

Marc Philippe Beaujean — Sun, 26 Jan 2020 12:30:13 +0000

Email is one of the most common ways by which applications communicate with their users. In this tutorial, I will show you guys how to setup Simple Email Service (SES) on Amazon Web Services (AWS), which will allow you to start sending 65000 emails for free each month.

Before we get started, you will need to have an AWS account. It is quite simple to set up, so I won't be going into much detail about this here.

Why bother sending Email with AWS?

Sending automated email can be complicated, because most email providers limit the number of emails you can send in an attempt to prevent spamming and abuse of the service. As a result, most large companies use their own email server that uses SMTP (which stands for Simple Mail Transfer Protocol) and is dedicated to sending emails. As a solo developer or smaller company, the maintenance costs of running your own SMTP server are not going to be worth it. As a result, providers like Mailgun or Amazon offer simpler, less expensive ways to send emails. The reason I will be covering SES (Simple Email Service) by Amazon is because their free tier is by far the most generous and is unlikely to cost you any money for your MVP or side project.

Getting started with SES

The first step after logging into your AWS account and entering the console, is to create a new user. This user is going to have certain permissions that allow him to send emails with SES. Go to the services tab and navigate to the IAM service, which is how AWS manages users and permissions.

Next, we want to create our new user. Navigate to Users on the sidebar and click on the New User button at the top left.

We only care about two things when we are creating this user. On the first view, we need to give them programmatic access.

Next, we need to give our user full access to SES. Click on attach existing policies and add Amazon SES.

After that, you will be given your access key. This can be important if you want to be sending emails without SMTP, which SES also allows. Make sure you store these keys somewhere.

Now, it is time to setup SES. Click on the service.

We need to verify an email from which we can send message out to users. SES makes this process fairly straightforward - go to the Emails tab and click on Verify Email. AWS takes you by the hand from there.

Your email should appear where the black box is right now. AWS will send you a confirmation email to the one that you defined, to confirm that it is legit.

After you confirmed your email, you are not ready to start using SES right away. AWS has an additional layer of security to prevent people from abusing it, called sandbox mode. To get out of sandbox mode, you need to send an email to Amazon support.

Create a case for SES, stating why you want to use it. You will probably get a reply the next day.

We can now get started with SMTP on SES - fortunately, this only takes a few clicks. Go onto the correct tab and create your credentials. Make sure that you store your username and password somewhere.

Sending emails with Django

Now that we have our credentials for using SMTP with SES and we got the confirmation email from Amazon that we are out of sandbox mode, we can get going with sending emails. Add the following configuration code to the settings.py file of your Django app:

EMAIL_BACKEND = 'django_smtp_ssl.SSLEmailBackend'
EMAIL_HOST = 'email-smtp.eu-central-1.amazonaws.com'
EMAIL_PORT = 465
EMAIL_HOST_USER = os.environ.get('AWS_SES_SMTP_USER')
EMAIL_HOST_PASSWORD = os.environ.get('AWS_SES_PASSWORD')
EMAIL_USE_SSL = True

We are using the SMTP credentials we stored earlier. Notice that I am using eu-central-1 in the host url - this needs to be whatever region you are using for AWS.

Now, you should be able to send emails using the standard Django email utility functions. I hope you guys found this short introduction to Amazon SES helpful!

5 great Questions for Junior Developers to ask

Marc Philippe Beaujean — Sun, 19 Jan 2020 14:57:27 +0000

As a junior developer, you often know very little when starting at your new job. What is worse is that it can often be intimidating to ask questions, usually out of fear of embarrassment or annoying your fellow co-workers. This is normal and you shouldn't worry - asking questions is important and absolutely essential, something you should not be afraid of doing at all! In this post, I have brought together some of the questions that I feel helped me gain valuable insights when starting out as a new developer and helped me ease into my job.

"What's your name?"

"Ughm-- this has nothing to do with being a software developer". Actually, you would be surprised! In fact, it's not so much the question that I want to highlight here, but that you remember the answer. On your first day, make sure you are social, direct, and remember your co-worker's names as soon as they tell you it. Believe me, this will go a long way (and you can only make a first impression once). If you start off being polite, friendly and show interest in your colleagues, people will be more tolerant of your mistakes and likely to give you a helping hand when you are (inevitably) struggling to get your work done.

"What Classes /Files should I look at when trying to tackle this Problem?"

The hardest thing about coding is not writing, but managing the complexity and reading other people's code. When you are a junior developer thrown into a large and unfamiliar code base, you will have no idea how to get started. By asking your co-worker for reference points when starting to work on your assignment, you are saving yourself a lot of time and confusion.

"I'm unsure if my current approach makes sense in the context of my current assignment - do you think I'm on the right path?"

I often find myself looking at different parts of the codebase, stitching things together and trying to make sense of it. This can lead to situations where I find that the approach I had thought of initially would not suffice and I'd probably have to rewrite/pivot to a new solution. When this is the case, I always like to make sure that my assumptions are correct before starting to undo the changes that I had already made - perhaps I my approach WAS the right one.

"I feel that this part of my code could be optimized or refactored heavily, but I'm not sure how - could you give me some feedback?"

When writing code, things start to get messy quickly and a refactoring is needed. Contrary to what you might think, experienced developers are rarely bothered by you asking for their advice or opinions on code that you are writing. It's often quite the opposite - developers usually have strong opinions on how code should be writing that they like sharing with others. Gaining that insight can help you write code that is more in line with that of your colleagues.

"I've read the assignment requirements several times and this part still doesn't make sense to me. Could you give me a further explanation?"

Understanding business requirements is secretly one of the most important parts of the software developer job. Getting good at this will take a lot of time, so I suggest that if you have ANY questions in this regard, you should ask as soon as possible instead of making assumptions. Remember: asking another developer only takes a few seconds out of their day, but building the wrong thing will require them to give you the same explanation AND possibly correct all the mistakes you made.

Always remember: it is good to ask questions. It shows others that you are interested, motivated and helps you grow. Never be afraid to ask, however make sure that you experiment to leave yourself room for figuring things out on your own as well.

When not to code it from Scratch: Backend Edition

Marc Philippe Beaujean — Sun, 12 Jan 2020 17:47:53 +0000

After spending some extensive time developing the backend for a personal project, as well as gaining some experience from work, I felt that it was time to add the missing part of a earlier post . This series is mainly focused on teaching new developers what parts of their software they can outsource to libraries or services, so they don't reinvent the wheel.

Backend development is crucial for many applications, because it holds and manages one of the companies most precious resources: data. This means that even more caution is required when working on these critical areas of the software. Fortunately, frameworks and libraries can be leveraged to save time and lead to more secure code. What parts you can delegate to third party tools or libraries will be discussed in this article, but ultimately that choice is up to you!

Request and Response Handling

Most backend frameworks usually come with at least some routing functionality that lets you define how the application can be addressed with a request, as well as the ability to return a response. There is generally no need to spend any time on your own implementation, but I'd suggest comparing how several frameworks or libraries implement this and picking one based on your preferences

User Authentication and Authorization

User permissions are critical to any application, as they guard sensitive information. Often, frameworks come with their own user functionality features, depending on how oppinionated the given framework is. These usually handle the following things for you, so you don't need to code them from scratch:

Database model for the user
Methods for basic user actions (registration, login, password reset)
Session management to verify if a user is logged in
Permission classes that let you differentiate between different types of users (for example admin vs regular user)

If you are going to code the registration and login manually, make sure you encrpyt passwords using an hashing library!

There are often libraries that offer additional functionality on top of the one provided by your given framework (for example "all-auth", a framework that builds on top of the python backend framework django). They are designed to provide out of the box solutions for user related patterns that are common, but maybe not so crucial that they are required as part of the base framework. I would suggest looking for a third part library if you are trying to do the following things:

Account verification via email, recaptcha or another service
Two factor authentication
Token Generation for API
Authentication via third-party accounts (Google, Facebook, etc.)

Serverside Rendered Templating

Most backend frameworks offer ways to generate HTML content dynamically using data from your database. This is standardly done using a templating language like jinja or thymeleaf. Most frameworks I know ship with this built in, I can't think of a reason to code this from scratch if you opt for SSR.

Database Queries

A lot of frameworks work with so called ORMs or allow you to easily add one. ORM stands for object relational mapping and let you map your database tables to objects for the given language that you are working in. They also provide more simple ways of accessing the data. While this can make development much more convenient, there is tradeoff in the additional overhead from using an ORM. If you prefer raw SQL, then you should still use a library to handle the database connection and sanitize your queries against SQL Injections.

API Payload Serialisation

When sending data between the client and server, you need to choose a data format that is used. API serialisation frameworks allow you to convert objects in your given programming language to common data formats, like JSON or XML.

API Endpoint Generation

When you are working with GraphQL, creating the endpoint logic from scratch can be pretty tedious. Libraries are popping up that make this much easier.

Even when using REST, you can often leverage "routers" that allow you to define a few generic methods (update, create, get, etc.) you want to support for a given object and the router generates an implementation for you.

The entire backend...?

Sometimes, your website does NOT need a backend! When is this the case? Well, nowadays API services make it possible to create apps that use third party data combined with frontend code. In addition, there are content management systems like Wordpress that, with the help of some plugins, might also be able to fullfill your needs. Finally, there are emerging BaaS (Backend as a Service) like Firebase that can be used when you aren't doing anything too fancy or unique and want to iterate quickly. This can include things like authentication, which can easily be outsourced to a third party like Google or Facebook using OAuth (notice how dev.to has done this by only allowing login with Twitter or GitHub).

I hope you enjoyed this short and sweet overview of some of the ways that you can cut corners when writing your backend code!