Библиотека фронтендера | 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
加入频道
💸👨‍💻 Тебе повезло, ты богатый айтишник

Как показали результаты нашего исследования, даже с профильным образованием найти первую работу в ИТ бывает нелегко. Большинству свитчеров первый оффер дается еще сложнее: огромный объем необходимых знаний и навыков нужно получить как можно быстрее.

Многие учатся (самостоятельно или на курсах) без отрыва от основной работы. Самые отчаянные вайтишники бросают работу и начинают учиться, живя на скромные сбережения. Герой этой истории, фронтендер Олег, начинал именно так. Под катом — его история.

👉 Читать статью
👉 Зеркало
💡 Упрощение группировки данных в JavaScript с помощью Object.groupBy() или Map.groupBy(): на заметку фронтендеру

#javascript #tip by Shripal Soni
⚡️Proglib запускает канал про ИИ-помощников

Будем максимально подробно рассказывать про все существующие нейросети-помощники, которые генерируют текст или код — с пошаговыми инструкциями, промтами, инструментами и лайфхаками.

⭐️ChatGPT
⭐️Gemini
⭐️Claude
⭐️Bing
И другие!

👉Подписывайтесь!
Please open Telegram to view this post
VIEW IN TELEGRAM
🧰 MistCSS — инструмент для создания React-компонентов на CSS.

CSS-in-JS уже не новость... что насчет JS-from-CSS? Этот новый подход предлагает способ компиляции компонентов, написанных исключительно на CSS, в TypeScript для использования с React.

Еще рано говорить о полной готовности, но идея, по крайней мере, интригующая.

🙇‍♂️ Простой пример
👩‍💻 GitHub
Please open Telegram to view this post
VIEW IN TELEGRAM
🧑‍💻 Статьи для IT: как объяснять и распространять значимые идеи

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

Что: семь модулей, посвященных написанию, редактированию, иллюстрированию и распространению публикаций.

Для кого: для авторов, копирайтеров и просто программистов, которые хотят научиться интересно рассказывать о своих проектах.

👉Материалы регулярно дополняются, обновляются и корректируются. А еще мы отвечаем на все учебные вопросы в комментариях курса.
7 ways to hide element using CSS.png
2 MB
💡7 способов скрыть элемент с помощью CSS: на заметку фронтенд-разработчику

#css #tip by Shripal Soni
🧘‍♂️ Work-life balance — это баланс между работой и личной жизнью. Соблюдать его — значит придерживаться образа жизни, при котором каждая сфера деятельности находится в гармонии с остальными и не наносит им ущерба.

💡 Другими словами, work-life balance позволяет успешно совмещать работу, отдых, семью, хобби, здоровье и другие важные аспекты нашей жизни.

💬 А вам удается его соблюдать?

👍 — да, только на этом и держусь
🤔 — нет, обычно работа в приоритете
🥱 — вы о чем вообще?
💯 — свой вариант (напишу в комментариях)
415. Firefox 124, Chrome 123, JSPI в WASM, Config и Hackfest, Popover…
Веб-стандарты
🎙Свежий выпуск подкаста «Веб-стандарты»: Вадим Макеев, Андрей Мелихов, Юля Миоцен, Никита Дубко про Firefox 124 и Chrome 123, JSPI в WASM, Config и Web Engines Hackfest, доступность Popover, JS-рантаймы и надёжные автогриды.

00:02:09 Firefox 124
00:13:06 Chrome 123
00:40:13 Chrome DevTools
00:49:20 JSPI в WASM
00:53:11 Config и Hackfest
00:55:26 Доступность Popover
01:10:55 Все JS-рантаймы
01:24:40 Где открывать ссылки
01:40:22 Надёжные автогриды
01:50:33 Ответы на вопросы

YouTube | Apple Подкасты | Google Подкасты | Яндекс Музыка | Сайт подкаста

#подкасты
⚡️ Итоги достижений в 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 год

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

🔗 Читать статью
🔗 Зеркало