Фронтенд Гайд
Kanalga Telegram’da o‘tish
Канал для фронтендеров, много полезных лайфхаков, фичей, макетов, тестов! Все представлено в виде готового кода, бери и юзай в своем проекте. 6ad1a2aabe82d4fbb0d6
Ko'proq ko'rsatish7 647
Obunachilar
-324 soatlar
-267 kun
-5030 kun
Postlar arxiv
\n\n📌В этом примере focus() автоматически активирует поле ввода при загрузке страницы\n\nfocus() удобно использовать для навигации по формам, активации поиска, подсветки ошибок или управления клавиатурным вводом. Это помогает сделать интерфейс более интуитивным и доступным","datePublished":"2026-01-02T06:02:43Z","dateModified":"2026-01-02T06:02:43Z","author":{"@type":"Organization","name":"Фронтенд Гайд","url":"https://telemetr.io/uz/channels/1681900587-frontend_dev5","image":"https://img.telemetr.io/c/1PP5aP/5339498914732170172?ty=x"},"publisher":{"@type":"Organization","name":"Фронтенд Гайд","url":"https://telemetr.io/uz/channels/1681900587-frontend_dev5","image":"https://img.telemetr.io/c/1PP5aP/5339498914732170172?ty=x"},"commentCount":0,"interactionStatistic":[{"@type":"InteractionCounter","interactionType":"https://schema.org/ViewAction","userInteractionCount":613},{"@type":"InteractionCounter","interactionType":"https://schema.org/LikeAction","userInteractionCount":2},{"@type":"InteractionCounter","interactionType":"https://schema.org/ShareAction","userInteractionCount":4}]}},{"@type":"ListItem","position":2,"item":{"@type":"SocialMediaPosting","@id":"https://telemetr.io/uz/channels/1681900587-frontend_dev5/posts/3618","url":"https://telemetr.io/uz/channels/1681900587-frontend_dev5/posts/3618","mainEntityOfPage":"https://telemetr.io/uz/channels/1681900587-frontend_dev5/posts/3618","headline":"Фронтенд Гайд","datePublished":"2026-01-01T13:05:38Z","dateModified":"2026-01-01T13:05:38Z","author":{"@type":"Organization","name":"Фронтенд Гайд","url":"https://telemetr.io/uz/channels/1681900587-frontend_dev5","image":"https://img.telemetr.io/c/1PP5aP/5339498914732170172?ty=x"},"publisher":{"@type":"Organization","name":"Фронтенд Гайд","url":"https://telemetr.io/uz/channels/1681900587-frontend_dev5","image":"https://img.telemetr.io/c/1PP5aP/5339498914732170172?ty=x"},"commentCount":0,"interactionStatistic":[{"@type":"InteractionCounter","interactionType":"https://schema.org/ViewAction","userInteractionCount":617},{"@type":"InteractionCounter","interactionType":"https://schema.org/LikeAction","userInteractionCount":4}]}},{"@type":"ListItem","position":3,"item":{"@type":"SocialMediaPosting","@id":"https://telemetr.io/uz/channels/1681900587-frontend_dev5/posts/3617","url":"https://telemetr.io/uz/channels/1681900587-frontend_dev5/posts/3617","mainEntityOfPage":"https://telemetr.io/uz/channels/1681900587-frontend_dev5/posts/3617","headline":"⚙️ Топ 5 причин, когда JavaScript блокирует загрузку вашего сайта На основе наблюдений я выделил 5 самых проб…","articleBody":"⚙️ Топ 5 причин, когда JavaScript блокирует загрузку вашего сайта\n\nНа основе наблюдений я выделил 5 самых проблемных случая, когда JavaScript блокирует загрузку сайта. В статье вы узнаете, как с ними бороться.\n\n🔗 Читать статью","datePublished":"2026-01-01T11:02:14Z","dateModified":"2026-01-01T11:02:14Z","author":{"@type":"Organization","name":"Фронтенд Гайд","url":"https://telemetr.io/uz/channels/1681900587-frontend_dev5","image":"https://img.telemetr.io/c/1PP5aP/5339498914732170172?ty=x"},"publisher":{"@type":"Organization","name":"Фронтенд Гайд","url":"https://telemetr.io/uz/channels/1681900587-frontend_dev5","image":"https://img.telemetr.io/c/1PP5aP/5339498914732170172?ty=x"},"commentCount":0,"interactionStatistic":[{"@type":"InteractionCounter","interactionType":"https://schema.org/ViewAction","userInteractionCount":695},{"@type":"InteractionCounter","interactionType":"https://schema.org/LikeAction","userInteractionCount":1},{"@type":"InteractionCounter","interactionType":"https://schema.org/ShareAction","userInteractionCount":10}]}},{"@type":"ListItem","position":4,"item":{"@type":"SocialMediaPosting","@id":"https://telemetr.io/uz/channels/1681900587-frontend_dev5/posts/3616","url":"https://telemetr.io/uz/channels/1681900587-frontend_dev5/posts/3616","mainEntityOfPage":"https://telemetr.io/uz/channels/1681900587-frontend_dev5/posts/3616","headline":"👩💻 Profile Card UI — Стильная карточка-портфолио с анимированными кнопками. Сделан на SVG, SCSS и JS 🔗 Откры…","articleBody":"👩💻 Profile Card UI — Стильная карточка-портфолио с анимированными кнопками.\n\nСделан на SVG, SCSS и JS\n\n🔗 Открыть код","datePublished":"2025-12-26T10:39:01Z","dateModified":"2025-12-26T10:39:01Z","author":{"@type":"Organization","name":"Фронтенд Гайд","url":"https://telemetr.io/uz/channels/1681900587-frontend_dev5","image":"https://img.telemetr.io/c/1PP5aP/5339498914732170172?ty=x"},"publisher":{"@type":"Organization","name":"Фронтенд Гайд","url":"https://telemetr.io/uz/channels/1681900587-frontend_dev5","image":"https://img.telemetr.io/c/1PP5aP/5339498914732170172?ty=x"},"commentCount":0,"interactionStatistic":[{"@type":"InteractionCounter","interactionType":"https://schema.org/ViewAction","userInteractionCount":875},{"@type":"InteractionCounter","interactionType":"https://schema.org/LikeAction","userInteractionCount":1},{"@type":"InteractionCounter","interactionType":"https://schema.org/ShareAction","userInteractionCount":19}]}},{"@type":"ListItem","position":5,"item":{"@type":"SocialMediaPosting","@id":"https://telemetr.io/uz/channels/1681900587-frontend_dev5/posts/3615","url":"https://telemetr.io/uz/channels/1681900587-frontend_dev5/posts/3615","mainEntityOfPage":"https://telemetr.io/uz/channels/1681900587-frontend_dev5/posts/3615","headline":"🔄 Ребята из Яндекса уволились и открыли свой новый канал! 🔥 Всё в одном архиве для твоего роста и результата:…","articleBody":"🔄 Ребята из Яндекса уволились и открыли свой новый канал! \n\n🔥 Всё в одном архиве для твоего роста и результата:\n\n👩💻 Python\n👩💻 Java \n👩💻 JavaScript\n👩💻 C# & Unity\n👩💻 Node.js\n👩💻 C & C++\n👩💻 SQL & Базы данных\n👩💻 Git & GitHub\n🤟 DevOps\n\nБЕСПЛАТНЫЕ КУРСЫ по всем ключевым направлениям\nтолько для наших сабов! ❤️\n\n➡️ Наша миссия — твой рост","datePublished":"2025-12-26T08:39:01Z","dateModified":"2025-12-26T08:39:01Z","author":{"@type":"Organization","name":"Фронтенд Гайд","url":"https://telemetr.io/uz/channels/1681900587-frontend_dev5","image":"https://img.telemetr.io/c/1PP5aP/5339498914732170172?ty=x"},"publisher":{"@type":"Organization","name":"Фронтенд Гайд","url":"https://telemetr.io/uz/channels/1681900587-frontend_dev5","image":"https://img.telemetr.io/c/1PP5aP/5339498914732170172?ty=x"},"image":["https://n2.tlmtr.cc/v/_mYo5L5eznWVQfm70yVkEJ39km5egt_6HY5xM0p1OUVg?ty=x"],"commentCount":0,"interactionStatistic":[{"@type":"InteractionCounter","interactionType":"https://schema.org/ViewAction","userInteractionCount":775},{"@type":"InteractionCounter","interactionType":"https://schema.org/ShareAction","userInteractionCount":5}]}},{"@type":"ListItem","position":6,"item":{"@type":"SocialMediaPosting","@id":"https://telemetr.io/uz/channels/1681900587-frontend_dev5/posts/3614","url":"https://telemetr.io/uz/channels/1681900587-frontend_dev5/posts/3614","mainEntityOfPage":"https://telemetr.io/uz/channels/1681900587-frontend_dev5/posts/3614","headline":"⚡️ Бесплатное обучение фронтенд-разработке с нуля до React — с поддержкой от наставника Опыт в программирован…","articleBody":"⚡️ Бесплатное обучение фронтенд-разработке с нуля до React — с поддержкой от наставника\n\nОпыт в программировании не нужен.\n\nНа канале Интенсивный JavaScript действующий тимлид и опытный разработчик помогает изучить фронтенд на практических задачах, которые интересно кодить\n\nС 24 по 28 декабря проводит бесплтаное обучение, где он на практике поможет разобраться в основах — HTML/CSS и JavaScript, а также попробовать самый популярный фреймворк — React\n\n💡Всё объясняет на примере проекта — доски объявлений\n\nОбучение подойдёт, даже если у вас нет опыта в программировании — всё объясняют так, чтобы поняла даже ваша бабуля\n\n🔖Ещё этот парень регулярно набирает новичков в свою команду и знает, как трудоустроиться и джуну, и разрабу поопытнее\n\nПомимо работы с кодом он даст пошаговый план изучения всего, что нужно современному фронтенду. \nПоделится способами поиcка клиентов с поомщью ИИ.\nРасскажет, как взять свой первый заказ на фрилансе без фриланс-бирж с огромной конкуренцией\n\nПодписывайтесь, чтобы участвовать, осталось 33 места\n\nУчиться самостоятельно можно бесконечно, если не знать, куда копать. На интенсиве сократите время на поиск информации и получите пошаговый план от разработчика, который нанимает новичков в команду\n\n➡️Участвовать бесплатно\n\n+ среди участников разыграет годовую подписку на полезный ИИ","datePublished":"2025-12-25T13:39:01Z","dateModified":"2025-12-25T13:39:01Z","author":{"@type":"Organization","name":"Фронтенд Гайд","url":"https://telemetr.io/uz/channels/1681900587-frontend_dev5","image":"https://img.telemetr.io/c/1PP5aP/5339498914732170172?ty=x"},"publisher":{"@type":"Organization","name":"Фронтенд Гайд","url":"https://telemetr.io/uz/channels/1681900587-frontend_dev5","image":"https://img.telemetr.io/c/1PP5aP/5339498914732170172?ty=x"},"commentCount":0,"interactionStatistic":[{"@type":"InteractionCounter","interactionType":"https://schema.org/ViewAction","userInteractionCount":625},{"@type":"InteractionCounter","interactionType":"https://schema.org/ShareAction","userInteractionCount":1}]}},{"@type":"ListItem","position":7,"item":{"@type":"SocialMediaPosting","@id":"https://telemetr.io/uz/channels/1681900587-frontend_dev5/posts/3613","url":"https://telemetr.io/uz/channels/1681900587-frontend_dev5/posts/3613","mainEntityOfPage":"https://telemetr.io/uz/channels/1681900587-frontend_dev5/posts/3613","headline":"⚡️ Бесплатное обучение фронтенд-разработке с нуля до React — с поддержкой от наставника Опыт в программирован…","articleBody":"⚡️ Бесплатное обучение фронтенд-разработке с нуля до React — с поддержкой от наставника\n\nОпыт в программировании не нужен.\n\nНа канале Интенсивный JavaScript действующий тимлид и опытный разработчик помогает изучить фронтенд на практических задачах, которые интересно кодить\n\nС 24 по 28 декабря проводит бесплтаное обучение, где он на практике поможет разобраться в основах — HTML/CSS и JavaScript, а также попробовать самый популярный фреймворк — React\n\n💡Всё объясняет на примере проекта — доски объявлений\n\nОбучение подойдёт, даже если у вас нет опыта в программировании — всё объясняют так, чтобы поняла даже ваша бабуля\n\n🔖Ещё этот парень регулярно набирает новичков в свою команду и знает, как трудоустроиться и джуну, и разрабу поопытнее\n\nПомимо работы с кодом он даст пошаговый план изучения всего, что нужно современному фронтенду. \nПоделится способами поиcка клиентов с поомщью ИИ.\nРасскажет, как взять свой первый заказ на фрилансе без фриланс-бирж с огромной конкуренцией\n\nПодписывайтесь, чтобы участвовать, осталось 33 места\n\nУчиться самостоятельно можно бесконечно, если не знать, куда копать. На интенсиве сократите время на поиск информации и получите пошаговый план от разработчика, который нанимает новичков в команду\n\n➡️Участвовать бесплатно\n\n+ среди участников разыграет годовую подписку на полезный ИИ","datePublished":"2025-12-25T13:38:49Z","dateModified":"2025-12-25T13:39:05Z","author":{"@type":"Organization","name":"Фронтенд Гайд","url":"https://telemetr.io/uz/channels/1681900587-frontend_dev5","image":"https://img.telemetr.io/c/1PP5aP/5339498914732170172?ty=x"},"publisher":{"@type":"Organization","name":"Фронтенд Гайд","url":"https://telemetr.io/uz/channels/1681900587-frontend_dev5","image":"https://img.telemetr.io/c/1PP5aP/5339498914732170172?ty=x"},"commentCount":0,"interactionStatistic":[{"@type":"InteractionCounter","interactionType":"https://schema.org/ViewAction","userInteractionCount":1}],"sharedContent":{"@type":"SocialMediaPosting","headline":"Vladimir Yankovsky","datePublished":"2025-12-25T13:34:37Z"}}},{"@type":"ListItem","position":8,"item":{"@type":"SocialMediaPosting","@id":"https://telemetr.io/uz/channels/1681900587-frontend_dev5/posts/3612","url":"https://telemetr.io/uz/channels/1681900587-frontend_dev5/posts/3612","mainEntityOfPage":"https://telemetr.io/uz/channels/1681900587-frontend_dev5/posts/3612","headline":"⚙️ Shadcn для Vue: норм или стрём? Опыт использования shadcn-vue в продакшн проекте: что работает хорошо, а с…","articleBody":"⚙️ Shadcn для Vue: норм или стрём?\n\nОпыт использования shadcn-vue в продакшн проекте: что работает хорошо, а с чем придется помучиться. Честный обзор популярной UI библиотеки от практикующего разработчика.\n\n🔗 Читать статью","datePublished":"2025-12-25T13:38:40Z","dateModified":"2025-12-25T13:38:40Z","author":{"@type":"Organization","name":"Фронтенд Гайд","url":"https://telemetr.io/uz/channels/1681900587-frontend_dev5","image":"https://img.telemetr.io/c/1PP5aP/5339498914732170172?ty=x"},"publisher":{"@type":"Organization","name":"Фронтенд Гайд","url":"https://telemetr.io/uz/channels/1681900587-frontend_dev5","image":"https://img.telemetr.io/c/1PP5aP/5339498914732170172?ty=x"},"commentCount":0,"interactionStatistic":[{"@type":"InteractionCounter","interactionType":"https://schema.org/ViewAction","userInteractionCount":497},{"@type":"InteractionCounter","interactionType":"https://schema.org/ShareAction","userInteractionCount":5}]}},{"@type":"ListItem","position":9,"item":{"@type":"SocialMediaPosting","@id":"https://telemetr.io/uz/channels/1681900587-frontend_dev5/posts/3611","url":"https://telemetr.io/uz/channels/1681900587-frontend_dev5/posts/3611","mainEntityOfPage":"https://telemetr.io/uz/channels/1681900587-frontend_dev5/posts/3611","headline":"🔥 Самые нужные каналы для Frontend разработчика, чтобы расти в доходе 💸 • Frontend | Вопросы собесов • Fronte…","articleBody":"🔥 Самые нужные каналы для Frontend разработчика, чтобы расти в доходе 💸\n\n• Frontend | Вопросы собесов\n• Frontend | Вакансии с удаленкой\n• Frontend | LeetCode\n• Frontend | Тесты\n\nПодпишись, чтобы не потерять ☝️","datePublished":"2025-12-25T11:36:10Z","dateModified":"2025-12-25T11:36:10Z","author":{"@type":"Organization","name":"Фронтенд Гайд","url":"https://telemetr.io/uz/channels/1681900587-frontend_dev5","image":"https://img.telemetr.io/c/1PP5aP/5339498914732170172?ty=x"},"publisher":{"@type":"Organization","name":"Фронтенд Гайд","url":"https://telemetr.io/uz/channels/1681900587-frontend_dev5","image":"https://img.telemetr.io/c/1PP5aP/5339498914732170172?ty=x"},"commentCount":0,"interactionStatistic":[{"@type":"InteractionCounter","interactionType":"https://schema.org/ViewAction","userInteractionCount":570},{"@type":"InteractionCounter","interactionType":"https://schema.org/ShareAction","userInteractionCount":2}]}},{"@type":"ListItem","position":10,"item":{"@type":"SocialMediaPosting","@id":"https://telemetr.io/uz/channels/1681900587-frontend_dev5/posts/3610","url":"https://telemetr.io/uz/channels/1681900587-frontend_dev5/posts/3610","mainEntityOfPage":"https://telemetr.io/uz/channels/1681900587-frontend_dev5/posts/3610","headline":"👩💻 Ubisoft Quartz Background Animation — Размытая анимация отлично подойдёт для фона на вашем сайте Сделано…","articleBody":"👩💻 Ubisoft Quartz Background Animation — Размытая анимация отлично подойдёт для фона на вашем сайте\n\nСделано на CSS\n\n🔗 Открыть код","datePublished":"2025-12-24T14:29:27Z","dateModified":"2025-12-24T14:29:27Z","author":{"@type":"Organization","name":"Фронтенд Гайд","url":"https://telemetr.io/uz/channels/1681900587-frontend_dev5","image":"https://img.telemetr.io/c/1PP5aP/5339498914732170172?ty=x"},"publisher":{"@type":"Organization","name":"Фронтенд Гайд","url":"https://telemetr.io/uz/channels/1681900587-frontend_dev5","image":"https://img.telemetr.io/c/1PP5aP/5339498914732170172?ty=x"},"commentCount":0,"interactionStatistic":[{"@type":"InteractionCounter","interactionType":"https://schema.org/ViewAction","userInteractionCount":620},{"@type":"InteractionCounter","interactionType":"https://schema.org/ShareAction","userInteractionCount":9}]}},{"@type":"ListItem","position":11,"item":{"@type":"SocialMediaPosting","@id":"https://telemetr.io/uz/channels/1681900587-frontend_dev5/posts/3609","url":"https://telemetr.io/uz/channels/1681900587-frontend_dev5/posts/3609","mainEntityOfPage":"https://telemetr.io/uz/channels/1681900587-frontend_dev5/posts/3609","headline":"💸 Разработчики из Яндекса создали IT каналы и слили кучу материала Здесь информация, которая реально помогает…","articleBody":"💸 Разработчики из Яндекса создали IT каналы и слили кучу материала\n\nЗдесь информация, которая реально помогает изучать программирование с полного нуля!\n\nВыбирайте своё направление и подписывайся:\n\n👩💻 Python Flow — @python_flow\n👩💻 C & C++ Flow — @cpp_flow\n💻 IT News Flow — @itnews_flow\n👩💻 Java Flow — @java_flow\n👩💻 SQL & Базы данных Flow — @sql_flow\n👩💻 C# & Unity Flow — @csharp_flow\n👩💻 Node.js Flow — @nodejs_flow\n👩💻 Linux & DevOps Flow — @linux_flow\n👩💻 InfoSec & Хакинг — @hacking_flow\n👩💻 Git & GitHub Flow — @git_flow\n\nПрием заявок действует до завтра ⚠️","datePublished":"2025-12-23T16:40:52Z","dateModified":"2025-12-23T16:40:52Z","author":{"@type":"Organization","name":"Фронтенд Гайд","url":"https://telemetr.io/uz/channels/1681900587-frontend_dev5","image":"https://img.telemetr.io/c/1PP5aP/5339498914732170172?ty=x"},"publisher":{"@type":"Organization","name":"Фронтенд Гайд","url":"https://telemetr.io/uz/channels/1681900587-frontend_dev5","image":"https://img.telemetr.io/c/1PP5aP/5339498914732170172?ty=x"},"commentCount":0,"interactionStatistic":[{"@type":"InteractionCounter","interactionType":"https://schema.org/ViewAction","userInteractionCount":654},{"@type":"InteractionCounter","interactionType":"https://schema.org/LikeAction","userInteractionCount":1},{"@type":"InteractionCounter","interactionType":"https://schema.org/ShareAction","userInteractionCount":2}]}},{"@type":"ListItem","position":12,"item":{"@type":"SocialMediaPosting","@id":"https://telemetr.io/uz/channels/1681900587-frontend_dev5/posts/3608","url":"https://telemetr.io/uz/channels/1681900587-frontend_dev5/posts/3608","mainEntityOfPage":"https://telemetr.io/uz/channels/1681900587-frontend_dev5/posts/3608","headline":"⚙️ Коллекция полезных HTML и CSS фич, которые редко используются Покажу забытые, но полезные фичи HTML/CSS: к…","articleBody":"⚙️ Коллекция полезных HTML и CSS фич, которые редко используются\n\nПокажу забытые, но полезные фичи HTML/CSS: когда они лучше JS и как применить без боли. Мини-примеры и быстрые советы — внедряем сегодня.\n\n🔗 Читать статью","datePublished":"2025-12-23T14:32:42Z","dateModified":"2025-12-23T14:32:42Z","author":{"@type":"Organization","name":"Фронтенд Гайд","url":"https://telemetr.io/uz/channels/1681900587-frontend_dev5","image":"https://img.telemetr.io/c/1PP5aP/5339498914732170172?ty=x"},"publisher":{"@type":"Organization","name":"Фронтенд Гайд","url":"https://telemetr.io/uz/channels/1681900587-frontend_dev5","image":"https://img.telemetr.io/c/1PP5aP/5339498914732170172?ty=x"},"commentCount":0,"interactionStatistic":[{"@type":"InteractionCounter","interactionType":"https://schema.org/ViewAction","userInteractionCount":609},{"@type":"InteractionCounter","interactionType":"https://schema.org/LikeAction","userInteractionCount":2},{"@type":"InteractionCounter","interactionType":"https://schema.org/ShareAction","userInteractionCount":10}]}},{"@type":"ListItem","position":13,"item":{"@type":"SocialMediaPosting","@id":"https://telemetr.io/uz/channels/1681900587-frontend_dev5/posts/3607","url":"https://telemetr.io/uz/channels/1681900587-frontend_dev5/posts/3607","mainEntityOfPage":"https://telemetr.io/uz/channels/1681900587-frontend_dev5/posts/3607","headline":"Привет. Вот тебе самые топовые каналы по IT! ⚙️ Free Znanija (IT) — Самая огромная коллекция платных курсов,…","articleBody":"Привет. Вот тебе самые топовые каналы по IT!\n\n⚙️ Free Znanija (IT) — Самая огромная коллекция платных курсов, которые можно скачать бесплатно;\n\n👩💻 IT Books — Самая огромная библиотека книг;\n\n💻 Hacking & InfoSec Base — Крутой блог белого хакера;\n\n🛡 CyberGuard — Всё про ИБ;\n\n🤔 ИБ Вакансии — Всё, чтобы найти работу в ИБ;\n\n👩💻 linux administration — Всё про Линукс;\n\n👩💻 Программистика — Python, python и ещё раз python;\n\n👩💻 GameDev Base — Всё про GameDev;\n\n😆 //code — Самые топовые мемы по IT:\n\nПодпишись, чтобы не потерять!","datePublished":"2025-12-23T12:34:22Z","dateModified":"2025-12-23T12:34:22Z","author":{"@type":"Organization","name":"Фронтенд Гайд","url":"https://telemetr.io/uz/channels/1681900587-frontend_dev5","image":"https://img.telemetr.io/c/1PP5aP/5339498914732170172?ty=x"},"publisher":{"@type":"Organization","name":"Фронтенд Гайд","url":"https://telemetr.io/uz/channels/1681900587-frontend_dev5","image":"https://img.telemetr.io/c/1PP5aP/5339498914732170172?ty=x"},"commentCount":0,"interactionStatistic":[{"@type":"InteractionCounter","interactionType":"https://schema.org/ViewAction","userInteractionCount":626},{"@type":"InteractionCounter","interactionType":"https://schema.org/ShareAction","userInteractionCount":3}]}},{"@type":"ListItem","position":14,"item":{"@type":"SocialMediaPosting","@id":"https://telemetr.io/uz/channels/1681900587-frontend_dev5/posts/3606","url":"https://telemetr.io/uz/channels/1681900587-frontend_dev5/posts/3606","mainEntityOfPage":"https://telemetr.io/uz/channels/1681900587-frontend_dev5/posts/3606","headline":"⚙️ View Transitions API Полистав различные ресурсы в Интернете и просмотрев множество видео по данной теме, я…","articleBody":"⚙️ View Transitions API\n\nПолистав различные ресурсы в Интернете и просмотрев множество видео по данной теме, я решил составить наиболее полную картину по данному, не побоюсь этого слова, революционному API, чтобы вы уже сегодня могли начать использовать его в своём проекте!\n\n🔗 Читать статью","datePublished":"2025-12-23T07:27:32Z","dateModified":"2025-12-23T07:27:32Z","author":{"@type":"Organization","name":"Фронтенд Гайд","url":"https://telemetr.io/uz/channels/1681900587-frontend_dev5","image":"https://img.telemetr.io/c/1PP5aP/5339498914732170172?ty=x"},"publisher":{"@type":"Organization","name":"Фронтенд Гайд","url":"https://telemetr.io/uz/channels/1681900587-frontend_dev5","image":"https://img.telemetr.io/c/1PP5aP/5339498914732170172?ty=x"},"commentCount":0,"interactionStatistic":[{"@type":"InteractionCounter","interactionType":"https://schema.org/ViewAction","userInteractionCount":612},{"@type":"InteractionCounter","interactionType":"https://schema.org/ShareAction","userInteractionCount":12}]}},{"@type":"ListItem","position":15,"item":{"@type":"SocialMediaPosting","@id":"https://telemetr.io/uz/channels/1681900587-frontend_dev5/posts/3605","url":"https://telemetr.io/uz/channels/1681900587-frontend_dev5/posts/3605","mainEntityOfPage":"https://telemetr.io/uz/channels/1681900587-frontend_dev5/posts/3605","headline":"❓ Зачем используется метод preventDefault() в JavaScript и когда его применять? Метод preventDefault() отменя…","articleBody":"❓ Зачем используется метод preventDefault() в JavaScript и когда его применять?\n\nМетод preventDefault() отменяет стандартное поведение элемента браузера, не прерывая при этом выполнение других обработчиков. Это удобно, когда нужно полностью контролировать действия пользователя.\n\n✅Пример:\n\n\n\n\n\n📌В этом примере preventDefault() предотвращает перезагрузку страницы при отправке формы.\n\npreventDefault() удобно использовать при работе с формами, ссылками, drag&drop и кастомными UI-элементами. Оно даёт разработчику полный контроль над поведением интерфейса","datePublished":"2025-12-23T07:26:51Z","dateModified":"2025-12-23T07:27:07Z","author":{"@type":"Organization","name":"Фронтенд Гайд","url":"https://telemetr.io/uz/channels/1681900587-frontend_dev5","image":"https://img.telemetr.io/c/1PP5aP/5339498914732170172?ty=x"},"publisher":{"@type":"Organization","name":"Фронтенд Гайд","url":"https://telemetr.io/uz/channels/1681900587-frontend_dev5","image":"https://img.telemetr.io/c/1PP5aP/5339498914732170172?ty=x"},"commentCount":0,"interactionStatistic":[{"@type":"InteractionCounter","interactionType":"https://schema.org/ViewAction","userInteractionCount":1}]}},{"@type":"ListItem","position":16,"item":{"@type":"SocialMediaPosting","@id":"https://telemetr.io/uz/channels/1681900587-frontend_dev5/posts/3604","url":"https://telemetr.io/uz/channels/1681900587-frontend_dev5/posts/3604","mainEntityOfPage":"https://telemetr.io/uz/channels/1681900587-frontend_dev5/posts/3604","headline":"👩💻 Fancy Glowing Button — Крутая кнопка с RGB подсветкой и эффектом при наведении Сделана на чистом CSS 🔗 От…","articleBody":"👩💻 Fancy Glowing Button — Крутая кнопка с RGB подсветкой и эффектом при наведении\n\nСделана на чистом CSS\n\n🔗 Открыть код","datePublished":"2025-12-21T16:00:06Z","dateModified":"2025-12-21T16:00:06Z","author":{"@type":"Organization","name":"Фронтенд Гайд","url":"https://telemetr.io/uz/channels/1681900587-frontend_dev5","image":"https://img.telemetr.io/c/1PP5aP/5339498914732170172?ty=x"},"publisher":{"@type":"Organization","name":"Фронтенд Гайд","url":"https://telemetr.io/uz/channels/1681900587-frontend_dev5","image":"https://img.telemetr.io/c/1PP5aP/5339498914732170172?ty=x"},"commentCount":0,"interactionStatistic":[{"@type":"InteractionCounter","interactionType":"https://schema.org/ViewAction","userInteractionCount":617},{"@type":"InteractionCounter","interactionType":"https://schema.org/ShareAction","userInteractionCount":6}]}},{"@type":"ListItem","position":17,"item":{"@type":"SocialMediaPosting","@id":"https://telemetr.io/uz/channels/1681900587-frontend_dev5/posts/3603","url":"https://telemetr.io/uz/channels/1681900587-frontend_dev5/posts/3603","mainEntityOfPage":"https://telemetr.io/uz/channels/1681900587-frontend_dev5/posts/3603","headline":"❓ Зачем используется метод preventDefault() в JavaScript и когда его применять? Метод preventDefault() отменя…","articleBody":"❓ Зачем используется метод preventDefault() в JavaScript и когда его применять?\n\nМетод preventDefault() отменяет стандартное поведение элемента браузера, не прерывая при этом выполнение других обработчиков. Это удобно, когда нужно полностью контролировать действия пользователя.\n\n✅Пример:\n\n\n\n\n\n📌В этом примере preventDefault() предотвращает перезагрузку страницы при отправке формы.\n\npreventDefault() удобно использовать при работе с формами, ссылками, drag&drop и кастомными UI-элементами. Оно даёт разработчику полный контроль над поведением интерфейса","datePublished":"2025-12-20T06:54:49Z","dateModified":"2025-12-20T06:54:49Z","author":{"@type":"Organization","name":"Фронтенд Гайд","url":"https://telemetr.io/uz/channels/1681900587-frontend_dev5","image":"https://img.telemetr.io/c/1PP5aP/5339498914732170172?ty=x"},"publisher":{"@type":"Organization","name":"Фронтенд Гайд","url":"https://telemetr.io/uz/channels/1681900587-frontend_dev5","image":"https://img.telemetr.io/c/1PP5aP/5339498914732170172?ty=x"},"commentCount":0,"interactionStatistic":[{"@type":"InteractionCounter","interactionType":"https://schema.org/ViewAction","userInteractionCount":723},{"@type":"InteractionCounter","interactionType":"https://schema.org/LikeAction","userInteractionCount":1},{"@type":"InteractionCounter","interactionType":"https://schema.org/ShareAction","userInteractionCount":4}]}},{"@type":"ListItem","position":18,"item":{"@type":"SocialMediaPosting","@id":"https://telemetr.io/uz/channels/1681900587-frontend_dev5/posts/3602","url":"https://telemetr.io/uz/channels/1681900587-frontend_dev5/posts/3602","mainEntityOfPage":"https://telemetr.io/uz/channels/1681900587-frontend_dev5/posts/3602","headline":"🤷🏼♂️ Готовимся к вопросам по вёрстке на интервью Frontend-разработчика: свойство display Статья посвящена по…","articleBody":"🤷🏼♂️ Готовимся к вопросам по вёрстке на интервью Frontend-разработчика: свойство display\n\nСтатья посвящена подготовке к собеседованию на позицию Frontend-разработчика, в частности, вопросам, связанным с вёрсткой и свойством display в CSS. Автор подробно объясняет, как работает свойство display, его внешние и внутренние типы отображения, а также ключевые слова, которые можно использовать. Это включает в себя обсуждение таких ключевых слов, как block, inline, run-in, flow, flow-root, flex, grid, table и ruby. \n\n#Полезное\n\nhttps://habr.com/ru/companies/ruvds/articles/798975/","datePublished":"2025-12-18T09:27:20Z","dateModified":"2025-12-18T09:27:20Z","author":{"@type":"Organization","name":"Фронтенд Гайд","url":"https://telemetr.io/uz/channels/1681900587-frontend_dev5","image":"https://img.telemetr.io/c/1PP5aP/5339498914732170172?ty=x"},"publisher":{"@type":"Organization","name":"Фронтенд Гайд","url":"https://telemetr.io/uz/channels/1681900587-frontend_dev5","image":"https://img.telemetr.io/c/1PP5aP/5339498914732170172?ty=x"},"commentCount":1,"interactionStatistic":[{"@type":"InteractionCounter","interactionType":"https://schema.org/ViewAction","userInteractionCount":810},{"@type":"InteractionCounter","interactionType":"https://schema.org/LikeAction","userInteractionCount":2},{"@type":"InteractionCounter","interactionType":"https://schema.org/ShareAction","userInteractionCount":7},{"@type":"InteractionCounter","interactionType":"https://schema.org/CommentAction","userInteractionCount":1}]}},{"@type":"ListItem","position":19,"item":{"@type":"SocialMediaPosting","@id":"https://telemetr.io/uz/channels/1681900587-frontend_dev5/posts/3601","url":"https://telemetr.io/uz/channels/1681900587-frontend_dev5/posts/3601","mainEntityOfPage":"https://telemetr.io/uz/channels/1681900587-frontend_dev5/posts/3601","headline":"IT — не латте, смузи и гироскутер, а вызовы и амбиции VK показывает, чем занимаются её команды — от экспериме…","articleBody":"IT — не латте, смузи и гироскутер, а вызовы и амбиции\n\nVK показывает, чем занимаются её команды — от экспериментальных технологий до VK Fest. Переходите по ссылке: смотрите ролики, читайте про проекты и тут же откликайтесь на вакансию, которая по вкусу! \n\nПерейти на сайт\n\n#реклама 16+\nvkteam.ru\nО рекламодателе","datePublished":"2025-12-04T06:43:14Z","dateModified":"2025-12-06T04:43:18Z","author":{"@type":"Organization","name":"Фронтенд Гайд","url":"https://telemetr.io/uz/channels/1681900587-frontend_dev5","image":"https://img.telemetr.io/c/1PP5aP/5339498914732170172?ty=x"},"publisher":{"@type":"Organization","name":"Фронтенд Гайд","url":"https://telemetr.io/uz/channels/1681900587-frontend_dev5","image":"https://img.telemetr.io/c/1PP5aP/5339498914732170172?ty=x"},"commentCount":1,"interactionStatistic":[{"@type":"InteractionCounter","interactionType":"https://schema.org/ViewAction","userInteractionCount":314},{"@type":"InteractionCounter","interactionType":"https://schema.org/CommentAction","userInteractionCount":1}]}},{"@type":"ListItem","position":20,"item":{"@type":"SocialMediaPosting","@id":"https://telemetr.io/uz/channels/1681900587-frontend_dev5/posts/3600","url":"https://telemetr.io/uz/channels/1681900587-frontend_dev5/posts/3600","mainEntityOfPage":"https://telemetr.io/uz/channels/1681900587-frontend_dev5/posts/3600","headline":"Фронтенд Гайд","datePublished":"2025-12-02T13:19:53Z","dateModified":"2025-12-02T13:19:53Z","author":{"@type":"Organization","name":"Фронтенд Гайд","url":"https://telemetr.io/uz/channels/1681900587-frontend_dev5","image":"https://img.telemetr.io/c/1PP5aP/5339498914732170172?ty=x"},"publisher":{"@type":"Organization","name":"Фронтенд Гайд","url":"https://telemetr.io/uz/channels/1681900587-frontend_dev5","image":"https://img.telemetr.io/c/1PP5aP/5339498914732170172?ty=x"},"commentCount":30,"interactionStatistic":[{"@type":"InteractionCounter","interactionType":"https://schema.org/ViewAction","userInteractionCount":1236},{"@type":"InteractionCounter","interactionType":"https://schema.org/LikeAction","userInteractionCount":6},{"@type":"InteractionCounter","interactionType":"https://schema.org/ShareAction","userInteractionCount":6},{"@type":"InteractionCounter","interactionType":"https://schema.org/CommentAction","userInteractionCount":30}]}}]}






























