Курси Front-end розробник

очно в Києві або онлайн

Після закінчення навчання видається диплом та заявки на роботу.

Програма навчання

Введення в HTML

• Дізнаємось що таке HyperText Markup Language і що він визначає. Обговоримо основні поняття Всесвітньої мережі: веб-сторінка, веб-сервер. Дізнаємося де знайти перелік всіх HTML-елементів і навчимося додавати розмітку в звичайний текст. Дізнаємося що таке атрибути і поставимо їх деяким HTML-елементам на сторінці. Вставимо на сторінку символи авторського права та торгової марки, дізнаємося про те, які спеціальні символи ще існують. Синтаксис та семантика HTML-елементів
• Лабораторна робота щодо створення сайту на тему заняття

Структура сторінки

• Розберемося коли використовуються елементи форматування тексту, а коли структурні елементи. Розмітимо сторінку index.html свого сайту та перевіримо роботу на валідаторе. Проведемо роботу над помилками, знайденими на сторінці.

Створення гіперпосилань та робота з ними

• Згадаймо поняття гіперпосилання та навчимося вставляти елементи гіперпосилань на своїх HTML-сторінках. Поговоримо про відмінності запису гіперпосилань та навчимося вставляти необхідні атрибути (дізнаємося як відкривати результат у новому вікні).
• На лабораторній роботі створимо розмітку для меню сайту.

Основи каскадних таблиць стилів CSS

• Довідаємося варіанти завдання стилів на сторінці. На лабораторній роботі підключимо стильовий файл для оформлення сторінки. Обговоримо базові поняття: селектор, властивість, каскад, наслідування, одиниці виміру.
• Навчимося писати найпоширеніші види селекторів, включаючи селектори псевдокласів та псевдоелементів.
• Змінимо оформлення наших сторінок: змінимо колір фону сторінки та її текст, підберемо шрифт та поставимо оформлення окремим частинам тексту.
• Лабораторна робота зі створення сайту на тему заняття

Розміщення зображень, списків та таблиць

• Навчимося розміщувати на своїх сторінках медіафайли: зображення. Розглянемо невпорядкований та впорядкований списки та оновимо за їх допомогою меню своїх сторінок. Подивимося як створювати таблиці та поєднувати в них комірки. Ознайомимося з CSS-властивостями, які допоможуть оформити вивчені HTML-елементи.

Iframe

• Навчимося вбудовувати зовнішні файли в сторінку. Поговоримо, куди можуть бути вбудовані наші сторінки за допомогою HTML-елемента. Розглянемо взаємодію посилань із iframe-елементами

Форми для збору даних

• Дізнаємося для чого призначаються і з чого складаються форми на веб-сторінках. Розглянемо більшість HTML-елементів форми: текстові поля, радіокнопки, прапорці/чекбокси, елемент вибору select та їх атрибути. Створимо на своїй сторінці форму зворотного зв'язку та обговоримо, як виконати її обробку

Макетування сторінки з CSS

• Навчимося змінювати оформлення меж, внутрішніх та зовнішніх відступів HTML-елементів (всі варіанти записів властивостей, а їх багато) Дізнаємося як задати ширину та висоту елементам. Торкнемося властивість float і змусимо потрібні елементи плавати. Навчимося керувати видимістю HTML-елемента Розглянемо та застосуємо окремі значення властивості display для розміщення елементів у більш складні макети, у тому числі inline-block та table-cell.

Таблиці стилів для друку та оформлення мобільної версії сайту - @media

• Створимо та підключимо стилі для оформлення нашої сторінки під час друку, поговоримо про інші застосування @media. Поговоримо про процес створення мобільної версії сайту та напишемо медійні запити (@media queries) для своїх сторінок. Дізнаємось про існування інших медіа властивостей (media feature)

Підготовка, розміщення та підтримка сайту в мережі

• Дізнаєтеся навіщо і як можна використовувати елемент meta для розміщення мета-інформації на сторінках. Подивимося як вибрати хостера, хостинг та розмістити сайт у мережу за допомогою FTP-клієнта. Почуємо спростити процес розміщення сайту в мережу 3 години
• Лабораторна робота зі створення сайту на тему заняття

Гнучка робота зі сторінками сайту

• Дізнаємося як розміщувати на своїх сторінках звукові та відео-файли. Обговоримо поняття мікророзмітки та перевірки її валідності. Торкнемося теми генерації вмісту сайту на льоту на сервері. Поговоримо про динамічну роботу з HTML-елементами та CSS-властивостями на сторінці у браузері. Визначимо, чи потрібен для вашого проекту HTML5 API
   

JavaScript

Основи програмування

• Вступ до JavaScript (ECMAScript-262)
• Огляд базових типів
• Оператори
• Вирази та інструкції
• Змінні та константи
• Маніпуляції з базовими типами
• Тривіальні типи

Керування конструкцій

