---
title: "Building a simple AngularJS application"
description: "Building a simple AngularJS application"
author: "Ravi Vishwakarma"
published: 2025-02-13
updated: 2025-03-07
canonical: https://www.mindstick.com/interview/33997/building-a-simple-angularjs-application
category: "angular js"
tags: ["javascript", "angular js"]
reading_time: 3 minutes
---
# Building a simple AngularJS application
AngularJS is an older JavaScript framework, but if you're looking to build a simple application with it, here's a step-by-step guide:
## Step 1: Set Up the Project
You don’t need a build system; you can include AngularJS via CDN in an HTML file.
```html
Simple AngularJS App
```
## Explanation of the Code:
- **Include AngularJS -** Loaded via Google CDN.
- **Define an AngularJS App (**`ng-app="myApp"`**) -** This initializes the AngularJS application.
- **Create a Controller (**`ng-controller="MainController"`**) -** Manages the application's data and behavior.
- **Two-Way Data Binding (**`ng-model`**) -** Updates the UI dynamically as the user types.
- `ng-repeat` **to Loop Through an Array -** Displays a list of items dynamically.
- **Event Handling (**`ng-click`**) -** Adds new items to the list when clicking the button.
## Next Steps
- If you need more functionality, you can add routing using `ngRoute`.
- Consider migrating to Angular (2+) if you're starting a new project since AngularJS is no longer maintained.
## Answers
### Answer by Ravi Vishwakarma
AngularJS is an older JavaScript framework, but if you're looking to build a simple application with it, here's a step-by-step guide:
## Step 1: Set Up the Project
You don’t need a build system; you can include AngularJS via CDN in an HTML file.
```html
Simple AngularJS App
```
## Explanation of the Code:
- **Include AngularJS -** Loaded via Google CDN.
- **Define an AngularJS App (**`ng-app="myApp"`**) -** This initializes the AngularJS application.
- **Create a Controller (**`ng-controller="MainController"`**) -** Manages the application's data and behavior.
- **Two-Way Data Binding (**`ng-model`**) -** Updates the UI dynamically as the user types.
- `ng-repeat` **to Loop Through an Array -** Displays a list of items dynamically.
- **Event Handling (**`ng-click`**) -** Adds new items to the list when clicking the button.
## Next Steps
- If you need more functionality, you can add routing using `ngRoute`.
- Consider migrating to Angular (2+) if you're starting a new project since AngularJS is no longer maintained.
---
Original Source: https://www.mindstick.com/interview/33997/building-a-simple-angularjs-application
Copyright © MindStick Software Pvt. Ltd. This Markdown version is provided for developers, AI systems, and offline reading.