Старт обучения . Сегодня
только 16 из 20 мест
Контакты:
+38 (066) 02 97 109

Обучение по HTML/CSS + JavaScript
от Геннадия Караченцева

Профессия
Junior HTML coder

Получите новую, востребованною и высокооплачиваемую профессию с возможностью выйти на личный доход от 800$ в месяц и выше!

Обучение HTML/CSS + JavaScript

Мы знаем что у Вас нет времени!

Нет времени и желания снова поступать в ВУЗ,
тратить 5 лет своей жизни, и переучиваться чтобы получить новую профессию!

Мир не стоит
на месте

Технологии развиваются с сумасшедшей скоростью

Обучение тоже больше не будет прежним

И благодаря современным технологиям, гаджетам, и многолетнему опыту разработки и верстки сайтов мы можем помочь Вам сократить время обучения с 5 лет всего до 4 месяцев!

Стать Frontend Developer

Ваши данные надежно защищены!

Как будет двигаться обучение?

Начальные знания: новичок

Обучающая программа рассчитана на людей с нулевыми знаниями HTML/CSS и JavaScript. Курс будет понятен всем кто только решил начать свой путь в веб-разработке.

Когда начало?

Мы стартуем сегодня. Каждую неделю будет дваться на выполнение 2 онлайн занятия с домашними заданиями. 1 раз в неделю, по четвергам будет проходить сессия вопрос ответ.

Шаг1: Записи укроков

Все занятия записаны и находятся в вашем личном, обучающем, кабинете. Каждый Понедельник и Четверг вы получаете доступ к новому уроку.

Шаг 2: Домашние задания

Посл просмотра каждого урока, вы будете получать домашние здания, которые необходимо выполнять до следующего урока.
Внимание!!!
У нас действует система штрафов, если вы не вовремя сдали ДЗ без уважительной причины.

Шаг 3: Личный наставник

За вами будет закреплен личный наставник, человек который и в дождь, и в снег, днем и ночью, будет помогать Вам разбираться во всех аспектах обучения. Он проверяет ваше домашнее задание и дает корректировки

Шаг 4: Исправление ошибок

Посл корректировки наставником вашего домашнего задания, если были найдены "баги" (ошибки), вы их исправляете и продолжаете обучение.

Личный проект

За каждым учеником будет закреплен свой макет, который необходимо будет сверстать, на протяжении всего обучения. Он пойдет в ваше портфолио как первая работа.

Защита диплома

По окончанию обучения, чтобы получить диплом, Вам нужно будет защитить ваш проект, который Вы делали на протяжении всего обучения.
Внимание!!!
Если вы не вовремя сдавали домашние задания, не исправляли ошибки в работе, игнорировали советы личного наставника, то вам будет закрыт доступ к защите вашего диплома!

Что Вам даст обучение в курсе?

После прохождения курса Вы сможете начать свою карьеру в веб-разработке, а также получите мощную базу для дальнейшего обучения на продвинутых курсах.

Младший верстальщик

2 месяца обучения

от 400$/мес *

Базовые знания HTML/CSS
Базовый JavaScript

Верстальщик

2 недели обучения

от 750$/мес *

Опыт работы с HTML/CSS
Опыт работы с JavaScript

Frontend developer

1 месяц и 2 недели обучения

от 1000$/мес *

HTML/CSS + JS продвинутый
Sass, Gulp, node.js (базовый),
php (базовый)

* данные о зарплатах брались с сайта - https://jobs.dou.ua/salaries/

Кому подойдет курс?

Кто решил
начать
свою карьеру в IT

Всем кто впервые столкнулся с профессиональной HTML версткой  и хочет начать свою карьеру в IT.

Кто уже знает основы но ему не хватает наставника.

Всем кто уже знаком с HTML версткой, делает свои первые и уверенные шаги, но хочет ускорить процесс обучения и повысить свой уровень знаний.

Что входит в курс?

Младший верстальщик

