If you’re on this page, it means you’re ready to share your work! To make this process easy, we’ll be showing you how to use a deployment platform called Netlify. Netlify is a great pick for deploying your first site because of its integration with GitHub which allows you to push your code to GitHub and automatically have Netlify update your deployed website.

Below is a step-by-step guide for deploying your site!

1. To get started, head to netlify.com and Sign Up.

   

2. After signing up, you should be led to the Team Overview page. On this page, you have two options for creating a new project:

   1. **Import an existing project** which will use the files in a GitHub repository of your choosing to build the project
   2. **Start from a template** which lets you upload files to create a project.

   We recommend the **Import an existing project** route because it will automatically re-deploy your project each time you commit to GitHub— keeping the public version of your project always up-to-date! Click **Import from Git**

   If your project isn’t currently on GitHub, check out the Version Control page to see how to do that.

   

3. Now it’s time to authorize Netlify with some permissions to your GitHub account so that it can let you choose a project to deploy. Click **Deploy with GitHub** and then follow the permissions prompts to proceed.

   

   

4. Once GitHub is authorized you can choose which project to deploy. If you don’t see your project at first, you may have to change the organization using the dropdown with your GitHub username initially on it. To proceed, click on the project you want to deploy to choose it from the list.

   

5. Now it’s time to give your project a name. The name you enter will affect what the public URL is, so choose (at least somewhat) carefully. For example, if we call our site dog-memes the public URL will be https://dog-memes.netlify.app . You can change the .netlify.app suffix if you want to by connecting a custom domain (these cost money).

   

6. Once you’ve done that, Netlify should take care of the rest of the configuration if you’ve created the app using create-react-app, vite, or next-js (which are the platforms most Oasis projects are built with). Scroll to the bottom of this page and click **Deploy** to publish your site!

   

7. If you see **Deploy Success!** then you’ve done it— your site is publicly accessible! Click View site Deploy to be taken to the public URL which you can share with friends, family, loved ones, teachers, mentors, and LinkedIn connections! (If this didn’t happen, keep scrolling since we may have the solution for you)

   

   

   In this case, the Site Deploy includes a photo of this adorable pup! 🐶

<aside> ⚠️ Possible Solution:

If you encounter an error, the most common reason is that Netlify is treating warnings from development as errors during deployment. These won’t have blocked your site from working on localhost, but you’ll want to resolve them or ask Netlify to bypass them here.

1. Go to **Site configuration** > **Build & Deploy** > Continuous Deployment > scroll down to **Build Settings** > click Configure

2. For the Build command field change the value from npm run build to CI='' npm run build and click Save

   What this does is override the default settings for the project (which by default may have included treating warnings as errors. Alternatively, you can fix all the warnings in your project if this is something you don’t want to do.

If you have additional errors we recommend close reading the Deploy Log.

1. To find it, from the sidebar go to **Builds** > Builds > and then click the most recent item in the list (which will have a **Failed** tag on it) > Go to Deploy details.

   

2. Under **Deploy log** on this page, twirl down the first row (either Initializing, **Building**, **Deploying**, etc.; but likely it’s **Building**) with a **Failed** tag on it and read this section, paying special attention for keywords such as **failed** and **error**. If the meaning of the message isn’t initially evident, a quick web search or chatbot query should help clarify things. </aside>