Как я построил Sykiks

Обо мне

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

Что такое сикики?

Сыкикс – живые чтения из видруемых экстрасенсов.

Как вы можете понять из названия, Sykiks – это платформа, которая соединяет пользователей (клиентов), которые хотят знать о своем будущем с пользователями (экстрасенсы), которые могут предвидеть будущее.

Клиент может купить кредиты из PayPal, отправить автономное сообщение или иметь живые текстовые сеансы с их психическими приборами.

Tech Stack.

React – React – это удивительная структура пользовательского интерфейса, поскольку все является компонентом. Есть более легкая кривая обучения.
Firebase 2.1. База данных Realtime Firebase – так как Sykiks ожидается, что будет в реальном времени, это было легкое забранное. Из листинга активных онлайн-пользователей, чтобы иметь чаты или даже отправлять сообщения. 2.2. Облачные функции – от принятия вызовов http to paypal, чтобы затрезвители обрабатывать баланс/транзакцию учетной записи пользователя. 2.3. Хостинг Firebase – проще развернуть и управлять развертыванием сайта 2.4. Google Cloud Storage – Сохранение изображений пользователей и аудиофайлов.
Twitter Bootstrap (v4) – заставить сикикс адаптировать и иметь простоту тематики.
Redux – для государственного управления
Узел JS – Функции Firebase Ничего, кроме узла JS
Electron js – Для создания и разработки настольных приложений версия Sykiks для Windows и Mac OS X

Процесс строительства сиников

Мы начали с использованием семени от генератора-реагирования-пожарной Firebase

Генератор-реагирование-пожарная машина была сделана специально для материала-интерфейса, но реактивный материал-интерфейс самостоятельно не выходит из адаптации коробки. Итак, мы удалили материал-интерфейс и подключали Twitter Bootstrap.
Мы также включаем Reactstrap, потому что, поскольку он говорит «Простота в использовании React Buttrap 4 компонента»
React-redux-firebase действовала как глобальное состояние для нашей базы данных Firebase Qoanbase, поэтому мы едва необходимы для написания собственного магазина Redux.
Затем мы использовали React Router версии 3 для управления маршрутом, который вышел из коробки с семенами.
Мы использовали облачные функции на основе HTTP для создания API для построения отдыха для добавления кредитов из PayPal.
Мы использовали функции на основе базы данных базы данных для следующих 6.1 Обновить отзывы 6.2 Для обновления запросов чата 6.3 Для обновления сеансов чата 6.4 Для обновления переводов 6.5 Для обновления баланса учетной записи 6.6 для отправки сообщений 6.7 Для обработки заблокированных пользователей для сообщений или запросов в чате 6.8 Чтобы отправить уведомление от облачных сообщений для сообщений и запросов в чате.
Мы также использовали функции облачных хранилищ, чтобы изменить размер аватары пользователя.
Мы также использовали Media-Recorder браузера для записи, сохранения и отправки аудиосистем.
Мы использовали WebView Electronjs для разработки простой настольной версии Sykiks. Это с помощью обмена облаками Firebase использовалась для кражи фокуса Infase, были запросы на чат.
Особое упомянутое, чтобы пересматривать модуль, который ввел лучший способ написания классов реагирования. У нас всегда был усилитель для каждого компонента, который мы написали, который был компонентом более высокого порядка. Таким образом, в основном шаблон и контроллер всегда разделены и проще для управления.

Проблемы я столкнулся

Поскольку Firebase является Realtime, время сервера не точна, согласно часовым поясам пользователей. К счастью, он говорит вам смещение между Serververtime и TimeZone пользователей, который вы можете использовать, чтобы показать правильное время в соответствии с часовым поясом пользователя.
Всякий раз, когда вы пишете облачную функцию для спускового крючка базы данных, есть вероятность, что на аналогичном пути спускового крючка необходимо знать об этом и обрабатывать такие случаи, так что следует избегать будущей обработки для уже обработанных путей.
Так же просто, как загрузка изображений звуки изображений заняли почти неделю. Изображения, необходимые для изменений не только в том, что индикатор выполнения, необходимый для обновления, и пользователь должен увидеть его измененный аватар после размера. Мы смогли установить новые пользователи AVATAR PATH PATHESTES из облачных функций, которые затем были отражены для пользователя.
Уведомления и звуки являются ключевым компонентом для предупреждения психики INCASE, он получает запрос на чат, но мы вскоре поняли, что было много проблем, которые все еще нерешены. 4.1 Браузеры, как правило, спят на вкладках Inacse Left Ledle, следовательно, вы должны закреплять вкладку или мы получили приложение для настольного компьютера, которое ворует фокус, в котором возникает запрос. 4.2 Не все браузеры поддерживают службу работников. И Safari поддерживает свою собственную версию Push-уведомлений, которые нуждаются в сертификатах Apple. 4.3 Автоиграция звуков, которые очень необходимы, запрещено Safari, а Chrome также может иметь этот параметр.
Max OS X будет спать настольное приложение через определенное время, если его простаистый, что вызвало проблемы в уведомлениях.
При обработке триггеров всегда добавляют чек, что указанный путь был обработан. Мы выучили трудный способ, чтобы при восстановлении базы данных. Firebase, очевидно, повторно запускает триггеры для восстановленных данных, которые вызвали большие проблемы. И Firebase не имеет прямого способа отключения облачных функций.

Назначение ключей

Мы начали с базы данных Realtime Firebase, но мы хотели бы прыгать на огнестрельном месте. База данных Realtime нуждается в большом количестве хайков для сохранения реляционных данных. Мы все еще можем использовать заполнения реагирования-redux-firebase, но у него все еще есть свои недостатки, например: дочерние записи не обновляются в реальном времени. И FireStore имеет лучший способ сохранения реляционных данных.
Реагирует материал UI не имеет адаптивной коробки
Рекомендую изменилось так, как мы написали React Code. Для каждого маршрута/компонента независимо от него было без гражданства или с государством. Это сделало нашу кодовую базу гораздо более управляемой.
База данных Firebase – это в режиме реального времени, но в облачных функциях необходимо предпринять дополнительные осторожности, чтобы избежать рекурсии пишет.
Вам определенно нужен платный план FireBase, если вам нужно сделать внешние вызовы API от облачных функций.
Реагируйте с redux удивительно и чувствуют себя зрелым, поскольку я пришел из угловой версии 1, отсутствие состояния было огромной проблемой, которую redux решает и реагирует рендеринг, основанный на основе компонентов.
Реагируйте в отличие от других структур пользовательских интерфейсов, намного стабильны и меньше меняются со временем по сравнению с угловым.
FireBase удивительна для размещения и развертывает ваш код, но во всех аспектах есть кривая обучения.

Окончательные мысли и следующие шаги

Мы планируем добавить видео чат и уже есть реактивная нативная версия приложения, используя EXPO, которую я планирую объяснить в более позднем посте.

Я планирую публиковать почти каждый компонент, как

Насколько изображения загружены и изменяются из реагирования на хранение Firebase/Cloud.
Как добавить поддержку платежного шлюза в реакции на родной, если нет народной поддержки
Как загрузить аудио в облачное хранение

https://github.com/prescottprue/generator-react-firebase https://reactstrap.github.io/http://react-redux-firebase.com https://github.com/giridharangm/reacuct-media- Рекордер/https://github.com/acdlite/recompose.