​Работа с картами на React с помощью Pigeon Maps и Mapbox

Разработчики из Evil Martians делятся подробный гайдом, как создать красивую карту для веб-приложения на React. В статье разбираются все шаги реализации проекта: дизайн, концепция, сбор данных, внедрение логики и многое другое:

https://evilmartians.com/chronicles/how-to-build-a-better-react-map-with-pigeon-maps-and-mapbox

#react

5 библиотек для React-разработчика, которые стоит попробовать

1. React Joyride помогает создать пошаговое руководство и интерактивную экскурсию по приложению.

2. React Beautiful DnD — для перетаскивания (drag and drop) с поддержкой мыши и клавиатуры. Также библиотека поддерживает вертикальные, горизонтальные передвижения и между списками.

3. Enzyme — это библиотека JavaScript, созданная командой AirBnB для тестирования компонентов React.

4. React Spring — популярная библиотека для анимаций.

5. Styled Components используется для стилизации приложений. Позволяет отслеживать компоненты и добавлять только их стили.

#react

​Создаём клон Netflix на React

В этом видеоуроке вы создадите приложение, которое похоже на популярную платформу с использованием React, Redux Toolkit, Nodejs и MongoDB для хранения данных. А с помощью TMDB API можно получить весь список фильмов и жанров:

https://youtu.be/HgaJW2I4Mbk

#react

​React: тестируем компоненты с помощью Jest и Testing Library

В этой статье вы сможете найти множество полезной информации:
— создание шаблона React-приложения с помощью Vite;
— создание компонента для получения приветствия от сервера;
— установка и настройка Jest, Testing Library;
— тестирование компонента с помощью снимков Jest, а также Testing Library, используя стандартные возможности, кастомный рендер и кастомные запросы.

#js #react

React Router: что это и как использовать

React Router – это библиотека для навигации между разными частями веб-приложения, созданными на React. Она помогает создавать одностраничные приложения, которые при переходе подгружают не всю страницу, а только необходимые компоненты.

А узнать, как её установить и создать свои первые простые и вложенные маршруты вы сможете узнать в этой полезной статье.

#js #веб #react

​​React Native vs. Flutter: что лучше?

Если только планируете вливаться в мобильную разработку, то можете стать перед выбором стека. Flutter и React Native — два основных инструмента для создания кроссплатформенных мобильных приложений. Оба позволяют разрабатывать приложения для iOS, Android и веб из одной кодовой базы.

Flutter предоставляет обширную библиотеку виджетов и плагинов, в то время как React Native — сторонние библиотеки и базовые компоненты.

Держите на заметку статью, где автор на практическом примере показывает разницу этих двух инструментов. Он создал чат-приложение с использованием Firebase в качестве бэкенда. React Native использует JavaScript и TypeScript, в то время как Flutter — язык Dart, оптимизированный для компиляции на разные платформы.

#mobile #react #flutter

​​Учим React за месяц

React — это крутая JavaScript-библиотека, которую используют для создания сайтов, мобильных приложений и даже игр.

Если давно в планах есть изучение React, но растягивать процесс не хочется, то начните с 30DaysOfReact — это учебник, который подойдет как новичкам, так и опытным разработчикам. Там можно найти задачи, темы и материалы для ежедневного изучения.

@prog_point #web #frontend #react

Курс по React для начинающих

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

Тут рассказывают, что такое React и как создавать приложения, используя Create React App и Vite. Среди основных тем, разобранных в этом курсе: props, state, события, стилизацию, создание пользовательских хуков и продвинутое использование состояний и хуков, таких как useRef, useEffect и useCallback.

https://youtu.be/kz23xxukY5s?si=hViyMF55q28nDlVh

#курс #react #web #ru

Разработка и деплой сайта с нуля и анимацией

В этом видео вы узнаете, как создать сайт с большим количеством разной анимации, например, одной из самых популярных — parallax-эффект.

Вы научитесь работать с компонентами, используя библиотеку ReactJS, познакомитесь с Framer motion, организуете хранилище с Redux Toolkit (RTK), добавите контент через платформу Contentful и с помощью Graphql получите реальные данные на вашем сайте.

#видео #туториал #веб #react

Как создать приложение Todo на React

Полезный туториал для фронтенд-разработчиков, в котором вы с нуля создадите приложение для ведения дел. Вы научитесь использовать хуки, а также продвинутые функции JavaScript.

Стартуем здесь.

#фронтенд #javascript #react

Разработка Telegram Mini App с помощью React

Telegram Mini App — это веб-приложения, которые открываются внутри мессенджера Telegram. Эти приложения создаются с использованием стандартных веб-технологий, таких как HTML, CSS и JavaScript, и выглядят как обыкновенные сайты.

Сейчас они становятся всё популярнее, поэтому вам точно стоит иметь в запасе навык их создания. В этой статье вы узнаете, как создать собственный Mini App, используя React.

#react #telegram