Мы в сети

VK
FB

Оформите подписку!

 Введите Ваш E-m@il и
получайте свежие новости

Видеокурс
Бесплатный видеокурс "Angular 4: быстрый старт, первые результаты". (Владилен Минин - Webformyself)
Бесплатный видео урок

Бесплатный видео урок Бесплатный видеокурс "Angular 4: быстрый старт, первые результаты". (Владилен Минин - Webformyself)

Страница автора - Владилен Минин - Webformyself
Страница автора

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

Данный курс посвящен очень популярной технологии от компании Google - Angular 4. Angular - это javascript фреймворк, который позволяет делать реактивные сайты - Single Page Applications. В процессе данного курса мы рассмотрим базовые возможности Angular 4, начиная с установки и заканчивая созданием полноценного приложения фотогалереи. У нас будут реализован динамический моментный фильтр по записям, вывод коллекции элементов, которые мы будем с помощью ajax технологии забирать с сервера, и 2 страницы, которые будут взаимодействовать между собой. 

Смотреть видео:

Angular. Урок 1. Настройка Angular. (Владилен Минин - Webformyself)

Содержание:

  • Урок 1. Настройка Angular

В этом уроке вы познакомитесь с Angular 4. Для начала вы узнаете, чем отличаются Angular 1, Angular 2 и Angular 4 и поймете, что стоит изучать. Далее мы установим самым эффективным способом Angular 4 с помощью инструмента Angular CLI и сделаем первые изменения на нашем проекте, а также разберем как работает Angular 4.

  • Урок 2. Создание компонента в Angular 4

В данном уроке вы узнаете, как создаются компоненты в Angular 4, и как они взаимодействуют друг с другом.

  • Урок 3. Вывод списка элементов в Angular 4

В этом уроке вы узнаете, как с помощью специального синтаксиса Angular 4 можно выводить динамически элементы в шаблоне. Мы реализуем вывод элементов в шаблоне в зависимости от длины массива данных, заданных в typescript. Также в данном уроке вы узнаете, как связывать компоненты параметрами, как передавать параметры из родительского компонента в дочерние.

  • Урок 4. Сервер и сервисы в Angular 4

В этом уроке вы узнаете про 2 сущности Angular 4 - сервисы и класс для работы с ajax запросами. Вы увидите, как создаются сервисы, и как их нужно регистрировать. Далее мы расширим функционал сервиса, путем добавления в него класса HTTP, который позволит нам делать асинхронные запросы к удаленному серверу для получения списка пользователей. Далее вы увидите, как правильно расшифровать ответ сервера, и распарсить данные в любой удобный нам формат с помощью библиотеки RxJS, которая составляет часть ядра Angular 4. После этого мы выведем в шаблон все данные, и вы так же увидите какие есть тонкости этого процесса.

  • Урок 5. Директивы Angular 4

В этом уроке вы познакомитесь с таким понятием как директивы. Для начала вы научитесь добавлять обработку любых событий на элементах. Далее мы воспользуемся встроенной директивой, для динамического изменения стиля элемента. После этого вы увидите, как создаются и регистрируются свои собственные директивы. В ней мы будем слушать событие наведение мыши на элемент и добавлять класс, для красивого отображения элемента, но сделаем это самым эффективным способом от Angular 4, который кардинально отличается от обычной javascript реализации.

  • Урок 6. Пайпы в Angular 4: создание фильтра

В этом уроке вы познакомитесь с понятием пайпов в Angular 4. Для начала вы увидите синтаксис по применению стандартных пайпов, например, для изменения регистра текста. Далее вы научитесь создавать свои собственные пайпы. На этом примере мы создадим пайп, который позволит нам фильтровать список пользователей в динамическом режиме без перезагрузки страницы. Для этого нам потребуется еще разобрать понятие “2 way data binding” с использованием Angular Model.

  • Урок 7. Роутинг в Angular 4: создание страниц

В этом заключительном уроке вы узнаете, как с помощью Angular 4 можно создавать разные страницы. Мы создадим 2 роута - для главной страницы и для страницы настроек. Далее мы создадим 2 компонента, но уже не самостоятельно, а с помощью инструмента Angular CLI, для того, чтобы ускорить процесс. После этого мы создадим навигационную панель, для моментального переключения страниц. В конце урока вы увидите, как связать страницу настроек и главную страницу - на странице настроек мы будем менять количество загружаемых пользователей, и при переходе на главную страницу с сервера будет подтягиваться необходимое количество.

Добавить комментарий


Защитный код
Обновить