Видео 23
Просмотров 29 807

17:16

Для чего нужны сабгриды (CSS subgrid)

11:30

Как подготовить макет в фигме для фронтендера

37:23

Лучшие практики: как называть CSS классы

28:04

Подкаст Борьба с Вебом #2: веб без JavaScript

19:20

Лучшие практики: как прижать футер

10:17

Как понять, что вас учат не тому (фронтенду)

Небольшой гайд для новичков про то, как быстро опознать не самое качественное образование)
Лекция про поиск информации ruclips.net/video/envQ_xm1HJc/видео.html обновляемый конспект github.com/Vallek/web-pres/blob/master/summary/search_pres.md
Не рекомендуемые сайты в подборке vallek.github.io/web-links/index.html#bad
Популярные ошибки vallek.github.io/pages/projects/pop-mistakes
Эволюция раскладок vallek.github.io/pages/projects/layouts
Запишитесь на консультацию getmentor.dev/mentor/valera-hasler-3536
00:00 О чем видео
01:28 HTML
03:50 CSS
05:35 Библиотеки
07:47 Источники

Видео

17:16

Как работает GIT RESET

Просмотров 32Месяц назад

Объясняю, как устроена команда git reset и как ей можно пользоваться Статья git-scm.com/book/ru/v2/Инструменты-Git-Раскрытие-тайн-reset Моя подборка ссылок vallek.github.io/web-links/#git Запишитесь ко мне на консультацию) getmentor.dev/mentor/valera-hasler-3536 00:00 О чем видео 06:20 Как работает git reset

11:30

Для чего нужны сабгриды (CSS subgrid)

Просмотров 2,2 тыс.Месяц назад

Небольшой рассказ о том, что такое сабгриды и зачем они нужны с демо. Демо codepen.io/vallek/pen/JjQWgqv Не забывайте проверять на caniuse.com/ Запишитесь ко мне на консультацию getmentor.dev/mentor/valera-hasler-3536

Как подготовить макет в фигме для фронтендера

37:23

Как подготовить макет в фигме для фронтендера

Просмотров 1763 месяца назад

В этом видео я рекомендую веб-дизайнерам, как подготовить макеты в фигме, с которыми будет удобно работать фронтендерам-верстальщикам, чтобы никто не тратил лишнее время и нервы) Гайд по фигме для фронтендеров ruclips.net/video/qyk7N40uiQw/видео.html Что такое блочная модель doka.guide/css/box-model/ Подборка ссылок vallek.github.io/web-links/ Запишитесь ко мне на консультацию vallek.github.io/...

Лучшие практики: как называть CSS классы

28:04

Лучшие практики: как называть CSS классы

Просмотров 3615 месяцев назад

Обзор разных подходов к CSS Архитектуре, рассматриваем способы именования CSS классов от самого простого до методологий и фреймворков. Популярные названия классов github.com/yoksel/common-words Методы именования классов web-standards.ru/articles/css-architecture/ Какие проблемы решает БЭМ ru.bem.info/methodology/solved-problems/ next.js nextjs.org/docs/getting-started/installation Реакт и БЭМ h...

Подкаст Борьба с Вебом #2: веб без JavaScript

19:20

Подкаст Борьба с Вебом #2: веб без JavaScript

Просмотров 1065 месяцев назад

Высказываю свое ценное мнение на тему веба без JS, важности Progressive Enhancement и нативных технологий. И да, я неправильно произношу слово Enhancement) У всех есть JS да? www.kryogenix.org/code/browser/everyonehasjs.html О прогрессивном улучшении www.bram.us/2022/04/22/progressive-enhancement-and-html-forms-use-formdata/ В подборке ссылок vallek.github.io/web-links/#js Иллюстрация www.freep...

10:17

Лучшие практики: как прижать футер

Просмотров 3506 месяцев назад

Рассматриваем как стоит и как не стоит прижимать футер к низу страницы на разных CSS раскладках. 00:00 О чем видео 01:00 Демо проблемы 01:55 Плохие практики 03:24 Раскладка на флексбоксе 06:23 Раскладка на гридах Способ на флексбоксе ishadeed.com/article/viewport-units/#2-second-solution-flexbox-and-viewport-units-recommended Способ на гридах vallek.github.io/web-pres/layouts/pages/grid.html В ...

Лучшие практики: заголовки и подзаголовки HTML

20:59

Лучшие практики: заголовки и подзаголовки HTML

Просмотров 9376 месяцев назад

