Теперь мы вместе разработаем полноценное мобильное приложения Vocabulary Builder.
Приложение позволит создавать собственный словарик английских слов.
В приложении мы используем React Native, RN Navigation, Redux, redux-thunk, AsyncStorage.
Будет интересно!
Начнем с небольшой подготовки. Добавь шрифты. Для начала установи библиотеку expo-font.
Все шрифты уже добавлены в папку src/assets/fonts. Использовать в проекте будет шрифты Roboto.
Шрифты должны загружаться один раз. Делать будем это с помощью хука useEffect, который должен выполняться один раз.
В асинхронной функции вызови асинхронный метод Font.loadAsync, передав в него массив из шрифтов Roboto.
Не забудь сами шрифты импортировать. Font это общий импорт из expo-font.
Пока шрифты грузятся, компонент App должен возвращать элемент ActivityIndicator с размером small.
После завершение загрузки шрифтов компонент App должен отобразить стандартное сообщение expo.
Для отслеживания загрузки используй флаг созданный с помощью useState

Эта задача — часть курса по Full-Stack JavaScript.
Ты можешь задать свой вопрос в комментариях под постом.
Если ты уже решил задачу, то не стесняйся помочь другим.

App.js

import React from 'react';
import { View, Text, StyleSheet } from 'react-native';

export default function App() {
  return (
    <View styles={styles.container}>
      <Text>Open up App.js to start working on your app!</Text>
    </View>
  );
}

app.json

{
  "expo": {
    "name": "1",
    "slug": "1",
    "version": "1.0.0",
    "orientation": "portrait",
    "icon": "./assets/icon.png",
    "splash": {
      "image": "./assets/splash.png",
      "resizeMode": "contain",
      "backgroundColor": "#ffffff"
    },
    "updates": {
      "fallbackToCacheTimeout": 0
    },
    "assetBundlePatterns": [
      "**/*"
    ],
    "ios": {
      "supportsTablet": true
    },
    "android": {
      "adaptiveIcon": {
        "foregroundImage": "./assets/adaptive-icon.png",
        "backgroundColor": "#FFFFFF"
      }
    },
    "web": {
      "favicon": "./assets/favicon.png"
    }
  }
}

src/assets/fonts/fontIcon/config.json

{
  "name": "fonticons",
  "css_prefix_text": "icon-",
  "css_use_suffix": false,
  "hinting": true,
  "units_per_em": 1000,
  "ascent": 850,
  "glyphs": [
    {
      "uid": "70370693ada58ef0a60fa0984fe8d52a",
      "css": "plus",
      "code": 59392,
      "src": "entypo"
    },
    {
      "uid": "15739f3032c2aa3df67efc96b3ffef56",
      "css": "cancel-circle",
      "code": 59393,
      "src": "websymbols"
    },
    {
      "uid": "f143f7cda5d88dd37a059fcbfb95ccde",
      "css": "trash",
      "code": 59394,
      "src": "custom_icons",
      "selected": true,
      "svg": {
        "path": "M55.6 888.9C55.6 950 105.6 1000 166.7 1000H611.1C672.2 1000 722.2 950 722.2 888.9V222.2H55.6V888.9ZM192.2 493.3L270.6 415 388.9 532.8 506.7 415 585 493.3 467.2 611.1 585 728.9 506.7 807.2 388.9 689.4 271.1 807.2 192.8 728.9 310.6 611.1 192.2 493.3ZM583.3 55.6L527.8 0H250L194.4 55.6H0V166.7H777.8V55.6H583.3Z",
        "width": 800
      },
      "search": [
        "vector"
      ]
    },
    {
      "uid": "0805cca616b3c12714f35af4d0912c10",
      "css": "up-open-big",
      "code": 59395,
      "src": "entypo"
    },
    {
      "uid": "289b5f92f23acf1059c93fbf401c1ad5",
      "css": "down-open-big",
      "code": 59396,
      "src": "entypo"
    },
    {
      "uid": "587bjlxppui6u4japooa2foe58rsvicp",
      "css": "pencil",
      "code": 59397,
      "src": "modernpics"
    },
    {
      "uid": "884cfc3e6e2d456dd2a2ca0dbb9e6337",
      "css": "left-open-big",
      "code": 59237,
      "src": "entypo"
    },
    {
      "uid": "3fce1eca43f917c8f23e532749abae5d",
      "css": "user-circle-o",
      "code": 62142,
      "src": "fontawesome"
    },
    {
      "uid": "f0cf7db1b03cb65adc450aa3bdaf8c4d",
      "css": "gplus-squared",
      "code": 61652,
      "src": "fontawesome"
    }
  ]
}