HTML Academy
10.2K subscribers
5.27K photos
164 videos
4 files
3.29K links
Курсы по веб-разработке: вёрстка, программирование, работа и комьюнити.
Наш секретный бот @HTMLAcademyKeksobot.

Вопросы по обучению @htmlacademy_sales

Ролики на YT https://www.youtube.com/@HTMLAcademyTV
Ролики на VK https://vkvideo.ru/@htmlacademy
Download Telegram
Даша — мама с двумя детьми — начала изучать фронтенд в 30 лет. Уже после первого интенсива ей удалось найти работу и начать карьеру в веб-разработке. Она поделилась с нами своей историей.
Четыре способа анимировать цвет текстовой ссылки по наведению.

https://css-tricks.com/4-ways-to-animate-the-color-of-a-text-link-on-hover/
​​А вот и она! Вышла новая глава курса «Знакомство с JavaScript» — «Коллекции и свойства элементов».

В этой главе вы познакомитесь с коллекциями элементов и циклом for of, научитесь с помощью свойств получать данные и управлять элементами, сделаете всплывающие подсказки и валидацию формы.

В конце вас ждёт испытание — запрограммировать виртуальную клавиатуру 💻
Адаптация SVG фавиконки к тёмной и светлой темам браузера с помощью медиавыражения prefers-color-scheme.

https://catalin.red/svg-favicon-light-dark-theme/
Читаем первые отзывы с 27 потока «HTML и CSS, уровень 1» и вот, что пишет выпускник Илья Исаченков:

«Скажу как есть, когда-то давно, ещё в 2008–2012 годах, я учился на программиста. Но по воле случая работать по этой профессии не пошёл. Спустя 7 лет случайно встретил однокурсника, который посоветовал мне Академию. Приехав домой, я зашёл на сайт и стал читать всю информацию, которая там только есть. После этого я оформил подписку на интерактивные курсы, и прошёл первые задания.

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

Спустя месяц я оформил в рассрочку профессию «Фронтенд-разработчик» и с нетерпением ждал, когда же он уже начнётся. А пока ждал, проходил интерактивные курсы.

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

На курсе обрёл очень много знаний, которые теперь буду применять на практике. Лекции — просто бомба, всё понятно, разбирают все мелочи. Учат разрабатывать и программировать сразу правильно и со всеми последними новшествами. Огромное спасибо Академии за то, что создали такой большой и полезный проект!»
Наш выпускник профессии «Фронтенд-разработчик» рассказал, чему он научился в «Лиге А.», и как после стажировки нашёл первую работу.

https://tml.io/4yobe
Поведение отрицательных внешних отступов в CSS.

https://www.quirksmode.org/blog/archives/2020/02/negative_margin.html
​​Мы создали чат для нашего телеграм-канала — вступайте, пожалуйста. Вы можете там задать нам вопрос, оставить отзыв на наши курсы, обсудить статьи в блоге или призвать на помощь коллег, если какая-то технология непонятна.
Как сделать размытие фона в CSS с помощью одной строки кода.

https://blog.prototypr.io/how-to-make-a-background-blur-in-css-with-one-line-of-code-e446c7236e60
Четыре года назад Лера Зелёная работала журналистом и подумать не могла, что станет автором интерактивных курсов. Она точно знает, с какими проблемами сталкиваются новички, и как их решать.

1. Программирование — это не моё

Если для вас программирование — новая сфера знаний, может показаться, что у других всё получается быстрее и лучше, что у них есть талант. Но правда в том, что талант и предрасположенность ничего вам не гарантируют. Главное — ваше желание и упорная работа. Не стоит опускать лапки, если что-то не получается с первого раза. Программирование не ваше только в одном случае — если вам это не нужно и не интересно.

Если вы встретите какую-то сложную тему, сквозь которую трудно пробраться, вот вам несколько советов, что с этим делать:

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

2. Страх сделать ошибку

Поначалу очень страшно писать код, боишься что-нибудь сломать. Поэтому хочется сначала придумать решение в голове, а потом писать код. Но это очень плохая тактика: если у нас в голове и есть интерпретатор, то работает он так себе. Поэтому лучше сразу довериться компьютеру. Тем более, программирование — комфортная среда для ошибок, особенно на этапе разработки: если вы ошибётесь, можно откатить изменения и программа снова будет работать. Пока вы учитесь код можно ломать сколько угодно, ничего страшного не случится.

Так что же делать:

