В центре внимания разработчиков: Брэндон Рид

В этом выпуске Космический JS В серии «В центре внимания разработчиков» мы встретились с Брэндоном Рейдом, разработчиком JavaScript, проживающим в Далласе, штат Техас, который в настоящее время является ведущим разработчиком в Простые СМИ. Брэндон недавно запустил новый веб-сайт React/Node на Cosmic для Компании Арнольда, энергетический и авиационный клиент. Следовать Брэндон на LinkedIn и Гитхаби наслаждайтесь вопросами/ответами.

Cosmic JS: Как долго вы занимаетесь разработкой программного обеспечения?
Брэндон: Лично я создавал небольшие сценарии C# для компьютерной игры, в которую я играл в старшей школе, под названием Space Engineers (я знаю! Насколько более заумным это может быть правильно?). на втором курсе во время получения степени бакалавра в Университете Северного Техаса. В то время, в 2015 году, я работал научным сотрудником. Итак, уже три года, и я наслаждался каждой минутой этого.

Какой стек разработки вы предпочитаете?
Я на стороне JavaScript. Итак, я всегда обращался к стеку CERN. Couchbase, Express, React и Node. Однако, поскольку я работаю с Cosmic JS, мне придется изменить свои предпочтения в бэкэнде: Couchbase для Cosmic. Что касается фреймворков пользовательского интерфейса, я всегда предпочитал материальный дизайн пользовательского интерфейса. Он простой, элегантный и имеет огромный набор пользовательского интерфейса для реакции, который предлагает массу отличных компонентов.

Какими прошлыми проектами вы больше всего гордитесь и почему?
Несомненно, это одно из моих первых производственных приложений, которые я когда-либо создавал, когда был научным сотрудником в Университете Северного Техаса под руководством доктора Рама Данту. Его исследовательская лаборатория создала мобильное приложение для Android на основе носимой технологии, которое может контролировать качество сердечно-легочной реанимации, проводимой пациентам в чрезвычайных ситуациях. По сути, медсестра будет носить смарт-часы Android, синхронизированные с планшетом Android, которые будут отслеживать движения/качество сердечно-легочной реанимации. Исследование проводилось в партнерстве с Texas Health Presbyterian во Фриско. Моя работа заключалась в реализации внутреннего веб-приложения, которое могло бы отображать оперативные статистические данные в виде диаграмм/гистограмм. Данные включали частоту насосов в минуту во время СЛР, количество насосов в минуту и т. д. Мне пришлось реализовать внутренний шлюз синхронизации между устройствами Android и внутренним сервером, работающим с полным стеком. Этот проект действительно заставил меня почувствовать, что я вношу изменения и влияю на медицинскую отрасль.

Расскажите немного больше о процессе создания приложений.
Обычно перед созданием приложения я пытаюсь составить несколько высокоуровневых диаграмм, отображающих важные функции приложения, в основном в форме интерактивных диаграмм/диаграмм последовательности. Затем я проанализирую, какие глобальные и многократно используемые компоненты будут в приложениях. Это помогает мне получить более четкое представление о том, как данные будут передаваться по дереву компонентов приложения, и о том, какой тип управления данными мне потребуется реализовать. После этого я реализую какой-нибудь гибкий рабочий процесс, работаю над спринтами разработки и попытаюсь представить своим клиентам MVP. Мне нравится быть максимально прозрачным с моими клиентами и вовлекать их в гибкий процесс на каждом этапе пути.

Какие технологии вам нравятся, которые вы используете сегодня или о которых хотите узнать больше?
О боже, это большой список. Там так много классных вещей, в которые я давно хотел попасть. Я очень рад работать с некоторыми библиотеками JavaScript, которые предлагают возможности 3D-рендеринга, такими как 3D.js. Поскольку современные браузеры становятся все более мощными, я чувствую, что мы увидим увеличение количества сайтов, использующих 3D-материалы. Я также в восторге от использования ИИ для чат-ботов и других вариантов использования, мне не терпелось найти время, чтобы раскрутить сервер ИИ в Digital Ocean и поиграть с ним. Также! Библиотеки анимации React. Есть действительно талантливые разработчики, создающие крутые анимационные штуки. Не могу дождаться, чтобы найти время, чтобы поиграть с ними.

Вы только что закончили создание TAC, превратив его из установки WordPress в современный стек API — как это было?
Здание ТАС был взрыв! Работать в Cosmic над созданием сверхбыстрого API-интерфейса было как нельзя более гладко. я смог использовать Стартовый набор Cosmic React и приступайте к работе, используя потрясающий шаблон, наполненный NextJS и его возможностями SSR. У меня никогда не было проблем с Cosmic, и мне никогда не приходилось обращаться в службу поддержки. Вот как просто, легко и элегантно для разработчика начать работу с платформой. Мне нравится наблюдать за этой тенденцией, когда крупные компании, наконец, отказываются от неуклюжих систем, таких как WordPress/Drupal, и переходят на более современный веб-стек. Как Full Stack Developer, специализирующийся на React/Node, я очень рад будущему веб-разработки.

Серверная часть TAC основана на Node, Next.js и Express. Next.js используется для возможностей рендеринга на стороне сервера для SEO-оптимизации, а также для маршрутизации сайта. Next.js также упрощает интеграцию с babel и webpack, поскольку они встроены прямо в систему. Я использовал API маршрутизации Next.js для рендеринга шаблонов страниц для страниц с одинаковыми макетами дизайна. Внешний интерфейс TAC основан на React.js и самом популярном в мире фреймворке React UI, Material UI. Чтобы использовать Material UI с SSR, мне пришлось обернуть сайт в JSSProvider и использовать CSSBaseline. Для разработки я использовал Eslint в качестве линтера для более чистой и согласованной кодовой базы. Поскольку TAC использует javascript ES6, мне также пришлось реализовать очень небольшое количество полифиллов для преобразования ES6 в ES5, чтобы сайт работал с IE11. Некоторые известные модули узла, которые я использовал, были: React-Image-Gallery для галерей изображений по всему сайту, React-Masonry-Component для отдела новостей и Fetch для запросов API. Для почтовых сервисов/API я использовал nodemailer и mailgun.

Я начал создавать сайт с помощью Стартовый набор Cosmic React, что помогло мне сразу приступить к работе. Начало создания TAC началось с внедрения всех глобальных элементов сайта (Header, Footer, Favicon и т. д.). Поэтому я быстро создал несколько функций запроса javascript для извлечения данных из космических корзин с помощью Cosmic Node API. Я добавил эти глобальные компоненты в макет сайта main_app, чтобы каждая страница была обернута и отображена с помощью этих глобальных компонентов. Оттуда я проанализировал, какие страницы будут иметь повторно используемые компоненты на нескольких страницах или сайте, и создал представления компонентов для этих страниц на основе моего анализа. Оттуда я смог эффективно создавать дизайны страниц и реализовывать типы объектов в космическом ведре на лету. Когда мы приблизились к запуску сайта, я заметил проблемы совместимости с IE11 и должен был придумать решение. Сначала я собирался понюхать код браузера, чтобы отобразить что-то, что будет работать в IE. Вместо этого я реализовал Babel и несколько полифилов, чтобы решить любые проблемы совместимости.

Серия Cosmic JS Spotlight посвящена демонстрации разработчиков, создающих приложения с использованием современных инструментов. Чтобы оставаться на связи с нами Следуйте за нами на Twitter и присоединиться к беседе в Slack.