I'm a huge fan of Netlify, I've made no secret of that. I think that the JAMStack is one of the most innovative and promising techniques in recent years for web development. So I asked Preston Lamb, the author of our awesome "Deploying Apps to Netlify" course, to write up a quick summary of how to get a site up and running on Netlify in just a couple minutes. Seriously. You can follow this tutorial and have an app deployed to Netlify in less than 3 minutes. If you haven't tried out Netlify before, you should definitely follow along.
Preston: Netlify is one of the best platforms to happen to the web development community in the last several years. I've been using the product for a little over 2 years, and it has made deploying everything from static sites to single-page apps so much easier. If you've never used Netlify, but have a site or application that needs to be deployed, I highly recommend taking a look at Netlify.
For those of you who aren't familiar with what Netlify is, it's a platform that gives you the ability to deploy your website or web application without the need to manage the server yourself. Generally speaking, you will connect your project repository (GitHub, GitLab, and Bitbucket for now) to Netlify and when new code is pushed to the repo, the site will be automatically deployed. In addition to the continuous deployment and hosting of the sites, Netlify offers many great features, like custom domains, SSL certificates, form submissions, analytics, and serverless functions, to name a few. Netlify allows you to build whatever it is you'd like to build and makes it as easy as possible to host it. Oh, and the best part is: it's free to get started! You can host a personal site on Netlify for free, and many of the add-ons have a free tier. This is great because it allows you to try it out with no risk. If it works for you (which it should in most situations), then you can keep using it. If not, you can switch to another solution.
So let's talk about what you need to do to get started. The first step is to go to www.netlify.com and sign up (the account is free). The easiest way to sign up is with your GitHub, GitLab, or Bitbucket account. To walk through this exercise use GitHub. After signing up, you'll end up on a page which will eventually list out all the sites you've deployed to Netlify.
We can get a simple site deployed in less than three minutes now. Head over to https://github.com/joeeames/netlify-hello-world and fork that repo (it's just a simple site with one static page).
Go back to Netlify. Towards the right and top of the page is a button that says "New site from Git".
Click the button, and go through the steps to create your new site. The first step is locating the repository. First, click the GitHub button.
Next, select the repo you just cloned.
After selecting the repository, you'll be able to select a branch from which you'll want to deploy your site.
You'll also be able to enter the build command your app or site needs to run, and then the directory where the built site will be located. Finally, you'll be able to set any build environment variables that your site may need. In our case, you don't need to enter anything since this is just a simple HTML site.
Once you've deployed your site, you can customize the site in a number of ways. The first way is to change the URL to the site. By default, Netlify will automatically generate a site ID, and the URL will look like this: some-site-id.netlify.com. The "some-site-id" part though will normally be something hard to remember and type. But, you are allowed to change that value to anything you want, as long as it's unique.
To change it, click on the site settings button.
That takes you to the "Site details" portion of the settings page. In that box is a button, "Change site name". Click that button, and in the modal, you'll be able to change your site's name. Again, it can be anything you'd like as long as it's unique, and the form will tell you if it is unique. This will make it easier for people (including you) to get to the URL for your site.
If you have a custom domain that you'd like to set up for your site though, or would like to purchase one, you can click the "Domain settings" button or choose the "Domain management" section of the settings.
Netlify will walk you through the process of configuring your custom domain or purchasing a new one and setting that up. The process isn't too complicated and will allow an even simpler way for people to get to your site or application.
I could go on and on about the benefits of Netlify and its features, but I think you get the point. It's an incredible tool, and one that I really believe can benefit any developer. Whether your site is built in Angular, React, Gatsby, Vue, Jekyll, or just plain old HTML, CSS, and JavaScript, Netlify is the tool for you. Try it out, and let me know how it goes!
If you found this tutorial helpful, be sure to check out Preston's Netlify course on Thinkster.io!
Happy Coding!
Signup for my newsletter at here.
Visit Us: thinkster.io | Facebook: @gothinkster
| Twitter: @gothinkster
Top comments (0)