This media is not supported in your browser
VIEW IN TELEGRAM
#css #tip by Shripal Soni
💡Получаем доступ к значению HTML-атрибута как к строке внутри CSS: наглядный пример для фронтенд-разработчика
👉 Поиграть можно здесь.
💡Получаем доступ к значению HTML-атрибута как к строке внутри CSS: наглядный пример для фронтенд-разработчика
👉 Поиграть можно здесь.
📌Как понять, что что-то идёт не так? Это сравнимо с постоянным стрессом — поэтому вы не можете:
• расслабляться;
• радоваться;
• придумывать новое;
• планировать будущее и вообще смотреть на него широко открытыми глазами;
• расставлять приоритеты;
• заставить себя сделать необходимые задачи;
• концентрироваться;
• запоминать.
📌Как не попасть в зависимость от работы? Просто имейте это в виду:
1️⃣Работа никогда не закончится
2️⃣Незаменимых людей нет
3️⃣Ты не перестанешь расти, если будешь себя хвалить
4️⃣Не кори себя за «лень», когда чувствуешь усталость
5️⃣Не бойся просить о помощи
6️⃣Умерь свой перфекционизм
7️⃣Тайм-менеджмент реально помогает
📌Что делать, если ты уже выгорел?
⚠️Научиться отдыхать, но это еще не все.
А теперь по шагам: что делать, если выгорел👇
Отдохни 👉 Выйди на прогулку 👉 Вспомни, какие занятия доставляли тебе удовольствие 👉 Системно займись тайм-менеджментом 👉 Будь себе другом, относись к себе бережно и работай над отношениями, даже если эти отношения — с работой
Please open Telegram to view this post
VIEW IN TELEGRAM
#айтисобытия #лучшиепрактики
🚀 Весь плейлист можно посмотреть здесь. А вот лучшие доклады заслуживают отдельного внимания:
🌐 Chrome DevTools — спрятанные полезности / Никита Дубко (Яндекс)
🌐 Ораторское мастерство как инструмент развития карьеры / Александра Прокшина (ARTW)
🌐 Инженерный подход к внедрению дизайн-системы / Семен Левенсон (Дзен)
🌐 Высококонверсионные собеседования / Андрей Смирнов (X5 Group)
🌐 Синий свет — зеленый свет: релизим без даунтаймов / Николай Тихонов (Тинькофф)
🌐 Webpack: заменить нельзя оставить / Евгений Кувшинов
🌐 Микросервис головного мозга. Рецепты качества / Михаил Трифонов (Сloud)
🌐 История о том, как мы на Module Federation съезжали / Максим Смирнов (Тинькофф)
🌐 Рано выбрасывать iframe в 2022-м году / Андрей Кузнецов (РБС)
🌐 Многопоточность на фронте. Абсурд или прекрасное архитектурное решение? / Игорь Костяков (IBS Dunice)
Please open Telegram to view this post
VIEW IN TELEGRAM
А ведь действительно, некоторые подписчики верно подметили в комментариях к опросу про Astro, ведь буквально недавно был представлен релиз Astro 3.0.
🚀На 30% быстрее и мощнее, чем когда-либо. Внутри: View Transitions, Image Optimization, JSX Fast Refresh и многое другое.
💡Статью-анонс нового выпуска обязательно стоит прочитать, ровно как и материал в блоге Chrome про Astro View Transitions.
💬Кто-то уже использовал? Поделитесь опытом и впечатлениями.
🚀На 30% быстрее и мощнее, чем когда-либо. Внутри: View Transitions, Image Optimization, JSX Fast Refresh и многое другое.
💡Статью-анонс нового выпуска обязательно стоит прочитать, ровно как и материал в блоге Chrome про Astro View Transitions.
💬Кто-то уже использовал? Поделитесь опытом и впечатлениями.
Telegram
Библиотека фронтендера | Frontend, JS, JavaScript, React.js, Angular.js, Vue.js
Какой(-ая), по вашему мнению, фронтенд фреймворк/библиотека будут наиболее активно развиваться в следующем году?
React / Angular / Alpine.js / Ember / Stencil / Vue.js / Preact / Svelte / Qwik / Другой вариант (напишу в комментарии)
React / Angular / Alpine.js / Ember / Stencil / Vue.js / Preact / Svelte / Qwik / Другой вариант (напишу в комментарии)
Не нужно учить Svelte, потому что... угадайте что?
Вы уже знаете его! Это всё JavaScript, только в более крутом исполнении. По крайней мере, так считает автор статьи.
🔍Что такое Svelte?
• UI-фреймворк: быстрый, простой и довольно популярный.
• Встроенный компилятор, преобразующий .svelte-файлы в чистый JavaScript-код. Итоговый результат работы фреймворка представляет собой код без намека на этот самый фреймворк, перекладывая всю тяжелую работу на этап сборки приложения.
• Лаконичный: только HTML, CSS и JS.
• Полный: встроенное управление состоянием и стили, ограниченные компонентами.
🤖Svelte vs React
• Эффекты/Реактивность: Svelte автоматически отслеживает зависимости.
• Управление состоянием: Svelte предлагает простое решение "pub-sub".
• Жизненный цикл: в отличие от React, Svelte предоставляет более явные методы для управления жизненным циклом компонентов.
🎨Примеры: в то время как в React вам нужны обертки, Svelte позволяет вам напрямую работать с библиотеками, такими как Chart.js.
🚀Начало работы с Svelte
• Основы: обязательно начните с документации.
• Создайте проект: попробуйте создать свой собственный проект на Svelte — идеи для проектов также есть в статье.
🌟Заключение
Svelte — это свежий взгляд на веб-разработку, который позволяет вам сосредоточиться на создании приложения, а не на изучении сложных особенностей фреймворка.
🔗Читать статью
Вы уже знаете его! Это всё JavaScript, только в более крутом исполнении. По крайней мере, так считает автор статьи.
🔍Что такое Svelte?
• UI-фреймворк: быстрый, простой и довольно популярный.
• Встроенный компилятор, преобразующий .svelte-файлы в чистый JavaScript-код. Итоговый результат работы фреймворка представляет собой код без намека на этот самый фреймворк, перекладывая всю тяжелую работу на этап сборки приложения.
• Лаконичный: только HTML, CSS и JS.
• Полный: встроенное управление состоянием и стили, ограниченные компонентами.
🤖Svelte vs React
• Эффекты/Реактивность: Svelte автоматически отслеживает зависимости.
• Управление состоянием: Svelte предлагает простое решение "pub-sub".
• Жизненный цикл: в отличие от React, Svelte предоставляет более явные методы для управления жизненным циклом компонентов.
🎨Примеры: в то время как в React вам нужны обертки, Svelte позволяет вам напрямую работать с библиотеками, такими как Chart.js.
🚀Начало работы с Svelte
• Основы: обязательно начните с документации.
• Создайте проект: попробуйте создать свой собственный проект на Svelte — идеи для проектов также есть в статье.
🌟Заключение
Svelte — это свежий взгляд на веб-разработку, который позволяет вам сосредоточиться на создании приложения, а не на изучении сложных особенностей фреймворка.
🔗Читать статью
Kavii Suri
You Don't Need to Learn Svelte – Here's Why
Discover the hidden power of Svelte – the JavaScript framework that feels like déjà vu. Uncover how Svelte simplifies web development, reimagining JS.
➕В инспекторе совместимости рядом с CSS-свойствами, которые могут привести к проблемам веб-совместимости, теперь отображается значок. При наведении на него появляется всплывающая подсказка со сведениями о том, какие браузеры не поддерживают это свойство, и ссылкой на страницу свойства в MDN.
➕
console.clear()
больше не очищает вывод консоли при включённой настройке «Непрерывные логи».➕В сетевом мониторе появилась пометка о том, что запрос выполнен через прокси.
➕При просмотре сгруппированных правил CSS теперь отображаются отступы и открывающие/закрывающие скобки.
➕Появилось предупреждение о проигнорированных свойствах выделенных псевдоэлементов.
➕Реализована подсветка контура offset-path.
Please open Telegram to view this post
VIEW IN TELEGRAM
🤔Трудно правильно структурировать асинхронный код, чтобы он выполнялся в том порядке, в котором вы этого хотите. К счастью, у нас есть линтеры, позволяющие выявить некоторые ошибки на ранних этапах.
📋В руководстве приведена мини-коллекция правил линтинга, которые помогут вам писать асинхронный код на JavaScript/TypeScript и Node.js.
📌Часть правил по умолчанию поставляются с ESLint, часть предназначены для Node.js, а остальные — для TypeScript.
Please open Telegram to view this post
VIEW IN TELEGRAM
eslint.org
Getting Started with ESLint - ESLint - Pluggable JavaScript Linter
A pluggable and configurable linter tool for identifying and reporting on patterns in JavaScript. Maintain your code quality with ease.
386. Safari, Firefox, Bun, Node.js, веб-фичи, Figma, марсианский…
Веб-стандарты
00:01:46 Safari TP
00:12:10 Планы Firefox
00:25:25 Bun 1.0
00:46:33 Env в Node.js
00:54:32 Каталог веб-фич
01:11:18 Новости Figma
01:21:50 Марсианский плагин
01:26:08 Google и Topics API
01:41:23 Отказ от TypeScript
02:03:48 Ответы на вопросы
⏯ YouTube | Apple Подкасты | Google Подкасты | Яндекс Музыка | Сайт подкаста
#подкасты
Please open Telegram to view this post
VIEW IN TELEGRAM
🛠 Принцип работы async/await в JavaScript
Если вам доводилось работать с JavaScript, то вы наверняка встречались с синтаксисом async/await. Эта функциональность позволяет прописывать асинхронную логику синхронным образом, упрощая тем самым её понимание.
Некоторым ветеранам JS известно, что async/await — это просто синтаксический сахар для существующего Promises API. Это означает, что в JS должен быть способ реализации функциональности async/await без использования ключевых слов async и await, хоть и более громоздкий. Именно об этом и пойдёт речь под катом.
🔗 Читать
Если вам доводилось работать с JavaScript, то вы наверняка встречались с синтаксисом async/await. Эта функциональность позволяет прописывать асинхронную логику синхронным образом, упрощая тем самым её понимание.
Некоторым ветеранам JS известно, что async/await — это просто синтаксический сахар для существующего Promises API. Это означает, что в JS должен быть способ реализации функциональности async/await без использования ключевых слов async и await, хоть и более громоздкий. Именно об этом и пойдёт речь под катом.
🔗 Читать
Какой из перечисленных софт скиллов, по вашему мнению, является наиболее ценным для ИТ-специалиста в команде? Можно выбрать несколько вариантов.
Anonymous Poll
65%
Умение общаться с коллегами (коммуникабельность)
56%
Способность к самостоятельному обучению
46%
Умение управлять своим временем и приоритетами
14%
Эмпатия и понимание потребностей пользователя
6%
Лидерские качества
38%
Умение быстро адаптировать в изменяющейся обстановке
33%
Внимательность
16%
Креативность и гибкость
15%
Пунктуальность
3%
Свой вариант (напишу в комментарии)
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥Команда Тинькофф объединила все библиотеки Angular, работа над которыми велась в течение пяти лет, в проект Taiga Family.
💪 Ребята начали еще с Angular 4 и до сих пор держатся. Вас ждут:
🔻Web APIs for Angular
🔻Event manager плагины
🔻Polymorpheus
🔻Maskito и многое другое
🔗GitHub
💪 Ребята начали еще с Angular 4 и до сих пор держатся. Вас ждут:
🔻Web APIs for Angular
🔻Event manager плагины
🔻Polymorpheus
🔻Maskito и многое другое
🔗GitHub
Хабр
Taiga UI: больше чем UI kit
Taiga UI — огромная библиотека UI-компонентов для Angular, на которую стоит взглянуть. Но она только вершина айсберга. Мы разрабатывали ее более пяти лет, начав еще на Angular 4. И, будучи любителями...
This media is not supported in your browser
VIEW IN TELEGRAM
💡Улучшаем UX для пользователей при нажатии на hover-based action buttons, которые используют только клавиатуру и сенсорный экран.
👉 Поиграть можно здесь.
#css #tip by Shripal Soni
👉 Поиграть можно здесь.
#css #tip by Shripal Soni
🍪Хоть сейчас и мало кого заинтересуешь «печеньками» и «кикером в офисе», эйчары до сих пор в описаниях вакансий делают упор на удобном расположении офиса, бесплатном кофе и классных тимбилдингах.
🧗♀️Но это, скорее, верхушка айсберга и приятное дополнение к тому, что должно помогать сотруднику сохранять страсть к своей работе и не выгореть на первом же году работы. А «под водой» — интересные и разноплановые задачи, которые бросают вызов нашим скиллам и заставляют получать новые знания, и благодаря которым каждый день мы приходим на работу с удовольствием.
💬А что «зажигает» именно вас? Ради чего вы каждый день приходите на работу или садитесь за рабочий компьютер в случае удаленки? Как думаете, зависит ли счастье сотрудников от интересных задач?
🧗♀️Но это, скорее, верхушка айсберга и приятное дополнение к тому, что должно помогать сотруднику сохранять страсть к своей работе и не выгореть на первом же году работы. А «под водой» — интересные и разноплановые задачи, которые бросают вызов нашим скиллам и заставляют получать новые знания, и благодаря которым каждый день мы приходим на работу с удовольствием.
💬А что «зажигает» именно вас? Ради чего вы каждый день приходите на работу или садитесь за рабочий компьютер в случае удаленки? Как думаете, зависит ли счастье сотрудников от интересных задач?
Универсальный набор инструментов для запуска, сборки и тестирования JavaScript/TypeScript стал еще лучше и быстрее. Под катом — подробности новой версии.
Please open Telegram to view this post
VIEW IN TELEGRAM
Хабр
Релиз Bun 1.0 (новый runtime для JavaScript )
Представляем Bun версии 1.0. Bun — это быстрый универсальный набор инструментов для запуска, сборки, тестирования и отладки JavaScript и TypeScript кода (от одного файла до...
👀 Манипулирование данными JPEG и EXIF в JavaScript: практический взгляд на то, как выбирать формат JPEG и читать/заменять теги EXIF напрямую, не полагаясь на стороннюю библиотеку.
👉 Читать
Please open Telegram to view this post
VIEW IN TELEGRAM
Getaround Tech
JPEG and EXIF Data Manipulation in Javascript | Getaround Tech
Understand the JPEG file format to know how to read and update EXIF Data in Javascript
🎓💼 ТОП-9 не самых очевидных компаний для стажировки в ИТ
Везде просят опыт работы... Но где его взять? Как раз об этом сейчас и расскажем!
🔗Читать статью
🔗Зеркало
Везде просят опыт работы... Но где его взять? Как раз об этом сейчас и расскажем!
🔗Читать статью
🔗Зеркало
This media is not supported in your browser
VIEW IN TELEGRAM
Emil Kowalski — разработчик библиотеки всплывающих компонентов для React под названием Sonner.
В статье он делится опытом и демонстрирует некоторые уроки, которые извлек, и ошибки, которые допустил при создании библиотеки.
👀 Читать
В статье он делится опытом и демонстрирует некоторые уроки, которые извлек, и ошибки, которые допустил при создании библиотеки.
Please open Telegram to view this post
VIEW IN TELEGRAM
👨🎓Если кратко, то одни после выполнения возвращает какое-либо значение, в то время как другие просто выполняют определённое действие.
📌Закрепляем эти, казалось бы, простые вещи на практике и разбираемся, как они отразились в React.
Please open Telegram to view this post
VIEW IN TELEGRAM
Joshwcomeau
Statements Vs. Expressions • Josh W. Comeau
One of the most foundational things to understand about JavaScript is that programs are made up of statements, and statements have slots for expressions. In this blog post, we'll dig into how these two structures work, and see how building an intuition about…
Forwarded from Библиотека шарписта | C#, F#, .NET, ASP.NET
⚒️ ТОП-27 плагинов для Visual Studio Code в 2023
Предлагаем список лучших расширений для VS Code в 2023 году: продуктивность, окрашивание сниппетов, контроль версий, форматирование, линтинг и отладка.
🔗Читать статью
🔗Зеркало
Предлагаем список лучших расширений для VS Code в 2023 году: продуктивность, окрашивание сниппетов, контроль версий, форматирование, линтинг и отладка.
🔗Читать статью
🔗Зеркало
387. Chrome 117 и бета 118, DevTools, экологичный веб, миксины и…
Веб-стандарты
🎙Свежий выпуск подкаста «Веб-стандарты»: Андрей Симоненко, Никита Дубко, Юля Миоцен, Вадим Макеев про Chrome 117 и бету 118, DevTools, экологичный веб, миксины и функции в CSS, Interop 2024 и Figma.
00:01:46 Chrome 117
00:12:20 Бета Chrome 118
00:42:21 Chrome DevTools
00:48:49 Экологичный веб
00:58:19 Миксины и функции в CSS
01:25:54 Interop 2024
01:29:59 Новости Figma
01:36:19 CSS в Figma
01:49:16 Ответы на вопросы
⏯ YouTube | Apple Подкасты | Google Подкасты | Яндекс Музыка | Сайт подкаста
00:01:46 Chrome 117
00:12:20 Бета Chrome 118
00:42:21 Chrome DevTools
00:48:49 Экологичный веб
00:58:19 Миксины и функции в CSS
01:25:54 Interop 2024
01:29:59 Новости Figma
01:36:19 CSS в Figma
01:49:16 Ответы на вопросы
⏯ YouTube | Apple Подкасты | Google Подкасты | Яндекс Музыка | Сайт подкаста