Design Converter
Flutter
React
Shopify
Flutter
React
Shopify
Discord
Discord
Education
Last updated on Aug 20, 2024
Last updated on Jun 28, 2024
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 2024, around 94% of enterprises were already using cloud services, and 31% 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 streamlines Vercel Deployment by letting developers deploy their React 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 web apps using one single platform. DhiWise has these key features in its React web builder:
Looks amazing, right?
Read the following use cases on how you can save your app development time with DhiWise.
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 web application deployment.
And so on.
Now that you know about Vercel and its benefits, find out how Vercel deployment is done in DhiWise web app builder.
If you are planning to build and deploy a React web app but don’t have enough time then try DhiWise. New to DhiWise Sign up here!
Here are the steps to deploy your app on Vercel.
Once you build your React app using DhiWise, sync your application code to GitHub or GitLab. DhiWise allows you to easily sync application code through GitHub and GitLab integration.
Sync your Code with GitHub or GitLab
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.
Authorize DhiWise
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.
Select Repository
Click Select Repository and then create a new one as you will not be able to select the repository that already contains program files.
Add New Repository or Select from Existing
After creating the new repository refresh the page to see the newly created repository.
Create a New 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 the Account Token Page under your personal account setting (Vercel Account).
Account Token Page
As shown, here you need to provide an appropriate token name, scope, and Expiration time. Then click Create token to generate the token.
Create Token
Make a note of the generated token as it will not be shown again due to security reasons.
Token Created
Finally, use the generated token to deploy your code on Vercel.
Use Generated Token to Deploy your Code on Vercel
That's it!
In the article, we have learned about the React web app deployment, what is Vercel, why developers like it, and how to sync your React code with GitHub and deploy it on Vercel using DhiWise.
Hope you find it helpful to build your next React application.
Overall, DhiWise aims to simplify the process of web application development and deployment with its web builder.
Sign up with DhiWise today!
Tired of manually designing screens, coding on weekends, and technical debt? Let DhiWise handle it for you!
You can build an e-commerce store, healthcare app, portfolio, blogging website, social media or admin panel right away. Use our library of 40+ pre-built free templates to create your first application using DhiWise.
