Skip to content

svierk/angular-bootstrap-toast-service

Repository files navigation

🍞 Angular Toast Service with Bootstrap

GitHub CI Quality Gate Status codecov FOSSA Status

Angular TypeScript RxJS Bootstrap Vercel

About the project

The idea of the project was to create a service that allows displaying different types of toast notifications to the user, e.g. success or error toasts.

The application consists of essentially three components: A toast component that represents a single toast notification, a toaster component that maintains and stacks all current toasts, and the toast service. How the solution was built and works in detail is also explained in the following Medium post:

How to Create a Toast Service Using Angular 14 and Bootstrap 5

Getting started

To get the toast service up and runnning locally, all you need to do is open the repository with VS Code and install all the recommended extensions.

Run

  • npm install to install all required dependencies

Development Server

Run

  • npm start for a local dev server. Navigate to http://localhost:4200/.

Linter and Prettier

Run

  • npm run lint to check for ESLint issues
  • npm run lint:fix to automatically fix ESLint issues
  • npm run prettier to check for Prettier issues
  • npm run prettier:fix to automatically fix Prettier issues

Unit Tests

Run

  • npm run test to execute the unit tests in watch mode for development
  • npm run test:coverage to execute all unit tests with code coverage

Build

Run

  • npm run build to run the production build