Фронтенд-розробка — сьогодні одне з найзатребуваних напрямків у IT-сфері. Представляємо до вашої уваги підборку з 9 відео, яка дасть гарний старт тим, хто хоче спробувати свої сили у фронтенді. Розбір даного багажу знань займає лише 12 годин.
1. З чого почати вивчення фронтенда? Верстка сайту HTML + CSS.
Вебінар з грифом «для початківців» не відкриє Америку, але дозволить засвоїти базис фронтенд розробки. Як організувати проект, підключити файли, перевірити працездатність CSS та HTML — все це ви дізнаєтеся з даного відео. Впевнене пояснення та зрозумілий схематизований відеоряд стануть розгорнутою відповіддю на розповсюджені питання початківців.
2. Chrome DevTools. Огляд основних можливостей веб-інспектора.
Ознайомлення з основними можливостями Chrome DevTools включає в себе обзор корисних функцій браузера Google Chrome. Розписано усе, починаючи з відкриття інспектора за допомогою гарячих клавіш та закінчуючи визначенням проблем сайту через вкладку Audits. Урок короткий, але ємний. Він допоможе розібратися з інструментарієм популярного браузера та ефективно його використовувати.
Рекомендуємо курс по темі
3. Знайомство з ECMASCRIPT 2015
Професійний фронтенд-розробник і викладач розповідає про ECMAScript 6. Вебінар заснований на презентації, кожен слайд якої доповнений практичним застосуванням теорії. Використовується Sublime Text, Node.js і транспайлер Babel. Вебінар інформативний і заточений під тих, хто тільки почав вивчати фронтенд.
Рекомендуємо публікацію по темі
4. Що таке Avocode? Повне керівництво по Авокод за 10 хвилин.
Короткий відеоурок, присвячений інструменту для верстання, працюючому з макетами популярних графічних редакторів (Photoshop, Sketch), Авокод. Інформація стосується визначення, призначення та використання програмної середи Avocode. У цілому, повний набор базових знань про незамінного помічника будь-якого верстальника.
5. CSS препроцесори
Як стало зрозуміло з першого уроку, фронтенд і CSS нерозлучні, і в цьому відео тема взаємозв'язку розкриється трохи краще. Що таке препроцесори CSS, навіщо вони потрібні і як їх використовувати — про все по порядку. Наголос робиться на недоліки каскадних таблиць стилю і той факт, що усунути ці самі недоліки непросто. Часто саме надбудови, які наділяють CSS новими можливостями, рятують ситуацію.
Рекомендуємо публікацію по темі
6. Використання CSS, JS та SVG анімації
Web-анімація — складний процес, у якого є велика кількість варіантів реалізації. В ході вебінара не тільки розкажуть, але й покажуть головні відмінності різноманітних засобів створення анімованих зображень. Цікаві яскраві приклади та порівняння допоможуть швидко розібратися в основах Web-анімації.
7. React – це просто
Смілива заява, але з цим доводиться погодитися, так як вебінар вичерпний, і в ньому ця JavaScript-бібліотека розкривається з усіх боків. У вебінарі йдеться про швидкість, універсальності і інші переваги React, які доповнюють знання про фронтенді. Крім того, наочна реалізація теоретичної частини дозволить «набити руку».
Рекомендуємо публікацію по темі
8. Посібник для новачків: як залити портфоліо на хостинг
Хтось скаже «Так що в цьому складного?», І цей хтось явно не новачок в цій справі. Тут же матеріал поданий таким чином, що зрозуміє будь-який зацікавлений у вивченні фронтенда. Слухач вебінару зможе завантажити портфоліо на хостинг, щоб зробити його доступним в інтернеті. Паралельно порушується прив'язка домену до хостингу.
Рекомендуємо публікацію по темі
9. JavaScript. Робота з API Telegram, YouTube, VK
Завершальний урок по фронтенду - як вишенька на торті. Що таке API, для чого потрібен і інші важливі питання розкриваються в повній мірі. Поряд з цим вивчається функціонал таких популярних сайтів і месенджерів, як VK, Telegram і YouTube.