Shubham Tiwari

Posted on Jun 30, 2022

Deploy Website on Netlify

#netlify #react #github #beginners

Hello Guys today i am going to show you how to deploy React app on Netlify for free.

Netlify is a platform which allows you to deploy your website for free and provides a bandwidth of upto 100GB for free and also have https security and can get more features in their paid version.

Let's get started...
I am going to deploy a react app

NOTE - I am not going to explain how to create react app or how to push code to github.

STEP - 1

Create your React project

Step - 2

Create a github repository on Github and push the React App code to that repository

Step - 3

Open Netlify from the link below
https://www.netlify.com/
You will see an interface like this , click "Start building for free"

Sign up if you dont have an account and after signup , log-in to your account
After Login you will get a dashboard like this

Click on Add a new site -> import an existing site
Then choose github in the Connect to Git provider option
Then connect your github to netlify using your credentials if asked
Then it will show you all the github repo's in your account
Choose the Repo which have your project.
Then Scroll down to bottom and click deploy site
Wait for few minutes , it will build your site and will create a link for the site.
After production build is successfull , you will see something like this

The link is Below your App name with https://, as you can see in the image above ## NOTE - If you want to change the url name of your site go to site settings -> change site name and change the site name and save .

OUTPUT -

Thats it for this post.
THANK YOU FOR READING THIS POST AND IF YOU FIND ANY MISTAKE OR WANTS TO GIVE ANY SUGGESTION , PLEASE MENTION IT IN THE COMMENT SECTION.
^^You can help me by some donation at the link below Thank you👇👇 ^^
☕ --> https://www.buymeacoffee.com/waaduheck <--

Also check these posts as well
https://dev.to/shubhamtiwari909/higher-order-function-in-javascript-1i5h

https://dev.to/shubhamtiwari909/styled-componenets-react-js-15kk

https://dev.to/shubhamtiwari909/introduction-to-tailwind-best-css-framework-1gdj

Quadratic AI – The Spreadsheet with AI, Code, and Connections

AI-Powered Insights: Ask questions in plain English and get instant visualizations
Multi-Language Support: Seamlessly switch between Python, SQL, and JavaScript in one workspace
Zero Setup Required: Connect to databases or drag-and-drop files straight from your browser
Live Collaboration: Work together in real-time, no matter where your team is located
Beyond Formulas: Tackle complex analysis that traditional spreadsheets can't handle

Get started for free.

Watch The Demo 📊✨

DEV Community