Миниатюрная вселенная на CSS.

https://codepen.io/miocene/pen/dRLbGP

С помощью свойства transform, в CSS возможно масштабирование и поворот элемента целиком.

Но что, если вы хотите повернуть только фоновое изображение? Готового предложения в W3C для преобразования фонового изображения пока нет.

Автор предлагает выход из ситуации.

https://www.sitepoint.com/css3-transform-background-image/

Совместно фоновые градиенты и плавные переходы в CSS просто так не работают.

Автор предлагает обойти эту особенность и добиться эффекта перехода с помощью плавного изменения непрозрачности псевдоэлементов.

https://keithjgrant.com/posts/2017/07/transitioning-gradients/

Выпуск №78: Chrome 60, Stylo, Flash 1996—2020, статистика браузеров, сброс стилей, большой текст, подсказки, порядок, новинки ES, должен ли? — https://soundcloud.com/web-standards/episode-78

Руководство по разработке веб-интерфейсов от команды приложения Grab.

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

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

https://medium.freecodecamp.org/grabs-front-end-guide-for-large-teams-484d4033cc41

Обзор проекта интенсива «Базовый JavaScript» — https://htmlacademy.ru/intensive/javascript. Всего на выбор два проекта.

«Кексобукинг» — сервис размещения объявлений о сдаче в аренду недвижимости в центре Токио. Предполагается, что пользователи размещают свои объявления или могут просматривать чужие.

70% учеников прошлого потока выбрали именно его, в качестве личного проекта.

https://www.youtube.com/watch?v=g_GtH7At8hs&list=PLQJNT2fdCJnhoGNGl-kIVbxiiyJRZOmZZ

Анимированный телескоп на CSS.

https://codepen.io/Malek094/pen/QvPmYx

Опыт разработки лендинга для набора инструментов Connect командой Stripe.

Применение CSS-гридов, 3D, анимации и других современных технологий.

https://stripe.com/blog/connect-front-end-experience

Обзор второго проекта интенсива «Базовый JavaScript» — https://htmlacademy.ru/intensive/javascript.

«Кекстаграм» — сервис просмотра изображений. Пользователи загружают свои фотографии или просматривают чужие.

Его выбрали 30% учеников прошлого потока.

https://www.youtube.com/watch?v=02O-70qjxxg&list=PLQJNT2fdCJnhoGNGl-kIVbxiiyJRZOmZZ

Опыт разработки веб-приложения для видеоконференций MeetSpace.

Собрав требования и проведя анализ навыков команды было принято решение использовать JavaScript без сторонних фреймворков.

Что из этого получилось и как.

https://www.smashingmagazine.com/2017/05/why-no-framework/

Уже 7 августа стартует профессия «Фронтенд-разработчик», которая пройдёт до 27 декабря.

Программа объединяет три интенсива и даёт участникам дополнительные возможности:

— «Базовый HTML и CSS» https://htmlacademy.ru/intensive/htmlcss
— «Продвинутый HTML и CSS» https://htmlacademy.ru/intensive/adaptive
— «Базовый JavaScript» https://htmlacademy.ru/intensive/javascript

Оплату курса можно разделить на три равные части, которые нужно внести по графику:

— Первую часть для записи на программу.

— Вторую до 16 сентября.

— Третью, заключительную, до 12 ноября.

Для этого на странице оплаты нужно выбрать пункт «Оплатить по частям».

https://htmlacademy.ru/profession/frontender

Как правильно загружать посторонние шрифты?

Разберём вместе с Вадимом варианты подключения и их особенности.

https://www.youtube.com/watch?v=MTQ9FpT3ayc&list=PLQJNT2fdCJngOj0mGZaTcZRyfSBTCWHe1

Задавайте вопросы на странице — htmlacademy.ru/shorts или в комментариях к видео. На самые интересные мы ответим в следующих выпусках.

— Паттерны загрузки веб-шрифтов — https://web-standards.ru/articles/web-font-loading-pa..
— System Font CSS — https://github.com/jonathantneal/system-font-css
— Font Face Observer — https://fontfaceobserver.com/
— A Comprehensive Guide to Font Loading Strategies — https://www.zachleat.com/web/comprehensive-webfonts/
— Font Style Matcher — https://meowni.ca/font-style-matcher/
— Controlling Font Performance with font-display — https://developers.google.com/…/updates/2016/02/font-display
— Front End Center: Crafting Webfont Fallbacks — https://youtu.be/tO01ul1WNW8

Какого цвета грибочки?

https://codepen.io/ilithya/pen/ZKapav

Бабочки и чёрная материя на CSS.

https://codepen.io/yoksel/pen/BZwWOO