7 647
❓ Зачем используется метод
focus() в JavaScript и когда его применять?
Метод focus() устанавливает курсор ввода в элемент формы, делая его активным для пользователя. Это удобно для улучшения UX — например, при автоматическом фокусе на первом поле формы или после действий пользователя.
✅Пример:
<input type="text" id="username" placeholder="Введите имя">
<script>
const input = document.getElementById("username");
window.addEventListener("load", () => input.focus());
</script>
📌В этом примере focus() автоматически активирует поле ввода при загрузке страницы
focus() удобно использовать для навигации по формам, активации поиска, подсветки ошибок или управления клавиатурным вводом. Это помогает сделать интерфейс более интуитивным и доступным
7 647
⚙️ Топ 5 причин, когда JavaScript блокирует загрузку вашего сайта
На основе наблюдений я выделил 5 самых проблемных случая, когда JavaScript блокирует загрузку сайта. В статье вы узнаете, как с ними бороться.🔗 Читать статью
7 647
👩💻 Profile Card UI — Стильная карточка-портфолио с анимированными кнопками.
Сделан на SVG, SCSS и JS🔗 Открыть код
7 647
🔄 Ребята из Яндекса уволились и открыли свой новый канал!
🔥 Всё в одном архиве для твоего роста и результата:
👩💻 Python
👩💻 Java
👩💻 JavaScript
👩💻 C# & Unity
👩💻 Node.js
👩💻 C & C++
👩💻 SQL & Базы данных
👩💻 Git & GitHub
🤟 DevOps
БЕСПЛАТНЫЕ КУРСЫ по всем ключевым направлениям
только для наших сабов! ❤️
➡️ Наша миссия — твой рост
7 647
⚡️ Бесплатное обучение фронтенд-разработке с нуля до React — с поддержкой от наставника
Опыт в программировании не нужен.
На канале Интенсивный JavaScript действующий тимлид и опытный разработчик помогает изучить фронтенд на практических задачах, которые интересно кодить
С 24 по 28 декабря проводит бесплтаное обучение, где он на практике поможет разобраться в основах — HTML/CSS и JavaScript, а также попробовать самый популярный фреймворк — React
💡Всё объясняет на примере проекта — доски объявлений
Обучение подойдёт, даже если у вас нет опыта в программировании — всё объясняют так, чтобы поняла даже ваша бабуля
🔖Ещё этот парень регулярно набирает новичков в свою команду и знает, как трудоустроиться и джуну, и разрабу поопытнее
Помимо работы с кодом он даст пошаговый план изучения всего, что нужно современному фронтенду.
Поделится способами поиcка клиентов с поомщью ИИ.
Расскажет, как взять свой первый заказ на фрилансе без фриланс-бирж с огромной конкуренцией
Подписывайтесь, чтобы участвовать, осталось 33 места
Учиться самостоятельно можно бесконечно, если не знать, куда копать. На интенсиве сократите время на поиск информации и получите пошаговый план от разработчика, который нанимает новичков в команду
➡️Участвовать бесплатно
+ среди участников разыграет годовую подписку на полезный ИИ
7 647
⚡️ Бесплатное обучение фронтенд-разработке с нуля до React — с поддержкой от наставника
Опыт в программировании не нужен.
На канале Интенсивный JavaScript действующий тимлид и опытный разработчик помогает изучить фронтенд на практических задачах, которые интересно кодить
С 24 по 28 декабря проводит бесплтаное обучение, где он на практике поможет разобраться в основах — HTML/CSS и JavaScript, а также попробовать самый популярный фреймворк — React
💡Всё объясняет на примере проекта — доски объявлений
Обучение подойдёт, даже если у вас нет опыта в программировании — всё объясняют так, чтобы поняла даже ваша бабуля
🔖Ещё этот парень регулярно набирает новичков в свою команду и знает, как трудоустроиться и джуну, и разрабу поопытнее
Помимо работы с кодом он даст пошаговый план изучения всего, что нужно современному фронтенду.
Поделится способами поиcка клиентов с поомщью ИИ.
Расскажет, как взять свой первый заказ на фрилансе без фриланс-бирж с огромной конкуренцией
Подписывайтесь, чтобы участвовать, осталось 33 места
Учиться самостоятельно можно бесконечно, если не знать, куда копать. На интенсиве сократите время на поиск информации и получите пошаговый план от разработчика, который нанимает новичков в команду
➡️Участвовать бесплатно
+ среди участников разыграет годовую подписку на полезный ИИ
7 647
⚙️ Shadcn для Vue: норм или стрём?
Опыт использования shadcn-vue в продакшн проекте: что работает хорошо, а с чем придется помучиться. Честный обзор популярной UI библиотеки от практикующего разработчика.🔗 Читать статью
7 647
🔥 Самые нужные каналы для Frontend разработчика, чтобы расти в доходе 💸
• Frontend | Вопросы собесов
• Frontend | Вакансии с удаленкой
• Frontend | LeetCode
• Frontend | Тесты
Подпишись, чтобы не потерять ☝️
7 647
👩💻 Ubisoft Quartz Background Animation — Размытая анимация отлично подойдёт для фона на вашем сайте
Сделано на CSS🔗 Открыть код
7 647
💸 Разработчики из Яндекса создали IT каналы и слили кучу материала
Здесь информация, которая реально помогает изучать программирование с полного нуля!
Выбирайте своё направление и подписывайся:
👩💻 Python Flow — @python_flow
👩💻 C & C++ Flow — @cpp_flow
💻 IT News Flow — @itnews_flow
👩💻 Java Flow — @java_flow
👩💻 SQL & Базы данных Flow — @sql_flow
👩💻 C# & Unity Flow — @csharp_flow
👩💻 Node.js Flow — @nodejs_flow
👩💻 Linux & DevOps Flow — @linux_flow
👩💻 InfoSec & Хакинг — @hacking_flow
👩💻 Git & GitHub Flow — @git_flow
Прием заявок действует до завтра ⚠️
7 647
⚙️ Коллекция полезных HTML и CSS фич, которые редко используются
Покажу забытые, но полезные фичи HTML/CSS: когда они лучше JS и как применить без боли. Мини-примеры и быстрые советы — внедряем сегодня.🔗 Читать статью
7 647
Привет. Вот тебе самые топовые каналы по IT!
⚙️ Free Znanija (IT) — Самая огромная коллекция платных курсов, которые можно скачать бесплатно;
👩💻 IT Books — Самая огромная библиотека книг;
💻 Hacking & InfoSec Base — Крутой блог белого хакера;
🛡 CyberGuard — Всё про ИБ;
🤔 ИБ Вакансии — Всё, чтобы найти работу в ИБ;
👩💻 linux administration — Всё про Линукс;
👩💻 Программистика — Python, python и ещё раз python;
👩💻 GameDev Base — Всё про GameDev;
😆 //code — Самые топовые мемы по IT:
Подпишись, чтобы не потерять!
7 647
⚙️ View Transitions API
Полистав различные ресурсы в Интернете и просмотрев множество видео по данной теме, я решил составить наиболее полную картину по данному, не побоюсь этого слова, революционному API, чтобы вы уже сегодня могли начать использовать его в своём проекте!🔗 Читать статью
7 647
❓ Зачем используется метод
preventDefault() в JavaScript и когда его применять?
Метод preventDefault() отменяет стандартное поведение элемента браузера, не прерывая при этом выполнение других обработчиков. Это удобно, когда нужно полностью контролировать действия пользователя.
✅Пример:
<form id="loginForm">
<button type="submit">Войти</button>
</form>
<script>
const form = document.getElementById("loginForm");
form.addEventListener("submit", (event) => {
event.preventDefault(); // отменяем стандартную отправку формы
console.log("Форма не перезагружается, можно обработать данные вручную");
});
</script>
📌В этом примере preventDefault() предотвращает перезагрузку страницы при отправке формы.
preventDefault() удобно использовать при работе с формами, ссылками, drag&drop и кастомными UI-элементами. Оно даёт разработчику полный контроль над поведением интерфейса
7 647
👩💻 Fancy Glowing Button — Крутая кнопка с RGB подсветкой и эффектом при наведении
Сделана на чистом CSS🔗 Открыть код
7 647
❓ Зачем используется метод
preventDefault() в JavaScript и когда его применять?
Метод preventDefault() отменяет стандартное поведение элемента браузера, не прерывая при этом выполнение других обработчиков. Это удобно, когда нужно полностью контролировать действия пользователя.
✅Пример:
<form id="loginForm">
<button type="submit">Войти</button>
</form>
<script>
const form = document.getElementById("loginForm");
form.addEventListener("submit", (event) => {
event.preventDefault(); // отменяем стандартную отправку формы
console.log("Форма не перезагружается, можно обработать данные вручную");
});
</script>
📌В этом примере preventDefault() предотвращает перезагрузку страницы при отправке формы.
preventDefault() удобно использовать при работе с формами, ссылками, drag&drop и кастомными UI-элементами. Оно даёт разработчику полный контроль над поведением интерфейса
7 647
🤷🏼♂️ Готовимся к вопросам по вёрстке на интервью Frontend-разработчика: свойство display
Статья посвящена подготовке к собеседованию на позицию Frontend-разработчика, в частности, вопросам, связанным с вёрсткой и свойством display в CSS. Автор подробно объясняет, как работает свойство display, его внешние и внутренние типы отображения, а также ключевые слова, которые можно использовать. Это включает в себя обсуждение таких ключевых слов, как block, inline, run-in, flow, flow-root, flex, grid, table и ruby.
#Полезное
https://habr.com/ru/companies/ruvds/articles/798975/
7 647
IT — не латте, смузи и гироскутер, а вызовы и амбиции
VK показывает, чем занимаются её команды — от экспериментальных технологий до VK Fest. Переходите по ссылке: смотрите ролики, читайте про проекты и тут же откликайтесь на вакансию, которая по вкусу!
Перейти на сайт
#реклама 16+
vkteam.ru
О рекламодателе