2 месяца

  • Основы HTML верстки и основные теги.
  • Основы CSS стилей, умение строить сетки и переносить стили из PSD макет в верстку.
  • Основы JS, знакомство с языком, умение работать с переменными, циклами, условиями и умение встраивать уже готовые библиотеки.
  • Дополнительные знания по работе с Photoshop для верстальщика.
  • Дополнительные знания по работе с инструментами для верстальщика: Chrome Developer Tools, Breackets, Dreamveawer, Sublime Text, Notpade ++
  • Ваша первая работа в портфолио по HTML/CSS, сделанный вами Landing Page (одностраничный сайт).

Верстальщик

2 недели

  • Основы JS, знакомство с языком, умение работать с переменными, циклами, условиями и умение встраивать уже готовые библиотеки.
  • Дополнительный курс по созданию 2D игры. Ваша вторая работа в портфолио, по JavaScript

Frontend developer

1,5 месяца

  • Основы работы с препроцессором Sass
  • Учимся собирать проекты на Gulp
  • Знакомство с node.js
  • Базовые знания по PHP для верстальщика
  • Понятия, что такие CMS установка сайта на Wordpress
  • Знакомство с Bootstrap
  • Ваша первая сборка проекта по стандартам передовых IT компаний.

План занятий на весь курс

Неделя 1 - знакомство с HTML

На этой недели мы пройдем ознакомительные материалы и вводные занятия по базовым знаниям HTML, работа с редакторами и инструментами для верстальщика.

Просмотреть план занятий

ПН - Базовые знания по HTML

  • Что такое HTML?
  • С чего начинается HTML?
  • Строение HTML документа.
  • Что такое теги и строение тегов?
  • Простые текстовые теги (p, h1-h6, em, strong, ul, ol, span, div).
  • Комментарии в коде.
  • Создание ссылок.
  • Вставка изображений в верстку.
  • Атрибуты тегов.
  • Создание ссылки с изображением.
  • Типы тегов и их свойства (блочные, строковые)
  • Инструменты для верстки

ЧТ - Работа с редакторами

  • Breakets
  • Dreamveawer
  • Sublime Text
  • Notpade ++

Неделя 2 - знакомство с CSS

Начинаем работу с базовыми знаниями по CSS, понятия работы со стилями, правильная разметка страницы, синтаксис разметки, логика тегов и блочная верстка страниц.

Просмотреть план занятий

ПН - Базовые знания CSS

  • Что такое CSS стили?
  • Строение стиля.
  • Где создаются стили?
  • Изучение основных стилей CSS.
  • Селекторы.
  • Псевдоклассы.
  • Категории стилей.
  • Псевдоэлементы.

ЧТ - Разметка страницы

  • Синтаксис разметки
  • Ошибки разметки когда фон, когда картинка
  • Разметка блога (<article>, <section> и <div>)</div></section></article>
  • Логика тегов
  • Блочная верстка

Неделя 3 - работа с Photoshop

Обучаемся базовым знаниям работы с редактором Photoshop. Изучаем главные инструменты для верстальщика. Учимся переносить дизайн из PSD в HTML. Построение сеток и обучение верстки по макету.

Просмотреть план занятий

ПН - Photoshop для верстальщика

  • Настройка Photoshop для работы
  • Работа с интерфейсом и инструментами
  • Работа со слоями
  • Работа с текстом
  • Работа с цветом
  • Работа с фильтрами
  • Экспорт изображений
  • Псевдоэлементы.

ЧТ - Сетка и блочная разметка

  • Позиционирование блоков
  • Создание сетки при помощи inline-block
  • Создание сетки при помощи float
  • Как влияет box-sizing на блоки
  • Относительное и абсолютное позиционирование блоков
  • Очищающий стиль normilize.css

Неделя 4 - Flex-box и HTML формы

Переходим к изучению более продвинутой системы работы с блоками Flex-box, которая позволяет делать невероятно гибкие сетки. Также познакомимся с HTML формами и научимся их создавать.

Просмотреть план занятий

ПН - Flex-box

  • Что такое flex-box?
  • Свойство display:flex
  • Поддержка браузером
  • Построение сетки в 2, 3, 4, 6, 12 колонок
  • Выравнивание и сортировка блоков
  • Создание классических разметок, при помощи flex-box

ЧТ - HTML формы

  • Что такое формы?
  • Работа c input и его атрибутом type
  • Работа с textarea и select
  • Стилизация формы
  • Работа с тегом label
  • Тестирование формы отправка данных на сервер
  • Мастер-класс, магия label и css селектора +

