http://sh.uploads.ru/B6KYq.png

Автор: Владилен Минин

Преимущества react

1 / React намного понятнее, чем angular. Для начала изучения фреймворков, с помощью более низкоуровневого подхода от react, можно понять полностью основную идею работы фреймворков. React прост в освоении.

2 / Проверенные рекомендации учат создавать компоненты, способные сделать большую базу кода JavaScript простой в обслуживании и легко управляемой.

3 / Третьим преимуществом react является то, что он работает с большинством загрузчиков и наборов инструментов — AMD, CommonJS, или globals; gulp, bower, npm, browserify, webpack, grunt, — удовлетворяя потребности современных javascript-разработчиков.

4 / React намного удобнее кастомизировать лучшими решениями в целях реализации той или иной задачи, что позволяет в большей степени контролировать ваше приложение. Такой unix-подход уже очень хорошо зарекомендовал себя на рынке и пользуется большой популярностью.

5 / Так же плюсом будет то, что принятие react не является рискованным решением «все или ничего». Библиотека хорошо сочетается с большинством существующих баз кода (даже с устаревшими MVC) и интегрируется с существующими платформами пользовательского интерфейса.

6 / Дизайн react идеально сочетается с асинхронными серверными архитектурами для адаптации к будущим технологиям.

7 / Седьмое преимущество - фреймворк react.native, с помощью которого вы сможете создавать нативные приложения для мобильных платформ, таких как android или ios. То есть, выучив подход react, вы сможете также писать на нем, на языке javascript, при этом на выходе получать готовые мобильные приложения. Очень удобно, когда вы пишете сайт на react, и после внесения небольших изменений в код, получаете мобильное приложение под вашу систему.

8 / И последнее, но не по важности, это феноменальная производительность фреймворка - при разработке больших приложений на javascript большое внимание нужно уделять быстродействию, и react нам это обеспечивает, так как он является самым высокопроизводительным фреймворком.

Описания уроков:

Продвинутый Javascript

Урок 1. “Инструменты разработчика”. Вы узнаете, какие инструменты используют профессиональные разработчики
Урок 2. “Работа с DOM”. Вы узнаете, какие особенности есть при работе с DOM деревом
Урок 3. “События”. Вы узнаете тонкости работы с событийной моделью
Урок 4. “Типы данных и переменные”. Вы узнаете какие типы данных есть в javascript и их особенности
Урок 5. “Замыкания”. Вы узнаете, что такое замыкания и как их использовать
Урок 6. “Контекст”. Вы узнаете, что такое bind call и apply и в чем их отличие
Урок 7. “Классы”. Вы узнаете как создавать классы в старом стандарте языка
Урок 8. “Прототипированное наследование”. Вы узнаете как делать наследование классов
Урок 9. “Jquery ajax”. Вы узнаете как делать асинхронные фоновые запросы к серверу
Урок 10. “Eslint”. Вы узнаете, что такое eslint и зачем он нужен

ES2015

Урок 1. “Что такое es2015”. Вы узнаете, что такое стандарт javascript es2015
Урок 2. “Переменные”. Вы узнаете как создавать переменные и в чем их отличие
Урок 3. “Строки и шаблонизация”. Вы узнаете особенности работы со строками
Урок 4. “Объекты”. Вы узнаете особенности создания и работы с объектами
Урок 5. “Функции”. Вы узнаете как можно создавать функции
Урок 6. “Классы”. Вы узнаете как создавать классы
Урок 7. “Модули”. Вы узнаете про нативные модули в javascript
Урок 8. “Промисы”. Вы узнаете что такое Promises и как с ними работать

Организация front-end приложения

Урок 1. “Структура”. Вы узнаете из чего формируется инфраструктура современного приложения
Урок 2. “Создание с нуля”. Вы узнаете, как создавать проект с полного нуля
Урок 3. “package.json”. Вы узнаете, что такое package.json, как он облегчает работу и его особенности
Урок 4. “Webpack”. Вы узнаете основы работы со сборщиком webpack
Урок 5. “Настройка webpack”. Вы узнаете про продвинутую настройку webpack
Урок 6. “Настройка eslint”. Вы узнаете как подключить и настроить eslint к проекту
Урок 7. “Less”. Вы узнаете как работать с css препроцессором less

