Deploying your website on the cloud has enormous benefits such as cost savings, flexible on-demand services, availability, maintainability, analytics, and so on. And that's why in the last few years, most businesses have started utilizing cloud deployment services.
In 2021, around 94% of the enterprises were already using cloud services, and 30% of the IT budget was spent on cloud computing services.
But why are we discussing cloud deployment in a DhiWise post?
DhiWise has introduced a new feature named “Deploy on Vercel” in DhiWise React web app builder. It lets developers deploy their React.js app code on Vercel in a few simple steps. That means developers don’t need to leave the platform to deploy their website on the cloud.
In fact, the platform has everything to build and deploy React.js web apps using one single platform. DhiWise has these key features in its React web builder:
Looks amazing, right?
Let’s explore more about “Deploy on Vercel”, a new feature introduced by DhiWise, but first understand what Vercel is and why developers love to use it.
Earlier, cloud hosting was carried out by the hosting providers, which required manual uploading of digital assets. Every time you make changes to the app code it also needs to be manually updated using the cloud hosting platform. The entire process was labor-intensive, time-consuming, error-prone, and costly.
However, with the emergence of GitHub, developers cannot only manage and share their app code across teams but can easily access cloud platforms like Vercel.
Vercel is a serverless cloud platform that was first introduced in 2015 by Guillermo Rauch. It allows front-end developers to easily host websites and online services instantly with minimum to no configuration. Moreover, it updates the changes automatically and provides a way to monitor app performance.
Here are some of the key benefits of using Vercel for React.js web application deployment.
Now that you know about Vercel and its benefits, find out how Vercel deployment is done in DhiWise web app builder.
Here are the steps to deploy your app on Vercel.
GitHub allows you to access Vercel. If you don’t have a GitHub account, create one to sync your code with GitHub. The platform will ask you to authorize your access from DhiWise to your GitHub account.
To sync your app code with GitLab read DhiWise help doc.
When the authorization is completed you will be directed to DhiWise application setting page. Here you need to select Integration from the side panel, then you will see the Select Repository option.
Click Select Repository and then create a new one as you will not be able to select the repository that already contains program files. After creating the new repository refresh the page to see the newly created repository.
Select the newly created repository, you will see the GitHub repository name and URL. Finally to sync application code with GitHub in the new repository click Commit.
Whenever you make the changes to the application code they can be instantly updated on GitHub from DhiWise.
Well, now you have your code on the GitHub repository. Next, you need to deploy your app code to Vercel.
To deploy an app on Vercel, you are required to generate a Vercel API access token. Let's find out how to create a Vercel access token. This token can be created and managed inside your account settings and can be scoped to allow access for specific teams.
To create the Vercel access token, navigate to Account Token Page under your personal account setting (Vercel Account).
As shown, here you need to provide an appropriate token name, scope, and Expiration time. Then click Create token to generate the token.
Make a note of the generated token as it will not be shown again due to security reasons.
Finally, use the generated token to deploy your code on Vercel.
In the article, we have learned about the React.js web app deployment, what is Vercel, why developers like it, and how to sync your react.js code with GitHub and deploy it on Vercel using DhiWise.
Hope you find it helpful to build your next React.js application.
Overall, DhiWise aims to simplify the process of web application development and deployment with its web builder.
Sign up with DhiWise today!