С «ага!» моменты, которые вы, возможно, не испытали

Прочитав новости об изменении климата, в которых упоминается последний отчет МГЭИК, у меня осталось чувство безнадежности, как будто нужно сделать еще один шаг.

Отчет вышел только для подтверждения худших прогнозов:

Если мы не сократим выбросы углерода прямо сейчас, человечество скоро вымрет.

Звучит как научно-фантастический фильм, но это реально.

Я должен был что-то с этим сделать

Таким образом, я решил, что опубликую еще одно инди-веб-приложение в моем аккаунте на страницах GitHub, чтобы помочь спасти планету Земля, пока не стало слишком поздно.

CO2 Avatar помогает повысить осведомленность о том, сколько CO2 вы будете производить на регулярной основе, давая вам полезные конкретные советы по сокращению выбросов углекислого газа.

Например:

  • Не ешьте фаст-фуд хотя бы год.
  • Используйте больше подержанных вещей
  • Больше гуляйте вместо того, чтобы водить машину

Живую демонстрацию можно найти здесь.

Предлагаемый совет - вызывать моменты, которые сделают мир лучше. Короче говоря, CO2 Avatar - это тест, состоящий из набора зашифрованных вопросов в следующих категориях: еда, транспорт и жилье.

В зависимости от того, насколько хорошо вы выступаете в каждой категории, вам будет предоставлен один из этих аватаров: Mutant, Polluter, Neutral, Healer и Hero.

Все результаты могут быть опубликованы в социальных сетях, как показано на рисунке 6.

Отказ от ответственности

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

От безысходности к надежде

Приложение было создано с использованием React, Redux и Reactstrap, которые представляют собой интерфейсную библиотеку, которая позволяет создавать адаптивные веб-сайты, ориентированные на мобильные устройства, аналогично тому, как вы это делали бы с Bootstrap, используя компоненты React без сохранения состояния. вместо.

И он использует response-range, чтобы задавать вопросы в виде ползунков диапазона.

Вот и все!

src/components/TakeTest.js

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

src/components/Test.js

Техническое примечание

Справедливо сказать, что я впервые создал CO2 Avatar еще в 2018 году в качестве побочного проекта, изучая React и Flux - вчера я просто заменил Flux на Redux и решил пока придерживаться Reactstrap в качестве UI-фреймворка.

В итоге я удалил историю коммитов репо, как будто начинал проект с нуля.

Bootstrap 5 был выпущен в мае 2021 года. Если вы большой поклонник Bootstrap, но любите React, вероятно, неплохо было бы попробовать React Bootstrap, поскольку он предоставляет вам компоненты Bootstrap 5, созданные с помощью React из коробки.

Также не пропустите обсуждение плана обновления для Reactstrap и помните, что Bootstrap 4 перешел в Долгосрочную поддержку после v4.4, что означает, что он по-прежнему продолжает получать исправления ошибок, обновления безопасности и обновления документации.

Большое спасибо за чтение!

Если вы хотите поделиться более конкретным советом, о котором другие люди, возможно, еще не слышали, оставьте комментарий ниже. Я буду счастлив включить ваши советы и моменты в «Аватар CO2», чтобы мы все узнали.





Больше контента на plainenglish.io