React.js Plugins | To Watch | RU
8 subscribers
317 photos
317 links
Плагины, пакеты и примеры на React.js
Download Telegram
Приложение с коротким URL-адресом, созданное с использованием Next.js

Пакет из GitHub представляет собой приложение для создания коротких URL-адресов на основе Next.js. Пользователи могут вводить длинные веб-адреса и генерировать короткие URL-адреса, что делает их более удобными для передачи ссылок. В приложении доступны такие функции, как укорачивание URL-адресов, перенаправление на первоначальные веб-адреса, просмотр базовой аналитики и регистрация и аутентификация пользователей. Для запуска приложения локально необходимо склонировать репозиторий, установить зависимости и перейти по указанной ссылке. Контрибьюторы также приветствуются и могут вносить свои предложения и правки в репозиторий.

Github
Клон пользовательского интерфейса TikTok, созданный с использованием React

Этот пакет Github - TikTok UI Clone - является веб-приложением, разработанным для воссоздания пользовательского интерфейса приложения TikTok. Он создан с использованием React.js, CSS и JSX и позволяет пользователям просматривать и просматривать видео в стиле TikTok в знакомом и интерактивном интерфейсе. Основные функции включают просмотр видео в стиле TikTok, плавное и отзывчивое воспроизведение видео, простой и понятный интерфейс с интуитивной навигацией, бесконечную прокрутку для плавного обнаружения видео и возможность ставить лайки, оставлять комментарии и делиться видео. Для установки и использования клонированного интерфейса TikTok UI следуйте инструкциям в репозитории.

Github
Реагируйте на приложение Todo с помощью localStorage