Неделя 5 - Декоративные стили CSS и анимация

Как переносить сложные декоративные стили из PSD в CSS такие, как тень, закругление углов, градиенты и сложные фоны. Создание анимации при помощи CSS и правильного использования ресурса браузера.

Просмотреть план занятий

ПН - Декоративные стили

  • linear-gradient()
  • text-shadow
  • border-radius
  • box-shadow
  • магия background
  • filter

ЧТ - Анимация

  • Как работает анимация CSS и какие есть 2 главных фактора убрать нагрузку на браузер.
  • transform
  • animation
  • Работа с keyframe
  • transition

Неделя 6 - Введение в JavaScript

Начинаем изучать язык программирования и язык создания скриптов JavaScript. Узнаем как он работает и для чего он нужен. Напишем первый скрипт. Узнаем как работать с переменными.

Просмотреть план занятий

ПН - Введение в JavaScript

  • Что такое JavaScript?
  • Где создавать jS?
  • Для чего нужен JS?
  • Первая программа Hello World
  • Вывод сообщения alert, wright, console.log()
  • Отладка ошибок JS
  • Синтаксис написания строк в JS
  • Переменный в JS

ЧТ - Переменные

  • Типы: Строковый, числовые и булевые
  • Математические операции +,-,*,/,%
  • Изменения типа: parseInt(), parseFloat()
  • Работа со стоками: length, indexOf(), substr(), replace()
  • Сложение строк (контаминация): toString(), toFixed()

Неделя 7 - Циклы, условия, функции и объекты

Углубляемся в изучение JavaScript и на этой неделе поговорим о циклах (итерациях), условных операторах, функциях и объектах. Узнаем как ими пользоваться и их взаимодействие друг с другом.

Просмотреть план занятий

ПН - Циклы и условные операторы

  • while
  • while do
  • while do
  • Работа со стоками: length, indexOf(), substr(), replace()
  • Сложение строк (контаминация): toString(), toFixed()
  • Операторы >,
  • if, if else, else

ЧТ - Функции и объекты

  • Что такое функции?
  • Создание функций
  • Аргументы (значения) функции
  • return, return true, return false
  • Объекты и зачем они нужны?
  • Создание первого объекта персоны
  • ключи объекта, безымянная функция в объекте, переменная this

Неделя 8 - Массивы и работа с DOM HTML

Знакомимся с новым типом данных Массивом и учимся работать с DOM элементами. Научимся обрабатывать клики мыши, нажатие клавиш и другое.

Просмотреть план занятий

ПН - Массивы

  • Что такое массивы?
  • Создание массива
  • Индексация массива и работа со значениями индексов
  • Получить длину массива length
  • Функции работы с массивом: push, pop, shift, unshift
  • Манипуляции над массивом: slice, sort, revers

ЧТ - Работа с объектами DOM HTML

  • getElementByID
  • getElementsByClassName
  • querySelectorAll
  • Изменение HTML объекта innerHTML
  • Добавление style, classList , атрибуты
  • События мыши
  • Событие нажатие клавишь

Неделя 9 - Canvas и рисование в HTML

Приступим к изучению векторной графики в HTML и научимся рисовать при помощи холста Canvas на JS. Начнем подготовку к созданию будущей 2D игры.

Просмотреть план занятий

ПН - Рисование на Canvas в HTML

  • Что такое Canvas?
  • Создание сцены Canvas
  • Примитивные фигуры на Canvas
  • Добавление текста
  • Форматирование текста и позиционирование
  • Добавления изображения в Canvas

ЧТ - Начинаем создавать игру

  • Обработка событий клавиш: создание старта игры
  • Создание интервала построения событий игры (анимация)
  • Создание объекта игрока (песонажа) и его появления в игре
  • Добавляем движение персонажа влево и вправо
  • Работа с движением и скоростью, создание плавного хода героя
  • Добавляем возможность прыжка для персонажа
  • Добавление гравитации в игру

Неделя 10 - Коллизия и цель игры

Добавление, так сказать, законов физики в игру. Построение простой, 2D коллизии, чтобы элементы не проходили сквозь друг друга. Добавление графики в нашу игру.

