FrontEndDev

JavaScript Security Vulnerabilities Tutorial

Топ 10 JS уязвимостей и как с ними бороться.

https://www.youtube.com/watch?v=ypNKKYUJE5o&ab_channel=freeCodeCamp.org

Как и когда использовать debounce и throttle в React

Что такое debouncing и throttling и примеры их использования.

https://soshace.com/how-and-when-to-debounce-and-throttle-in-react/

Склеиваем коммиты в git при помощи squash и fixup

Статья о том, как и зачем использовать склеивание коммитов.

https://htmlacademy.ru/blog/git/how-to-squash-commits-and-why-it-is-needed

Пара трюков в DevTools, которые немного упростят вашу отладку

Выбираем элементы через $ и $$ и получаем текущий элемент через $0.

https://gomakethings.com/a-few-developer-console-tricks/

50 запросов для ChatGPT, которые могут быть полезны для разработчиков

От генерации кода до его документирования и тестирования.

https://dev.to/hackertab_org/50-chat-gpt-prompts-every-software-developer-should-know-tested-9al

Погружаемся в Redux Toolkit

На примере разработки проекта для трекинга багов рассмотрим работу с Redux Toolkit.

https://www.smashingmagazine.com/2023/05/guide-redux-toolkit-typescript/

Логические свойства CSS и их использование

Чем логические свойства отличаются от физических и как они помогают при разработке приложений.

https://blog.logrocket.com/css-logical-properties-guide

Храним API ключи правильно

Убираем хардкод и используем dotenv для работы с переменными окружения на примере React приложения.

https://www.smashingmagazine.com/2023/05/safest-way-hide-api-keys-react/

CSS Blend Modes

Режимы смешивания цветов и эффекты, которых можно добиться с помощью них.

https://garden.bradwoods.io/notes/css/blend-modes

ChatGPT - курс по работе с OpenAI API

Создаем несколько простых приложений использующих OpenAI API.

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

Работаем с формами в React

Используем интеграцию React Hook Form с валидатором Zod для создания формы.

https://my-js.org/blog/rhf-zod/

Чит лист по доступности интерактивных элементов

Какого размера должны быть иконки и кнопки, чтобы сайтом или приложением было удобно пользоваться?

https://www.smashingmagazine.com/2023/04/accessible-tap-target-sizes-rage-taps-clicks/

Как поддерживать проект по мере его развития

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

Часть 1
Часть 2
Часть 3

Используем экспериментальное свойство CSS color-mix

Создаем различные варианты наложения цветов с color-mix

https://una.im/color-mix-opacity/

Шпаргалки и материалы для IT собеседований

Dev Questions - бесплатный сервис для подготовки к собеседованиям. Проект активно развивается - каждый день добавляется новый контент и функционал!