Use Netlify to Host and Deploy a Website with Content Managed by TakeShape CMS
In this lesson, we'll walk through using Netlify to host and deploy a new website project that uses TakeShape CMS to manage its content. We'll start by connecting our Github project to Netlify. To pull in our content with the TakeShape API, we'll use environment variables to customize our Netlify deployment. Once configured, we'll deploy our site and preview it with its new unique Netlify URL.
Instructor: [0:00] We're to start off with this GitHub repo of my TakeShape starter project. This starter project pulls in the TakeShape API to fill it with content. We want to share this website with the world, so we're going to deploy it with Netlify.
[0:10] We're going to get started by clicking new site from Git. Here, we'll want to choose our Git provider. For me, I'll use GitHub. Once you connect with Git, you should be able to search for your project and it will show up below.
[0:19] Next, let's click that project to get started. Because we're deploying a Gatsby site, Netlify can automatically detect that. We can actually use all the default settings here. However, since our project uses the TakeShape project key and an API key, we'll need to add those environment variables for the build process.
[0:34] Before we click deploy site, we can click show advanced where we can enter our keys. Here, we want to make sure we add both our TakeShape projects and our TakeShape API key. Once those are set, we can hit deploy site.
[0:45] Once the next page loads, you'll notice we'll see our site deploy is in progress. Once the deploy is finished though, you can see that Netlify randomly assigned us a domain name. Once we click that link, we can see our new deployed project.
[0:56] In review, we started with our Gatsby TakeShape project posted on Github. Next, we used Github to connect that site to Netlify. Once our app finished deploying, we can see our app successfully deployed to Netlify.