One more step
Please complete the security check to access codepen.io
Why do I have to complete a CAPTCHA?
Completing the CAPTCHA proves you are a human and gives you temporary access to the web property.
What can I do to prevent this in the future?
If you are on a personal connection, like at home, you can run an anti-virus scan on your device to make sure it is not infected with malware.
If you are at an office or shared network, you can ask the network administrator to run a scan across the network looking for misconfigured or infected devices.
Another way to prevent getting this page in the future is to use Privacy Pass. You may need to download version 2.0 now from the Chrome Web Store.
Cloudflare Ray ID: 5340316c2d894ec4 • Your IP : 188.64.174.135 • Performance & security by Cloudflare
htmlAcademy
Очень странный код
Помогите, мы не можем найти Кекса! Последний раз его видели, когда он отправился с Витахультом к его родителям во Фронтендск. Что-то тут явно нечисто. Агент Джонс и шериф МакКодер собирают поисковые группы, чтобы найти кота.
Вступайте в ряды одной из двух поисковых групп и с 1 по 5 января: проходите курсы, ищите подсказки и получайте улики. Команда победитель получит доступ ко всем платным курсам и вызовам с 6 по 10 января, а команда, занявшая второе место, получит доступ ко всем открытым за время игры. Чтобы ваша группа получила больше улик на старте операции и вырвалась вперёд, зовите друзей присоединиться к вам.
Присоединяйтесь к расследованию у нас на сайте.
HTML Academy ищет настанивков по JavaScript
HTML Academy, которые делают онлайн-курсы по фронту и беку, ищут наставников. Наставник — это опытный разработчик, который сопровождает своих подопечных студентов в течение всего интенсива и помогает им в обучении. И это частичная занятость, оплата от 12 000 до 20 000 рублей в месяц при нагрузке 6–10 часов в неделю (4 000 рублей за одного ученика).
Задачи наставника:
Вышел SDCast #57 с моим участием
Совсем недавно я рассказывал, что погостил в классном подкасте для разработчиков — Software Development podCAST. Вчера выпуск с моим участием стал доступен для прослушивания. Послушать можно на официальной странице или в iTunes. В подкасте я рассказал о программировании под платформу 1С, наставничестве в HTML Academy и митапе Ha.js. Полный анонс под катом.
Установка PHP 7.1 в Windows. Командная строка
В htmlAcademy стартовал первый базовый интенсив по PHP и я работаю на нем наставником. Студентам в рамках интенсива предстоит поднять рабочее окружение и это заметка нацелена упростить эту нелегкую для новичка задачу. Есть разные способы поднятия полноценного LAMP стека, но мы пойдем классическим путем. Настроим все компоненты по отдельности (без применения готовых комбайнов) и начнем с PHP (обязательно будет заметка с рассмотрением готовых сборок LAMP). Поскольку я планирую работать наставникам на интесивах по PHP и дальше, я собираюсь написать подобные инструкции для повторения в других ОС (Linux, macOS). Как говорится, лучше один раз попотеть, но потом всем станет проще. Итак, приступаем.
В htmlAcademy стартует первый базовый интенсив по PHP (Скидка внутри)
В htmlAcademy стартует пилотный выпуск базового интенсива по PHP. Интесив стартует с 18 апреля и продлится до 24 мая. Если вы хотели познакомиться и начать применять язык программирования PHP в проектах, то самое время обратить внимание на «Базовый PHP». Программа обучения как всегда насыщенная. В рамках интенсива будут рассмотрены такие вопросы, как:
— Основы синтаксиса PHP (управляющие конструкции, циклы, функции и т.д.);
— Режимы работы (cli, web);
— Проектирование и создание форм (передача параметров, отправка файлов и т.д.);
— Взаимодействия с СУБД (MySQL)
— и многое другое. Полная программа доступна здесь.
В htmlAcademy стартовал 9-й интенсив «Базовый JavaScript»
В #htmlAcademy стартовал очередной интенсив «Базовый JavaScript«. Постоянные читатели блога в курсе, что на базовом по JS я работаю наставником. Вчера подготавливал структуру каталогов для учебных проектов студентов и обратил внимание, что для меня это уже 6-й интенсив в роли наставника. Вроде только недавно начал, а уже пролетело аж пять интенсивов. Время летит с сумасшедшей скоростью.
Если вы собираетесь стать front-end разработчиком и давно подыскиваете хороший курс по изучению JavaScript, то рекомендую присмотреться к htmlAcademy. Курс обучения хорошо организован и продуман до мелочей. Здесь вам и теоретическую базу расскажут, и попрактиковаться вдоволь сможете. Программа очень насыщенная, скучать будет некогда.
P.S. Если решитесь на приобретение курса, воспользуйтесь моим партнерским кодом: 3162fcd29, получите небольшую скидку.
Как проверить существование функции в JavaScript
Решил сделать небольшую шпаргалку для своих студентов по интенсиву “Базовый JavaScript” в #htmlAcademy. Буквально недавно один из студентов задал вопрос: “Как проверить существование функции в JavaScript?”. Пример решения под катом.
Закончил базовый курс html и css в Codecademy, что дальше изучать/практиковать?
1) Без воды и на русском — Sorax
2) Я бы предпочел html5+css3, а проблемы старых браузеров решал по ходу их возникновения.
3) Можно брать сайты, но лучше не любые, а очень красивые и удобные. Мороки с ними будет больше, а значит и опыта больше. Да и красивый сайт верстать приятней.
4) В качестве редактора после многих экспериментов наилучшим показался Sublime Text
справа экран с наглядным результатом веб-страницы
1. HTML Academy и Loftblog. Но всё равно, очень рекомендую читать по максимуму на английском, учить язык. Потому что многие специфические вещи на русском очень сложно найти.
2. Только HTML5+CSS3. Отталкиваться от поддержки старых браузеров — это порочный путь, потому что вместо освоения новых технологий, вы будете заниматься освоением старых багов, потратите кучу времени, а спустя какое-то время этот навык окажется полностью бесполезным.
Крайне рекомендую сразу освоить следующие две вещи:
— Bootstrap — очень удобная платформа для создания сайтов.
— LESS — это очень просто и сэкономит вам очень много времени.
Сначала может показаться, что это сложно или возникнуть вопрос «Зачем это?», но чем раньше освоите, тем больше времени сэкономите в дальнейшем.
3. Я рекомендую дальше заниматься сугубо практикой и неизвестное гуглить. Возьмите бесплатные PSD-шаблоны, коими полнится интернет и верстайте. Чтобы было интереснее, сделайте сайт какой-нибудь для себя или кого-то из друзей. Потому что вёрстка в отрыве от назначенных целей для сайта — это не слишком осмысленное занятие.
4. Sublime Text, да. Ещё можете посмотреть Brackets — я бы может и им пользовался, если бы уже не был привычен к саблайму.
Образование | Артем Рудов: Как я прошел онлайн-курс HTML Academy и устроился на работу мечты
Наталья Баранова
Всего материалов: 585
Артем Рудов: Как я прошел онлайн-курс HTML Academy и устроился на работу мечты
Почему не стоит ждать четыре года, когда закончишь вуз? Как начать карьеру в it-сфере прямо сейчас? Замредактора Теплицы Наталья Баранова поговорила с выпускником онлайн-курса HTML Academy по профессии «фронтенд-разработчик» Артемом Рудовым из Ставрополя и его наставником Полиной Катышевой о том, почему важно не ограничиваться навыками, полученными в университете, и учиться новым востребованным специальностям в области веб-разработки.
После защиты диплома в университете Артем Рудов узнал, что выиграл конкурс HTML Academy на бесплатное обучение по профессии фронтенд-разработчика. Артем до сих пор с трудом верит в это везение. Именно после курса он с уверенностью сменил работу: попрощался с бюрократией в государственном учреждении и стал фронтенд-разработчиком в перспективной ставропольской студии веб-дизайна MindSell.
Фронтенд-разработчик занимается версткой шаблона сайта и созданием пользовательского интерфейса. Ежегодное исследование StackOverflow показало, что самая популярная профессия среди пользователей сервиса в 2020 году – это веб-разработчик (web developer). Все фронтенд-разработчики относятся к этой категории.
Вместе со вступительными экзаменами в магистратуру в 2020 году у Артема начался интенсив в академии. «Когда я шел на курс, я думал, что справлюсь, так как мне доводилось верстать, – вспоминает Артем. – Понимал общие процессы, помогал друзьям делать сайты. Но первое, что я выяснил в академии, – «моя уверенность оказалась преждевременной»: я завалил 1‑й уровень HTML. Понадеялся, что одновременное поступление в магистратуру не выльется в цейтнот, ведь знакомые мне вещи рассказывают на лекциях, и… не успел. В академии делают ставку не только на работоспособность проекта, но и качество кода, что и оказалось моей зоной роста. Пришлось договариваться о пересдаче, чтобы не было хвостов».
Несмотря на этот провал, прогресс в обучении Артем ощутил довольно быстро. Признается, что первые темы казались простыми, но со временем практически все знания стали в новинку.
«Второй и третий интенсивы (профессиональный HTML и CSS, 2‑й уровень и профессиональный JavaScript, 1‑й уровень) словно поставили перед собой задачу активировать мой мозг на 150% из 100! Во время обучения всегда испытываешь много переживаний, эмоций и адреналина. Особенно когда наступает время защиты личных проектов. И, сделав выводы после первого интенсива, я стал более грамотно распределять свое время и защитил HTML и CSS, второй уровень, на 100%, а JavaScript – на 97. Сейчас я не ставлю себе планку меньше 100 на других интенсивах», – делится впечатлениями Артем.
От процесса обучения студент остался в восторге. Понравились интерактивные задания, работа над личными проектами, доступность всех дополнительных материалов и никаких технических сложностей. «Особенно приятно, что каждый студент академии может выбрать среди красочных макетов тот, который соответствует его личному восприятию своих возможностей на данный момент», – отметил студент.
Особенно Артему запомнились креативные домашние задания (например, сделать редизайн сайта, подключить API). А еще он вспоминает, как его наставник Полина Катышева всегда помогала и одобряла предложенные идеи.
Артем с гордостью называет себя фронтенд-разработчиком. Но учебу в академии не забросил: сейчас он заканчивает второй уровень по JavaScript. И самое интересное: Артем попробовал себя в роли наставника. «Мой первый студент закончил интенсив с результатом 100 из 100! Я осознал, насколько мне нравится делиться знаниями, часто выступаю на местном митапе IT-разработчиков», – эмоционально рассказывает Артем.
Почему не стоит ждать, когда закончишь универ
Артем учился на кафедре информатики и вычислительной техники, направление выбрал осознанно, успевал совмещать учебу с работой, но практических навыков получил мало.
«Много теории, устаревшие материалы и обучение по старым спецификациям и стандартам не дадут 100% гарантии выйти высококвалифицированным специалистом. Сейчас я учусь одновременно в магистратуре и в академии. Стоимость обучения в обоих учреждениях практически одинаковая, но в академии я получил больше практического опыта, чем теоретического», – размышляет Артем.
Студент убежден: если вы хотите быть востребованным специалистом – без практики никуда.
В чем плюсы курса
Неоспоримый плюс – это доступность онлайн-обучения: заниматься можно из любого места. По словам наставника интенсива Полины Катышевой, курс построен таким образом, что, пройдя его, ты получишь достаточное количество базовых знаний, чтобы уже иметь возможность устроиться на работу.
«Работа на курсе максимально приближена к разработке на реальных проектах – те знания, что я получила, проходя сама эти интенсивы, я сейчас использую в повседневной работе. Поэтому после прохождения курса нет ощущения, что ты изучил что-то очень интересное и полезное, но понятия не имеешь, куда это применить». Полина Катышева, наставник интенсива
Более того, программа интенсивов пересматривается и обновляется от потока к потоку. «Безусловно, всю эту информацию можно найти в свободном доступе в Интернете, но обычно это статьи, относящиеся к какой-то конкретной технологии, которые не могут дать полного понимания, что с ней делать. А на лекциях HTML Академии не только рассказывают о технологии, но и сразу показывают, как применить ее на практике и где почитать о ней подробнее. И, конечно же, после прохождения интенсива у студента в портфолио уже есть полноценный проект», – объяснила Полина Катышева.
Почему важен наставник
С академией работают более трехсот наставников. Это те люди, что смогут ответить на вопросы, которых не было в лекции, или, наоборот, разъяснить то, что было в лекции, но до конца осталось непонятным. «Наставник делится своим опытом, знаниями, лучшими практиками, которые он применяет в своей работе. И, кроме того, может поддержать и приободрить студента, когда он совсем не молодец или, наоборот, большой молодец», – говорит Полина Катышева.
На голосовое общение с наставником выделено 5–6 часов. По мнению Катышевой, работу с наставником отчасти можно сравнить с командной разработкой, где более опытный коллега делится опытом с новоприбывшим.
Полина Катышева училась в академии на курсе по адаптивной верстке. А сейчас она наставник уже десятого потока интенсивов по верстке.
Как проходит обучение
По наблюдениям Полины Катышевой, студент может совмещать онлайн-курс с работой или учебой. Лекции проходят два раза в неделю по вечерам, с 19 до 21 по московскому времени, а после лекций следует домашнее задание.
«Некоторые задания требуют совсем немного времени, например, настройка работы c Github, с другими нужно посидеть подольше. Но в целом времени, отведенного на прохождение интенсива, вполне достаточно, если уделять выполнению заданий понемногу времени каждый день», – уточнила наставник.
Куда идти после курса
После прохождения базового интенсива по верстке можно устроиться младшим верстальщиком в компанию. Есть множество компаний, которые готовы брать к себе на стажировку. Можно попробовать себя на фрилансе. Выпускники курса «фронтенд-разработчик» выполняют три тестовых задания для трудоустройства.
У академии есть программа поддержки специально для выпускников, которая помогает устроиться в компании-партнеры и проект «Лига А». Он специально создан для того, чтобы выпускники тренировались на коммерческих заказах.
Спрос на профессию фронтенд-разработчика крайне высокий. На HeadHunter доступно более 1600 вакансий. Больше вакансий открыто в Москве, Санкт-Петербурге, Республике Татарстан и Новосибирской области. Зарплата в зависимости от региона варьируется от 65 тысяч рублей и от 260 тысяч рублей.
Кто учится
По словам Полины Катышевой, студенты приходят на курс с разным уровнем знаний. «Бывают те, кто занимается версткой давно, но знания довольно разрознены, и даже устаревшие, они приходят для структурирования имеющихся знаний и получения новых. Есть совсем начинающие, которые решают поменять сферу деятельности. Бывают студенты с опытом программирования, и даже разработки сайтов, но не умеющие верстать на хорошем уровне», – вспоминает наставник.
Новый мир
Полина Катышева рассказывает много историй, когда после курса студенты действительно находили любимое занятие, с легкостью меняли профессию. Например, Дарья Глаголь из Томска на третьем курсе педагогического университета совсем не хотела работать преподавателем. После прохождения HTML и CSS 1‑го уровня практически сразу устроилась на работу в офис младшим верстальщиком, где смогла набраться опыта и углубить полученные знания. Сейчас она работает уже фронтенд-разработчиком в компании SibEDGE.
Онлайн-курс HTML Academy по профессии «фронтенд-разработчик» пройдет с 6 августа по 26 декабря 2020 года. Стоимость курса – 59 тысяч 500 рублей. Чтобы записаться на курс, перейдите по ссылке.
Познакомиться с профессией, пообщаться с известными разработчиками, завести полезные контакты можно на конференции pitercss_conf, которая пройдет в Санкт-Петербурге 8 и 9 июня 2020 года. Для студентов колледжей и вузов у нас действует специальная скидка 1000 рублей по промокоду pitercsswelcome.
Взгляд в HTML6
Введение
HTML – простой язык веб-разработки, продолжающий развиваться и обновляться. Сейчас идет работа над шестой версией языка. HTML5, текущая версия HTML, считается одним из самых популярных релизов по сравнению с предыдущими версиями HTML.
Обзор HTML5
В HTML5 появились очень интересные функции, например, поддержка аудио и видео, а также возможность создания оптимизированных для смартфонов сайтов. Кроме того, он освободил разработчиков от использования атрибута type в тегах
и. Он позволил систематизировать контент, используя новые метки
,,и т. д. Однако, HTML5 все еще находится на стадии развития и не является законченным продуктом.
Понимание концепции HTML6
Представьте себе использование тега для присвоения логотипа веб-странице или тега . Было бы удобно, если бы Вы могли использовать тег
HTML6 – шестой релиз HTML с такой же структурой пространств имен, как у XML. Пространства имен XML помогут Вам использовать тот же тег, не конфликтуя с любым другим тегом. Например, тег, используемый в XHTML DOCTYPE:
В HTML6 можно будет отходить от определенных спецификаций тегов и использовать теги более понятные и удобные для разработчика.
Пример HTML6
html:title > Взгляд в HTML6 html:title >
html:meta type =»title» value =»Заголовок страници»>
html:meta type =»description» value =»Пример заголовка»>
html:link src =»css/mainfile.css» title =»Styles» type =»text/css»>
html:link src =»js/mainfile.js» title =»Script» type =»text/javascript»>
html:media type =»image» src =»images/xyz.png»>
html:a href =»/img1″>
html:a href =»/img2″>
h 1 > Заголовок h 1 >
h 2 > Подзаголовки h 2 >
h1 > Концепт HTML6 h1 >
h 2 > Понимание основ h 2 >
copyright > © 2014 copyright >
В примере кода HTML6 Вы видите теги . Эти новые элементы с двоеточиями принадлежат к спецификации W3C и HTML6. Например, элемент будет изменять заголовок в браузере, а покажет определенное изображение на экране. Все эти элементы определяются специально для пользователей и не имеют ничего общего с браузером. Они не более чем крюки для JavaScript и таблицы стилей. Они помогут сделать Ваш код более семантичным и правильным.
HTML6 APIs
В HTML6 теги будут содержать двоеточия, например, или и т.д. Давайте посмотрим на каждый тег, использованный в примере выше.
// этот тег эквивалентен тегу
в предыдущих версиях
Этот тег – эквивалент тегу . Его цель – получение данных и скриптов, управляющих отображением контента в теге .
Этот тег изменяет заголовок документа HTML в браузере. Он похож на тег
HTML Academy
Добавлен в индекс
Подписчики
Просмотры
Средний охват поста и ERR%
Публикации
Репосты и упоминания канала
Каналы, которые цитирует @htmlacademy
Последние публикации
То, что вы могли не знать о Chrome DevTools.
Какие есть проблемы со скруглёнными кнопками?
Если пропустили вчера — запись лайва с Вадимом Макеевым.
Обсудили зачем изучать вёрстку в 2020 году и что ждёт учеников на курсе «HTML и CSS, уровень 1», который стартует 20 января.
Прокачиваем навыки отладки JavaScript с помощью консольных трюков.
Открыта запись на профессию «React-разработчик», которая пройдёт с 20 января по 2 декабря 2020 года. Доступна оплата в рассрочку.
Программа состоит из пяти курсов на комфортном тарифе и длится одиннадцать месяцев:
— «HTML и CSS, уровень 1»
— «HTML и CSS, уровень 2»
— «JavaScript, уровень 1»
— «JavaScript, уровень 2»
— «JavaScript, уровень 3»
Вас ждёт непрерывное обучение, 45 часов голосовых консультаций с наставником, тонны ревью кода и как минимум пять проектов в портфолио.
После прохождения профессии вы станете сильным специалистом, который понимает, что он делает, и знает, как использовать инструменты правильно.
Успешные выпускники смогут пройти стажировку в «Лиге А.» и получить опыт работы с реальными заказами.
Как перестать бояться DOM, использовать его в полной мере и действительно начать любить его.
Как проходят лекции? Кто такие наставники и зачем они нужны? Что я буду уметь после обучения на курсе?
Если вы задаётесь этими вопросами — приходите на лайв с преподавателем курса «HTML и CSS, уровень 1»! Он пройдёт завтра в 18:00 по московскому времени. Запишитесь, чтобы не пропустить.
А ещё во время эфира объявим победителя розыгрыша бесплатного места.
Зачем и как делать семантическую разметку.
Самое популярное видео среди HTML Шортов — «Как правильно вставлять SVG».
Полное руководство по отзывчивым изображениям.
Четыре вопроса, которые помогут определиться, нужен ли вам PWA.
Слово недели — хлебные крошки.
Хлебные крошки обычно располагаются в верхней части страницы и имеют следующий вид: главная страница → раздел сайта → запись из раздела.
Использование Google API для доступа к вариативным шрифтам.
Отзыв выпускницы двадцать шестого потока курса «HTML и CSS, уровень 1» Кристины кузьменко:
«Переехав жить вместе со своим парнем-фронтендером в Амстердам, передо мной встал вопрос смены профессии. По образованию я журналист, но без идеального знания английского и голландского языков это совершенно бесполезная специальность в Нидерландах. Стать фронтенд-разработчиком нам показалось очевидным решением, ведь эта специальность открывает впечатляющие перспективы, плюс она здесь очень востребована. Ну и, конечно, двое фронтендеров в семье — лучше, чем один.
Но где учиться? С чего начинать? Местные курсы предлагают «сделать тебя full-stack за три месяца», пытаясь за этот срок рассказать обо всём и сразу (а в итоге — ни о чём толком). Хорошенько всё обдумав, мы решили отказаться от местного обучения в пользу «Профессии React-разработчик» в HTML Academy, так как были уверены, что там качество полученных знаний будет во много крат выше.
Академию я знала уже давненько: ещё полтора года назад я проходила там интерактивные курсы и изучала по ним вёрстку. Полученных тогда знаний мне хватило, чтобы начать изредка фрилансить как верстальщик, но хотелось их систематизировать, вывести на более высокий уровень. С этим мне и помог первый интенсив.
Несмотря на то, что я уже уверенно верстала и даже выполняла коммерческие заказы, из лекций я узнала много нового. Самое важное, что я вынесла для себя — как создавать и тестировать доступные интерфейсы. Эта лекция Вадима Макеева впечатлила меня больше всего и я твёрдо решила, что в своей деятельности фронтендера буду уделять много внимания этом вопросу. Тем более, что в Европе вопрос доступности интерфейсов крайне актуален.
Мне очень повезло с наставником (им стал Вадим Новаш). Во время работы над личным проектом, мы обсуждали не только один, но все возможные варианты реализации той или иной задачи. Мы выбрали самый сложный проект интенсива — «Девайс», так как хотелось выжать из учебы максимум. Макет оказался интересным и заставил в некоторых местах пошевелить извилинами. Но, несмотря на все трудности, мне удалось защитить его на 100%, чему мы с наставником несказанно рады.
Впереди еще четыре интенсива профессии и я уже предвкушаю новые вызовы. Надеюсь, что сумею успешно закончить всю «Профессию React-разработчик» (в идеале — все этапы на 100%) и найти хорошую работу в Амстердаме. Спасибо, HTML Academy, за то, что вы поднимаете культуру веб-разработки на высокий уровень. Вы — лучшие на просторах Рунета и, я надеюсь, что вскоре выйдете и на мировой уровень.»
Подробнее о том, как проходить обучение на интенсиве, можно будет узнать 6 ноября в 18:00 по московскому времени на лайве с преподавателем курса Вадимом Макеевым.
JAVA SCRIPT
Твой билет в мир фронтенда с нуля за 6 недель
6 недель
Длится обучение на нашем курсе
30 уроков
Удобный формат обучения
60 заданий
Для домашнего выполнения
Skills up
Прокачаете свои навыки и умения
А что после обучения?
ВЫ становитесь junior frontend developer
Технологии
Уверенно владеете JavaScript, есть опыт работы с React. Знаний и работ в портфолио достаточно для трудоустройства или успешного старта на фрилансе.
Портфолио
У вас есть репозиторий на гитхабе и три работы в портфолио, которых достаточно для трудоустройства или успешного старта на фрилансе.
Заработок
Сможете зарабатывать от 40 тысяч на полученных знаниях. Столько в среднем получает начинающий разработчик на старте карьеры.
Что нужно для старта?
Чтобы освоить программу курса, достаточно знать основы HTML. Если вы ещё не изучали этот язык, мы поможем: зарегистрируйтесь на курс, и мы бесплатно вышлем вам уроки HTML, которые помогут подготовиться к курсу JavaScript.
Быстрый результат
Мы убрали из программы всё лишнее, оставив только пользу. Поэтому обучение длится 6 недель, а не полгода.
Обучение на практике
Программа курсов состоит из 70% практики и 30% теории. В уроках — только то, что нужно в реальной работе. Всё остальное — в виде дополнительных ссылок.
Поддержка куратора
Куратор — это опытный наставник. Он поможет разобраться в теме, посоветует дополнительную литературу. Один куратор работает в мини-группе с 5-ю студентами.
Удобный формат уроков
Короткие видео-уроки до 30 минут, которые можно посмотреть в удобное время. В конце недели — прямая трансляция с преподавателем с ответами на вопросы.
Награда лучшим студентам
На тарифах с куратором и преподавателем работает балльная система. Войдёте в тройку лучших студентов — получите большие скидки на курсы и подарки от Академии.
Поддержка после курса
После выпуска вы попадёте в закрытое сообщество выпускников Академии, в котором можно найти партнёров. Там же вы сможете консультироваться с кураторами по дальнейшему развитию.
Программа курса
Основы JavaScript
Введение в язык, подключение javascript. Основы работы с Git.
Типы данных, операторы, методы и свойства.
Динамическая типизация данных в Javascript. Условия в JS.
Функции в JS, callback — функции, чистые функции, область видимости и замыкание.
Циклы в JS. Рекурсия.
Знакомимся с объектами и массивами, методы переборов и псевдомассивы
Подготовим наш проект для работы со страницей
JavaScript в работе
Доступ к элементам на странице. DOM, BOM. Дебаггер
Дебаггинг и работа с отладчиком кода.
Загрузка документа, События в JS, обработчики событий и особенности их работы, события мыши и клавиатуры.
Контекст вызова — this
ООП — Наследование, прототипы, конструкторы и классы
Особенности современного стандарта ES6. Интерполяция, деструктуризация, новый синтаксис
ООП ES6+, getters & setters. коллекции Map и Set
Скрипты и время выполнения. setTimeout, setInterval и requestAnimationFrame. Объект Date.
Параметры документа, окна и работа с ними
Работа с атрибутами, Дата Атрибуты. Регулярные выражения
Дополнительные технологии и улучшение качества работы
Работа с JSON, AJAX. Получение и отправка данных на сервер
Асинхронный JS. Promise. Контекст выполнения, асинхронное выполнение, стек вызовов и event loop
Подробно про Fetch API
Приём модуль. Инкапсуляция. Настраиваем Webpack и Babel, Полифилы
Обзор технологии которые стоит учить в будущем
Секретный бонус JS 10.0
Пишем своё первое приложение на React.
Первые деньги на разработке
Развитие себя как специалиста
План развития на год
Дипломный проект
Напишете интерактивный сайт или веб-приложение
6 новых вызова в HTML Academy
Учись в самой большой онлайн-школе английского в России*
Записывайся на бесплатный вводный урок
Уроки 1 на 1
с преподавателем
Конкурс учителей
39 человек на место
преподавателей в штате
Цифровой учебник
с тестами, заметками
и личным словарем.
Учителя проходят методический
и психологический отбор
и обучение.
Английский где удобно,
когда угодно. Нужен
только интернет.
Все материалы
в одном месте
Начинай учить английский в Skyeng и получи
годовой доступ ко всем курсам HTML Academy
Пройди бесплатный
вводный урок в Skyeng
уроков успешно проведено
*По данным РБК за 2015 год
студентов учат английский
Подарочный промо-код на годовую подписку в HTML Academy можно использовать самому
или подарить другу. А если у тебя уже есть подписка, то промокод продлит её на год
Нажимая, в принимаете условия Соглашения
Оплати любой пакет
уроков английского
Получи годовой доступ ко всем
курсам HTML Academy в подарок!
Внимание: акция действует только для новых учеников Skyeng
Интерактивные задания помогут освоить веб-технологии и создать сайт,
а интенсивные курсы подготовят к старту карьеры.
HTML Academy — это курсы для каждого,
кто хочет окунуться в мир вёрстки и программирования.
Я ♥ HTML Academy
HTML Academy учит верстать крутые сайты. Там есть бесплатные курсы по HTML и CSS для начинающих и продвинутые курсы, доступные по подписке. Есть курсы вводные, курс про формы, про таблицы, про анимации.
Базовый интенсив по вёрстке
Если уже прошли курсы или если у вас есть базовые знания, но не хватает практического опыта — пройдите интенсив. За месяц вы научитесь создавать с нуля целый сайт. Интенсив состоит из онлайн-лекций, интерактивных заданий и практики, практики, практики. Вам будет помогать наставник — этакий супермен, который читает ваш код, указывает на ошибки и подсказывает, как сделать правильно.
Продвинутый интенсив
Переросли базовый интенсив? Попробуйте продвинутый. Вас ждут адаптивные макеты, препроцессоры, методологии разработки, CSS-фреймворки и автоматизация работы верстальщика.
Базовый интенсив по Javascript
Вы научитесь программировать. Перестанете спать по ночам. Станете настоящим фронтэнд разработчиком. Научитесь делать интерактивные сайты. Вырастете из падавана в джедаи. Записывайтесь.
Промокод на скидку в HTML Academy
Используйте промо-код, чтобы получить скидку на интенсив. Просто введите его при оплате. Этот код подойдёт для любого интенсива. Код:
Я наставник
Учу студентов решать проблемы. Мотивирую кодить. Не принимаю халтуру. Заставляю переписывать код, пока он не будет прекрасен. Веду продвинутый по вёрстке и оба интенсива по JavaScript.
Если хотите попасть ко мне, напишите заранее на isqua@isqua.ru. Тест на внимательность: в теме письма укажите интенсив, на который вы хотите, например «Базовый JavaScript #394». В письме укажите ссылку на ваш профиль в Академии. Расскажите, зачем вам интенсив. Какие у вас планы во фронтенде на три месяца, полгода, год? Как интенсив вам поможет их достичь?
Пока у меня перерыв, не беру новых студентов.
Вступление на путь верстальщика
Итак, ты прочел название и заинтересовался. Сейчас я немного сумбурно, но все же введу тебя в курс дела, если ты совсем в «в этом вашем вебе» не понимаешь.
Что же такое верстка?
Если вкратце, то это процесс создания страницы сайта. Заметьте, статичной страницы, без каких либо скриптов. Верстальщик использует языки разметки, в данном случае подразумевается HTML5/CSS3, с помощью которых размечает страницу. Создает ее с самого зеро, то есть с пустого документа.
HTML – используется исключительно для разметки. CSS или каскадные таблицы стилей – для управления потоком документа, придания элементам, заранее созданным в разметке определенной формы, размещения их в том или ином порядке, манипуляций с текстом, размерами etc. Они идут в связке.
В итоге получается готовая страница сайта. Сайты верстают, чаще всего с psd макетов, которые предоставляет дизайнер. Макет разбирают в фотошопе. После верстки готовый документ не является завершенным сайтом. Это просто оболочка, причем статичная. Дальше идет обработка с помощью JS, подключение скриптов, работа серверных программистов и еще куча всего.
По сути, если собрался становиться именно верстальщиком, то необходимо не слишком большое количество скиллов.
Однако верстальщики сейчас на рынке не так востребованы. Намного чаще требуются именно фронтендеры. Фронт-енд – клиентская сторона создания сайта. То есть работа на стороне браузера. Если сильно обобщить, то она включает в себя как верстку, так и работу со скриптами.
Есть еще бэкенд. Бэкенд – серверная сторона, отвечает за взаимодействие с сервером, непосредственно работу сайта, оперирование данными от пользователей и т.д. В этой пасте бэкенду почти ничего не посвящено. Материалов у нас очень мало, ткак не то направление. Если кто поделится, будем рады пополнить свои закрома.
Так вот, фронтендер, даже самый начинающий должен знать сильно больше верстальщика. Тут лучше продублирую ОП-пост:
На данный момент фронтендеру новичку нужно учить больше, чем просто HTML/CSS. В частности необходимы продвинутые инструменты разработки, автоматизаторы, работа со скриптами, сам Js и Jquery, в перспективе что-то из Js фреймворков, MVC и прочего дерьма.
Не помешает навык натяжки оболочки на движок. Можете даже в бэкенд завалиться, если интересно. Но продуктивно это совмещать со всем тем стаком технологий, что нужны для фронт-енда, получится не у каждого, особенно на старте. Впрочем, если есть желание — попробовать можно, оно того стоит.
Полноценным фронтендерам, как специалистам нормального уровня, уже нужно добавлять кучу скиллов конкретно по их направлению. Тут что-то универсальное посоветовать сложно, так как направлений есть дохуя. Полюбому понадобится хорошее знание одного из языков программирования, что ориентированы на веб.
И это отмечу, далеко не предел, даже на начальном этапе расти есть куда. Вариантов масса. От псевдотрехмерных техник создания сайтов на параллаксе, до запила крутых приложений на JS, с перспективой перехода на мобильные платформы. Да что там говорить, даже игры умудряются пилить, и довольно удачно.
По поводу работы. Она есть. И места есть, и заказы есть, и конкуренция есть. Последняя причем есть везде. Если ты ноешь, что работы нет, значит плохо искал, либо живешь в глухом селе хуй знает где. Тогда сочувствую бро, тебе только в переезд или во фриланс.
Основные направления: фриланс или конторки.
О фрилансе ты наверняка слышал хоть немного. Есть местные или зарубежные биржи, где люди выкладывают свои заказы разных уровней. От «поправь шрифт на сайте для мобильных версий» до «запили мне рабочий аналог фейсбука за 30 долларов» (утрировано). Из зарубежных самый популярный – Upwork. Кстати в воркаче есть постоянно живущий тред по апворку, где можно узнать больше информации, советую читнуть тамошний фак.
Новичкам на фрилансе сложновато за счет сильной конкуренции (чаще всего вас просто будут игнорить заказчики), плюс при работе на зарубежных сайтах нужно знание английского, но это не значит, что не стоит и пытаться. Лично знаю людей, которые начинали работать с совсем уж мелочных заказов на какой-то пидорашкинской бирже, а затем перекатились на конкретный такой запил сайтов на апворке.
Конторки – местные кружки веб-макак локального или глобального уровня. Пилят от мелких сайтов торгашам с рынка, до довольно крупных продаваемых приложений (если тебе повезло в такую попасть со старта). Основная задача местных анонов – пробиться в одну из них. Собственно, материалы в треде как раз и предназначены для того, чтобы выбить ентри левел. Через несколько месяцев пребывания там, ты, если не конченый дебил, уже и сам будешь знать, что тебя ждет, что дальше делать и куда двигаться.
На фрилансе больше нужны люди оркестры, в конторках скорее необходим человек более узкой специализации. Но бывает всякое.
МАТЕРИАЛЫ, ПОЛЕЗНЫЕ ССЫЛКИ И СОВЕТЫ ПО ОБУЧЕНИЮ.
Сначала вкратце по процессу обучения: если совсем нихуя не знаешь, то лучше начинай учить именно HTML/CSS. Сверстаешь свой первый макет – учись верстать адаптивно. Почитывай материалы в инете, разные статейки, смотри интересные примеры, практикуйся, спрашивай непонятное в треде, читай литературу представленную здесь и ищи что-то сам. Постепенно придет понимание всех этих процессов, и че это вообще за хуйня. Как почувствуешь уверенность в верстке – перекатывайся на JS (мастхев, если хочешь развиваться). Можешь параллельно прикручивать готовые скрипты к своим сайтикам, смотреть что как работает. Ну а дальше работы не паханое поле. Двигайся, куда тебе захочется.
Необязательно вычитывать и проходить абсолютно все, что есть в пасте. Какие-то вещи тут повторяются, какие-то тебе и вовсе не нужны. Что-то возможно даже немного устарело. Чего-то не хватает. Сначала думай головой.
1. Первичные материалы в хаотичном порядке. Они часто дублируют друг друга. Можно проходить что-то одно по одному из направлений. Личные предпочтения выскажу ниже.
http://htmlacademy.ru/ — ультрагоднота, советую начинать изучение HTML/CSS отсюда. У них же есть интенсивы (обучающие видеоуроки, для лучшего понимания предмета, тоже мастхев) ссылки чуть ниже.
http://learn.javascript.ru/ — по JS на русском лютая годнота. Годнее только Флэнаган. Лучше начинать учить язык отсюда, потом уже книги.
http://codeschool.com/ — тут платно, но есть бесплатные курсы, годные вещи про jquery и git
http://htmlbook.ru/ Справочник. Каждый верстальщик пользуется им. Все непонятное смотрим там.
http://teamtreehouse.com — тут все платно, но первые две недели бесплатно, можно успеть пройти пару курсов, объясняют хорошо.
Интенсивы от академии:
Базовый интенсив HTMLacademy за 2015 год:
Продвинутый интенсив HTMLacademy за 2015 год:
Лично я бы советовал сначала браться за http://htmlacademy.ru/ . В идеале пройди базовые курсы у них на сайте, затем купи/скачай с торрента интенсивы, пройди их.
Курсы дадут понимание элементов верстки, но только разрозненное. Вряд ли ты сможешь после них сверстать полноценный сайт самостоятельно, это нормально. Для того и нужен базовый интенсив. После него ты сможешь делать фиксированные простенькие странички. Запили минимум 3 из представленных учебных макетов. Практика просто необходима.
Затем переходи на продвинутый интенсив. Твоя основная задача там — освоить продвинутые инструменты верстки и адаптивность. Сверстай парочку тамошних тестовых макетов применяя все вышеописанные технологии и приемы.
Дальше можешь выкачивать макеты с простор интернета и верстать уже их. Наращивание сложности приветствуется. Где не прописана адаптивность, тоже запили сам. Старайся в каждом новом проекте улучшать код. Черпай инфу из инета и литературы. Узнавай полезные приемы.
Не лишним будет ознакомиться с сетками на flexbox и прочими новыми фишками. Вот здесь уже можно проплатить, если есть желание, продвинутые курсы в академии. Месяц там стоит 300 рублей, и за это время ты вполне успеешь пройти все даже дважды. Это не то чтобы мастхев, но понимание работы ксс-анимаций, хороших практик верстки, различных продвинутых элементов в новой спецификации и т.д. там дается. Хотя я буду лукавить, если скажу что всю эту инфу нельзя найти в инете и в разрозненном виде.
Для работы понадобятся текстовые редакторы или среды разработки, тут уж решать надо самому.
Тут надо выбирать индивидуально. Если по HTML/CSS, то желательно, чтобы книга была не старше 2012 года, ну или хотя бы переиздана. Читай все что интересно. В любом случае это будет полезно.
http://www.ozon.ru/context/detail/id/20279391/ — «Создаем динамические веб-сайты с помощью PHP, MySQL, JavaScript и CSS» Весьма неплохая книга, бегло позволит ориентироваться в основах веб-технологий и понять, как же все это говно вместе работает.
http://habrahabr.ru/post/240219/ — «Выразительный Джаваскрипт» Хавербек Марейн. Вводна книга по JS и программингу в целом. Для новичков может быть сложноватой.
http://frontendbookshelf.ru/ — список полезных книг. Большинство актуальны, можно выбрать по языку, технологии и конкретному уровню знаний. Первооочередную литературу желательно брать оттуда.
http://scanlibs.com/ что-то типа хранилища айти книг. Скачать книги можно бесплатно. Там есть дохуя всего. Если в свободном доступе не найдете, попробуйте поискать там.
Учебное задания УЛЬТРА ХАРДКОР ЛЕВЕЛ. Если считаешь, что тебе мало учебной хуйни. Сделай это и положи к себе в портфолио. Будет что показать на собеседовании. На данный момент устарели, но попрактиковаться все-таки можно:
Появились новые тренировочные задания с ТЗ:
ПРИМЕРЫ ВЕРСТКИ ДЛЯ САМЫХ МАЛЕНЬКИХ:
Внизу видеокурс о том, как верстать PSD шаблон. Просто пример, чтобы посмотрели как выглядит работа и как верстают С НУЛЯ.
Лично я все же посоветую черпать инфу по базовой верстке из интенсивов, ссылки чуть ниже. Там ребята показывают весь процесс и делают это качественно. Никаких ошибок, минимум стилизации и отсебятины.
2. Если вы дошли сюда, значит уже что-то умеете, теперь пойдут профессиональные штуки, очень полезные для общего развития