Transcript for:
Deploying React.js Application on DigitalOcean App Platform

foreign [Music] what's up everyone for today's video we are going to learn how to deploy your react.js application on the digital ocean app platform but before that please do like comment and share the video and do not forget to subscribe thank you the digitalocean app platform is a platform as a service that allows you to deploy and manage your applications it also provides a more compelling API for interacting with the various components of your app such as git and databases with one-click deployments you can be up and running with a new instance in minutes in this tutorial I will show you how to deploy your react.js application to the digital ocean app platform before we get started we have to make sure that we have all the stuff that we need for this exercise first of course you need to have your own computer second you need node.js installed on your computer third you need to have a digital ocean account fourth you need to have a GitHub account lastly you need to have a code editor such as vs code after you have all this stuff done then we are ready to go assuming you have already signed up to GitHub go ahead and log into your account and on the top right corner of the page click on the plus icon then click on the new Repository name the repository to whatever you like then click on create repository button [Music] after that GitHub will redirect to this page which you can see an instruction on how to check out your GitHub repository assuming you already have node.js installed on your computer now we are going to install create react app to do so open up your terminal then go to your preferred project directory then type in npm install gcreate react app this will install the create react app command line utility globally on your system now let us create our project by typing create react app then the name of your application in my case I will just name it my app this will create a new folder named my app within your current working directory and it contains all of the required files for a basic react.js application now on your terminal type in CD my Dash app then let us run git init then let us run git add [Music] then let us run git commit Dash and then your commit message [Music] then let us run git remote add origin then the URL for the repository that we just created [Music] after that let us run git branch Dash capital M then Main then get push Dash lowercase U then origin Main [Music] after that log into your digital ocean account and go to the apps page then click on the create app button now select GitHub then click on the manage access button then a new window will pop up asking if you would like to authorize digitalocean click on install and authorize after that select the repository we created leave the branch to Main and the source directory click next then click on the pencil icon to configure our build phase edit the resource type then select static site then hit save edit the build phase then at npm run build on the build command then hit save edit the output directory then add build then hit save [Music] then hit save [Music] click on backlink then hit next until you reach the final step then finally hit on the create resource button after a couple of minutes the react.js application should already be deployed as you can see on the application overview digitalocean generated a custom domain for us which we can actually change to our own domain name later on the good thing about this is that whenever you push code to your main branch is that the changes will be automatically deployed to your site now you can only focus on your coding how cool is that congratulations you just got your react application deployed on the digitalocean app platform thank you very much for watching please like comment share and subscribe to my channel until next time