- Будьте заранее готовы к ошибкам и относитесь к ним спокойно. Они случаются у всех, даже у опытных разработчиков.
- Сначала пишите код так, чтобы программа работала, а затем улучшайте его.
- Обязательно разбирайтесь, почему произошла ошибка: заглядывайте в консоль, гуглите, проверяйте работу программы после каждого внесённого изменения.
- Если ошибка мелкая и найти её не получается — отвлекитесь, а потом свежим взглядом посмотрите на ваш код.

3. Страх перед большими задачами

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

- Составьте хаотичный список того, что нужно сделать. Пишите туда всё, что надо сделать в вашем проекте.
- Каждую задачу разбейте на маленькие подзадачи — можно задать себе вопрос: «что нужно сделать, чтобы это появилось (заработало)?»
- Теперь нужно упорядочить хаотичный список из первого и второго пунктов. Пропишите план действий по списку. Наверняка, что-то нужно сделать в первую очередь, чтобы двигаться дальше. Например, сначала создавать базовую разметку, а потом уже навешивать обработчики на элементы.
- Начните движение по списку.
- Редактируйте план по необходимости.

И помните, чтобы научиться программировать, надо перестать бояться и начать программировать. Это работает только так и никак иначе. Не надо себя ругать и давить, если сегодня писать код не хочется и хочется сделать передышку. Это нормально: мозгу нужно время, чтобы отдохнуть и построить новые нейронные связи. Не нужно упарываться, нужно обязательно отдыхать и не требовать от себя всего и сразу прямо сейчас. Всё придёт постепенно!

Попробовать себя в программировании можно в курсе «Знакомство с JavaScript». Вы узнаете, как работает JavaScript в браузере, и научитесь оживлять интерфейсы.
Forwarded from Веб-стандарты (Вадим Макеев)
Выпуск №220: Цветовая гамма, история CSS, сборка в Rome, фильм про Vue, i18n, Google Fonts, геймдев, митапы. В гостях Александр Коротаев. Слушайте на Ютубе https://youtu.be/hCe_xaglY70, читайте на Медиуме https://medium.com/p/20637b9fb1ad
220. Цветовая гамма, развитие CSS, сборка в Rome, фильм про Vue…
Веб-стандарты
00:00:57 События
00:11:39 Широкая цветовая гамма
00:15:11 Этапы развития CSS
00:20:28 Вся сборка ведёт в Rome
00:26:16 Фильм про Vue.js
00:30:59 Интернационализация
00:36:30 Юбилей Google Fonts
00:40:11 Фронтендер в геймдеве
00:58:50 Зарубежные митапы
Новый поток курса «JavaScript, уровень 1» будет проходить с 26 мая по 29 июля. После каждой лекции вы будете работать над одним из двух личных проектов на выбор: «Кекстаграм» и «Кексобукинг». А учебным проектом станет демо-страница игры-платформера «Код и Магия». Доступна оплата в рассрочку.

Вот отзыв Александра Тимошенского, нашего выпускника с девятнадцатого потока:

«Перед приобретением интенсива «JavaScript, уровень 1» испытывал огромные опасения. Как мне кажется, это связано с тем, что сейчас какой-то бум на онлайн-школы, цель которых просто вытянуть деньги.

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

Теперь о самом интенсиве. В сети бытует мнение, что такая модель обучения — это «обдираловка», т.к. весь материал есть в свободном доступе. Для сторонников этого тезиса спешу заявить, что смысл не в том, что вам дают информацию, которую вы больше нигде не найдете. Смысл и преимущество интенсива в том, что вы получаете актуальную структурированную информацию с примерами и ответами на все ваши вопросы. Такой подход ускоряет обучение в 1000 раз.

На интенсиве также рассказывают про особенности или «узкие места» JavaScript, что даёт более обширное представление об инструменте. Очень приятные лекторы (никогда не забуду уроки русского языка от Игоря Алексеенко и «очень просто» от Александра Сушко). Очень интересные проекты и домашние задания по ним, из-за чего не было ощущения дедлайна, т.к. ручки сами открывали Sublime.

Итог. Настоятельно рекомендую всем, кто хочет научиться программировать на JavaScript и сменить профессию. Даже если уже знаете базис, вы пополните багаж знаний колоссально после прохождения.

P.S. Осторожно, затягивает!»
CSS библиотека с набором переключателей.

https://github.com/JNKKKK/MoreToggles.css
Популярные редакторы кода.

Подробнее про особенности каждого из них и доступные плагины можно почитать у нас в блоге.
Какой редактор кода используете вы?
Anonymous Poll
16%
Sublime Text 3
6%
Atom
59%
VS Code
19%
WebStorm
8%
Другой