Лайфхак для IT-шников в 2024

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

На бесплатном обучении от FAANG School ты прокачаешь алгоритмы с разработчиком с 7-летним опытом, который решил 500+ задач на LeetCode. Узнаешь:

– Как использовать разные структуры данных
при решении задач
– Какие 20% усилий дают 80% результата
при подготовке к алгоритмам
– Prefix Sum и Sliding Window. 2 подхода, которые закрывают задачи на 200к$ во время собесов в Google
– Как научиться решать алгоритмы без матана

Простые и доступные объяснения, полезные квизы и опросы, а также много задач для практики.

Переходи и жми на кнопку «Принять участие», если хочешь увеличить шансы устроиться в Яндекс, Amazon, Google и другие.


Original post link: t.me/seniorFront/4175
Forwarded and filtered by @smartfeed_bot

Cityscape

При нажатии на части сцены задаются различные CSS-классы, которые запускают анимации и трансформации.

https://codepen.io/jackiezen/pen/bvqqOo


Original post link: t.me/senior_front/2061
Forwarded and filtered by @smartfeed_bot

🖥 HaHo Mobile UI Kit – дизайн-система для мобильных приложений, которая включает самые разные элементы интерфейса: формы, календари, инфографику, галереи, чаты и тд.

Сайтодел | #макет #figma


Original post link: t.me/sitodel/1820
Forwarded and filtered by @smartfeed_bot

🗓 JavaScript и HTML: делаем простой календарь за 5 минут

Существует много способов использования JS для вебмастера. Одним из таких примеров может быть виджет календаря для веб-страницы. В этом материале мы создадим такой виджет с помощью HTML, CSS и JavaScript.

Читать...


Original post link: t.me/frontendnoteschannel/3674
Forwarded and filtered by @smartfeed_bot

Прототипы и наследование в JavaScript

В этой статье мы изучим всё, что касается прототипов в JavaScript. Разберём, зачем они нужны, что такое наследование и цепочка прототипов, как работает this внутри методов, рассмотрим пример расширения классов и многое другое.

https://itchief.ru/javascript/prototypes


Original post link: t.me/senior_front/2070
Forwarded and filtered by @smartfeed_bot

👩‍💻 5 крутых функций JavaScript, о которых не знает большинство разработчиков

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

Читать...


Original post link: t.me/frontendnoteschannel/3686
Forwarded and filtered by @smartfeed_bot

👩‍💻 Set в JavaScript: теперь с новыми суперспособностями

Узнайте о грядущих обновлениях Set в JavaScript, включая новые методы union, intersection, difference и другие. Подробный обзор и примеры использования.

Читать...


Original post link: t.me/frontendnoteschannel/3688
Forwarded and filtered by @smartfeed_bot

🖥 Самые интересные публикации за последние дни:

• На чем разработать свой стартап или с чего начать хакатон в 2024?

• Освоение программирования за 2 года с нуля или как я пытался автоматизировать реальное производство

• FastStream — новый убийца Celery?

• Как работать с объектным хранилищем на Python

• Мощь AST в действии, или как переписать код 10 летней давности на ES6-модули и ничего не сломать


Original post link: t.me/frontendnoteschannel/3689
Forwarded and filtered by @smartfeed_bot

​Что такое ARIA-атрибуты?

ARIA-атрибуты — это группа дополнительных атрибутов из спецификации WAI-ARIA, которая состоит из свойств и состояний.
Состояния (states) описывают состояния элементов и отвечают на вопрос «В каком состоянии сейчас элемент?».
Свойства (properties) нужны для раскрытия дополнительных функций элементов. Отвечают на вопрос «Что ещё делает этот элемент?».

ARIA-атрибуты поддерживают роли и помогают браузерам и Accessibility API правильно обрабатывать элементы для вспомогательных технологий. Сами по себе, без CSS и JavaScript, они не изменяют внешний вид и функциональность элементов.

Общий синтаксис ARIA-атрибутов — aria-атрибут="значение".
Для примера сообщим скринридеру с помощью ARIA-атрибута, что у поля есть инструкция к нему.
<label for="psw">Пароль</label>
<input
type="password"
name="password"
id="psw"
aria-describedby="hint"
>
<span id="hint">Пароль должен содержать не меньше 20 знаков</span>

aria-describedby связывает с помощью одинакового ID два элемента — поле и подсказку из тега <span>. Скринридер озвучит текст подсказки после подписи и основной информации о поле.

👉 @seniorFront

​Генератор градиентного фона

Хотите создавать действительно крутой градиент, а не полоски из 2-3 цветов? Тогда присмотритесь к Mesher — инструменту, который позволяет создавать очень сложные комбинации цветов, смешивая их так, как нужно именно вам.

Убедитесь сами:

https://csshero.org/mesher/

#инструменты #фронтенд


Original post link: t.me/tproger_web/4649
Forwarded and filtered by @smartfeed_bot

Как ошибка ChatGPT стоила нам $10 000

В этой статье рассказывается про то, как код, написанный при помощи ChatGPT привёл к багу, который не могли исправить неделю

