useCallback - React хук, который принимает в качестве аргументов: callback и массив зависимостей, а возвращает уже мемоизированный callback, который будет обновлен, только если одна из зависимостей будет изменена.
UseCallback также, как и useMemo позволяет в значительной степени оптимизировать приложения. Но излишнее использование данного хука может привести к замедлению работы компонента.
Статья на тему, как правильно его использовать.
Ссылка на статью
#react
UseCallback также, как и useMemo позволяет в значительной степени оптимизировать приложения. Но излишнее использование данного хука может привести к замедлению работы компонента.
Статья на тему, как правильно его использовать.
Ссылка на статью
#react
May 6, 2022
Strapi - это бесплатный фреймворк для управления контентом, работающий на Node.js.
CMS можно настраивать и масштабировать с помощью системы плагинов. Здесь предусмотрено множество встроенных возможностей: удобная административная панель, управление аутентификацией и доступами, инструменты для работы с контентом, генератор API и прочее.
Она также поддерживает передачу данных посредством и REST, и GraphQL.
Ссылка на на официальный сайт
#nodejs
CMS можно настраивать и масштабировать с помощью системы плагинов. Здесь предусмотрено множество встроенных возможностей: удобная административная панель, управление аутентификацией и доступами, инструменты для работы с контентом, генератор API и прочее.
Она также поддерживает передачу данных посредством и REST, и GraphQL.
Ссылка на на официальный сайт
#nodejs
👍6
May 7, 2022
Анимация фона
Делимся инструментом для создания фона с движущимися элементами.
Доступно три варианта анимации, для каждого из которых вы можете настраивать цвета, количество, размер и скорость движения элементов.
Ссылка на сайт
#дизайн
Делимся инструментом для создания фона с движущимися элементами.
Доступно три варианта анимации, для каждого из которых вы можете настраивать цвета, количество, размер и скорость движения элементов.
Ссылка на сайт
#дизайн
👍4
May 8, 2022
Линтер - программа, которая проверяет код на соответствие стандартам и правилам. В случае если находятся какие-то несоответствия, она выводит сообщения об этом, форматирует или исправляет код.
Самый популярный из линтеров - ESLint, но также существуют и альтернативные ему варианты.
О других линтерах, их преимуществах и недостатках читайте в статье.
Ссылка на статью
#статьи
Самый популярный из линтеров - ESLint, но также существуют и альтернативные ему варианты.
О других линтерах, их преимуществах и недостатках читайте в статье.
Ссылка на статью
#статьи
May 9, 2022
Отражение
Возможности CSS позволяют создавать различные эффекты. С помощью него можно даже создать реалистичное отражение текста или других объектов.
Статья как раз на эту тему!
В ней вы найдете много примеров с разными вариантами отражения.
Ссылка на статью
#css
Возможности CSS позволяют создавать различные эффекты. С помощью него можно даже создать реалистичное отражение текста или других объектов.
Статья как раз на эту тему!
В ней вы найдете много примеров с разными вариантами отражения.
Ссылка на статью
#css
🎉2
May 10, 2022
TypeScript
Поскольку в JavaScript отсутствует строгая типизация, на помощь приходит TypeScript. Строгая типизация уменьшает количество потенциальных ошибок, которые могли бы возникнуть при разработке на нативном JS.
Делимся с вами гайдом по изучению TypeScript для начинающих!
Ссылка на гайд
#js
Поскольку в JavaScript отсутствует строгая типизация, на помощь приходит TypeScript. Строгая типизация уменьшает количество потенциальных ошибок, которые могли бы возникнуть при разработке на нативном JS.
Делимся с вами гайдом по изучению TypeScript для начинающих!
Ссылка на гайд
#js
🤩1
May 11, 2022
Cleave.js - это JavaScript-библиотека для автоматического форматирования вводимого текстового контента в инпут. Она форматирует номера кредитной карты, номера телефона, даты, числа и другое.
Ссылка на сайт
#инструменты
Ссылка на сайт
#инструменты
👍4
May 12, 2022
SuperTokens
Supertokens позволяет добавить безопасную аутентификацию в ваше веб-приложение за считанные минуты с помощью готового пользовательского интерфейса, который вы можете легко настроить. Это гибкая альтернатива Auth0, Firebase и AWS Cognito.
С помощью данной статьи вы научитесь реализовывать аутентификацию пользователей в React приложении с помощью Supertokens.
Ссылка на статью
#react
Supertokens позволяет добавить безопасную аутентификацию в ваше веб-приложение за считанные минуты с помощью готового пользовательского интерфейса, который вы можете легко настроить. Это гибкая альтернатива Auth0, Firebase и AWS Cognito.
С помощью данной статьи вы научитесь реализовывать аутентификацию пользователей в React приложении с помощью Supertokens.
Ссылка на статью
#react
👎4
May 13, 2022
Микросервисы
Микросервис представляет собой автономную единицу, которая вместе с другими составляет обширное приложение. Архитектура на основе микросервисов позволяет разделить приложение на небольшие блоки. Каждая часть может развертываться и масштабироваться независимо друг от друга.
В статье рассказывается, как создать микросервисы с помощью Node.js. В примере создается три сервиса, которые имеют отдельные серверы, работающие на разных портах. Эти сервисы взаимодействуют друг с другом через REST API.
Подробнее читайте в статье!
Ссылка на статью
#nodejs
Микросервис представляет собой автономную единицу, которая вместе с другими составляет обширное приложение. Архитектура на основе микросервисов позволяет разделить приложение на небольшие блоки. Каждая часть может развертываться и масштабироваться независимо друг от друга.
В статье рассказывается, как создать микросервисы с помощью Node.js. В примере создается три сервиса, которые имеют отдельные серверы, работающие на разных портах. Эти сервисы взаимодействуют друг с другом через REST API.
Подробнее читайте в статье!
Ссылка на статью
#nodejs
👍5
May 14, 2022
Shuffle - это генератор верстки для сайта. Выберите в настройках понравившийся шаблон и доработайте в визуальном редакторе. Генератор предоставляет готовые шаблоны для десктопа, планшета и мобильного телефона.
В визуальном редакторе, вы можете скопировать готовый HTML код, а стили подтягиваются из библиотеки на ваш выбор: Bootstrap, Tailwind, Bulma.
Доступна бесплатная и платная версия с расширенными возможностями.
Ссылка на сайт
#дизайн
В визуальном редакторе, вы можете скопировать готовый HTML код, а стили подтягиваются из библиотеки на ваш выбор: Bootstrap, Tailwind, Bulma.
Доступна бесплатная и платная версия с расширенными возможностями.
Ссылка на сайт
#дизайн
👎5🔥2👍1
May 15, 2022
hash таблица - это структура данных, которая помогает решать различные алгоритмические задачи. Одной из ее сильных сторон является быстрое извлечение данных.
В статье рассказывается подробно о hash таблицах:
- что это такое
- зачем их использовать
- как они работают
- примеры их использования в JavaScript и многое другое.
Ссылка на статью
#статьи
В статье рассказывается подробно о hash таблицах:
- что это такое
- зачем их использовать
- как они работают
- примеры их использования в JavaScript и многое другое.
Ссылка на статью
#статьи
👍3
May 16, 2022
:where - это CSS псевдокласс, который принимает в качестве аргумента список селекторов и применяет заданные стили к любому элементу из него. Он очень полезен для сокращения длинного списка селекторов и не только.
Например, вместо того, чтобы писать:
Данный псевдокласс позволяет сократить код до:
Поддержка браузерами уже вполне приличная! Можно посмотреть здесь.
Подробно о :where и случаях его использования читайте в статье.
Ссылка на статью
#css
Например, вместо того, чтобы писать:
header p:hover,
main p:hover,
footer p:hover {
color: red;
cursor: pointer;
}
Данный псевдокласс позволяет сократить код до:
:where(header, main, footer) p:hover {
color: red;
cursor: pointer;
}
Поддержка браузерами уже вполне приличная! Можно посмотреть здесь.
Подробно о :where и случаях его использования читайте в статье.
Ссылка на статью
#css
👍11
May 17, 2022
codingame - это ресурс для изучения JavaScript в игровой форме!
Вы можете улучшить свои навыки, решая увлекательные задачи по всем актуальным темам программирования.
Помимо JavaScript доступно еще около 25 языков.
Ссылка на сайт
#js
Вы можете улучшить свои навыки, решая увлекательные задачи по всем актуальным темам программирования.
Помимо JavaScript доступно еще около 25 языков.
Ссылка на сайт
#js
May 18, 2022
popmotion - это JavaScript библиотека для создания анимаций.
Она поддерживает анимацию ключевых кадров, пружинящие и инерционные анимации. С помощью нее можно анимировать 3D объекты, диаграммы, SVG и другое.
Каждую функцию можно импортировать по отдельности и она весит менее 5 КБ.
Ссылка на официальный сайт
#инструменты
Она поддерживает анимацию ключевых кадров, пружинящие и инерционные анимации. С помощью нее можно анимировать 3D объекты, диаграммы, SVG и другое.
Каждую функцию можно импортировать по отдельности и она весит менее 5 КБ.
Ссылка на официальный сайт
#инструменты
👍3
May 19, 2022
storybook — это инструмент, который позволяет создавать и организовывать UI компоненты.
С помощью него можно интерактивно разрабатывать и тестировать компоненты, а также просматривать их различные состояния. Его можно использовать с React, Vue или Angular.
В статье рассказывается, как использовать Storybook с React и как лучше всего его интегрировать в любое React приложение.
Ссылка на статью
#react
С помощью него можно интерактивно разрабатывать и тестировать компоненты, а также просматривать их различные состояния. Его можно использовать с React, Vue или Angular.
В статье рассказывается, как использовать Storybook с React и как лучше всего его интегрировать в любое React приложение.
Ссылка на статью
#react
👍2
May 20, 2022
Koa.js — это Node.js фрэймворк, разработанный командой Express. Он меньше по размеру и более надежная основа для веб-приложений и API.
В статье дается небольшой обзор о Koa, а также в конце статьи вы найдете ссылку на подробный туториал по данному фреймворку.
Ссылка на статью
#nodejs
В статье дается небольшой обзор о Koa, а также в конце статьи вы найдете ссылку на подробный туториал по данному фреймворку.
Ссылка на статью
#nodejs
👍5
May 21, 2022
3D эффект
Хотите создать интересный эффект при наведении? Вот вам идея. На данном сайте можно сгенерировать код анимированного 3D эффекта.
Лучше посмотреть, чтобы понять о чем речь!
Ссылка на сайт
#дизайн
Хотите создать интересный эффект при наведении? Вот вам идея. На данном сайте можно сгенерировать код анимированного 3D эффекта.
Лучше посмотреть, чтобы понять о чем речь!
Ссылка на сайт
#дизайн
May 22, 2022
Bootstrap 5.2.0
Недавно был релиз версии Bootstrap v5.2.0-beta1.
В этой версии была переработана документация и переменные CSS для всех компонентов, появились новые хелперы и утилиты, были улучшены кнопки и элементы ввода, а также появилось множество улучшений под капотом.
Подробнее обо всем читайте в статье!
Ссылка на статью
#статьи
Недавно был релиз версии Bootstrap v5.2.0-beta1.
В этой версии была переработана документация и переменные CSS для всех компонентов, появились новые хелперы и утилиты, были улучшены кнопки и элементы ввода, а также появилось множество улучшений под капотом.
Подробнее обо всем читайте в статье!
Ссылка на статью
#статьи
👍4
May 23, 2022
Slink
Знаете такую игрушку, как "слинк"(slink)? Или может вам она знакома по названию "пружинка-радуга".
Её можно перекидывать из руки в руку, а также многие любили ее спускать вниз по ступенькам.
Сегодня можно создать подобный элемент с помощью CSS и заставить его "шагать" с помощью анимации! В статье рассказывается, как это реализовать.
Ссылка на статью
#css
Знаете такую игрушку, как "слинк"(slink)? Или может вам она знакома по названию "пружинка-радуга".
Её можно перекидывать из руки в руку, а также многие любили ее спускать вниз по ступенькам.
Сегодня можно создать подобный элемент с помощью CSS и заставить его "шагать" с помощью анимации! В статье рассказывается, как это реализовать.
Ссылка на статью
#css
May 24, 2022
Sparse array
Sparse array переводится, как "разреженный" массив. Так называются массивы, которые содержат элементы без явного значения или по-простому "дыры".
Это происходит, например, когда с помощью метода delete удаляются элементы из массива.
Очень интересный факт: метод forEach, пропускает "дыры" в массиве!
Подробно читайте в статье!
Ссылка на статью
#js
Sparse array переводится, как "разреженный" массив. Так называются массивы, которые содержат элементы без явного значения или по-простому "дыры".
Это происходит, например, когда с помощью метода delete удаляются элементы из массива.
let numbers = [1, 2, 3, 4];
delete numbers[1];
delete numbers[2];
Очень интересный факт: метод forEach, пропускает "дыры" в массиве!
Подробно читайте в статье!
Ссылка на статью
#js
May 25, 2022
Справочник алгоритмов
Делимся ссылкой на GitHub репозиторий, в котором собраны базовые примеры самых популярных алгоритмов и структур данных, реализованных на JavaScript.
Для каждого алгоритма и структуры данных есть отдельный файл README с пояснениями и ссылками на дополнительную информацию.
Ссылка на репозиторий
#инструменты
Делимся ссылкой на GitHub репозиторий, в котором собраны базовые примеры самых популярных алгоритмов и структур данных, реализованных на JavaScript.
Для каждого алгоритма и структуры данных есть отдельный файл README с пояснениями и ссылками на дополнительную информацию.
Ссылка на репозиторий
#инструменты
👍7
May 26, 2022