Skip to content

A simple single-page portfolio website built with AngularJS, ngRoute, and Angular Material. This project demonstrates routing, modular architecture, and dynamic data binding for a personal portfolio.

License

Notifications You must be signed in to change notification settings

ongunakaycom/angular-js-demo

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

30 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

🌟 AngularJS Portfolio Demo

A simple single-page portfolio website built with AngularJS, ngRoute, and Angular Material. This project demonstrates routing, modular architecture, and dynamic data binding for a personal portfolio.


πŸ—‚ Project Structure

angular-js-demo/
β”œβ”€β”€ .github/
β”‚   └── workflows/
β”‚       └── deploy.yml        # GitHub Actions workflow for deployment
β”œβ”€β”€ .gitignore
β”œβ”€β”€ index.html                 # Main entry point
β”œβ”€β”€ home.html                  # Home page template
β”œβ”€β”€ about.html                 # About page template
β”œβ”€β”€ cv.html                    # CV / Resume page template
β”œβ”€β”€ app.js                     # AngularJS application and controllers
β”œβ”€β”€ style.css                  # Main stylesheet
β”œβ”€β”€ LICENSE
└── readme.md

⚑ Features

  • πŸš€ Single-Page Application (SPA) using AngularJS with ngRoute for client-side routing.

  • πŸ“„ Three main pages:

    • Home 🏠
    • About πŸ‘€
    • CV πŸ“‘
  • πŸ”„ Dynamic content rendered via AngularJS controllers:

    • HomeController – Manages welcome message
    • AboutController – Displays personal biography
    • CvController – Handles contact info, career objectives, qualifications, experience, and skills
  • πŸ“± Responsive layout using Angular Material design components.

  • πŸ“¦ GitHub Pages deployment automated with GitHub Actions.


βš™οΈ AngularJS App Overview

angular.module('cvApp', ['ngRoute', 'ngMaterial'])
  .config(['$routeProvider', function($routeProvider) {
    $routeProvider
      .when('/', { templateUrl: 'home.html', controller: 'HomeController', controllerAs: 'home' })
      .when('/about', { templateUrl: 'about.html', controller: 'AboutController', controllerAs: 'about' })
      .when('/cv', { templateUrl: 'cv.html', controller: 'CvController', controllerAs: 'cv' })
      .otherwise({ redirectTo: '/' });
  }]);

🏑 Installation & Usage

Clone the repository

git clone https://github.com/ongunakaycom/angular-js-demo.git
cd angular-js-demo

Open locally

  • Simply open index.html in your browser (no server required for this static demo).

Optional: Run on a local server (recommended for routing support)

# Using Python
python -m http.server 8080
# Then navigate to http://localhost:8080

πŸš€ Deployment

This project uses GitHub Actions to deploy to GitHub Pages automatically when changes are pushed to the main branch.

Workflow: .github/workflows/deploy.yml

Key steps:

  • βœ… Checkout repository
  • πŸ“‚ Copy project files to a public folder
  • 🌐 Deploy contents of public/ to GitHub Pages using peaceiris/actions-gh-pages

πŸ‘¨β€πŸ’» About Me

I'm Ongun Akay, a Senior Full-Stack Developer with expertise across various technologies.


πŸ“„ License

This project is licensed under the MIT License. See LICENSE for details.


About

A simple single-page portfolio website built with AngularJS, ngRoute, and Angular Material. This project demonstrates routing, modular architecture, and dynamic data binding for a personal portfolio.

Topics

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published