Библиотека фронтендера | Frontend, JS, JavaScript, React.js, Angular.js, Vue.js
23.1K subscribers
2.22K photos
126 videos
38 files
4.65K links
Все самое полезное для фронтенда в одном канале.

По рекламе: @proglib_adv

Учиться у нас: https://proglib.io/w/77178ed4

Для обратной связи: @proglibrary_feeedback_bot

РКН: https://gosuslugi.ru/snet/67a5b6884689c2151c820bb4
加入频道
⚡️ Итоги достижений в Node.js за 2023 год: верхнеуровневый обзор новостей для фронтендеров, которые не следит за развитием проекта в реальном времени.

👉 Читать
Please open Telegram to view this post
VIEW IN TELEGRAM
This media is not supported in your browser
VIEW IN TELEGRAM
💡 Простой кейс создания закругленных углов в CSS

➡️ Поиграть можно здесь

#css #tip by Shripal Soni
Please open Telegram to view this post
VIEW IN TELEGRAM
📉 Оптимизация JavaScript: гайд для фронтенд-разработчика

Оптимизация кода включает в себя баланс между улучшением производительности и сохранением читаемости.

Под катом — краткий обзор простых методов оптимизации с примерами и бенчмарками 👇

🔗 Читать
🧑‍💻 Путь разработчика: один язык на всю жизнь или постоянное переобучение?

Мир IT постоянно развивается, и то, что было актуально вчера, сегодня может оказаться устаревшим. Мы хотим узнать, как часто разработчики меняют сферу деятельности и направление разработки в погоне за новыми знаниями и возможностями.

👉 Поделитесь своим мнением и опытом. Ваши ответы помогут нам лучше понять тенденции и предпочтения в сообществе разработчиков

Опрос займёт у вас примерно 4 минуты.
🧰 Команда Netflix представила библиотеку SafeTest, которая предлагает свежий взгляд на сквозные (E2E) тесты для веб-приложений с UI

SafeTest призван решить проблемы существующих библиотек с помощью нового подхода к UI-тестированию.

📌 Основная идея: на этапе загрузки приложения иметь фрагмент кода, который внедряет хуки для запуска тестов.

Этот способ работы не оказывает заметного влияния на обычное использование вашего приложения — SafeTest прибегает к ленивой загрузке для динамической загрузки тестов только при их выполнении (в примере с README тесты вообще не находятся в продакшен бандле).

После этого для запуска обычных тестов можно использовать Playwright, что помогает достигнуть идеального контроля браузера, который мы хотим получить для наших тестов.

🤩 Этот подход также открывает некоторые интересные возможности:

☑️ Глубокая привязка к конкретному тесту без необходимости запускать тестовый сервер.
☑️ Двусторонняя связь между браузером и контекстом теста.
☑️ Доступ ко всем фичам DX, которые поставляются с Playwright (за исключением тех, которые поставляются с playwright/test).
☑️ Видеозапись тестов, просмотр трейсов и функция паузы страницы.

👉 Подробнее
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
This media is not supported in your browser
VIEW IN TELEGRAM
🧙‍♂️ Визуализация JavaScript: выполнение промисов

Гайд с диаграммами и анимацией в сочетании с 8-минутным видео, из которого вы узнаете некоторые внутренние механизмы работы промисов и разберетесь, как они позволяют выполнять неблокирующие асинхронные задачи в JavaScript.

👉 Читать
👍 Ваш ультимативный набор шпаргалок для разработки на 2024 год

Эти шпаргалки сэкономят вам часы бесконечного гугления и упростят процесс кодинга.

🔗 Читать статью
🔗 Зеркало
👩‍💻 Node.js: документальный фильм об истории происхождения

Новый док от команды Honeypot особенно хорошо освещает историю Node, в том числе то, как все готовилось к форку io.js в 2014 году.

📌 Другие документальные фильмы для фронтенд-разработчика:

📺 React.js
📺 Vue.js
📺 GraphQL
📺 Ember.js
Please open Telegram to view this post
VIEW IN TELEGRAM
🖼️ Что нужно знать о современном CSS: на заметку фронтенд-разработчику

Подборка современных дополнений к CSS: container queries, nesting, scroll-driven animations, view transitions, :has() и многие другие.

👉 Читать
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
🤩 «По-настоящему красивые переходы средствами браузера» — доклад Никиты Дубко про новые интересные фичи, которые уже позволяют в некоторых браузерах делать очень красивые переходы между состояниями веб-приложений.

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

👀 Смотреть
Please open Telegram to view this post
VIEW IN TELEGRAM
🛠 Введение в htmx: гайд для фронтенд-разработчика

По данным 2023 JavaScript Rising Stars библиотека htmx заняла второе место в разделе Front-end Frameworks и десятое место в разделе Most Popular Projects Overall.

htmx — это библиотека, которая предоставляет доступ к AJAX, переходам CSS, WebSockets и Server Sent Eventsпрямо из HTML через атрибуты, что позволяет создавать современные пользовательские интерфейсы (насколько сложные — другой вопрос), пользуясь простотой и мощью гипертекста.

На сегодняшний день у библиотеки почти 30 000 звезд на Github. Самое интересное, что до такого решения сообщество додумалось только сейчас, учитывая, что весь функционал был доступен уже 10 лет назад. Узнайте подробнее, почему👇

🔗 Читать