Deploy Vite React App to GitHub Pages (2024)

hello everyone in this video we'll work through deploying a v react application to get Hub Pages it might seem a little complex but follow along with this step-by-step guide and you will be up and running in no time let's get right into it so let's create a new vit react project mpm gr vit choose react typescript doesn't matter done install npm dependencies now we need to create a new repository let's call it V react deploy hit create let's go back to vs code and we need to set base path in our vid config file it should be equal to your rer name hit save and the last file we need to create is a deploy file under the dogit Hub folder inside the workflows folder and the name is deploy yaml file and actually we don't need to write any workflow code you can copy the workflow code from my blog post on my website I will leave a link in the description so let's copy and pasted here hit save and let's initialize a g repository add all files and to commit and push the files I would just copy those commands and paste it here let's go back to GitHub hit refresh done we've successfully push it our project to GitHub Now open up settings actions General scroll down to workflow permissions and choose read and write permissions Now open up actions and you will see a f deployment click on that and here choose reun fail jobs and wait a bit until it's finished now go to settings again open up pages and here under the branch choose kidub Pages hit save open up actions again and wait the building process now you can go back to your repo main page and here under the deployments you will see a new successful deployment here click on that and open up that link congratulations you've just successfully deployed your project to GitHub Pages that's it if you found this tutorial helpful please hit the like button and subscribe to the channel your support helps me to stay motivated in in the long run thanks for watching and see you in the next video

Channel: Vladyslav Dihtiarenko

Views: 6,798

Keywords: Deploy Vite React App to GitHub Pages, deploy vite react to github pages, vite react deploy to github pages, vite react github pages, vite react github deploy, vite react deploy, deploy vite react, react deploy, vite deploy to github pages, gh-pages, github, git hub, vite deploy, how to deploy react app on github pages, how to deploy vite react app to github pages, deploy react app, reactjs, vite

Id: Bk28snjHr7c

Length: 3min 6sec (186 seconds)

Published: Sat Apr 27 2024