d280-javascript/README.md

D280 - JavaScript Programming

WGU Project - Interactive World Map with Angular

Student ID: 010659768

Angular Version Information

Angular CLI       : 21.1.4
Angular           : 21.1.4
Node.js           : 24.13.1
Package Manager   : npm 11.8.0
Operating System  : linux x64

Package Details:
- @angular/build            : 21.1.4
- @angular/cli              : 21.1.4
- @angular/common           : 21.1.4
- @angular/compiler         : 21.1.4
- @angular/compiler-cli     : 21.1.4
- @angular/core             : 21.1.4
- @angular/forms            : 21.1.4
- @angular/platform-browser : 21.1.4
- @angular/router           : 21.1.4
- rxjs                      : 7.8.2
- typescript                : 5.9.3
- vitest                    : 4.0.18

Project Description

This project develops an interactive world map using the Angular framework. The application features:

• Visual interface with SVG map
• Mouse event handling for country selection
• World Bank API integration for country-specific data
• Two-column layout displaying map and country information

Technical Requirements

• Framework: Angular 21.1.4
• Language: JavaScript/TypeScript
• IDE: VS Code / IntelliJ Ultimate
• Version Control: Gitea (git.n8lab.io)
• Branch: Working (for all development commits)

Project Structure

• Phase A: Repository & Configuration
• Phase B/E: UI Layout (two-column design)
• Phase C/G: World Bank API Integration
• Phase D: Angular Routing Configuration
• Phase F: SVG Interactivity & Event Binding

Data Displayed (6 Properties)

1. Country Name
2. Country Capital
3. Country Region
4. Income Level
5. [Custom Property 1]
6. [Custom Property 2]

Getting Started

npm install
ng serve

Navigate to http://localhost:4200/

Build

ng build

Build artifacts will be stored in the dist/ directory.