MobyDick

Библиотека компонентов для мобильной разработки.

Содержание

1. О проекте
2. Разработка
   • Локальный запуск
     • Подготовка
     • Установка
     • Как запустить проект
   • Code style
   • Процесс сборки приложения для релиза
3. Тесты
4. База знаний

1. О проекте

Легковесная библиотека компонентов для разработки мобильных приложений. См. также дизайн-систему в Figma.

Чтобы не тянуть все зависимости, которые могут не пригодиться, либу разделили на модули:

• @lad-tech/mobydick-core
• @lad-tech/mobydick-utils
• @lad-tech/mobydick-calendar

2. Разработка

Локальный запуск

Подготовка

• Пакетный менеджер yarn, так как он быстрый.
• Конфигурацию ESlint. Информация о ней находится в отдельном репозитории, чтобы использовать ее на смежных проектах.

Чтобы установить все пакеты, нужно установить ассоциации для нашего gitlab registry и закрепить accessToken. Для этого изучи пункты 1 и 2 в инструкции “Как скачать наш пакет”.

Установка

1. Сначала прочитай инструкцию.

2. Установить Android SDK можно через Android Studio (самый простой способ) или через IDEA, прописав нужные переменные для .bashrc или аналоги:

   export ANDROID_HOME=$HOME/Android/Sdk
   export PATH=$PATH:$ANDROID_HOME/emulator
   export PATH=$PATH:$ANDROID_HOME/tools
   export PATH=$PATH:$ANDROID_HOME/tools/bin
   export PATH=$PATH:$ANDROID_HOME/tools:$ANDROID_HOME/platform-tools
   export ANDROID_SDK_ROOT=$ANDROID_HOME
   export PATH=$PATH:$ANDROID_SDK_ROOT/cmdline-tools/latest/bin:$ANDROID_SDK_ROOT/cmdline-tools/tools/bin
   export PATH=$PATH:$ANDROID_SDK_ROOT/emulator #регистируем новый Path
   export JAVA_HOME=/usr/lib/jvm/java-8-openjdk-amd64/

3. Чтобы установить пакеты, лучше использовать команду yarn install --frozen-lockfile.

Как запустить проект

Чтобы запустить проект локально, используй:

• yarn start
• yarn android или yarn ios
• yarn storybook

Для debugging

Чтобы пользоваться React Native Debugger нужно добавить patch для StyleSheet у React Native

702 bytes
diff --git a/node_modules/react-native/Libraries/StyleSheet/StyleSheet.js b/node_modules/react-native/Libraries/StyleSheet/StyleSheet.js
index 785fbfe..1d3b93c 100644
--- a/node_modules/react-native/Libraries/StyleSheet/StyleSheet.js
+++ b/node_modules/react-native/Libraries/StyleSheet/StyleSheet.js
@@ -360,13 +360,6 @@ module.exports = {
     // TODO: This should return S as the return type. But first,
     // we need to codemod all the callsites that are typing this
     // return value as a number (even though it was opaque).
-    if (__DEV__) {
-      for (const key in obj) {
-        if (obj[key]) {
-          Object.freeze(obj[key]);
-        }
-      }
-    }
     return obj;
   },
 };

Code style

1. Константы CAPS_SNAKE_CASE
2. Функции camelCase
3. Классы PascalCase
4. Enum PascalCaseEnum.camelCase
5. Типы PascalCaseType
6. Интерфейсы PascalCase
7. Переменные внутри функций camelCase
8. Названия файлов
   • Если внутри файлов default export Class, то PascalCase
   • В любом другом случае (функции / константы / etc) camelCase

Процесс сборки приложения для релиза

Запустить скрипт в scripts/publish

3. Тесты

Чтобы запустить тесты, используй команду yarn run test.

4. База знаний

Несколько простых правил для readme

1. Основная структура readme-файла нерушима.
2. Технические писатели обеспечивают структуру и читаемость.
3. Если ты считаешь, что твоей команде не хватает какой-то информации, пиши в #docs.
4. Для каждой новой темы используй новый заголовок. Максимальный уровень вложенности заголовков равен 3.
5. Если на чём-то нужно заострить внимание, пиши полужирным “важно” и “примечание”.