React Todo App - это приложение для создания списка задач с использованием React. В приложении можно добавлять задачи и удалять их по клику на кнопку. Кроме того, все задачи автоматически сохраняются в локальное хранилище при изменении состояния приложения. Доступна демонстрация приложения по [ссылке](https://arberlisaj.github.io/react-todo-app/).

Github
Список расходов, созданный с помощью React и TypeScript

Пакет "React Expense List" представляет собой приложение для учета расходов. Оно позволяет добавлять расходы, удалять их и фильтровать по категориям. В приложении также реализовано валидация формы с использованием Zod. На странице проекта доступен скриншот работы приложения и демонстрация в реальном времени.

Github
Универсальный компонент React, обеспечивающий функциональность нижнего листа

React Stateful Bottom Sheet - это универсальный пакет npm, который предоставляет компонент нижнего списка со состоянием для ваших приложений React. Он легко вписывается в ваш проект, повышая взаимодействие и отзывчивость пользователей. Он поддерживает различные настройки и может изменяться в размере в зависимости от интерактивного перемещения пользователя вверх и вниз. Встроенное управление состоянием позволяет открывать или закрывать нижний список, обеспечивая гладкую работу. Компонент также поддерживает плавные анимации и переходы с помощью библиотеки framer-motion, а интеграция с TypeScript улучшает безопасность типов и опыт разработчика.

Github
Быстрый анализ и отладка кода с помощью ChatGPT в вашем браузере

Пакет CodeSage — это программный инструмент, разработанный для значительного сокращения времени, затрачиваемого разработчиками на кодирование и отладку. Он включает в себя встроенный редактор и компилятор, позволяющие разработчикам анализировать и оптимизировать код, отлавливать ошибки, проверять безопасность и оценивать качество и сложность кода. Он также охватывает различные сегменты рынка, включая крупные технологические компании, стартапы с ограниченными ресурсами и учебные заведения, и предлагает ряд улучшений и инноваций, таких как интеграция с пакетными менеджерами и возможность предварительного просмотра HTML и React-кода.

Github
Приложение для бронирования, созданное с помощью React

Booking_Application - это пакет, доступный на GitHub, который позволяет пользователям регистрироваться и создавать учетную запись, указывая свое имя, адрес электронной почты и пароль, причем пароли надежно зашифрованы. Существующие пользователи могут войти в систему и просмотреть доступные места, включая такие сведения, как название, адрес, описание, цена и фотографии. Пользователи могут бронировать жилье, указывать даты заезда/отъезда и просматривать данные о своем бронировании, а также управлять своим профилем, обновляя такую информацию, как имя, адрес электронной почты и контактные данные. Используемый технологический стек включает React, Node.js , MongoDB и CSS для стилизации.

Github
Адаптивный дизайн веб-сайта портфолио с использованием React.Js CSS и HTML

Этот пакет Portfolio-Website (React.Js) представляет собой адаптивный дизайн портфолио-сайта, разработанный с использованием React.Js, CSS и HTML. Он обладает плавной прокруткой в каждом разделе и полностью совместим с мобильными устройствами. Сайт имеет красивый и приятный пользовательский интерфейс и построен с использованием технологий React.js, JavaScript, CSS3, VSCode и Vercel. Для установки и настройки необходимо клонировать репозиторий, установить node.js и git, выполнить команду npm install для установки зависимостей и запустить команду npm start для запуска приложения в режиме разработки. Для настройки информации на сайте необходимо открыть папку проекта и перейти в /src/components/, где находятся все использованные компоненты. Если вам нравится этот сайт, не забудьте поставить звезду на GitHub.

Github | Демо
Веб-приложение для социальных сетей с базовым функционалом

Пакет на GitHub представляет собой социальное медиа веб-приложение с основными функциональными возможностями, созданное в соответствии с инструкциями из видео на YouTube. В приложении есть функции регистрации, входа и выхода из аккаунта, создания постов, лайков и дизлайков, а также переключение между темной и светлой темой. Для запуска приложения локально необходимо клонировать код, создать файл .env с переменными MONGO_URL, JWT_SECRET и PORT, установить необходимые зависимости, запустить сервер и клиентскую часть с помощью команды "npm run start".

Github
Next.js приложение, визуализирующее погодные тенденции для любого геолокационного местоположения

Данный пакет из Github представляет собой веб-приложение, которое позволяет визуализировать и сравнивать погодные и климатические тенденции для любого местоположения. Вы можете изучить исторические данные для любой указанной даты, недели или месяца в период с 1940 года по настоящее время. Приложение создано на базе Next.js, использует библиотеки React-Vis, Pigeon Maps и API Open Meteo. Вы можете попробовать приложение в песочнице или запустить его локально, склонировав репозиторий и установив зависимости.

Github
Ювелирный веб-сайт, созданный с использованием React

Данный пакет на GitHub представляет собой проект по созданию интернет-магазина ювелирных изделий. Фронтэнд разработан с использованием React, а бэкэнд - Node Express. Для стилизации используются CSS и React Bootstrap, а функциональность сайта осуществляется при помощи JSX. Сайт будет обладать удобным интерфейсом для клиентов: они смогут регистрироваться/авторизовываться при помощи Google-аккаунта или по электронной почте и паролю. Клиенты также смогут легко совершать покупки, проверять свои заказы, получать обратную связь и другие функции. Администратор сможет управлять товарами, заказами и добавлять других администраторов. Дизайн сайта простой и понятный для пользователя.

Github
Минималистичное приложение для тестирования скорости набора текста, созданное с использованием React и TailwindCSS

OpenType - это приложение на базе React и TailwindCSS, которое позволяет пользователям тестировать и улучшать скорость и точность набора текста. Он обеспечивает удобный интерфейс и интуитивно понятную обратную связь по производительности набора текста. Приложение включает в себя такие функции, как тесты набора текста, регулируемая продолжительность набора текста, отображение статистики, история набора текста, настройка темы и адаптивный дизайн. Планы на будущее для приложения включают добавление большего количества языков, тем, виртуальной клавиатуры, уровней сложности и отслеживание истории набора текста пользователем. Проект отдает должное MonkeyType за вдохновение и дизайнерские идеи.

Github
Утилита оболочки для интерактивного выбора строк из стандартного ввода

Утилита LineSelect представляет собой командную оболочку, которая позволяет выбрать строки из ввода и вывести их в вывод. Это позволяет пользователям прерывать выполнение командного потока и вручную выбирать нужные строки перед продолжением выполнения командного потока или другой составной команды. Программа может быть использована для выбора файлов для удаления, выбора контейнеров Docker для остановки или отбора определенных строк из лог-файлов. Утилита построена на основе библиотеки React-for-CLI Ink и использует уникальный метод отображения пользовательского интерфейса, обеспечивающий корректную работу с выводом в консоль.

Github
Приложение для обмена видео и фотографиями в социальных сетях, созданное с помощью React

MeFriends - это приложение для обмена видео и фотографиями в социальных сетях, предназначенное для общения и обмена моментами с друзьями и семьей. Он предлагает такие функции, как аутентификация пользователя, создание и редактирование постов, лайки и комментарии, персонализированная лента новостей, функция изучения, управление профилем, функция поиска, уведомления, меры конфиденциальности и безопасности. Приложение создано с использованием таких технологий, как React.js , Node.js , Express.js , MongoDB и Sanity.io , обеспечивая плавный и интерактивный пользовательский интерфейс при одновременном обеспечении безопасности и масштабируемости. Этот проект открыт для участия и лицензирован по лицензии MIT.

Github
Приложение React, которое используется для поиска бесплатных инструментов

Привет! Этот проект в GitHub - Welcome 👋 Free-Hit - это веб-приложение, которое позволяет найти бесплатные инструменты, полезные для нашего повседневного использования. Он создан удивительным сообществом открытого исходного кода. Здесь вы найдете список бесплатных инструментов, которые могут помочь вам в повседневной жизни. Вы также можете внести свой вклад в проект, добавляя больше инструментов в нашу базу данных. В проекте используется Reactjs, Vite и PNPM для разработки и управления пакетами. Проект приветствует вклады и предлагает руководство для новых участников. Авторы проекта - Jason Dsouza и Syed Aman Ali, а также благодарят всех участников за вклад и приглашают других присоединиться к проекту.

Github
Полнофункциональный веб-сайт электронной коммерции, использующий MERN stack

Этот пакет на GitHub представляет собой проект Amazon Clone, созданный с использованием React и TypeScript для разработки полнофункционального интернет-магазина, похожего на Amazon. Он использует MERN-стек (MongoDB, ExpressJS, React и Node.JS) и содержит основные страницы, такие как страница товаров, страница отдельного товара и корзина. В планах дальнейшая разработка бэкэнда с использованием Node.js, Express.js и MongoDB, создание страниц оформления заказа и оплаты, аутентификация пользователей и развертывание проекта на облачных серверах.

Github
Компонент React, который обрабатывает ввод csv-файла и его синтаксический анализ

react-csv-reader - это компонент React, который обрабатывает ввод csv-файла и его парсинг. В этом пакете представлены примеры использования компонента, включая превью и настройки парсера. Компонент предоставляет возможность загружать csv-файлы, парсить их и получать данные в формате JSON. Пакет также позволяет настраивать параметры парсера, такие как использование worker thread и динамическая типизация данных.

Github
Полноценное приложение с системой авторизации

Данный проект "React Employees" является полноценным веб-приложением с системой авторизации. Приложение позволяет создавать сотрудников, причем редактировать или удалять сотрудника может только его создатель (пользователь). В разработке использованы технологии ReactJS, Redux Toolkit, Typescript, RTK Query, Antd, Prisma client и Jsonwebtoken.

Github
Веб-сайт ресторана с использованием MERN Stack

GKMIT Restaurant - это ресторан, где можно заказать и найти вкусную еду. Для создания сайта ресторана использовался стек MERN. В качестве фронтенда был использован ReactJS, для создания стилей - Advance CSS, а в качестве бэкенда - NodeJS. Веб-страницы включают главную страницу, страницу с едой, страницу корзины и страницу контактов. Кроме того, есть возможность протестировать рабочий вариант сайта по ссылке.

Github
Клон Spotify, созданный с использованием React, Next.js , Tailwind CSS и Spotify API

Это пакет в GitHub представляет собой клон Spotify, созданный с использованием React, Next.js, Tailwind CSS и Spotify API. Он обладает множеством функций, таких как аутентификация/регистрация через Spotify, получение плейлистов пользователя, топ-артистов, топ-треков, недавно прослушанных треков и сохраненных треков пользователя. Также включены адаптивный дизайн, темный режим, поиск треков, артистов, альбомов и плейлистов, поключение в режиме реального времени с клиентом Spotify и управление воспроизведением треков. Дополнительно предоставляются команды для сборки, тестирования, проверки и форматирования кода.

Github