Кросс-платформенная игра на JavaScript с открытым исходным кодом

После разработки моей последней игры Expo Sunset Cyberspace самое большое, что я заметил, - это то, насколько конкурентоспособными были мои друзья. В то время мы просто делились скриншотами с нашим счетом. Это будущее и все такое, я подумал, что мы можем сделать это центральным элементом нашего игрового процесса.

Стек: Expo, Three, Firebase

Концепция игры

Эта игра имеет чрезвычайно простую концепцию: коснитесь круга, когда он выстраивается в линию с целью, затем другой круг вращается вокруг первого круга, и у вас есть два шанса приземлиться на следующую цель.

Очки для подсчета очков

Чтобы подключить его, я использовал rematch (библиотеку dope Redux), чтобы глобально регистрировать счет каждый раз, когда пользователь набирал очко. Когда результат меняется, мы проверяем, лучше ли наш новый результат, чем наш предыдущий лучший результат; в таком случае мы обновляем наш Firebase firestore с новым лучшим результатом.

Используя rematch, я мог также сохранить лучший результат, чтобы при перезапуске приложения он сохранялся в памяти!

Процедурные игры FTW!

Мне потребовалось всего ~ 15 часов, чтобы написать это целиком. Отсутствие необходимости создавать активы сэкономило мне много времени.

Ленивый совет от ленивого мальчика: я рекомендую использовать плоское затенение и трехмерные примитивы, чтобы не создавать рисунки для вашей игры. Экономит массу времени 🍔

Неинвазивная социальная интеграция

Формула создания отличного приложения Expo сводится к тому, насколько быстро вы сможете получить опыт.

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

Как трудно это может быть?

Ответ очень, очень… совсем не сложно! 😘 🔥 Firebase предоставляет нам хорошее пробное состояние: анонимная аутентификация!

Когда приложение запускается, мы инициализируем наше приложение Firebase и проверяем, вошел ли пользователь в систему. В большинстве приложений именно здесь появляется страница регистрации! Но в Pillar Valley мы анонимно аутентифицируем пользователя и сохраняем метаданные устройства в нашей базе данных.

Презентация

После этого нам просто нужен базовый составной запрос, который фильтрует наших пользователей на предмет слагов, а затем сортирует их по баллам. Добавьте это в пейджинговый FlatList, и готово!

Добавление всего остального, что вы найдете в игре

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

  • Кнопка Поделиться: 💬 Делается снимок экрана, добавляется имя приложения к URL-адресу приложения (из app.json) и, конечно же, мой дескриптор Twitter @baconbrix ». Если мы еще не сделали снимок экрана игры, кнопка не будет отображаться; это создает приятный эффект, который показывает, насколько мы больше заботимся о том, чтобы вы играли в игру, чем о том, как вы ею делитесь! ❤️
  • Кнопка «Оценить приложение»: ⭐️ Вдохновлено тем, как я добавляю 👏 хлопающие смайлики в свои статьи на Medium. Теперь вы тоже можете манипулировать, эээ, влиять на людей, ставя звездочку на кнопку и имея ссылку на кнопку в App Store! 😄 Этот компонент извлекает URL-адрес магазина приложений / магазина воспроизведения из app.json: если он недоступен, кнопка не будет отображаться; если он доступен, то мы должны связать вас с ним!
  • Кнопка отключения звука: 🗣 Это было несложно: просто подключите состояние нашего аудио-синглтона к нашему редуктору-реваншу (если он отключен, мы ничего не воспроизводим). Это также хороший способ сохранить в нашем сокращении, поскольку пользователи обычно не любят отключать звук каждый раз!
  • Кнопка "Таблица лидеров". При этом перемещается экран над нашей игрой с помощью React Navigation.

Развертывание

Обычно я просто отправлялся на выставку на Экспо и покончил с этим. Но недавно я прочитал об опыте Джулии Цю с выпуском Slope Ninja, поэтому мне пришлось самому попробовать развернуть в App Store. Это было намного приятнее, чем я мог себе представить (может быть, в 27 раз проще, чем собственное развертывание).

Поделиться в сети

Наконец, когда я отправил приложение всем трем поставщикам, я загрузил исходный код на Github и опубликовал его в Твиттере! Отклик был отличным, и было весело наблюдать, как в таблице лидеров появляются все мои любимые программисты со всего Твиттера, соревнующиеся за первое место !! (На момент написания этой статьи Каталин МИРОН лидирует с 240 очками 🔥)

Самое лучшее в работе с Expo - это невероятное сообщество - меня так мотивирует вся поддержка, которую все оказывают друг другу.

Если вы еще этого не сделали, я настоятельно рекомендую присоединиться к нашему сообществу Slack.

Наконец-то

Создание игр в Expo происходит очень быстро и по-настоящему выгодно, развертывание выполняется легко, а кодовая база проста! Мне это очень нравится, и это напоминает мне о том, почему я научился программировать !! 🙌

Ссылки

Для всех моих маленьких программистов, которые мгновенно прокручивали до самого низа, у меня есть то, что вам нужно! 🔥 😇 ⭐️ ❤️ 👏 😄