Angular deployment guide
In this guide, you'll learn how to deploy an Angular app from your Git repository to your server.
Launchdeck automates your Angular deployments, allowing you to deploy changes directly from GitHub or Bitbucket to your server.
Prerequisites
Before you begin, you'll need:
- An Angular app stored in a GitHub or Bitbucket repository
- Access to the server hosting your app with FTP, SFTP, or SSH credentials
New to Launchdeck? Start your free trial and follow the steps below to deploy with Launchdeck. Start free trial →
Create a project
Let’s get started by creating a new project and linking it to your Git account. All repositories within your account will be retrieved and shown as a list, from which you can now select the one you’d wish to use. When creating the new project, Launchdeck will automatically add a webhook to your repository so that when you push new commits, they'll show up in Launchdeck automatically.
You can connect to a repository on any of the main hosting providers - Bitbucket, GitHub, GitLab, or - if you host a repository elsewhere - you can configure it manually.
Configure build commands
The next step allows us to define commands which will be executed in an isolated docker container - this is the build step. Hit the button “Auto suggest build automation” and we will automatically suggest a build config based on the contents of your repository.
If you’re using the Angular CLI you’ll only need to add the following build commands. Please note that the input and output paths are specified as well. This will be used to cache the node_modules folder and circumvent the time-consuming task of having to install the dependencies from scratch with every deployment.
This will save you a ton of time!
build:
- cmd: npm install
input: package.json
output: node_modules
- npm run build
All files generated using these build commands will be uploaded to the server. If you use the Angular CLI you'll want to deploy just the browser bundle which is generated inside the dist/angular directory. To "pull" everything inside this folder up to the working directory and delete everything else, use:
pull-up dist/angular
You’ll find more information on how to set up and use build commands on our docs page about build automation.
Configure a server
Now let’s tell Launchdeck where to upload your Angular app.
Hit ‘+ new server’, select the protocol, and enter the credentials facilitating access to your server.
Setting up a server connection is covered in the pages below:
Run SSH commands
In addition to the build commands, you can run additional commands on your server, for example to restart some background worker process.
Within the server configuration modal you will find the SSH commands editor. More information on how to setup SSH commands is available over at our docs page about SSH commands.
SSH commands are only available if you're using the (zero-downtime) SSH deployment "strategy" as we'll need shell access in order to run commands on your server.
Deploy for the first time
We’re now ready to start our first deployment. Click ‘create new project’ to confirm the settings and add the project. In the project overview, you can now start the build. The code will be cloned from your repository and prepared for you to publish it. Hit ‘Publish’ and your Angular application is live!
If we then commit changes to our repository, the commit will automatically appear in your project overview where you’ll be able to upload and publish your new version with the push of a button. If anything goes wrong, you can simply roll back to the latest working version.
That’s all! By using Launchdeck to deploy your Angular app, you’ll never have to upload a new version or run commands manually. Just hit “publish”, and Launchdeck will deploy your app.
