front_end_dev | Technologies

Telegram-канал front_end_dev - FrontEndDev

29695

🚀 Статьи, новости, туториалы по frontend разработке. http://jem-space.ru Admin: @jem_jem Пишу в @five_a_m Хорошие серваки от DigitalOcean: https://m.do.co/c/1351d64475ee Реклама: http://bit.ly/2NxmVDu № 4850240725

Subscribe to a channel

FrontEndDev

Несколько советов по доступности

Кевин Эндрюс делится советами по accessibility, которые можно применять уже сегодня.

https://piccalil.li/blog/practical-accessibility-tips-you-can-apply-today/

Читать полностью…

FrontEndDev

Используем Map вместо привычного Object

Дмитрий Павлутин рассказывает о том, как обойти ограничения обычных объектов для хранения данных с помощью Map.

https://dmitripavlutin.com/maps-vs-plain-objects-javascript/

Читать полностью…

FrontEndDev

В чем разница между Dialog и Popover?

Разбираем отличия и аспекты использования Dialog и Popover.

https://frontendmasters.com/blog/whats-the-difference-between-htmls-dialog-element-and-popovers

Читать полностью…

FrontEndDev

AbortController не только для fetch

Несколько вариантов использования AbortController'a, о которых мало кто знает, но которые могут быть сподручными при решении задач разработки.

https://kettanaito.com/blog/dont-sleep-on-abort-controller

Читать полностью…

FrontEndDev

Сборщики: прошлое, настоящее и будущее

Исторический экскурс на тему бандлеров: почему приходится их использовать, как они работают под капотом, какие проблемы решают и как будут развиваться дальше

https://www.youtube.com/watch?v=JUS6EPMbk0U

Читать полностью…

FrontEndDev

🙂 Как эффективно и безболезненно внедрить DevSecOps?

Positive Technologies выпустили в помощь общедоступную методологию внедрения практик безопасной разработки — AppSec Table Top.

📖 Внутри — набор принципов и подходов, которые помогут выстроить AppSec-процессы с учетом интересов бизнеса, требований регуляторов и потребностей команд.

В методологии учтена передовая экспертиза Positive Technologies в области application security, а также лучшие российские практики и зарубежные наработки.

Скачивайте гайдлайн на сайте, а дальше... вы будете знать, что делать.

Читать полностью…

FrontEndDev

Управление сессией в NextJS

Полное руководство с примерами кода по работе с сессиями без использования сторонник библиотек.

https://clerk.com/blog/complete-guide-session-management-nextjs

Читать полностью…

FrontEndDev

Переходы открытия и закрытия для <details>

Интересный и простой способ оживить нативный <details> c помощью interpolate-size и transition.

https://nerdy.dev/open-and-close-transitions-for-the-details-element

Читать полностью…

FrontEndDev

Создаем фигуры с вырезами, используя CSS маски

Простые примеры использования CSS Mask для создания фигур.

https://verpex.com/blog/website-tips/how-to-create-shapes-with-inner-curves-using-css-mask

Читать полностью…

FrontEndDev

ColorSpace

Простой и удобный генератор CSS градиентов.

https://mycolor.space/gradient3

Читать полностью…

FrontEndDev

SVG Coding Examples: Рецепты ручного создания SVG

Разбираемся с внутрянкой работы SVG на примере простых фигур и операций.

https://www.smashingmagazine.com/2024/09/svg-coding-examples-recipes-writing-vectors-by-hand/

Читать полностью…

FrontEndDev

Новые значения и функции CSS

Обновленные старые и новые фичи, которые могут заехать в релиз в ближайшем будущем.

https://alvaromontoro.com/blog/68062/new-values-and-functions-in-CSS

Читать полностью…

FrontEndDev

🥥 Kokoc Hackathon 2024: Объединяй технологии, спорт и бизнес!

Прими участие в Kokoc Hackathon 2024 – событии, где спорт, e-commerce и технологии сливаются воедино! С 3 по 18 октября ты сможешь решить реальные кейсы и побороться за призовой фонд в 1 000 000 рублей.

💼 Приглашаем аналитиков, ML-специалистов, Product-менеджеров, Backend и Frontend-разработчиков (знание Python, Django и/или PHP будет преимуществом), UI/UX-дизайнеров, студентов и выпускников технических вузов.

🎯 Задачи хакатона:
1. Веб-платформа для футбольного клуба – создай платформу для взаимодействия клуба и болельщиков.
2. Интеллектуальная рекомендательная система – создай ML-модель, прогнозирующую действия пользователей интернет-магазина.

📅 Таймлайн:
🔸 3 сентября - 30 сентября: Регистрация
🔸 3 октября: Открытие и задачи
🔸 4 - 10 октября: Чек-поинты с экспертами
🔸 18 октября: Питчинг и награждение

👉 Регистрируйся до 30 сентября! https://cnrlink.com/kokochack2024frontenddev

Реклама. ООО «Эдбокс». ИНН: 9702043065. erid: LjN8K3jeC

