Frameworks Compatibility | Angular
Explore how Azion Bundler integrates with Angular, a comprehensive platform for building web applications that provides a complete solution with built-in tools, TypeScript support, and powerful features for modern web development.
About Angular
Angular is a comprehensive platform for building web applications. It’s a complete solution that includes everything you need to build client-side applications, from development tools to testing utilities. Angular uses TypeScript as its primary language and follows a component-based architecture with a robust dependency injection system.
Key features:
- Full-featured framework with built-in tools and utilities
- Component-based architecture with TypeScript support
- Powerful dependency injection system
- Built-in routing and form handling
- Reactive programming with RxJS integration
- Built-in state management capabilities
You can deploy your Angular project either by using our ready to deploy templates or by linking an existing project with the Azion CLI.
Available Templates
| Template name | Use case | Details |
|---|---|---|
| Angular Boilerplate | Starter project | Learn more |
| ButterCMS + Angular Starter Project | Starter Project | Learn more |
Deploying a template using Azion Console
- Login to Console.
- Click the + Create button.
- Click the Templates section.
- Choose the desired Angular template.
- Connect your GitHub Account.
- Choose a name for your application.
- Click Deploy.
Deploying an existing project using Import from GitHub
- In Console click the + Create button.
- Select Import from Github.
- Select your repository.
- Choose an application name.
- Select the Angular Preset.
- Input the install command:
- Click Deploy
Deploying a template using Azion CLI
- Initialize the project:
- Give your project a name, or press
enterto accept the given suggestion:
- Choose the Angular preset:
-
Choose one of the available templates.
-
With the template fetched and configured, you can now start a local development server.
The following steps are based on the answer you gave.
- If you chose to have a local development server running.
- If you chose not to have a local development server running.
Answering yes to local dev
- Install the project dependencies. Input
ywhen the interaction prompts:
Wait until the installation is complete.
Output:
- On the browser, go to
http://localhost:3333/and you can see your Angular project running.
Deploying the project
When your project is running locally, you’re still able to deploy it to the edge. To do so:
- Stop the terminal execution with
control + c. - Access the project folder:
- Deploy the project:
- Wait while the project is built and deployed to the Azion Web Platform.
After the deployment is complete, you’ll receive a domain to access your Angular project on the Azion’s platform.
Wait a few minutes so the propagation takes place, and then access your application using the provided domain, which should be similar to https://xxxxxxx.map.azionedge.net.
Answering no to local dev
After indicating you don’t want to have a local server running, deploy the Angular project to the edge.
- Enter
yto the following interaction, indicating you want to deploy the project:
- Install the project dependencies. Input
ywhen the interaction prompts:
- Wait while the project is built and deployed to the Azion Web Platform.
After the deployment is complete, you’ll receive a domain to access your Angular project on the Azion Web Platform.
Wait a few minutes so the propagation takes place, and then access your application using the provided domain, which should be similar to https://xxxxxxx.map.azionedge.net.
Local project deploy with Azion CLI
You can use the Azion CLI to deploy a project compatible with our availiable frameworks.
- Inside your existing project folder, use the command below to link your project to an application:
-
Choose the Angular preset.
-
The CLI will guide you through the rest of the process. In less than five minutes, your application can be up and running on the Azion Web Platform.