Hosting a web application's front-end with Netlify
NicolasBrondinBernard
Tired of using 4 different services to host the front end of your web applications?

Article published on 15/07/2021, last updated on 10/08/2026
When it comes to hosting a front-end application, cloud solutions are often split into several services that need to be linked together and automated to make deployment easier.
We can take AWS as an example, where you'll need to use 3 independent services: S3 (file storage + web server configuration), Cloudfront (CDN) and ACM (SSL certificates).
If you'd like to find out how to host a static site with AWS, I have a full tutorial available here!
And that's without even mentioning automation and CI/CD, because most of the time you'll have to configure your workflow yourself, externally...
What is Netlify?
Netlify is a cloud hosting service specialized in automating the deployment process for web applications, a kind of all-in-one service.
This means that from a simple Git repository hosted on GitHub, GitLab or BitBucket, you can automatically trigger your build phase, deploy your application behind a CDN, with a domain name and an SSL certificate (by default).
In short, this lets you automate the hosting of any React, Vue, Angular application and many others by pushing updates directly to a specific branch of your remote Git repository.
Does this only work with front-end applications?
No, but it's most often for this type of project that the platform is used. Plus, there's a very interesting free plan that lets you host all your projects and prototypes in just a few clicks!
How do you do it?
Step 1: The Git repository
The first step is to use GitHub, GitLab or BitBucket to host your code's version control, because Netlify will connect directly to the remote repository (with your authorization).
Once your repository is created, push the latest working version of your application to your main (or master) branch before starting the next step.
Step 2: Create a Netlify account
The advantage with Netlify is that creating an account doesn't even require you to enter your credit card, so you can test the service with total peace of mind, without worrying about waking up to a bill out of nowhere.
You can create an account with your email, but it's also possible to sign in with one click using your GitHub, GitLab or BitBucket account!
Here's the link to sign up: https://app.netlify.com/signup
Step 3: Create a new site
Even with a free plan, there's no restriction on the number of sites you want to deploy (but there is a maximum number of build minutes and bandwidth).
To continue, click the "New site from Git" button at the top right, as shown below, and follow the guide.
You'll then need to indicate the online version control service you're using, and you'll be prompted to authorize Netlify to connect to it so it can display the list of your repositories.
Once that's done, select the project you want to deploy to move on to the next step.
Step 4: Configure CI/CD
For Netlify to be able to build your application before deploying it, you'll need to specify the branch you want to use, the command to run to launch the build, as well as the directory where the build files will be available.
Most of the time, Netlify will manage to pull this info out on its own from your package.json, but if your build is configured a bit differently, you'll need to specify it to the platform.
Step 5: Check the build phase
Once the site is configured, the first build should launch automatically.
For this one and all subsequent builds, you'll be able to access the logs in real time directly from the platform. If there's ever an issue, you'll simply need to fix it in your local repository, push the change, and a new build will start!
Step 6: Test the application live
Once all the previous steps are complete, you'll be able to access your application via a URL in the form:
https://[keyword]-[keyword]-[hash].netlify.app/
With a valid SSL certificate AND hosted behind a CDN, all in just a few clicks. Happy deploying!
Complete courses, exercises and certificates to really learn programming!
4.8 average rating
No comments yet