Resources for deploying your project to the world wide web.
After completing a project intended for user interaction on the internet, how does one go about deploying it to the actual web? Once both the backend and front end of your application (routes, user interface and all those fun aspects of your project) are complete you’ll need to adhere this project to a domain — host it somewhere. Luckily, in 2021 we live in the bright and shiny digital era and there are a multitude of easily accessible (and free!) resources for deploying a project to the internet.
GitHub Pages
GitHub Pages is a resource by GitHub for hosting projects on the web using a GitHub repository. They have a simple, helpful walkthrough here. Each GitHub account can host one site.
- Create a repository — which, chances are, you’ve already done in order to store any changes from your local device and text editor on Github (and collect those sweet sweet green Chiclets!).
2. Clone the repository — store your project in a file and clone the repo.
3. Add an index.html file — index.html is a conventional default page. Essentially, the file indicating the homepage of the website when a user tries to access the website. Read more on that here.
4. Push all changes — add, commit, and push all changes from your terminal or text editor to the repository. Business as usual.
5. Visit your site — GitHub uses the following convention for hosted sites: https://username.github.io.
Heroku
Heroku is a cloud-based platform (one of the first) founded in 2007 that allows developers to manipulate and run their websites directly in the cloud. Heroku is compatible with most languages — it manages to make interacting with these different languages very similar in terms of building and scaling.
- Sign up with Heroku — obviously.
- Create your React App — after using the “create-react-app” terminal command, you’ll need to specify the node and npm versions by using “npm -v” and “node -v”
- Create a Heroku Repository in GitHub — read an extensive guide on how to do so here.
*You can also sync your GitHub account from your Heroku account which is a little easier to navigate!
Netlify
Netlify is another cloud-based platform and computing company founded in 2014 that specializes in “serverless backends” and is particularly useful for hosting static websites. For my purposes, Netlify was the most obvious choice.
- Signup with Netlify and add a new site — use the “New Site From Git” button.
2. Sync Netlify with your GitHub account
3. Give Netlify Access to the necessary repository
3. Specify the branch of the repository so that any changes made to the repo will reflect on the deployed site.
4. Revel in your live website!
There are further options to make custom domains that are further covered in this Netlify guide.
