Содержание
Если вы хотите освоить React, эти 7 репозиториев Github - бесценные учебные ресурсы с большим количеством примеров кода и паттернов для изучения.
Давайте начнем👇
krasimir/react-in-pattern
Бесплатная книга, в которой рассказывается о паттернах проектирования/технике, используемой при разработке на React.
📚 Бесплатная книга, в которой рассказывается о паттернах/технологиях проектирования, используемых при разработке на React.
Этот репозиторий содержит примеры кода, иллюстрирующие общие паттерны проектирования React. Он охватывает такие паттерны, как управление состоянием, асинхронная обработка данных, аутентификация и многое другое. Изучение этих паттернов даст вам более глубокое понимание того, как структурировать приложения React при их масштабировании.
jeromedalbert/real-world-react-apps
Реальные приложения React и их кодовые базы с открытым исходным кодом, на которых разработчики могут учиться
Реальные приложения React и их кодовые базы с открытым исходным кодом, на которых разработчики могут учиться
Изучайте приложения React, написанные опытными разработчиками.
Исходный код приложений вы найдете в подкаталоге apps/.
Спасибо каждому разработчику, который работал над проектом, на который ссылается это репо, - ваша работа помогает разработчикам изучать React.
git clone git@github.com:jeromedalbert/real-world-react-apps.git
cd real-world-react-apps
Приложения связаны как git-подмодули. # Это займет некоторое время… (см. комментарий ниже для возможного ускорения) git submodule update —init
ИЛИ, если у вас установлен git 2.9+, попробуйте запускать обновления параллельно: # git submodule update —init —jobs 4
В некоторых примерах ниже используется ag, но с тем же успехом можно использовать grep или его эквивалент.
Коллекция сложных, полнофункциональных приложений React. Изучив исходный код таких приложений, как социальная сеть, портфель криптовалют и клон Hacker News, вы увидите, как React воплощает в жизнь реальные приложения.
beautiful-react-hooks
🔥 Коллекция красивых и (надеюсь) полезных хуков React для ускорения разработки компонентов и хуков 🔥.
Коллекция специализированных хуков для React, которые улучшат ваш процесс разработки и сделают его быстрее
Пользовательские крючки React позволяют разработчикам абстрагировать бизнес-логику компонентов в отдельные, многократно используемые функции.
Я заметил, что многие из хуков, которые я создал и распространил по проектам, связаны с обратными вызовами, ссылками, событиями и жизненным циклом компонентов.
Поэтому я создал beautiful-react-hooks, коллекцию полезных хуков React, которые могут помочь другим разработчикам ускорить процесс разработки.
Более того, я стремился создать лаконичный и практичный API, который подчеркивает читаемость кода, сохраняя при этом кривую обучения как можно ниже, что делает его пригодным для использования и совместного использования большими командами.
— Пожалуйста, прежде чем использовать любой хук, прочитайте его…
Узнайте, как эффективно использовать хуки React, такие как useState, useEffect, useContext и другие, на простых и хорошо объясненных примерах. Хуки позволяют добавлять методы состояния и жизненного цикла в функциональные компоненты для более чистого кода React.
enaqx/awesome-react
Коллекция удивительных вещей, связанных с экосистемой React.
Список интересных ресурсов по React, включая учебники, библиотеки и инструменты разработки. Он указывает вам на библиотеки экосистемы React для управления состояниями, маршрутизации, форм, анимации и многого другого.
Asabeneh/30-days-of-react
Задача 30 Days of React - это пошаговое руководство по изучению React за 30 дней. Эти видео тоже могут помочь:
https://www.youtube.com/channel/UC7PNRuno1rzYPb1xLa4yktw
Сниппеты кода и демонстрации для изучения основ и возможностей React. Этот репозиторий шаг за шагом изучает концепции React в удобном 30-дневном формате.
alexgurr/react-coding-challenges
Серия задач по кодингу на ReactJS с различными сложностями.
Отточите свои навыки работы с React с помощью этих задач на кодирование, которые варьируются от начального до продвинутого уровня. Выполнение этих заданий поможет улучшить ваши навыки работы с кодом React и решения проблем.
codex-team/editor.js
Блок-Редактор в стиле ”чистый JSON
Editor.js - это текстовый редактор с открытым исходным кодом, предлагающий множество функций, помогающих пользователям эффективно создавать и форматировать контент. Он имеет современный интерфейс в стиле блоков, который позволяет пользователям легко добавлять и упорядочивать различные типы контента, такие как текст, изображения, списки, цитаты и т. д. Каждый блок предоставляется через отдельный плагин, что делает Editor.js чрезвычайно гибким.
Editor.js выводит чистые JSON-данные вместо тяжелой HTML-разметки. Используйте его в Web, iOS, Android, AMP, Instant Articles, ридерах речи, чатботах AI - везде. Легко дезинфицировать, расширять и интегрировать с вашей логикой.
😍 Современный пользовательский интерфейс из коробки 💎 Чистый вывод JSON ⚙️ Хорошо разработанный API 🛍 Доступны различные инструменты 💌 Бесплатно и с открытым исходным кодом
Все очень просто:
Установите Editor.js Установите необходимые инструменты Инициализируйте экземпляр редактора
Установите с помощью NPM, Yarn или CDN:
npm i @editorjs/editorjs
Выберите и установите инструменты:
Отточите свое мастерство с помощью этого компонента react Editor.js - это текстовый редактор с открытым исходным кодом, предлагающий множество функций, помогающих пользователям эффективно создавать и форматировать контент. Он имеет современный интерфейс в стиле блоков, который позволяет пользователям легко добавлять и упорядочивать различные типы контента, такие как текст, изображения, списки, цитаты и т. д. Каждый блок предоставляется через отдельный плагин, что делает Editor.js чрезвычайно гибким.
Заключение🔥
С помощью этих 7 репозиториев вы познакомитесь с архитектурными паттернами React, реальными приложениями, крючками и многим другим. Они содержат огромное количество кода и паттернов React, которые вы сможете изучить на своем пути к освоению React.
Счастливого кодинга😊