App Platform is a Platform-as-a-Service (PaaS) offering that allows developers to publish code directly to DigitalOcean servers without worrying about the underlying infrastructure.
The NodeJS buildpack applies to this sample app. See the NodeJS buildpack overview for more information about its configuration options and limitations.
This content is automatically generated from https://github.com/digitalocean/sample-vuejs/blob/main/README.md.
This guide describes how to use DigitalOcean App Platform to run a sample Vue.js application.
Note: Following these steps may result in charges for the use of DigitalOcean services.
Click the following button to deploy the app to App Platform. If you are not currently logged in with your DigitalOcean account, this button prompts you to to log in.
Note that, for the purposes of this tutorial, this button deploys the app directly from DigitalOcean’s GitHub repository, which disables automatic redeployment since you cannot change our template. If you want automatic redeployment or you want to change the sample app’s code to your own, we instead recommend you fork our repository.
To fork our repository, click the Fork button in the top-right of its page on GitHub, then follow the on-screen instructions. To learn more about forking repos, see the GitHub documentation.
After forking the repo, you can view the same README in your own GitHub org; for example, in https://github.com/<your-org>/sample-vuejs
. To deploy the new repo, visit the control panel and click the Create App button. This takes you to the app creation page. Under Service Provider, select GitHub. Then, under Repository, select your newly-forked repo. Ensure that your branch is set to main and Autodeploy is checked on. Finally, click Next.
After clicking the Deploy to DigitalOcean button or completing the instructions above to fork the repo, follow these steps:
After, you should see a “Building…” progress indicator. You can click View Logs to see more details of the build. It can take a few minutes for the build to finish, but you can follow the progress in the Deployments tab.
Once the build completes successfully, click the Live App link in the header and you should see your running application in a new tab, displaying the home page.
If you forked our repo, you can now make changes to your copy of the sample app. Pushing a new change to the forked repo automatically redeploys the app to App Platform with zero downtime.
Here’s an example code change you can make for this app:
src/App.vue
and replace “Welcome to Your Vue App” with a different greetingmain
branch. Normally it’s a better practice to create a new branch for your change and then merge that branch to main
after review, but for this demo you can commit to the main
branch directly.To learn more about App Platform and how to manage and update your application, see our App Platform documentation.
When you no longer need this sample application running live, you can delete it by following these steps:
Note: If you do not delete your app, charges for using DigitalOcean services will continue to accrue.
package-lock.json
for npm projects or yarn.lock
for Yarn projects must be committed to the repo alongside the app’s source code.