marouaneXan/Angular-sso-app

This project focuses on developing a secure authentication system using Keycloak, angular-oauth2-oidc, and TypeScript. With the rise of online security breaches, user authentication has become a critical aspect of any web application. The aim of this project is to provide a simple, yet secure authentication solution for any web application.

Secure Authentication using Keycloak, angular-oauth2-oidc, and TypeScript

This project focuses on developing a secure authentication system using Keycloak, angular-oauth2-oidc, and TypeScript. With the rise of online security breaches, user authentication has become a critical aspect of any web application. The aim of this project is to provide a simple, yet secure authentication solution for any web application.

Keycloak is a powerful open-source identity and access management solution that provides features like single sign-on, social login, and multi-factor authentication. angular-oauth2-oidc is a library that allows developers to implement OAuth 2.0 and OpenID Connect protocols easily. TypeScript is a superset of JavaScript that adds static typing, classes, and interfaces to the language, making it easier to develop complex applications.

The authentication system developed in this project provides secure login and logout functionalities, and access control to protect the application's resources. Keycloak provides an intuitive administrative console for managing users and roles, which can be integrated with any web application. Angular-oauth2-oidc library simplifies the process of implementing OAuth 2.0 and OpenID Connect protocols, providing the necessary security measures for user authentication. TypeScript adds an extra layer of security by adding static typing and other features that help developers avoid common security pitfalls.

Overall, this project provides a secure and easy-to-implement authentication solution for any web application using Keycloak, angular-oauth2-oidc, and TypeScript.

Table of Contents

• Getting Started
• Prerequisites
• Installing
• Configuration
• Usage
• Built With
• Contributing
• License

Getting Started

clone the project and run this command: npm i

Prerequisites

List of prerequisites required to use the project:

1. Node.js and npm installed on your system.
2. Angular CLI installed on your system. You can install it using the following command:
   npm install -g @angular/cli
3. Access to a Keycloak server instance. You can download Keycloak from the official website: https://www.keycloak.org/downloads.html
4. Basic knowledge of TypeScript and Angular framework.
5. Familiarity with OAuth 2.0 and OpenID Connect protocols.
6. Access to an IDE of your choice, such as Visual Studio Code or WebStorm.

Installing

1. Clone the project repository using the following command:
   git clone [repository URL]
2. Navigate to the project directory using the following command:
   cd [project directory]
3. Install the project dependencies using the following command:
   npm install
4. Create a new file named config.ts in the src/app directory.
5. Copy and paste the following code into the config.ts file: arduino Copy code export const environment = { production: false, keycloakBaseUrl: 'http://localhost:8080/auth', keycloakRealm: 'your-realm', keycloakClientId: 'your-client-id', }; Replace the values of keycloakBaseUrl, keycloakRealm, and keycloakClientId with the appropriate values for your Keycloak server configuration.

   Note: You can also configure environment variables for the Keycloak server instance by setting them in the environments/environment.ts file.

6. Start the development server using the following command:
   ng serve --open
7. The application should now be running on http://localhost:4200/

List of the tools and libraries used to build the project. For example:

• Angular
• Keycloak
• angular-oauth2-oidc
• TypeScript