Произошло следующее: в рамках миграции бэкенда мы переносили модели баз данных с Prisma/Typescript на Python/SQLAlchemy. Это был очень монотонный процесс. Мы обнаружили, что ChatGPT превосходно справляется с этой трансляцией, поэтому использовали его на протяжении почти всей миграции. Мы копипастили генерируемый им код, видели, что всё работает хорошо, пробовали в продакшене, видели, что он тоже работает, а затем продолжали процесс.

👉 @seniorFront


Original post link: t.me/seniorFront/4219
Forwarded and filtered by @smartfeed_bot

​​​JavaScript localStorage: что такое и как использовать?

LocalStorage в JavaScript позволяет хранить пары ключ/значение в браузере. Но в отличие от обычных переменных, всё, что мы запишем в localStorage, останется там после перезагрузки страницы и закрытия браузера.

В статье рассказали, как работает и как использовать localStorage в JS: https://tproger.ru/articles/javascript-localstorage-polnoe-rukovodstvo/

#js


Original post link: t.me/tproger_web/4652
Forwarded and filtered by @smartfeed_bot

​Regex Previewer: работа регулярки в соседней вкладке VSCode

Расширение позволяет валидировать регулярное выражение на ваших примерах в параллельных вкладках IDE.

Расширение на Visual Studio Marketplace

#инструменты


Original post link: t.me/tproger_web/4654
Forwarded and filtered by @smartfeed_bot

​​Что нового в React 19?

Видеообзор, в котором можно узнать все о новых интересных функциях, которые появятся в React 19, включая готовые способы обработки действий, оптимистичные обновления, статусы форм, новый API use() и многое другое: https://youtu.be/81uAxzeyL2I

#react


Original post link: t.me/tproger_web/4655
Forwarded and filtered by @smartfeed_bot

🖥 Самые интересные публикации за последние дни:

• Вам не нужен Lodash. Хватит! Пожалуйста

• Квест на Node.js — борьба с утечкой памяти. От диагностики до решения

• Организация структуры папок и файлов в React/Next по MVC-архитектуре

• Кофе по SSH, сайты в zip-архивах. Чистый HTML лучше всего

• Магия CSS на практике: советы по вёрстке от гика


Original post link: t.me/frontendnoteschannel/3701
Forwarded and filtered by @smartfeed_bot

👩‍💻 21 лайфхак для новичков в JavaScript

В JavaScript есть эксклюзивные практики, которые используют профессионалы и о которых даже не подозревают новички. Ознакомьтесь с некоторыми из них, чтобы усовершенствовать свои навыки в написании кода и преуспеть в динамичном мире JavaScript-разработки.

Читать...


Original post link: t.me/frontendnoteschannel/3704
Forwarded and filtered by @smartfeed_bot

​​Web API, которые функционально приближают веб-приложения к нативным

Чтобы дать пользователям доступ к функциям, привычным в нативных приложениях, и добавить новые, можно использовать Web API.

В статье подробно рассказали о них и раскрыли некоторые тонкости: https://habr.com/ru/companies/clevertec/articles/820227/

#javascript #api #react


Original post link: t.me/tproger_web/4661
Forwarded and filtered by @smartfeed_bot

🖥 Dynamic 3D Business Icons Set – набор из 44 объемных иконок на тему бизнеса. У иконок красивые пастельные цвета, напоминающие конфеты.

Сайтодел | #макет #figma


Original post link: t.me/sitodel/1838
Forwarded and filtered by @smartfeed_bot

🖥 Самые интересные публикации за последние дни:

• Коварные утечки памяти в React: как можно обжечься на useCallback и замыканиях

• Загружаем товары из магазина Ozon в Google-таблицу

• Многопоточность JavaScript с SharedArrayBuffer и Atomics: основы

• Загрузка es-модулей в браузерные приложения

• Tramvai — фреймворк для создания веб-приложений


Original post link: t.me/frontendnoteschannel/3711
Forwarded and filtered by @smartfeed_bot

​​Новый китайский владелец популярного проекта Polyfill JS внедрил вредоносное ПО более чем на 100 тысяч сайтов

Polyfill.js - популярная библиотека с открытым исходным кодом для поддержки старых браузеров. Более 100 тыс. сайтов встраивают ее через домен cdn.polyfill.io.

В феврале этого года китайская компания Funnull купила домен и аккаунт на Github. С тех пор этот домен был замечен в внедрении вредоносного ПО на мобильные устройства через вебсайты, использующие cdn.polyfill.io. Любые жалобы быстро удалялись из репозитория Github.

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

Автор оригинального проекта рекомендует не использовать Polyfill, так как он больше не нужен современным браузерам. Тем временем, Fastly и Cloudflare предложили собственные альтернативы пользователям.

Google начал блокировать рекламу для сайтов eCommerce, использующих polyfill.io. Cloudflare реализовала перенаправление в реальном времени с cdn.polyfill.io на свою версию. Позже регистратор Namecheap приостановил действие домена, устранив риск на данный момент.

Этот инцидент является типичным примером атаки на цепочку поставок. Рекомендуется удалить все ссылки на polyfill.io в вашем коде.

Подробнее: https://sansec.io/research/polyfill-supply-chain-attack

#безопасность