Вы, наверное, уже читали, что я недавно читал университетский курс React Native. Было большое ограничение: моя часть курса была очень короткой - у меня было всего два дня.
Когда я начал готовить программу курса, мой главный вопрос был: как научить их создавать приложение за два дня? Имейте в виду, что некоторые из студентов действительно имели базовые знания синтаксиса JavaScript, что сделало даже базовые функции ES6 (такие как деструктуризация и стрелочные функции) чем-то новым, что необходимо объяснить. Мне также пришлось объяснить основную идею React и преимущества функционального реактивного программирования в целом. Я не хотел, чтобы они просто следовали инструкциям, не понимая, почему мы так работаем. Наконец, мне нужно было выполнить реальное упражнение, которое покажет им, как объединить все это вместе, чтобы написать полезное приложение. Все это за два занятия по три часа каждое. Невозможно.
В итоге выяснилось, что студенты вузов привыкли достигать невыполнимых учебных целей. Курс оценивается на основе проектных заданий, над которыми студенты работают самостоятельно в течение двух недель. 70% из них удалось сдать рабочее приложение, большинство из них превзошли мои ожидания относительно того, чего можно достичь всего за два дня вводного инструктажа и две недели самостоятельной работы.
Но я столкнулся с некоторыми причудами в самой экосистеме React Native, которые затрудняют обучение в такой обстановке. И это то, чем я хотел здесь поделиться.
Синтаксис JavaScript - беспорядок
Я помню, как в те дни, когда я преподавал Руби, я всегда боялся двух вопросов:
- Почему мы помещаем здесь круглые скобки, а здесь - нет? (В Ruby круглые скобки были необязательными в большинстве вызовов методов, но были необходимы в некоторых из них - чтобы сделать параметры неоднозначными. Непросто объяснить новым программистам.)
- Почему некоторые хеш-структуры выглядят иначе, чем другие? (В Ruby в какой-то момент был введен «новый» синтаксис хеширования, который казался отличной идеей. Однако его нельзя использовать для представления всех возможных значений ключа, поэтому для некоторых сценариев использования вам нужно вернуться к с использованием старого синтаксиса. При большом количестве баз кода, сочетающих и то, и другое, намного сложнее объяснить кому-то, что на самом деле представляет собой хеш.)
В JavaScript у нас есть базовый синтаксис, который работает в браузере, у нас есть «синтаксис jQuery», знакомый многим людям, которые ненадолго пробовали работать с веб-интерфейсом, а затем у нас есть все эти синтаксисы ESX с разными уровнями адаптации. в разных версиях узлов. Но что еще важнее, с разным уровнем усвоения в разных учебных материалах.
В настоящее время есть только одно решение: погрузиться в изучение JavaScript и изучить (и принять) все его маленькие причуды. Однако для студента университета, который пишет проекты на четырех разных языках программирования, чтобы закончить один урок, это просто невозможно.
React Native быстро движется и ломает вещи
Как преподаватель по совместительству, у меня нет ни времени, ни доступа для настройки всех машин в классе, как я хочу. Во всяком случае, это потому, что другие профессора также должны иметь возможность проводить там свои занятия. Итак, процесс начинается в августе (на самом деле в сентябре в Испании в августе ничего не происходит) со сбора требований для моего класса. Затем системные администраторы устанавливают его, и в октябре я могу протестировать настройку, которую я буду использовать для своих занятий в декабре и марте. Медленно, но просто.
Потом кто-то приходит в ноябре и поправляет «одну мелочь». Конечно, что-то ломается, исправляют переустановкой, но только на тех компьютерах, к которым прикоснулись. В декабре половина моего класса работает с разными версиями React Native. А есть студенты, которые приходят со своими ноутбуками под управлением Windows или Linux. «У меня уже установлен узел», - наивно говорят они. О, если бы это было так просто ...
Суть в том, что установка React Native утомительна, раздражает и подвержена ошибкам. Определенно то, что вы не хотите проходить в одиночку, когда только начинаете. Для этого нужен либо надзор со стороны того, кто делал это раньше, либо натренированные инстинкты разработчика, который раньше ходил в таких водах и знает, как справиться с этой тяжелой работой.
Вам нужно изучить всю экосистему
Одним из главных преимуществ React Native является возможность писать кросс-платформенный код. Итак, чтобы как изучить его, так и оценить его возможности, вам необходимо изучить все следующее:
- Среда разработки Android (для тестирования и выпуска вашего приложения на одной платформе)
- Среда разработки iOS (для тестирования и выпуска вашего приложения на другой платформе)
- Экосистема React (многие учебные материалы и документация предполагают знание исходной экосистемы React)
- Функциональное реактивное программирование (не зная, почему мы используем декларативные компоненты, вы не сможете структурировать свое приложение удобным для сопровождения способом)
- Актуальные специфические концепции React Native
Итак, чтобы написать приложение Hello World и иметь возможность судить, будет ли эта технология полезной для вас, вам необходимо хотя бы вкратце ознакомиться со всем вышеперечисленным.
На самом деле выхода нет.
Решения?
Избегайте JavaScript
Первое, что пришло мне в голову, было попытаться научить React Native вообще отдельно от JavaScript. Есть несколько довольно хороших рабочих процессов и инструментов, доступных с использованием ClojureScript, и они предлагают множество преимуществ: более простой синтаксис, отказ от JSX, отсутствие необходимости использовать специальные библиотеки для достижения неизменности.
Однако основным ограничением будет количество доступных ресурсов. Вам, вероятно, придется подготовить много из них самостоятельно, чтобы не объяснять учащимся неудобные отношения с JavaScript.
Используйте среду начальной загрузки
Еще одно решение, позволяющее ограничить количество концепций, которые вы должны ввести вначале, - это использование фреймворка начальной загрузки, такого как Ignite. Преимущество здесь состоит в том, что студенты начинают с уже работающего приложения, которое они расширяют, чтобы добавить необходимые им функциональные возможности. Redux намного легче понять, если у вас есть пример использования, представленный внутри вашего собственного приложения.
Еще одним преимуществом является то, что он поставляется с набором правил eslint, которые помогут вам разобраться в причудах и ловушках синтаксиса JavaScript, не сталкиваясь с ошибками undefined is not a method. .
Мысли на прощание
Если после прочтения всего вышеперечисленного вы все еще захотите изучить React Native, я буду проводить курс в Берлине в апреле. Не стесняйтесь отправить Brains & Beards электронное письмо, чтобы узнать больше о деталях.
