myShop Angular Client

Table of Contents

1. About The Project
   • Topics
   • Built with
2. Screenshots
3. Related Projects
4. Getting Started
5. License

About The Project

The main goal of myShop Angular Client project was to learn how to create modern, reactive, responsive Single Page Application, which can communicate with a myShop API.

The application covers the following topics:

• Angular Router
• Angular Forms/Reactive Forms (built-in and custom validators)
• Built-in and custom Angular Pipes, Directives
• Custom reusable components
• Angular Material Components
• Integration light/dark themes with Angular Material
• Angular Resolvers, Guards, Interceptors
• Angular Services (Dependency Injection)
• Angular Animations
• Managing User Session using JWT and refresh tokens
• TypeScript
• RxJS
• Angular Signals
• Angular Standalone Components
• Diffrent types of paginations (e.g. Query Params, Infinite Scroll)
• Working with external packages
• Angular Service Worker (Progressive Web Application)
• Sass (Variables, Mixins)
• RWD (Responsive Web Design)
• Working with REST API and SignalR Hub
• Working with charts

Built with

• Angular 18
• Angular Material
• Angular Service Worker (PWA)
• Angular Animations
• Sass/SCSS
• Microsoft SignalR
• ngx-toastr
• ngx-infinite-scroll
• Swiper
• ng2-charts (chart.js + chartjs-plugin-datalabels)
• Angular Fontawesome
• hammer.js

Screenshots

Note

Screenshots myShop Angular Client can be found here.

Related Projects

• myShop API
• myShop Pay

Getting Started

Important

For fully functionality, the myShop Angular Client project must have related projects running.

Full instruction for starting myShop projects is here.

1. Clone repository

   git clone https://github.com/marcin-niewczas/MyShop-Angular-Client.git

2. In root folder of repository install NPM packages

   npm install

3. Run application

   ng serve

License

Distributed under the MIT License. See LICENSE for more information.