Просмотреть план занятий

ПН - Коллизия

  • Добавляем платформы в игру
  • 2D Коллизия

ЧТ - Создаем графику игры

  • Добавляем платформы в игру
  • Добавляем цель игры
  • Добавляем графику, фон, прорисовка персонажа

Неделя 11 - Хостинг/Домен и PHP

Сверстать сайт это хорошо, но все сайты как мы знаем находятся в интернете. Как туда попасть и как разместить вас сайт в сети, расскажет данный урок. А также вы познакомитесь с первый серверным языком программирования PHP

Просмотреть план занятий

ПН - Хостинг и домен

  • Что такое Хостинг?
  • Что такое Домен?
  • Как выбирать хостинг?
  • Какой хостинг лушче всего использовать?
  • Где брать хостинг и домен?
  • Что такое FTP?
  • Как закачивать файлы на сервер?
  • Работа с виртуальным хостингом.

ЧТ - Знакомство с PHP

  • Что такое PHP?
  • Редактор для работы с PHP.
  • Основы работы с PHP.
  • Знакомство с коммандами echo, print_r, define(), include.
  • Работа со строками, сложение строк.

Неделя 12 - Углубляемся в PHP

В будущем, вам придется стлокнуться с движками и системами написанными на PHP. Зачастую необходимо будет менять верстку или внедрять новую верстку на сайты. Для того, чтоб это ументь делать, необходимо понимать как работает сайт написанный на PHP.

Просмотреть план занятий

ПН - PHP условные операторы, циклы, массивы и объекты

  • Условыне операторы в PHP.
  • Циклы и итерации в PHP.
  • Массивы и работа с массивами в PHP.
  • Работа с объектами в PHP.
  • Перебор массивов и объектов через foreach.

ЧТ - Классы и функции в PHP

  • Что такое классы в PHP?
  • Методы PHP классов.
  • Как работать с классами в PHP?
  • Конструктор и диструктор классов PHP.
  • Область видимости класса в PHP.
  • Статические функции класса в PHP.

Неделя 13 - SQL база данных

Любой сайт уже не работает просто с файлами. Все данные хранятся в специальнов виде, в базах данных. Чтобы уметь работат с ними, необходимо познакомится с язоком общения базы данных, чтобы научится писать запросы и получать данные из нее.

Просмотреть план занятий

ПН - База данных SQL

  • Что такое база данных SQL?
  • Как хранятся данные в БД?
  • Почему SQL?
  • Что такое запросы в БД?
  • Добавление данных в БД - INSERT.
  • Получение данных в БД - SELECT.
  • Изменение данных в БД - UPDATE.
  • Удаление данных в БД - DELETE.

ЧТ - PHP соединение с БД и работа с формой

  • Как производить подключение к БД в PHP?
  • Отправка запросов в БД при помощи PHP.
  • Работа с данными которые приходят после запроса в БД.
  • Вывод данных в HTML и динамическое построение страницы.

Неделя 14 - Сборщик проекта gulp

Когда вы создаете проект для крупного проекта, любая IT компания спросит вас, умеете ли вы собирать проект, чтобы его можно было перенсти на другой компьютер/сервер и развернуть его там. Навык который просто необходим для любого Junior Developer.

Просмотреть план занятий

ПН - Установка Node.js и Gulp

  • Что такое node.js и установщик npm?
  • Установка node.js на ваш компьюетр.
  • Что такое Gulp?
  • Установка Gulp на ваш компьюетр.
  • Инициализация проекта при помощи npm.
  • Соаздение вашего первого gulpfile.js
  • Первый код на Gulp.

ЧТ - Плагины Gulp

  • Работа с плагинами в Gulp и зачем они нужны?
  • Плагин gulp-autoprefixer.
  • Плагин gulp-concat.
  • Плагин gulp-uglifyjs.
  • Плагин gulp-cssnano.
  • Плагин del.
  • Плагин gulp-sass.
  • Плагин imagemin-pngquant.
  • Плагин gulp-imagemin.
  • Плагин gulp-cache.

Неделя 15 - Новый взгляд на CSS

