I had already wrote a blog about hosting your react app using github pages. Link : https://bit.ly/3aLFnG9
In this blog, we will see how to host your project using netlify.
There are two ways to host using netlify
- By drag and drop
- By authorizing github
Lets get started.
Drag and Drop
Step 1:
Head over to netlify.com and create a free account.
Step 2:
After successfully creating your account, the following page will appear.
Step 3:
In your project folder, open git bash or terminal and run the following command
npm run build
This will create a folder named 'build' in your project directory
Simply drag and drop build folder into the above appeared screen.
and Done Netlify will host your project π₯π₯
Imagine Let say You had build a project and later you tried to update the project UI then the changes are not gonna reflect in your netlify app.
To make above query to happen, we use method 2
Importing from github
Step 1:
push your code onto github after committing all the changes.
Step 2:
In the following image you can see there is an option to import and existing project. Select it and authorize your github account.
Step 3:
Then you will see all your github repos, select your project repo
and done netlify will take care of hosting it and it will also observe the future changes to that repo.
Project I created Recently
I started learning about material UI and created a small app which generates random quote using an API.
Link : https://fancy-starlight-16b468.netlify.app/
Code available on github : https://github.com/vamsi-tupakula/quote-generator-react
Thank You for reading πΉπΉ
Top comments (0)