React deploying frontend on Netlify
Wrapping up the blog I posted and the series on creating a real-time chat application and then deploying the API to Heroku, I wanted to go over deploying the frontend and React component to Netlify and getting an actual application up and running on the internet.
Much like deploying on Heroku, Netlify has a great resource for deploying a website. It should definitely be your main reference but for the sake of being thorough I am writing this guide to tie up all loose ends.
Account Setup & GitHub Authorization
You will need to sign up with Netlify, for free and make an account. Once you have an account you should authorize your GitHub to the account, this way you can update GitHub repositories and see those changes reflected in the deployed application. This is a time saver and worth the additional effort, otherwise you will have to make commits to your repo and re-deploy them to Netlify every time you make a change or fix a bug or something.
Adding new site from Git
After creating an account you may have to create a team and answer a few questions, these are not too important for now so get through them fast. The next step will be to locate the button “New site from Git”
This button should be in the top-right corner after clicking sites.
From this menu click on “GitHub” under Continuous Deployment. Then we can search for any repository under our GitHub.
Filling out the basics here should be sufficient and once that is done you will have a link to open your newly created site.
Clicking on the link should take you to the site, much like if you were to run npm start from your terminal. Instead of seeing localhost as the domain however you will see the domain that Netlify generates for your site. You can customize this domain in the settings if you would like as well as some other options that I can explore but for now its time to appreciate the hard work you have done in creating your first application and first pillar on the internet. Congratz.
