Эта серия статей написана в виде заметок, которые использовались во время семинара, организованного OKE Software Poland в Гданьске, Польша. Он не представляет собой исчерпывающую и полную серию руководств для кого-либо, но он будет использоваться для семинаров, предназначенных для разработчиков, не имеющих опыта создания SPA с использованием React. Я публикую его здесь, так как думаю, что некоторые люди могут найти его полезным. Пожалуйста, не стесняйтесь поправлять мою, если вы обнаружите, что я пишу чушь. Также имейте в виду, что английский не является моим родным языком, поэтому простите мне любые грамматические и лингвистические ошибки. Моя первая статья! Наслаждайтесь!
Ссылка на вторую часть:
Https://medium.com/@wojciech.bilicki/marvelous-thorough-react-tutorial-workshop-part-1-4e969c6f2b9
План
Часть 0 - Цель, что мы будем делать, инструменты.
Цель
Цель этого введения - познакомить участников с процессом создания приложения SPA с нуля. Поскольку я работаю в третьей компании за свою почти четырехлетнюю карьеру в ИТ, я слишком часто вижу, как разработчики интерфейсов застревают на использовании jQuery, добавляя теги сценариев в файлы представления, предоставляемые .NET framework (.cs), Django, PHP Frameworks (CakePHP ), Рубин на рельсах. Каждое из этих решений, построенных на основе MVC, предоставляет V-часть в виде статически сгенерированных файлов со стандартным HTML и некоторыми возможностями создания шаблонов, которые позволяют визуализировать данные. Вы можете узнать больше о подходе Django здесь:
Это все нормально и аккуратно. В этих решениях можно хорошо и масштабируемо управлять JavaScript, но я часто видел, как JS-код очень быстро выходит из строя и превращается в спагетти. Может быть, это отсутствие архитектуры в коде JavaScript при построении клиентских решений? Может быть. MVC (или, скорее, MC) действительно хорошо работает, когда мы создаем наши API, но мне часто казалось странным, когда я имел дело с JS. Я всегда искал лучший способ создания интерфейсных решений, чтобы сделать его более компонуемым и легким для понимания, вместо этого гигантского ада функций, плавающего в глобальном пространстве, выполняющего 20 или более функций, чтобы исправить какие-то незначительные или хуже невоспроизводимой ошибки. Потом я узнал о React. Решил использовать его в одном проекте, и тогда я понял, что это решение, которое я искал все время. Ну хватит моего рассказа.
Что мы будем делать
Это макет приложения, которое мы будем делать. Сделано в Эскизе примерно за 1,5 часа. Я не дизайнер, и со временем все может немного измениться, но я верю, что так и будет. Он состоит из двух экранов: Главный / Список и детали. В первой части семинара мы загрузим данные из файла .json. После того, как мы представим Redux, мы будем использовать преобразователи для отправки запросов Ajax.
Инструменты
Я постараюсь написать их, чтобы они были представлены во время семинара:
- NPM, Узел, Пряжа
- Код и плагины Visual Studio (но вы можете использовать любую другую IDE, которая вам подходит)
- Реагировать, ReactDOM
- Красивее
- ESLint
- Webpack и Babel
- Поток
- Redux
- Redux - Thunk
Я бы с удовольствием представил Jest (фреймворк для тестирования) на этом семинаре, но, поскольку у нас есть только 12 часов, чтобы обсудить все темы, я боюсь, что у нас не хватит времени. Я надеюсь, что тестирование приложения React / Redux станет темой нашего второго воркшопа.
Это все, чтобы знать. В части 1 мы познакомимся и объясним технологию и кодирование. Ура.
Ссылка на вторую часть:
Https://medium.com/@wojciech.bilicki/marvelous-thorough-react-tutorial-workshop-part-1-4e969c6f2b9
