код и магия htmlacademy
Код и магия htmlacademy
Учебный проект «Код и Магия» 
1. Зарегистрируйтесь на Гитхабе
Если у вас ещё нет аккаунта на github.com, скорее зарегистрируйтесь.
Откройте репозиторий и нажмите кнопку «Fork» в правом верхнем углу. Репозиторий из Академии будет скопирован в ваш аккаунт.
3. Клонируйте репозиторий на свой компьютер
Будьте внимательны: нужно клонировать свой репозиторий (форк), а не репозиторий Академии. Также обратите внимание, что клонировать репозиторий нужно через SSH, а не через HTTPS. Нажмите зелёную кнопку в правой части экрана, чтобы скопировать SSH-адрес вашего репозитория:
Клонировать репозиторий можно так:
Команда клонирует репозиторий на ваш компьютер и подготовит всё необходимое для старта работы.
4. Начинайте обучение!
Репозиторий создан для обучения на интенсивном онлайн‑курсе «Профессиональный JavaScript», уровень 1 от HTML Academy.
About
Учебный проект «Код и Магия» интенсива HTML Academy «Профессиональный JavaScript, уровень 1»
Тренажёры
Начните проходить интерактивные задания прямо сейчас.
Если вы совсем новичок и хотите узнать, что такое HTML, CSS, JavaScript и PHP — этот тренажёр для вас.
Знакомство с веб-разработкой
На практике знакомимся с базовыми технологиями веб-разработки: HTML, CSS, JavaScript и PHP.
Тренажёр обновлён 23 июня 2021
Если вы хотите разобраться с основами HTML, CSS, JavaScript и PHP — вам сюда.
Знакомство с HTML и CSS
Изучаем основы HTML и CSS. На практике разбираемся с семантической разметкой и базовыми механизмами стилизации на примере небольшого сайта.
Тренажёр обновлён 21 мая 2021
Знакомство с JavaScript
Узнаем, как работает JavaScript в браузере. Научимся оживлять интерфейсы.
Тренажёр обновлён 3 февраля 2021
Знакомство с PHP
Добавляем PHP в разметку, работаем с веб-сценариями, данными и адресом.
Тренажёр обновлён 23 июня 2021
И ещё море крутых тренажёров для новичков и для опытных
Чтобы увидеть все тренажёры, нужно зарегистрироваться.
Практикум
Профессии
Информация
Услуги
Остальное
Регистрация
Нажимая кнопку «Зарегистрироваться», вы даёте своё согласие на обработку персональных данных в соответствии с «Политикой конфиденциальности» и соглашаетесь с «Условиями оказания услуг».
Восстановление доступа
Забыли пароль или потеряли доступ к профилю? Введите привязанную к профилю эл. почту, мы отправим вам письмо со ссылкой для восстановления.
Забыли привязать эл. почту к профилю? Напишите нам, мы поможем.
Кодгайд: почему, зачем и как?
«Пора выбрать единый способ оформления кота» — подумали мы с Сашей, когда перестали понимать, что происходит. Мы выпускаем много обучающего материала, и пора привести его в порядок.
Конечно, первым делом мы пошли смотреть на текущие гайды. Каждый нас чем-то не устраивал, поэтому мы решили создать собственный. Мы внимательно изучили и взяли всё лучшее из:
EditorConfig
Почему мы используем два пробела, а не что-нибудь другое?
Мы готовим код для презентаций, демонстраций, интерактивных заданий. Настроить длину tab не всегда представляется возможным. И если в вебе нас могло спасти свойство tab-size (у которого до сих пор плохая поддержка), то для остального никаких нормальных способов настроить tab нет. Поэтому наш выбор остановился на пробелах.
Мы выбрали два, а не четыре пробела, чтобы иметь возможность умещать код в небольших пространствах, таких как демонстрации или интерактивные задания.
Читабельность и единообразие
Главное правило, которым мы руководствовались в создании гайда — читабельность и единообразие. Нам не хотелось, чтобы учеников вводили в заблуждение сокращения. Код в первую очередь должен быть читабельным.
О сокращениях мы долго спорили внутри команды, и аргументы защитников сокращений сводились к одному — так быстрее писать. Но я считаю, что если хотите ускорить набор кода, то вам нужно использовать специальные инструменты: Emmet для быстрого набора кода или автодополнение в редакторах. А сокращением должны заниматься роботы. Не отбирайте у них работу, их не для этого создавали.
Класс — главный атрибут
Мы решили всегда использовать класс первым атрибутом. Таким образом можно сразу идентифицировать те стили, которые будут применены к элементу. К этому решению быстро привыкаешь.
Порядок свойств по важности
Чтобы не запоминать эти правила, мы подготовили конфиг для CSSComb, который будет автоматически сортировать свойства.
Впереди ещё много работы
Долгие баталии и споры по гайду закончены, и теперь мы будем планомерно обновлять контент по новым правилам.
HTML Academy
Repositories
taskmanager-demo
Архив демо-проектов «Менеджер задач» с курса «JavaScript. Архитектура клиентских приложений»
0 Updated Sep 20, 2021
htmlacademy.github.io
Мой первый хостинг
0 Updated Sep 17, 2021
codeguide
Стиль кода Академии HTML
2 Updated Sep 16, 2021
console.js
1 Updated Sep 10, 2021
eslint-config-htmlacademy
ESLint rules that uses on all HTML Academy professional courses
1 Updated Aug 18, 2021
intensive-php-giftube
Учебный проект «GifTube» для базового PHP-интенсива
0 Updated Aug 17, 2021
spec-tester
10 Updated Aug 12, 2021
research
Репозиторий исследований рынка от HTML-авторов
0 Updated Jul 28, 2021
cra-template-htmlacademy
Шаблон «Create React App» для курса «React. Разработка сложных клиентских приложений» от HTML Academy.
0 Updated Jul 27, 2021
eslint-plugin-htmlacademy
Плагин для проведения автопроверок
0 Updated Jul 23, 2021
configs
Общие файлы конфигурации для инструментов авторов
0 Updated Jul 22, 2021
guess-melody-demo
Архив демо-проектов «Угадай мелодию» с курса «React. Разработка сложных клиентских приложений»
0 Updated Jul 19, 2021
linthtml-config-htmlacademy
HTML Academy LintHTML config
0 Updated Jul 19, 2021
intensive-php2-turbocrm
Учебный проект TurboCRM для интенсива PHP2
0 Updated Jul 15, 2021
intensive-nodejs-criteria
Критерии интенсива «Профессиональный Node.js, уровень 1»
12 Updated Jul 12, 2021
Список того, что вы можете указать в HEAD
0 Updated Jul 7, 2021
code-and-magic-demo
Архив демо-проектов «Код и Магия» с курса «JavaScript. Профессиональная разработка веб-интерфейсов»
0 Updated Jun 17, 2021
stylelint-config-htmlacademy
HTML Academy Stylelint config
0 Updated Jun 16, 2021
yomoyo
Академия, ну ё-моё ☝️
0 Updated May 4, 2021
jessica-test-project
1 Updated Mar 31, 2021
md2html
Конвертер из MD в HTML
1 Updated Mar 12, 2021
kue-client
0 Updated Mar 10, 2021
hello-php
0 Updated Feb 18, 2021
htmlhint-config-htmlacademy
HTML Academy HTMLHint config
0 Updated Jan 27, 2021
firstaidgit
0 Updated Dec 15, 2020
queeeeeez
0 Updated Aug 25, 2020
sass.js
0 Updated Jul 28, 2020
example-auto-demo-create
0 Updated Jul 1, 2020
php-unparser
A JavaScript based code generator, to unparse glayzzle/php-parser compatible AST back to code.
0 Updated Jun 19, 2020
editorconfig-cli
1 Updated Feb 17, 2020
You can’t perform that action at this time.
You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session.
Интерактивные онлайн-курсы HTML Academy
Научитесь создавать и программировать современные веб-интерфейсы, начните карьеру в IT, оттачивайте своё мастерство.
Подробнейшие тренажёры
по HTML, CSS и JavaScript
Мы выбрали одно направление — фронтенд — и сделали самые подробные тренажёры о веб-технологиях. Одну тысячу пятьсот заданий в среднем проходят за три месяца.
8 частей тренажёров — бесплатно
Сто тридцать интерактивных заданий — бесплатные. После их прохождения вы сможете создать свой сайт.
Обучение на практике
С самого начала мы учим работать с живым кодом и самостоятельно решать задачи, приближённые к реальным. Также вас ждут испытания, принцип которых — «сверстай, как показано в образце».
От новичка до профессионала
Разобравшись с тренажёрами вы сможете принять участие в профессиональных курсах. Это профессиональные программы, где под руководством личного наставника вы научитесь создавать современные сайты и веб-приложения по критериям качества, принятым в веб-индустрии.
Учиться весело
Интересные, наглядные и затягивающие курсы, интерактивные интерфейсы, достижения — всё для обучения с удовольствием. И конечно же, Инструктор Кекс. Заскучать не получится.
1 507 Заданий и испытаний
1 043 186 Пользователей
89 957 664 Задания выполнено
Всё начинается с сущей шалости. «Я только попробую», — говоришь ты. А утром обнаруживаешь себя за компьютером и не можешь ответить, как долго просидел за ним, проходя онлайн‑курсы один за другим. Именно в этот момент всё выходит из-под контроля: базовый интенсив, продвинутый, JavaScript. И вот ты уже меняешь свою работу, жизнь и мечтаешь теперь об одном: стать ниндзя веб-разработки, в арсенале которого HTML, CSS, SVG и JavaScript. Ребятам из HTML Academy удалось невозможное: увлечь за собой многих «скучающих и сомневающихся» и занять их сложным, современным и очень классным делом. Ирина Смирнова, фронтенд-разработчик в Bookmate
Обучаясь в Академии, вы сэкономите огромное количество времени и научитесь правильно писать код, работать с реальными проектами и очень легко сможете продолжить свою карьеру фронтенд-разработчика самостоятельно. А также работа с наставником даёт большой опыт работы с кодом, потому что он всегда готов помочь в трудную минуту. Богдан Васкан, веб-разработчик в Synergic Software
Курсы Академии мне порекомендовали. Всегда скептически относился к вебинарам, но обучение в Академии изменило это представление. Учиться действительно интересно, занимательно, и, самое главное, не скучно. Интенсив Академии просто «вбивает» в голову нужные и современные навыки и знания, которые пригодятся вам в любимом деле. Павел Цыганов, преподаватель
Для меня знакомство с миром вёрстки началось с книжек и скринкастов на YouTube. Это было интересно, но непросто. И вызывало больше вопросов, чем ответов. В процессе появилось понимание, что без структуры и обратной связи от опытных практиков обучение может растянуться до бесконечности. В какой-то момент я наткнулся на сайт Академии. Это было что-то принципиально новое, интересное и увлекательное. Я стал проходить курсы по HTML и CSS. Это напоминало увлекательную игру, в которой хочется пройти на новый уровень. Сразу вспомнилась моя любимая игра World of Warcraft. Выполнил задание — получил достижение. В какой-то момент захотелось большего, и естественным продолжением стал интенсив. Месяц бессонных ночей, взорванный мозг, и вот, я смотрю на мой первый сайт. Потом на второй. И этот загадочный мир вёрстки начинает становиться понятным и уже родным. Для меня Академия стала прекрасным стартом, и я уверен, что будет отличным продолжением! Сергей Фоменко, ученик Академии
Если бы в школьную программу добавили обучение по таким интерактивным курсам, думаю, дети быстрей поняли, что им нравится, и лучше усваивали. Регулярно захожу на сайт, чтобы отдохнуть и вдобавок вспомнить, что давно не использовал в вёрстке. Советую всем тем, кто хочет держать себя в тонусе, и тем, кто учится. Поверьте такой подход обучения покажет свой результат, а если вы добавите ещё видео и книги, то пойдёт как по маслу. Поехали! Владислав Ридвановский, младший фронтенд-разработчик
HTML Academy — это новый уровень в онлайн-обучении. Я даже представить не мог, что такой уровень подачи материала может быть в онлайн. Академия учит тебя думать как профессионал, делать как профессионал. Плюс ко всему Академия — это семья и сообщество в одном лице, где каждый найдёт себе собеседника, ответ на волнующий его вопрос. Ни разу не пожалел, что год тому назад решил попробовать их курсы! Дмитрий Руднев, фронтенд-разработчик в Greensight
Обучение в HTML Academy позволяет быстро погрузиться и качественно прокачаться в сфере фронтенда. Круто стать частью огромного волшебного мира и так скоро уже оказаться одним из лучших среди новых коллег. Артемий Альтигин, системный администратор