React js теория

Урок 1. “Зачем нужны js фреймворки”. Вы узнаете зачем нужны javascript фреймворки
Урок 2. “Сравнение с angular”. Вы узнаете про плюсы и минусы фреймворка react по сравнению с angular
Урок 3. “Как работает react”. Вы узнаете почему react такой быстрый и эффективный
Урок 4. “Создание структуры проекта”. Вы узнаете и получите полностью настроенную структуру проекта
Урок 5. “Создание первого компонента”. Вы узнаете как создаются компоненты
Урок 6. “JSX синтаксис”. Вы узнаете особенности jsx синтаксиса
Урок 7. “Props”. Вы узнаете, что такое props и как передавать различные параметры к компоненту
Урок 8. “State”. Вы узнаете, что такое state в компоненте
Урок 9. “Связь компонентов”. Вы узнаете как связать несколько компонентов
Урок 10. “Жизненный цикл компонента”. Вы узнаете что такое жизненный цикл компонента и зачем он нужен
Урок 11. “Коллекции”. Вы узнаете как выводить и работать с коллекциями или массивами в компоненте
Урок 12. “Роутеры”. Вы узнаете как работать с роутерами и как осуществлять навигацию между страницами

Redux теория

Урок 1. “Что такое redux”. Вы узнаете, что такое redux
Урок 2. “Как работает redux”. Вы узнаете про то как redux работает и почему это будущее современных приложений

React практика

Урок 1. “Изучение архитектуры”. Вы получите полностью рабочую и готовую для разработки структуру проекта и так же узнаете про все ее модули
Урок 2. “Настройка redux”. Вы узнаете и увидите по шагам как настроить redux
Урок 3. “Настройка devtools”. Вы узнаете как подключить специальные инструменты для удобной разработки
Урок 4. “Создание роутеров”. Вы узнаете и увидите как создать расширяемую систему роутинга
Урок 5. “Страница 404”. Вы узнаете как создать роутинг для обработки несуществующих страниц
Урок 6. “Главная страница”. Вы научитесь создавать главную страницу приложения
Урок 7. “Главная страница и redux”. Вы узнаете как соединить главную страницу с redux
Урок 8. “Добавление функционала”. Вы научитесь добавлять дополнительные действия к списку элементов и обрабатывать их в redux
Урок 9. “Эмуляция асинхронности”. Вы узнаете как хранить данные в браузере у пользователя и как сделать асинхронные запросы
Урок 10. “Оптимизация страницы”. Вы научитесь оптимизировать код страницы под redux
Урок 11. “Страница списка”. Вы научитесь создавать страницу списка элементов
Урок 12. “Страница детального отображения”. Вы научитесь делать страницу для детального отображения каждого элемента списка
Урок 13. “Абстрактный компонент модального окна”. Вы узнаете как создать компонент модального окна, которое работает на redux и которое динамически создает свое содержимое, то есть модальное окно будет всего одно на все приложение
Урок 14. “Модальное окно редактирования”. Вы узнаете как на основе компонента модального окна создавать окно для редактирования элементов списка
Урок 15. “Модальное окно удаления”. Вы узнаете как создать модальное окно для удаления элемента
Урок 16. “Создание формы и валидация”. Вы научитесь создавать формы для обработки данных пользователя с валидацией
Урок 17. “Продакш сборка”. Вы научитесь делать финальную минифицированную сборку проекта в 1 javascript файл.

Бонусы
Бонус 1. Создание компонента выбора даты (date time picker)
Бонус 2. Создание динамического поиска по большому объему данных
Бонус 3. Создание списка товаров с детализацией каждого из них и верстка с css flexbox
Бонус 4. JavaScript Jquery и AJAX с Нуля до Гуру

Складчик:

Скрытый текст:

Для просмотра скрытого текста - войдите или зарегистрируйтесь.


magnet-ссылка:

Скрытый текст:

Для просмотра скрытого текста - войдите или зарегистрируйтесь.