---
# System prepended metadata

title: 'ULLA: Техническая часть :hammer_and_wrench:'
tags: [ulla]

---

---
tags: ulla
disqus: hackmd
---

# ULLA: Техническая часть :hammer_and_wrench:

Подготовив контент учебника, вы легко можете превратить его в приложение для Android, iOS, Web. Для этого вам придется установить некоторые программы и ознакомиться с инструкциями. Но для начала мы хотим объяснить вам суть этих задач. И вам придётся узнать и осмыслить некоторые важные, но не сложные моменты из мира создания программ. 

## Сборка приложения 

Когда вы работаете над приложением: готовите контент, настраиваете стили (цвета, шрифты, размеры текстов) -- все файлы находятся в человеко :man::woman: читаемом виде в папках с понятными названиями, где вам легко ориентироваться и править их. 

Когда же работа завершена -- всё что вы долго и упорно делали надо запаковать в максимально сжатый, удобный для устройств :computer::iphone: виде. Именно такие файлы и принимают магазины: Google Play, AppStore и размещают на веб-сайте.

### Объём и характер работы

Для программистов это элементарные задачи, требующие 10-30 минут чтобы вникнуть и проделать. У непрограммистов это может занять... несколько часов. Если вы планируете создавать свои учебники и выпускать их в виде приложения, конечно вам стоит уделить этому время и силы.

Суть работы заключается в вызове комманд из терминала (коммандная строка -- специальное окно, где программы запускаются посредством ввода текста). Например, вот такой командой создаётся версия приложения для Android: 
```
expo build:android -t apk
```

### Терминал (командная строка)

Терминал (командная строка) -- это специальная программа, чаще в виде черного окна, для ввода команд для операционной системы. Вызываетя сочетанием клавиш:
- Виндовс: Win+x, cmd
- Убунту: Ctrl+Alt+t

Обычные пользователи (непрограммисты), для взаимодействия с компьютером используют графический интерфейс, глаза :eyes:, руки :hand: и мышку/тачскрин. Они:
- переходят по папкам тыкая в них мышкой, 
- переносят файлы напряженной рукой, чтобы она не дрогнула и файлы не рассыпались на пол пути,
- переименовывают файлы глазами находя их в папке и тыкая в них, 
и т.д. 

В терминале всё это заменяется текстовыми командами. Например, создать папку MyProject и войти в неё будет выглядеть так: 

```bash
mkdir MyProject
cd MyProject
```

То есть благодаря командной строке вы выводите своё общение с компьютером на новый уровень: с языка жестов на письменность. 

Это удобно и необходимо по многим причинам. Для вас сейчас важно, что однотипные действия (создать приложение для iOS, Android, Web) проще копировать/вставлять в виде текста в терминал, нежели блуждать по папкам и тыкать файлы мышкой. 

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

## Настройка программного окружения

Ulla сделано на базе популярной технологии создания мобильных приложений **react-native**, изобретенной Фейсбуком. А точнее, с использованием [expo/create-react-native-app](https://github.com/expo/create-react-native-app). Этот инструмент:
- показывает вам приложение на этапе разработки,
- собирает итоговую версию для iOS, Android и Web 

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

- [node](https://nodejs.org/)
- [git](https://git-scm.com/downloads) 
- [expo-cli](https://docs.expo.io/workflow/expo-cli/)

Процесс установки может немного отличаться в зависимости от вашей ОС (Windows, Ubuntu, MacOS). Надеемся, вы справитесь, перейдя по ссылкам выше. В случае затруднения -- посмотрите на ютубе: *how to install node.js/git/expo-cli on Windows/Ubuntu/MacOS*. 

Проверить установку можно запустив в терминале: 

```
node --version
git --version
expo-cli --version

```

В случае успеха вы увидите лаконичные номера версий. 
В случае неуспеха - длинные сообщения об ошибках. 

## Установка Ulla

Ulla является программой с открытым исходном кодом, и находится по адресу: https://github.com/aparus/ulla. [^1]

Зайдите через терминал в папку с вашими проектами и клонируйте туда Ulla: 

```bash
cd /your-projects-folder
git clone https://github.com/Aparus/ulla.git
```

На Гитхабе программы хранятся в сокращённом виде, лишь с перечнем названий всех программ, необходимых для их запуска и работы. Это называется "зависимости". Они перечислены в файле `package.json`. Когда вы клонировали проект с Гитхаба, вам надо установить все эти зависимости локально (на свой компьютер), чтобы программа запустилась у вас. 

Заходите в папку ulla и устанавливаете все её зависимости: 

```bash
cd ulla
npm install 
```

## Кодирование контента 

Когда вы добавили свой контент (текст, переводы, картинки, аудио), чтобы приложение могло их использовать, нужно их предварительно подготовить (например, чтобы у каждого слова в тексте был выставлен порядковый номер, или заранее знать перечень всех картинок и аудио). Для этого запустите в командной строке команду: 
```bash
npm run generate-assets
```
Для интереса можете посмотреть в папку `/assets` - это то, как ваш контент закодировался в удобном для приложения виде. 

## Запуск в режиме отладки

И последний шаг перед получением наглядного результата: 
```bash
expo start 
```

[^1]: Гитхаб является самым крупным и популярным хранилищем открытого кода в мире. Большинство открытых программ опубликованы там, с **инструкциями** по: установке, развёртыванию, использованию; с обсуждениями: сообщениях об ошибках, вопросов, голосованием за новые фичи и т.д. Страницу отдельного проекта также называют: *репозиторий*.