evgenii-petukhov/letstalk.angular.app

An instant messaging service with authentication via social media, such as Facebook. The service allows users to send text messages and share links.

LetsTalk Chat App @ front-end

🔔 Please, also see the back-end repository 🙏

🔴 Live demo

Description

This is an instant messaging service with authentication via social media, such as Facebook. It allows users to send text messages, images, and share links.

This project is a showcase of my technical skills and talent for potential IT recruiters, employers, customers, etc. It demonstrates that

• I can
  • create a single-page web application with Angular
  • implement reactive state management with NgRx store in Angular applications
• I understand
  • basic principles of the OpenAPI Specification
  • microservice communication patterns and protocols, such as GRPC
  • main principles of microservice architecture, event-driven development, and experienced in Apache Kafka

Architecture

The front-end is an Angular single-page application which uses NgRx for reactive state management.

The back-end implements microservice architecture. The table below describes each of them.

Microservice name	Protocol	Description
Chat API	REST	Responsible for sending messages and account management
Authentication	GRPC	Generates and validates JSON Web Tokens
Notification	Apache Kafka | SignalR	Sends out notifications about new messages
Link preview	Apache Kafka	Decorates messages with a website's name and a picture preview, if a message contains links
File storage	GRPC Web	Saves avatars and images uplodaed by users on the file system and serves them when requested
Image processing	Apache Kafka	Generates image previews, uses SkiaSharp

Get started

1. Clone the repository
2. Install dependencies npm install
3. Build the project. Use one of the following commands
   • npm run build for the production environment
   • npm run build:dev for development purposes
4. Copy the output files to the website's directory