• Цикл while
• Оператори інкременту та декременту
• Цикл for
• Цикл do while
• Керування конструкції if – else if – else
• Переривання та продовження циклу
• Керуюча конструкція switch
• Практикум: Практичне застосування керуючих конструкцій у JavaScript

Функції

• Поняття функцій
• Декларація функцій
• Аргументи функції
• Повернення значень
• Області видимості
• Функція-вираз
• Анонімна функція
• Практикум: Використання функцій під час процедурного підходу у програмуванні

Об'єктні типи

• Об'єктний тип: Об'єкт (Object)
• Властивості об'єкта
• Методи об'єкта
• Об'єктний тип: Масив (Array)
• Властивість та методи функцій
• Практикум: Використання об'єктних типів у JavaScript

Об'єктно-орієнтоване програмування

• Конструктори об'єктів
• Прототипи
• Класи
• Практикум: Застосування об'єктно-орієнтованого підходу у програмуванні

JavaScript. Використання бібліотеки jQuery

Вступ до jQuery

• Використання текстових редакторів
• Використання javascript-консолі в браузерах
• Вступ до jQuery
• API jQuery
• Вибірка jQuery
• Фільтрування
• DOM: відносини елементів
• Робота з елементами веб-форми
• Лабораторна робота

Події та маніпуляції з елементами

• Події jQuery
• Обробка подій
• Об'єкт Event
• Скасування подій
• Додавання елементів
• Маніпуляції з елементами
• Делегування подій
• Лабораторні роботи

Анімація в jQuery

• Базові ефекти
• Керування ефектами
• Метод animate()
• Дослідження анімації
• Корисний метод grep()
• Лабораторна робота

Практична робота з jQuery

• Створення коду плавного показу картинок
• Оптимізація коду
• Створення шаблонизатора
• Використання шаблонизатора Handlebars

Технологія та психологія працевлаштування:

Пошук роботи

• Моніторинг ринку праці, рівня запропонованих заробітних плат, умов, вимог за фахом.
• Пошук фірми: збір та аналіз доступної інформації про можливих роботодавців.

CV. Підготовка самопрезентації

• Складання CV. Важливі дрібниці під час складання Резюме. Найпоширеніша помилка – плагіат.
• Правила составления Резюме: системность, краткость, информированность.
• Супровідний лист.
• Надання рекомендацій.
• Телефонна розмова із представником фірми-роботодавця.

Організація зустрічі із роботодавцем. Співбесіда, тестування: стратегія поведінки. Психологічний тренінг. Питання найму, трудові та інші контракти

• Отримання запрошення на роботу: зустріч із роботодавцем; самопрезентація під час співбесіди.
• Питання роботодавця: типові, атипові, хитромудрі, на перевірку витримки, на правдивість.
• Варіанти можливої ​​співбесіди (Ситуаційна співбесіда. Стресова співбесіда. Групова співбесіда. Метод проективного інтерв'ю).
• Тести: професійні; особистісні; міжособистісні.
• Отримання роботи: укладання договору, види договорів, їх наслідки; випробувальний термін.
• Що обов'язково потрібно з'ясовувати претенденту до оформлення трудових відносин.
• Приклади поведінки «хитрих» роботодавців, «безкоштовна» робота.
• Алгоритм та правила «правильного» працевлаштування. 

Психологія спілкування з клієнтами:

Психологія успішного спілкування з клієнтами

• Імідж та його складові в очах клієнта
• Чи не вербальні характеристики іміджу - зовнішній вигляд, особливості пластики, міміки, невербальних характеристик мови.
• Вербальні характеристики – вибір мови спілкування, культура спілкування, грамотність мови (професійний сленг, слова паразити тощо). Важливість грані між дружелюбністю та фамільярністю, впевненістю у собі та самовпевненістю, вимогливістю та нахабством.
• Репутація та «легенда про себе», значення, прості способи створення правильної «легенди».
• Темперамент, характер, цінності та установки. Які особливості допомагають, а які заважають встановленню правильних стосунків із клієнтом.
• Підстроювання. Психоманіпулятивні техніки, що підвищують ефективність спілкування (переконливість мови, вміння викликати довіру і просто подобатися людям).
• Основи НЛП – заборонені слова та фрази, способи формування «позитивних формул». Мовні сигнали від клієнта, їх важливість та робота з ними.
• Заборонені теми для обговорення з клієнтами.
• Заборонені теми для обговорення між колегами у клієнтах.

Клієнт.

• Класифікація клієнтів за гендерними, віковими, соціальними та психологічними особливостями.
• Особливості сприйняття жінки – клієнта та чоловіка – клієнта.
• Особливості роботи з різними віковими категоріями.
• Соціальний статус клієнта та його значення.
• Психологічні особливості клієнта, способи виявлення, їх облік у роботі з клієнтом.
• Потреби, бажання та цілі клієнта – головний орієнтир у побудові роботи з клієнтом.
• Виявлення потреб, бажань та цілей клієнта за допомогою техніки активного слухання.

Конфлікт.

• Робота зі скаргами та запереченнями.
• Слова - конфліктогени;
• Види претензій: обгрунтовані, необгрунтовані, з метою шантажу;
• Необхідність привітання заперечень;
• Основні помилки під час прийняття скарг;
• Як правильно говорити "ні";
• Робота із стандартними претензіями;
• Чим можуть бути корисні Вам претензії та скарги клієнтів;
• Коли необхідно залучати адміністрацію до вирішення ситуації.

 Варіанти оплати:

Фізична особа:

• сплатити за навчання можна готівкою в касу навчального центру;
• карткою через термінал Приватбанку в офісі;
• на сайті карткою через калькулятор,
• квитанцією через Ощадбанк (Приватбанк),
• заключити договір через вайбер (телеграм) та отримати рахунок.

Юридична особа (підприємство):

• з р/р підприємства, де Ви працюєте, для цього потрібно заключити договір з навчальним центром:

1. для договору потрібно переслати нам на вайбер (098) 087-31-41 реквізити підприємства,
2. ПІБ директора та вказати на підставі якого документа він діє).