Рассматриваем, как стоит и не стоит делать заголовки и подзаголовки в HTML. История outline adrianroselli.com/2016/08/there-is-no-document-outline-algorithm.html MDN developer.mozilla.org/en-US/docs/Web/HTML/Element/Heading_Elements#usage_notes Спеки html.spec.whatwg.org/multipage/sections.html#headings-and-outlines-2 В моей подборке ссылок vallek.github.io/web-links/index.html#html

БОЛЬШОЕ ОБНОВЛЕНИЕ Подборки ссылок по Фронтенду

8:08

БОЛЬШОЕ ОБНОВЛЕНИЕ Подборки ссылок по Фронтенду

Просмотров 3066 месяцев назад

Обзор обновления подборки ссылок по фронтенду. Добавьте в закладки подборку vallek.github.io/web-links/index.html Подписывайтесь на мой твиттер _vallek

Подкаст Борьба с Вебом #1: будущее Фигмы, метрики Гугл и любимые браузеры

52:53

Подкаст Борьба с Вебом #1: будущее Фигмы, метрики Гугл и любимые браузеры

Просмотров 1007 месяцев назад

Пилотный выпуск подкаста про критическое отношение ко всему, что касается веба. В этом выпуске я размышляю о будущем Фигмы, новой метрике от Гугл и любимых браузерах. Обзор фигмы ruclips.net/video/qyk7N40uiQw/видео.html Новая метрика в web vitals web.dev/articles/inp Браузер Vivaldi vivaldi.com/ru/ 00:00 О подкасте 03:35 Будущее Фигмы 16:50 Новая метрика от Гугл 31:45 Мои любимые браузеры Забыл...

24:31

Сборка HTML на Node.js и Github Actions

Просмотров 1097 месяцев назад

Рассказываю про то, как сделан мой проект animatable-css и необычный метод сборки страницы с данными из api на Node.js и Github Actions. На 18ой минуте я рассказываю про push в экшене не совсем верно сказал. Это то, что будет происходить по пушу. То есть это такой же триггер сборки, как и расписание. Инструкция в базе знаний vallek.github.io/webdevtips/ru/build-static-node-github-actions Сам сп...

24:10

Мои любимые фичи в VS Code

Просмотров 2387 месяцев назад

Обзор трех вещей в редакторе кода VS Code, которые я использую каждый день и которые помогают работать эффективнее. Редактор ютьюба обрезал криво не то, что нужно было в конце и может еще какие-то места, извините) Про гит в подборке ссылок vallek.github.io/web-links/index.html#git Как менять цвета темы vallek.github.io/webval-blog/2018/08/26/vs-code-syntax-highlight.html Онлайн генератор тем th...

Figma для фронтендера/верстальщика в 2024

31:51

Figma для фронтендера/верстальщика в 2024

Просмотров 1,3 тыс.7 месяцев назад

Обновленная версия обзора фигмы для верстки сайта с макета. Рассматриваем основные задачи по переносу свойств с макета в верстку, а также новые изменения. Как обойти ограничения без платного dev mode и какие уже есть альтернативы Фигмы. 00:00 О чем видео 01:27 Что копировать с макета 04:06 Обзор 20:26 Плагин 26:00 Альтернативы Фигма www.figma.com/ Плагин Inspect Styles www.figma.com/community/p...

25:19

Как совладать с CORS

Просмотров 3117 месяцев назад

В этом сложносочиненном гайде/демо мы пытаемся совладать с CORS, чтобы отправить данные с формы на Node.js сервер и обратно, используя FormData и асинхронный fetch запрос. 00:00 Чем мы будем заниматься 03:24 Демо Код демки github.com/Vallek/node-cors nodemon www.npmjs.com/package/nodemon CORS на MDN developer.mozilla.org/ru/docs/Glossary/CORS Про источники/origin developer.mozilla.org/ru/docs/G...

Чем отличаются inherit, initial, unset и revert?

27:07

Чем отличаются inherit, initial, unset и revert?

Просмотров 3827 месяцев назад

Разбираем значения CSS свойств inherit, initial, unset и revert. Что они делают и чем отличаются. В начале сразу оговорился и назвал их свойствами, а не значениями)) 00:00 О чем видео 00:24 Проблемы с информацией по теме 02:39 Разбор источников CSS 09:39 Разбор значений 13:51 Демо 24:48 Доп. сложности О значениях на Доке doka.guide/css/global-keywords/ О revert на MDN web-standards.ru/articles/...