Тут у Вадима Макеева вышло новое и интересное видео. Советую всем, кто уже в теме html, чтобы быть в тренде 😉
Да, это тот спикер, чьи крутые выступления я уже кидал сюда.
https://youtu.be/mG0VFWCTnZI
Да, это тот спикер, чьи крутые выступления я уже кидал сюда.
https://youtu.be/mG0VFWCTnZI
YouTube
🥨 Попап вместо селекта: ✨новые HTML-элементы✨ наконец-то решат старую проблему
00:00 Интро
00:22 В чём проблема?
01:50 Описание задачи
02:34 Недостатки селекта
04:36 Что нам нужно
05:22 Open UI
07:20 Попап вместо селекта
09:46 Стилизация попапа
11:45 Доступность и фокус
13:52 Кроссбраузерность
15:41 Выводы
16:59 Аутро
Нравится? Становитесь…
00:22 В чём проблема?
01:50 Описание задачи
02:34 Недостатки селекта
04:36 Что нам нужно
05:22 Open UI
07:20 Попап вместо селекта
09:46 Стилизация попапа
11:45 Доступность и фокус
13:52 Кроссбраузерность
15:41 Выводы
16:59 Аутро
Нравится? Становитесь…
Новый #тест уже готовится появиться ниже 😉
Чем занимается html-атрибут contenteditable?
(Очень интересная штука, на базе которой построена часть одного из моих курсов)
(Очень интересная штука, на базе которой построена часть одного из моих курсов)
Anonymous Quiz
18%
Позволяет вручную перетаскивать блоки на странице с изменением их положения
57%
Позволяет редактировать содержимое блока прямо на странице
8%
Создает приоритет для установки фокуса на этом элементе
17%
Позволяет скрипту быстро обращаться к этому элементу для редактирования
Последнюю неделю немного сменил вектор. Перечитал все негативные отзывы и выписал список необходимых улучшений для нескольких курсов, основным из которых будет js+react.
Да, я все читаю и вполне нормально отношусь к критике. Конструктив всегда идет только на пользу) А создать продукт, подходящий всем на 100% просто нереально. Но стараться улучшать можно всегда 🙂
Будет много мелких и не очень дополнений и обновлений сначала в части по базовому JS.
И, наконец-то, я дождался полноценного конструктора упражнений с автоматической проверкой прямо на платформе. Это был один из самых частых запросов, чтобы можно было сразу потренироваться с автопроверкой.
Вы только посмотрите сколько языков добавили 😍 (Раньше был только Python и Ruby)
Так что в свободное время добавляю полезные и интересные задачки и покрываю все тестами.
Да, я все читаю и вполне нормально отношусь к критике. Конструктив всегда идет только на пользу) А создать продукт, подходящий всем на 100% просто нереально. Но стараться улучшать можно всегда 🙂
Будет много мелких и не очень дополнений и обновлений сначала в части по базовому JS.
И, наконец-то, я дождался полноценного конструктора упражнений с автоматической проверкой прямо на платформе. Это был один из самых частых запросов, чтобы можно было сразу потренироваться с автопроверкой.
Вы только посмотрите сколько языков добавили 😍 (Раньше был только Python и Ruby)
Так что в свободное время добавляю полезные и интересные задачки и покрываю все тестами.
Если кому интересно, то процесс написания тестов идет прямо в браузере и выглядит вот так. Используется Jasmine и PhantomJS.
Да, да, отдельный модуль по тестированию тоже очень хочу запилить, тоже в планах.
А теперь предложение к вам. Если у вас есть в заначке интересные и не сильно большие задачки по JS, то можете скинуть их в комментариях. Я тоже их буду разыскивать и придумывать, но вы можете внести свою лепту в будущее других студентов 🙂
Да, да, отдельный модуль по тестированию тоже очень хочу запилить, тоже в планах.
А теперь предложение к вам. Если у вас есть в заначке интересные и не сильно большие задачки по JS, то можете скинуть их в комментариях. Я тоже их буду разыскивать и придумывать, но вы можете внести свою лепту в будущее других студентов 🙂
Нашел интересный инструмент по проверке фавиконок на сайтах.
Может подсказать в какую сторону копать, если на чем-то не отображается иконка: ссылка
#полезности
Может подсказать в какую сторону копать, если на чем-то не отображается иконка: ссылка
#полезности
realfavicongenerator.net
Favicon checker
Test the favicon of your site. Make sure it works on all platforms, including Google result pages. Our free favicon checker gives you insights to fix issues.
Книга
Я уже рекомендовал эту книгу выше, но хочу напомнить про неё всем.
Начало, именно эту страницу, стоит прочитать каждому, даже если вы еще не перешли на этап изучения JS.
Займет минут 5, но написано годно.
#полезности
Я уже рекомендовал эту книгу выше, но хочу напомнить про неё всем.
Начало, именно эту страницу, стоит прочитать каждому, даже если вы еще не перешли на этап изучения JS.
Займет минут 5, но написано годно.
#полезности
karmazzin.gitbook.io
О программировании | Выразительный Javascript
Новый #тест уже готовится появиться ниже 😉
Можно ли при помощи css создавать полноценные фигуры на сайтах? (звезда, ромб, пирамида, капля…)
Anonymous Quiz
37%
Да, но некоторые современные браузеры могут давать баги
56%
Да, без проблем
7%
Да, но только в комбинации с js
1%
Нет
В комментах несколько человек попросили актуальные промокоды на скидки. Кому нужно - ловите или делитесь с друзьями/знакомыми:
Web-разработчик
JS + React
Практический JS
Админка на React+PHP (до конца дня 22го января)
Wordpress
Напомню, что они применяются при переходе по ссылке.
Все, кроме одного действуют до 10 утра 24го числа.
Web-разработчик
JS + React
Практический JS
Админка на React+PHP (до конца дня 22го января)
Wordpress
Напомню, что они применяются при переходе по ссылке.
Все, кроме одного действуют до 10 утра 24го числа.
Как подтверждение теста выше, посмотрите на эти примеры: ссылка
Немного фантазии, псевдоэлементов, парочка свойств - и можно создавать уйму всего 🙂
Особенно полезными бывают стрелки, сердечки и звездочки.
#полезности
Немного фантазии, псевдоэлементов, парочка свойств - и можно создавать уйму всего 🙂
Особенно полезными бывают стрелки, сердечки и звездочки.
#полезности
Про CSS
CSS-фигуры
Статьи про CSS и SVG
Вообще, CSS и анимации на нем - это целый мир. И те, у кого много времени и энтузиазма создают что-то невероятное.
Несколько красивых примеров использования только CSS ниже:
3D комната: ссылка
Работающие часы: ссылка
Параллакс звездного неба: ссылка
Симпсоны на чистом CSS: ссылка (Яна, честно взял ссылку из коммента выше 😅)
#полезности
Несколько красивых примеров использования только CSS ниже:
3D комната: ссылка
Работающие часы: ссылка
Параллакс звездного неба: ссылка
Симпсоны на чистом CSS: ссылка (Яна, честно взял ссылку из коммента выше 😅)
#полезности
pattle.github.io
The Simpsons in CSS
#проект
Нужен человек, который займется разработкой сайта для отеля в паре с дизайнером.
Сейчас есть старый сайт на modx и самописных кусках кода php. Заказчики хотят его переделать с новым дизайном и функционалом + чтобы был на Wordpress.
Готовы делать его с нуля, но нужен человек, который сможет сверстать, посадить на движок и дополнить нужным функционалом. И объяснить заказчикам технические детали: как работать с админкой и тп.
И оценить стоимость.
Будете работать в паре с опытным дизайнером, так что с вас технический опыт 🙂
Ценовая категория клиента средне-высокая.
Контакт дизайнера: @insuperposition
Пишите конкретно: кто вы, что умеете, портфолио и тп.
Успехов 🔥
Нужен человек, который займется разработкой сайта для отеля в паре с дизайнером.
Сейчас есть старый сайт на modx и самописных кусках кода php. Заказчики хотят его переделать с новым дизайном и функционалом + чтобы был на Wordpress.
Готовы делать его с нуля, но нужен человек, который сможет сверстать, посадить на движок и дополнить нужным функционалом. И объяснить заказчикам технические детали: как работать с админкой и тп.
И оценить стоимость.
Будете работать в паре с опытным дизайнером, так что с вас технический опыт 🙂
Ценовая категория клиента средне-высокая.
Контакт дизайнера: @insuperposition
Пишите конкретно: кто вы, что умеете, портфолио и тп.
Успехов 🔥
Что позволяет делать css-свойство object-fit?
Anonymous Quiz
11%
Регулировать масштаб элемента <figure>
58%
Определять, как содержимое тэга <img> заполняет свой контейнер
15%
Аналог свойства background-size
16%
Определять выравнивание контента внутри тэга <img>
Новый #тест выше 😁
Напомню, что существует интересное css-свойство, которое как раз и занимается выравниванием контента внутри тэга <img>. Это последний вариант из теста.
Оно называется object-position и про него стоит помнить для всяких экстраординарных случаев.
#полезности
Оно называется object-position и про него стоит помнить для всяких экстраординарных случаев.
#полезности
MDN Web Docs
object-position - CSS: каскадные таблицы стилей | MDN
CSS-свойство object-position определяет выравнивание контента выбранного замещаемого элемента внутри блока элемента. На областях блока, не покрытых объектом замещаемого элемента, будет отображаться фон элемента.
Никогда не лишним будет напомнить один из главных инструментов frontend-разработчика.
А именно великий caniuse , где вы всегда можете посмотреть поддержку любых свойств, событий, чего угодно в браузерах.
Или посмотреть на процент использования того или иного браузера/его версии: ссылка
#инструменты
А именно великий caniuse , где вы всегда можете посмотреть поддержку любых свойств, событий, чего угодно в браузерах.
Или посмотреть на процент использования того или иного браузера/его версии: ссылка
#инструменты
Caniuse
Can I use... Support tables for HTML5, CSS3, etc
"Can I use" provides up-to-date browser support tables for support of front-end web technologies on desktop and mobile web browsers.