Профессиональные Frontend Разработчики, не пишут стили привычным способом и чаще используют уже готовые решния. Это позволяет уменьшить число ошибоки и увеличить скорость. По этому навый знания работы с Sass препроцессором и фреймворком Bootstrap является обязательным.

Просмотреть план занятий

ПН - Препроцессор Sass

  • Что такое препроцессор Sass?
  • Преимущетсва Sass.
  • Детальный разбор плагина gulp-sass.
  • Вложенность Sass.
  • Миксины/функции в Sass.
  • Добавление библиотек в Sass.

ЧТ - Bootstrap

  • Что такое Bootstrap?
  • Зачем нужен Bootstrap?
  • Чем полезен Bootstrap?
  • Подключение Bootstrap в вашу верстку.
  • Работа с сеткой в Bootstrap.
  • Флексы в Bootstrap.
  • Компоненты Bootstrap.
  • Быстрая постройка интерфесов при помощи Bootstrap.
  • Стили в Bootstrap.

Варианты участи в курсе

Пакет "VIP"

Для максимального результата

Толко 4 места

Все записи уроков, домашних заданий и дополнительных материалов.

Кабинет обучения с неограниченным временем доступа.

Личный наставник на протяжении всего обучения.

Возможность задавать домашние задания на проверку.

Онлайн поддержка через скайп, fb закрытую группу, телефон, почту.

Доступ в закрытую группу участников для Frontend developer на Facebook и Skype

Возможность получить сертификат окончания курсов "Frontend developer".

2 индивидуальный занятия в неделю, по 40 минут, с Геннадием Караченцевым

Бонус  помощь в прохождении собеседования на работу и выполнении тестового задания

Бонус  Помощь в составление Резюме на работу в IT компанию.

Бонус  1 месяца поддержки во время прохождения испытательного периода на первой должности после получения работы.

Пакет "Premium"

Для тех кто ищет наставника

Все записи уроков, домашних заданий и дополнительных материалов.

Кабинет обучения с неограниченным временем доступа.

Личный наставник на протяжении всего обучения.

Возможность задавать домашние задания на проверку.

Онлайн поддержка через скайп, fb закрытую группу, телефон, почту.

Доступ в закрытую группу участников для Frontend developer на Facebook и Skype

Возможность получить сертификат окончания курсов "Frontend developer".

2 индивидуальный занятия в неделю, по 40 минут, с Геннадием Караченцевым

Бонус  помощь в прохождении собеседования на работу и выполнении тестового задания

Бонус  Помощь в составление Резюме на работу в IT компанию.

Бонус  1 месяца поддержки во время прохождения испытательного периода на первой должности после получения работы.

Пакет "Standart"

Для тех кто в теме

Все записи уроков, домашних заданий и дополнительных материалов.

Кабинет обучения с неограниченным временем доступа.

Личный наставник на протяжении всего обучения.

Возможность задавать домашние задания на проверку.

Онлайн поддержка через скайп, fb закрытую группу, телефон, почту.

Доступ в закрытую группу участников для Frontend developer на Facebook и Skype

Возможность получить сертификат окончания курсов "Frontend developer".

2 индивидуальный занятия в неделю, по 40 минут, с Геннадием Караченцевым

Бонус  помощь в прохождении собеседования на работу и выполнении тестового задания

Бонус  Помощь в составление Резюме на работу в IT компанию.

Бонус  1 месяца поддержки во время прохождения испытательного периода на первой должности после получения работы.

Внимание!!!
Если у Вас нет возможности оплатить весь курс сразу,
у нас действует рассрочка, оплата за каждый месяц.
Заказать в рассрочку

Кто будет Вас обучать?

Геннадий Караченцев

  • Основатель проекта WebLaboratory
  • Профессиональный коуч
  • Frontend Developer (более 6-ти лет)
  • Wordpress Theme Developer
  • Adobe Extention Developer (After Effect)
  • Интернет предприниматель
  • Специалист-эксперт по IT технологиям
  • Спикер онлайн встреч и живых семинаров, выступаю на радио и телевидении на тему разработки интернет сайтов и продвижения своего бизнеса.

Сертификат об окончании?

Сертификат об окончании

