Відмінності між версіями «Сучасні web-технології»
м (→Завдання до курсу) |
м |
||
Рядок 55: | Рядок 55: | ||
[https://codecraft.tv/courses/angular/ Learn Angular 5 For FREE] | [https://codecraft.tv/courses/angular/ Learn Angular 5 For FREE] | ||
+ | |||
+ | [https://coursehunters.net/course/udemy-react-angular-vue React, Angular, Vue - Сравнение и быстрый старт - Видеоуроки] | ||
+ | |||
+ | [https://coursehunters.net/course/udemy-vuejs-2 Vue JS 2: Полное руководство - Видеоуроки] | ||
+ | |||
+ | [https://coursehunters.net/course/udemy-angular-4-2-the-complete-guide Angular 6 (формально Angular 2) - Полное Руководство - Видеоуроки] | ||
+ | |||
+ | [https://coursehunters.net/course/kniga-ng-book-polnoe-rukovodstvo-po-angular-5-video Книга. Полное руководство по Angular 6 (+Видео) - Видеоуроки] | ||
+ | |||
+ | [https://coursehunters.net/course/angular-pro Angular Pro - Видеоуроки] | ||
+ | |||
+ | [https://www.udemy.com/the-complete-angular-master-class/ The Complete Angular Course: Beginner to Advanced] - платно |
Версія за 14:22, 11 вересня 2018
Завдання до курсу
Завдання h можна виконувати в codepen.io або подібних "пісочницях"
i1
Зробити опис всіх семантичних тегів що з'явились в HTML5
h1
Написати трьохколоночну структуру використовуючи HTML5 та BEM (Block Element Modifier)
Зробити два варіанти: flexbox та CSS Grid
the-complete-css-flex-box-tutorial
h2
Порівняння трьох CSS препроцесорів.
Розробити приклад з використанням BEM та обраного препроцесора.
h3
Розробити структуру зображену на малюнку 1.
Використовуємо flexbox або CSS Grid
h4
Порівняння HTML препроцесорів: Slim, Pug, HAML.
Розробити приклад (семантичний) сторінки новин з використанням обраного препроцесора.
s0
Що використати: JSON-pure API, RESTful API чи REST API + JSON?
проект
Групи 2-3 чоловіка
Корисні матеріали:
React, Angular, Vue - Сравнение и быстрый старт - Видеоуроки
Vue JS 2: Полное руководство - Видеоуроки
Angular 6 (формально Angular 2) - Полное Руководство - Видеоуроки
Книга. Полное руководство по Angular 6 (+Видео) - Видеоуроки