Если вы это читаете, наверняка я уже мертв...

Всем доброго времени суток! На связи Кирилл - разработчик собственного месседжера, а также редактор этого канала. Хочу ввести вас в курс дела. Что тут вообще происходит и зачем вы тут находитесь. Что я делаю надеюсь вам понятно, вы здесь нужны для того что бы увидеть этапы разработки моего приложения, посмотреть на трудности с которыми я столкнулся и, возможно получить небольшое количество вдохновения.

Теперь, думаю вам стало яснее что да как. Ну что же, начнем.

Хочу как Дуров

Все началось неделю назад, когда я спокойно лежал в своей теплой постели и ни о чем не бесспокоился, но вдруг ко мне пришла большая доза мотивации и мне безумно захотелось что-то сделать. Я встал с кровати и... лег обратно, ведь идей у меня совсем не было( Я долго думал, куда потратить свое время и в конечном итоге я решил в одиночку сделать месседжер, взяв за основу телеграм. Так идея переросла в цель.

Мы что-то упустили...

Тааак... Идея у нас есть, время и желание. Чего же не хватает? План - одна из самых важных частей, без плана вряд-ли получится что-то сделать, тем более правильно 😕.
Я приступил к разработке плана (ох сколько же листов бумаги пострадало...).

Сначала я выделил основные поинты разработки.
• Что будет уметь месседжер?
• Как будет выглядеть приложение?
• Как будет это все рализовано?

- Великое начинается с малого

Для чего я создан?

Основные концепции месседжера.

Чат
• Отправка/получение сообщений;
• Удаление, копирование сообщений;
• Эмодзи;
• Отправка медиа вложений;
• Голосовые сообщения;
• Разделение чата по датам;
• Поиск по чату;
• Стикеры;
• Push уведомления;
• Сквозное шифрование;
• Персонализация;

Профиль
• Загрузка/изменение аватарки;
• Имя/статус;
• Возможность отображения онлайна пользователей и индикации набора текста;

Регистрация/авторизация
• Логин, пароль;
• Регистрация через соц. сети;

Главная
• Список чатов;
• Поиск чатов по названию;
• Удаление/очистка чатов;
• Закрепление чатов;
• Поиск пользователей по доступным данным (имя, почта, телефон);
• Поиск пользователей по идентификатору;

Прекрасная находка

За дизайн я взял чудом доставшийся мне макет приложения openLand, которое прекратило свою работу 31 октября.

Откройте окно, тут душно

Настало время решить, что же делать с сервером. Кому-то эта задача обойдётся в 30 секунд, но мне, фронтендеру, который ничего не знает о северной разработке эта задача стала не из лёгких. Пришлось потратить пару - тройку вечеров на чтение статей и просмотр разных пояснительных видео на эту тему.

В конце концов я наткнулся на очень удобную экосистему под названием firebase. Данные будут лежать на облачной базе данных от Google - firebase. Да, я знаю что это не самый лучший вариант, но для меня, знающего только то, что backend существует и ничего более - это лучший вариант.

Еще я выделил пару плюсов firebase:

• firebase - это realtime database.
мы можем создавать такие системы, которые будут обновлять свои данные в режиме реального времени на всех устройствах, которые будут этой системой пользоваться, что отлично подходит для месседжера.

• Это документо-ориентированная база данных. - Скорость в разы больше реляционных баз данных.

• Основные функции доступны обсалютно бесплатно.

UI kit в процессе разработки

Это база //

Одной из самых больших возникших у меня трудностей оказалась проектирование базы данных для хранения информации наших пользователей и сообщений. Даже сейчас я не совсем уверен, что сделал все верно. Как правильно представить модель сообщения, модель пользователя, пользователя как участника группы или чата? Как это все правильно связать между собой и не допустить дублирование информации - все это было для меня абсолютно новым опытом и до сегодняшнего дня я ни разу даже не задумывался о архитектуре базы данных.

Прочитал довольно много статей на тему проектирования бд, посмотрел пару лекций и вроде что-то понял. Нашел довольно удобный сервис для графического представления структуры базы и сделал набросок. Как мы видим, все завязано на уникальных id пользователей и сообщений, по ним мы обращаемся к ячейкам разных таблиц и достаем значения.

Авторизация в процессе активной разработки и уже подает первые признаки жизни! Пол дня пытался разобраться с подтверждением адреса электронной почты через ссылку в письме, но в итоге не вышло((

Впереди еще много работы

🛠 Стек технологий //

Для написания мессенджера на Ангуляре я буду использовать следующие библиотеки и технологии:
- Angular (Javascript Framework)
- Typescript
- RxJS (асинхронное программирование)
- Webpack (сборщик модулей)
- Firebase (служба событий и обмена данными)
- Socket.io (реализация сетевого подключения)
- REST API (программирование постоянных запросов)

👨‍💻 Best Practice //

В результате исследования уже существующих месседжеров на angular я выделил для себя несколько хороших практик:

- Использование библиотеки WebSocket для реализации асинхронных соединений между клиентами и сервером.
- Организация эффективной системы аутентификации и безопасности.
- Создание масштабируемого и идеально организованного кода и инфраструктуры.
- Использование Firebase для реализации простой и доступной службы для отправки сообщений, истории последних действий и т. д.