Читать полностью…

FrontEndDev

Улучшаем рендеринг перфоманс с CSS content-visibility

На примере сайта с большим количеством emoji посмотрим как content-visibility влияет на отрисовку страницы.

https://nolanlawson.com/2024/09/18/improving-rendering-performance-with-css-content-visibility/

Читать полностью…

FrontEndDev

Scroll-based анимация текста с помощью SVG фильтров

Очередной необычный эффект для анимации текстового контента.

Демо | GitHub

https://tympanus.net/codrops/2024/08/22/scroll-based-svg-filter-animations-on-text/

Читать полностью…

FrontEndDev

Перевод веб приложения в Telegram Mini Apps

Интересная история о том, как команда Точки решила изменить подход к развитию продукта и перевела его на интеграцию с Telegram.

Глеб Агеев — фронт-разработчик Точка Нетворк, рассказывает о том, как это упростило разработку и делится советами по эффективной работе с платформой.

Читать полностью…

FrontEndDev

Как использовать CSS свойство backdrop-filter

Примеры стилизации с backdrop-filter, которые помогут создать необычный эффект в пару строк.

https://blog.logrocket.com/use-css-backdrop-filter-property/

Читать полностью…

FrontEndDev

Всем привет!
На связи команда RuStore.

Каждый день мы стараемся делать RuStore ещё удобнее и будем благодарны за вашу помощь. Примите участие в исследовании о работе магазинов приложений, заполнив небольшой опрос.

Это займёт не более 5 минут и поможет нам стать лучше.

Пройти опрос по ссылке

Читать полностью…

FrontEndDev

Сделайте ваше React приложение в стиле Windows 95

Библиотека React компонентов для ностальгирующих.

https://react95.github.io/React95/?path=/story/all--all

Читать полностью…

FrontEndDev

ESLint теперь поддерживает линтинг JSON

Поддержка новых правил с помощью плагинов eslint/json и eslint/markdown для проверки JSON и Markdown файлов

https://eslint.org/blog/2024/10/eslint-json-markdown-support/

Читать полностью…

FrontEndDev

Angular Routing

Все, что нужно знать о роутинге в Angular в одной статье

https://monsterlessons-academy.com/posts/angular-routing-essentials-all-you-need-to-know-in-one-post

Читать полностью…

FrontEndDev

Scroll-to-select

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

https://css-tricks.com/how-to-make-a-scroll-to-select-form-control/

Читать полностью…

FrontEndDev

🚀 Dockhost - современный хостинг для разработчиков приложений, ботов, mini apps и баз данных!

Облачная PaaS платформа на основе Docker-контейнеров, которая упрощает запуск и масштабирование приложений. Отлично подходит для разработчиков, владельцев пет проектов, фрилансеров, которые хотят быстро и просто запустить свой продукт, не задумываясь о настройке инфраструктуры.

👨‍💻Бонусом на платформе удобный интерфейс для управления контейнерами, высокий уровень безопасности и оплата по факту потребления, без фиксированных тарифов.

Помимо запуска готового образа Docker-контейнера из любого реестра, вы можете легко подключить к своему проекту в Dockhost любой репозиторий Git (GitHub, GitLub, и другие) с вашим кодом и настроить авто-деплой через Push (Push-to-Deploy).

👉 Перейти в Dockhost

Читать полностью…

FrontEndDev

5 способов ленивой подгрузки изображений

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

https://www.sitepoint.com/five-techniques-lazy-load-images-website-performance/

Читать полностью…

FrontEndDev

Используем Axios с Proxy

Примеры глобальной конфигурации axios, а также конфигурации одиночных запросов с использованием proxy.

https://brightdata.com/blog/how-tos/axios-proxy

Читать полностью…

FrontEndDev

CSS Converter

VS Code расширение для конвертации HTML/CSS в JS/CSS для styled components и обратно.

https://marketplace.visualstudio.com/items?itemName=Lakkannawalikar.css-converter

Читать полностью…

FrontEndDev

Управляем React компонентом с помощью url

Как синхронизировать состояние компонента с url параметрами: пошаговое и интерактивное руководство.

https://buildui.com/posts/how-to-control-a-react-component-with-the-url

Читать полностью…

FrontEndDev

Math4Devs

Список математических символов с их эквивалетном в JS: от простых до сложных.

https://math4devs.com/

Читать полностью…

FrontEndDev

Хочешь щёлкать задачи по фронтенду как орешки?

Канал Frontend tests & tasks научит!

Это не очередной канал с задачами. Здесь придется думать.

Убедись сам 👉 @Frontend_tasks

Читать полностью…

FrontEndDev

2 CSS свойства, позволяющие обрезать лишнее пространство box-контейнера

Экспериментальные свойства text-box-trim и text-box-edge, позволяющие тонко настраивать размеры текстовых контейнеров.

https://css-tricks.com/two-css-properties-for-trimming-text-box-whitespace/#aa-now-where-do-you-want-to-trim-from

Читать полностью…
Subscribe to a channel