Наша адреса і телефони:

• Україна, Київ, метро "Вокзальна", ул. Патріарха Мстислава Скрипника (колишня вул. Миколи Островського), 58.
• (098) 087-31-41, (095) 527-00-70
• вайбер (098) 087-31-41.

Образование:

• Киевский институт рекламы, Графический дизайн и реклама
• Художественная школа №1
• Криворожский педагогический университет

Опыт работы:

• ДП "Эйвон косметикс Юкрейн", отдел маркетинга, специалист по компьютерной графике, веб-дизайнер, веб-разработчик
• АН "CREDO", менеджер по рекламе
• РИА "Перекресток" , веб-дизайнер
• Консалтинговая фирма "Nazcabusiness", веб-дизайнер

Висококласний ресторатор-практик з досвідом роботи викладача та бізнес-тренера.

Освіта:

• Національний університет харчових технологій - отримано звання доцента кафедри інформаційних систем та технологій
• Національний університет харчових технологій - диплом спеціаліста зі спеціальності "Менеджмент організацій"
• Національний університет харчових технологій - диплом спеціаліста зі спеціальності "електропостачання та електрозбереження"

Досвід роботи:

• Викладач SQL (не повна зайнятість)
• Інженер-програміст Авіаційного навчального центру
• Доцент, завідувач кафедри Комп'ютерно-інтегрованих технологій
• Доцент, заступник начальника центру інформаційних технологій

   

Освіта:

• Інститут Дизайну (Київ)
• Рік закінчення 2010

Досвід роботи:

• Web Designer - Бф Часослов з лютого 2010 по - теперішній час
• HTML-верстальник
• Front End програміст
• Дизайнер ( Web design HTML 5) відмінне знання програм HTML5 / CSS3/JS/ ReactJS/ Redux/Vue.js
• Впевнені знання HTML5, CSS3
• БЕМ
• CSS-препроцесор
• jQuery (native JS)
• Git (Bitbucket)
• Adobe Photoshop, Adobe II Illustrator. InDesign, CorelDraw.

Тримірні рішення для сайтів у програмі Blend4Web.

Досвід у розробці дизайну сайтів, UI, розуміння грамотного юзабіліті сайтів, розуміння макетування дозволів на різні екрани, уміння створювати макет у PSD для верстки.

Креативний та сучасний погляд на дизайн, інтерес до розвитку в дизайні.

• Макети Дизайн інтерфейсу для настільних та мобільних пристроїв
• Розробка процесу Дизайн графіки та інфографіки для корпоративних комунікацій
• Розробка контенту для корпоративного сайту
• Підтримка цілісності бренду
• Розробка фірмових комплектів зв'язку

Приклади:

• HTML5 сайт
• http://p.happygnom.com.ua
• http://q.happygnom.com.ua
• http://www.happygnom.com.ua/
• http://all.happygnom.com.ua/
• WEB Presentation
• https://urlid.ru/b48a

Досвід роботи:

• Програміст-практик з багаторічним досвідом розробок сайтів різної складності: від простих сайтів візиток з інтеграцією верстки на CMS Wordpress до складних інтернет-магазинів, порталів з проектуванням баз даних для індивідуальної системи управління контентом. У своїх проектах використовує технології: HTML5/CSS3 - блочна верстка сайтів з використанням нових технологій, що включають адаптивність сайту під різні розміри екрану, анімації та трансформації за допомогою каскадних таблиць стилів, кросбраузерність верстки; JavaScript/jQuery; PHP; CMS WordPress; MySQL. Викладач має великі знання в галузі веб-технологій.  Займався розробкою, просуванням сайтів та різних автоматизованих систем. Великий досвід роботи дозволяє йому вільно орієнтуватися у питаннях розробки та впровадження інтернет-рішень. Він створював та інтегрував веб-технології для компаній різних галузей та напрямків.