После того как Вы дошли до конца и смогли выполнить все задания в курсе, у Вас есть возможность получить доступ к защите вашего дипломного проекта.

Постановка задачи

Вам будет поставлена реальная задача, как на реальном проекте,
с ограниченными сроками на выполнение.

Получение диплома

Если Вы справляетесь, то Вы получаете сертификат об окончании того курса, на котором Вы  проходили обучение.

Гарантия

* Полный возврат денег в течение
30 дней, без вопросов.

Я даю 100% гарантию качества моих онлайн курсов.

Если в течение первой недели обучения Вы решите, что курс Вам не подходит
или обучения для Вас очень тяжело дается, я верну Вам полную стоимость курса.

И если Вы прошли обучение полностью,
до самого конца и ничему не научились, я верну Вам полную стоимость курса.

* возврат средств идет согласно договору возврата - Договор возвората

Отзывы учеников

Все коментрии можно посомтеть на офф странице
https://www.facebook.com/pg/weblaboratory404/reviews/

Счастливые обладатели дипломов

Александр Балабко

Алекснадр, прошел успешно обучение, бросил свою работа на заводе и перешел зарабатывать на фриланс.

Taras Ivantso

Тарас закончил обучение, прошел в нашем штате практику, успешно выпустился. Нашел работу в компании Tickets.ua, с нашей помощью успешно прошел испытательный срок и получил должность front end developer.

Александр Лобач

Александр прородолжил обучение, по Drupal и Wordpress. Ведет небольшой проект на Wordpress.

Варианты участи в курсе

Пакет "VIP"

Для максимального результата

Толко 4 места

Все записи уроков, домашних заданий и дополнительных материалов.

Кабинет обучения с неограниченным временем доступа.

Личный наставник на протяжении всего обучения.

Возможность задавать домашние задания на проверку.

Онлайн поддержка через скайп, fb закрытую группу, телефон, почту.

Доступ в закрытую группу участников для Frontend developer на Facebook и Skype

Возможность получить сертификат окончания курсов "Frontend developer".

2 индивидуальный занятия в неделю, по 40 минут, с Геннадием Караченцевым

Бонус  помощь в прохождении собеседования на работу и выполнении тестового задания

Бонус  Помощь в составление Резюме на работу в IT компанию.

Бонус  1 месяца поддержки во время прохождения испытательного периода на первой должности после получения работы.

Пакет "Premium"

Для тех кто ищет наставника

Все записи уроков, домашних заданий и дополнительных материалов.

Кабинет обучения с неограниченным временем доступа.

Личный наставник на протяжении всего обучения.

Возможность задавать домашние задания на проверку.

Онлайн поддержка через скайп, fb закрытую группу, телефон, почту.

Доступ в закрытую группу участников для Frontend developer на Facebook и Skype

Возможность получить сертификат окончания курсов "Frontend developer".

2 индивидуальный занятия в неделю, по 40 минут, с Геннадием Караченцевым

Бонус  помощь в прохождении собеседования на работу и выполнении тестового задания

Бонус  Помощь в составление Резюме на работу в IT компанию.

Бонус  1 месяца поддержки во время прохождения испытательного периода на первой должности после получения работы.

Пакет "Standart"

Для тех кто в теме

Все записи уроков, домашних заданий и дополнительных материалов.

Кабинет обучения с неограниченным временем доступа.

Личный наставник на протяжении всего обучения.

Возможность задавать домашние задания на проверку.

Онлайн поддержка через скайп, fb закрытую группу, телефон, почту.

Доступ в закрытую группу участников для Frontend developer на Facebook и Skype

Возможность получить сертификат окончания курсов "Frontend developer".

2 индивидуальный занятия в неделю, по 40 минут, с Геннадием Караченцевым

Бонус  помощь в прохождении собеседования на работу и выполнении тестового задания

Бонус  Помощь в составление Резюме на работу в IT компанию.

Бонус  1 месяца поддержки во время прохождения испытательного периода на первой должности после получения работы.

Внимание!!!
Если у Вас нет возможности оплатить весь курс сразу,
у нас действует рассрочка, оплата за каждый месяц.
Заказать в рассрочку

Стать Frontend Developer

Ваши данные надежно защищены!