Простой и полезный диспетчер задач с React
Taskman - это простое приложение для управления задачами, ориентированное на то, чтобы помочь пользователям управлять своей рабочей нагрузкой в течение дня. Он имеет элегантный и минималистичный дизайн, без каких-либо отвлекающих факторов или рекламы. Приложение позволяет пользователям создавать, читать, обновлять и удалять задачи. Он построен с использованием MongoDB, ExpressJS, React и NodeJS, что делает его надежным и полнофункциональным. Разработчики постоянно совершенствуют приложение, включая функцию перетаскивания, несколько списков задач на каждый день недели, функцию мягкого будильника и темный режим.
Github
Taskman - это простое приложение для управления задачами, ориентированное на то, чтобы помочь пользователям управлять своей рабочей нагрузкой в течение дня. Он имеет элегантный и минималистичный дизайн, без каких-либо отвлекающих факторов или рекламы. Приложение позволяет пользователям создавать, читать, обновлять и удалять задачи. Он построен с использованием MongoDB, ExpressJS, React и NodeJS, что делает его надежным и полнофункциональным. Разработчики постоянно совершенствуют приложение, включая функцию перетаскивания, несколько списков задач на каждый день недели, функцию мягкого будильника и темный режим.
Github
Сайт-портфолио, который выглядит и ощущается как терминал, созданный с помощью React и Tailwind
Этот пакет из GitHub представляет собой шаблон сайта-портфолио, имитирующего терминал. Он использует различные технологии, включая Vite, React, React Hook Form, TypeScript, ESLint, Tailwind CSS и Vercel Analytics. Для установки и использования пакета необходимо выполнить указанные команды. Кроме того, предоставляется информация о развертывании проекта на платформе Vercel и возможности внести свой вклад в проект. Пользователям рекомендуется ознакомиться с руководством по внесению изменений и правилами перед открытием запроса на слияние.
Github
Этот пакет из GitHub представляет собой шаблон сайта-портфолио, имитирующего терминал. Он использует различные технологии, включая Vite, React, React Hook Form, TypeScript, ESLint, Tailwind CSS и Vercel Analytics. Для установки и использования пакета необходимо выполнить указанные команды. Кроме того, предоставляется информация о развертывании проекта на платформе Vercel и возможности внести свой вклад в проект. Пользователям рекомендуется ознакомиться с руководством по внесению изменений и правилами перед открытием запроса на слияние.
Github
Набор инструментов для просмотра, поиска и создания архивов Reddit
Redarc - это самостоятельное решение для поиска, просмотра и создания собственных архивов Reddit. Он позволяет просматривать и искать потоки и комментарии, загружать изображения и архивировать потоки через API. Архивы доступны для загрузки, а также есть поддержка автоматического получения новых и популярных потоков из указанных сабреддитов. Установка осуществляется через Docker или вручную, предоставляется также документация API для выполнения поиска и запросов к архиву. Лицензия MIT.
Github
Redarc - это самостоятельное решение для поиска, просмотра и создания собственных архивов Reddit. Он позволяет просматривать и искать потоки и комментарии, загружать изображения и архивировать потоки через API. Архивы доступны для загрузки, а также есть поддержка автоматического получения новых и популярных потоков из указанных сабреддитов. Установка осуществляется через Docker или вручную, предоставляется также документация API для выполнения поиска и запросов к архиву. Лицензия MIT.
Github
Приложение React, созданное для любителей игры на фортепиано
Пакет React Piano Player / Visualizer / Analyzer - это веб-приложение, созданное для любителей игры на пианино. Это приложение предоставляет очень простой способ визуализации игры на пианино, считывая его midi-файл. Ссылка на последнюю версию: https://react-piano-player-63qjc9wca-tzmcion.vercel.app/. Это приложение позволяет создавать уроки игры на пианино, предлагает базовые эффекты, звуки, а также возможность записывать midi-файлы. Технологии, используемые в приложении: React, Typescript, HTML/CSS, Sass, Redux, библиотека NPM.
Github
Пакет React Piano Player / Visualizer / Analyzer - это веб-приложение, созданное для любителей игры на пианино. Это приложение предоставляет очень простой способ визуализации игры на пианино, считывая его midi-файл. Ссылка на последнюю версию: https://react-piano-player-63qjc9wca-tzmcion.vercel.app/. Это приложение позволяет создавать уроки игры на пианино, предлагает базовые эффекты, звуки, а также возможность записывать midi-файлы. Технологии, используемые в приложении: React, Typescript, HTML/CSS, Sass, Redux, библиотека NPM.
Github
Гибкая библиотека управления задачами для JavaScript-приложений
Kronash - это мощная, гибкая и простая в использовании библиотека управления задачами для JavaScript-приложений. Она предоставляет высокоуровневый API для планирования задач с различными вариантами и механизмами управления, упрощая работу с таймерами JavaScript и делая код более понятным и интуитивно понятным.
Особенности Kronash включают возможность создания задач с заданными интервалами повторения, а также отложенных операций. Она позволяет приостанавливать, возобновлять, останавливать и очищать задачи по мере необходимости, обеспечивая уровень контроля, который часто сложно осуществить вручную. Кроме того, Kronash совместима со всеми популярными фреймворками и библиотеками JavaScript, такими как React, Vue и Angular, и полностью совместима с TypeScript для поддержки надежной типизации.
Github
Kronash - это мощная, гибкая и простая в использовании библиотека управления задачами для JavaScript-приложений. Она предоставляет высокоуровневый API для планирования задач с различными вариантами и механизмами управления, упрощая работу с таймерами JavaScript и делая код более понятным и интуитивно понятным.
Особенности Kronash включают возможность создания задач с заданными интервалами повторения, а также отложенных операций. Она позволяет приостанавливать, возобновлять, останавливать и очищать задачи по мере необходимости, обеспечивая уровень контроля, который часто сложно осуществить вручную. Кроме того, Kronash совместима со всеми популярными фреймворками и библиотеками JavaScript, такими как React, Vue и Angular, и полностью совместима с TypeScript для поддержки надежной типизации.
Github
Удобный и визуально привлекательный аниме-сайт с React
AnimeHub - это удобный и привлекательный визуально сайт с аниме. Он позволяет пользователям искать аниме по названию, сортировать их по жанру, просматривать популярные, продолжающиеся, лучшие и новые аниме. Кроме того, пользователи могут создавать и управлять своим списком просмотра. Для этого проекта использовались такие технологии, как Tailwind CSS, ReactJS, NodeJS, ExpressJS и MySQL. Для участия в разработке репозитория необходимо создать задачу на добавление функции или исправление ошибки, добавить звезду репозиторию, форкнуть его, клонировать на локальную машину, создать новую ветку, импортировать базу данных anime_hub в MySQL Workbench, создать .env файл и добавить пароль, установить необходимые модули и запустить сервер. После внесения изменений, сделанных в новой ветке, нужно запушить их и создать запрос на включение изменений в основную ветку репозитория.
Github
AnimeHub - это удобный и привлекательный визуально сайт с аниме. Он позволяет пользователям искать аниме по названию, сортировать их по жанру, просматривать популярные, продолжающиеся, лучшие и новые аниме. Кроме того, пользователи могут создавать и управлять своим списком просмотра. Для этого проекта использовались такие технологии, как Tailwind CSS, ReactJS, NodeJS, ExpressJS и MySQL. Для участия в разработке репозитория необходимо создать задачу на добавление функции или исправление ошибки, добавить звезду репозиторию, форкнуть его, клонировать на локальную машину, создать новую ветку, импортировать базу данных anime_hub в MySQL Workbench, создать .env файл и добавить пароль, установить необходимые модули и запустить сервер. После внесения изменений, сделанных в новой ветке, нужно запушить их и создать запрос на включение изменений в основную ветку репозитория.
Github
Фреймворк для многоагентных приложений LLM, построенный с использованием Next.js и FastApi
Автохен UI - экспериментальный пользовательский интерфейс для работы с агентами AutoGen на основе библиотеки AutoGen. Интерфейс разработан с использованием Next.js и веб-API, построенного с использованием FastApi. AutoGen UI разработан для облегчения разработки приложений с использованием нескольких агентов, способных взаимодействовать друг с другом для решения сложных задач. UI позволяет создавать и тестировать агентов, анализировать их поведение и результаты, а также проводить отладку. В пакете также представлен план развития, который включает создание эндпоинта FastApi для работы с AutoGen, реализацию базового UI для общения с агентами, добавление инструментов для отладки и создание платформы для компоновки и запуска агентов.
Github
Автохен UI - экспериментальный пользовательский интерфейс для работы с агентами AutoGen на основе библиотеки AutoGen. Интерфейс разработан с использованием Next.js и веб-API, построенного с использованием FastApi. AutoGen UI разработан для облегчения разработки приложений с использованием нескольких агентов, способных взаимодействовать друг с другом для решения сложных задач. UI позволяет создавать и тестировать агентов, анализировать их поведение и результаты, а также проводить отладку. В пакете также представлен план развития, который включает создание эндпоинта FastApi для работы с AutoGen, реализацию базового UI для общения с агентами, добавление инструментов для отладки и создание платформы для компоновки и запуска агентов.
Github
SaaS-приложение для редактирования изображений с использованием искусственного интеллекта
Pixiemist - это SaaS-приложение для редактирования изображений с использованием искусственного интеллекта. Оно создано на основе Next.js 13 с использованием различных технологий, таких как Prisma для работы с базой данных SQL на PlanetScale, Stripe для оформления подписок, Cloudinary для хранения изображений и NextAuth.js для аутентификации. Приложение написано на TypeScript и использует Zustand для управления состоянием. Для запуска локально необходимо установить зависимости с помощью pnpm, скопировать файл .env.example в файл .env и обновить переменные, а затем запустить сервер разработки с помощью команды pnpm dev. Учтите, что генерация изображений может занимать до 3-5 минут из-за холодного запуска Replicate.
Github
Pixiemist - это SaaS-приложение для редактирования изображений с использованием искусственного интеллекта. Оно создано на основе Next.js 13 с использованием различных технологий, таких как Prisma для работы с базой данных SQL на PlanetScale, Stripe для оформления подписок, Cloudinary для хранения изображений и NextAuth.js для аутентификации. Приложение написано на TypeScript и использует Zustand для управления состоянием. Для запуска локально необходимо установить зависимости с помощью pnpm, скопировать файл .env.example в файл .env и обновить переменные, а затем запустить сервер разработки с помощью команды pnpm dev. Учтите, что генерация изображений может занимать до 3-5 минут из-за холодного запуска Replicate.
Github
Менеджер закладок для совместной работы с открытым исходным кодом, использующий Next.js
Linkwarden - открытый источниковый менеджер закладок для сбора, организации и архивирования веб-страниц. Целью является организация полезных страниц и статей из интернета в одном месте, и так как полезные страницы могут исчезнуть со временем, Linkwarden также сохраняет копию каждой страницы в виде скриншота и PDF, обеспечивая доступность, даже если исходный контент больше не доступен. Кроме того, Linkwarden создан с учетом сотрудничества, позволяя обмениваться ссылками с общественностью и/или позволяя нескольким пользователям совместно работать.
Github
Linkwarden - открытый источниковый менеджер закладок для сбора, организации и архивирования веб-страниц. Целью является организация полезных страниц и статей из интернета в одном месте, и так как полезные страницы могут исчезнуть со временем, Linkwarden также сохраняет копию каждой страницы в виде скриншота и PDF, обеспечивая доступность, даже если исходный контент больше не доступен. Кроме того, Linkwarden создан с учетом сотрудничества, позволяя обмениваться ссылками с общественностью и/или позволяя нескольким пользователям совместно работать.
Github
Одностраничное приложение, позволяющее пользователям присоединяться к социальной сети
В данном проекте представлена социальная сеть, позволяющая пользователям присоединяться к ней и писать посты и комментарии к ним. Проект разделен на два сервера - клиентский и серверный, их можно запустить одновременно с помощью команды npm run dev. Также можно запустить сервера индивидуально, используя команды npm run dev:client для клиентской части и npm run dev:server для серверной части. После запуска серверов проект можно увидеть по адресу localhost:3000. Функциональность проекта включает регистрацию, вход в аккаунт, редактирование биографии, загрузку профильных фотографий, поиск друзей, общий и приватный чаты, создание постов на стене и комментирование постов.
Github
В данном проекте представлена социальная сеть, позволяющая пользователям присоединяться к ней и писать посты и комментарии к ним. Проект разделен на два сервера - клиентский и серверный, их можно запустить одновременно с помощью команды npm run dev. Также можно запустить сервера индивидуально, используя команды npm run dev:client для клиентской части и npm run dev:server для серверной части. После запуска серверов проект можно увидеть по адресу localhost:3000. Функциональность проекта включает регистрацию, вход в аккаунт, редактирование биографии, загрузку профильных фотографий, поиск друзей, общий и приватный чаты, создание постов на стене и комментирование постов.
Github
Прогрессивно улучшается WebGL и преломление хрусталика
Этот пакет из GitHub представляет собой обучающий материал по созданию отзывчивой веб-страницы с использованием WebGL, CSS и React Three Fiber. Автором является David Lindkvist от компании 14islands. В статье на Codrops представлены инструкции по установке и запуску проекта, а также предоставлены ссылки на используемые компоненты и изображения. Один из ключевых элементов этой веб-страницы - это эффект линзового искажения, реализованный на основе работы Paul Henschel под названием "Lens Refraction".
Github
Этот пакет из GitHub представляет собой обучающий материал по созданию отзывчивой веб-страницы с использованием WebGL, CSS и React Three Fiber. Автором является David Lindkvist от компании 14islands. В статье на Codrops представлены инструкции по установке и запуску проекта, а также предоставлены ссылки на используемые компоненты и изображения. Один из ключевых элементов этой веб-страницы - это эффект линзового искажения, реализованный на основе работы Paul Henschel под названием "Lens Refraction".
Github
Платформа социальной сети с автоматической модерацией контента
Проект SocialEcho - это социальная платформа, построенная с использованием стека MERN (MongoDB, Express.js, React.js, Node.js). Он включает в себя две основные особенности: автоматизированную систему модерации контента и контекстную аутентификацию. Платформа также предоставляет обычные функциональности, характерные для социальных сетей, такие как создание профиля, создание и обмен сообщениями, лайки и комментирование сообщений, а также подписка/отписка от пользователей. Автоматизированная система модерации контента использует различные API для обработки естественного языка, такие как Perspective API, TextRazor API и Hugging Face Interface API.
Github
Проект SocialEcho - это социальная платформа, построенная с использованием стека MERN (MongoDB, Express.js, React.js, Node.js). Он включает в себя две основные особенности: автоматизированную систему модерации контента и контекстную аутентификацию. Платформа также предоставляет обычные функциональности, характерные для социальных сетей, такие как создание профиля, создание и обмен сообщениями, лайки и комментирование сообщений, а также подписка/отписка от пользователей. Автоматизированная система модерации контента использует различные API для обработки естественного языка, такие как Perspective API, TextRazor API и Hugging Face Interface API.
Github
Добавьте анимированные кнопки для "нравится", "не нравится" и пользовательских взаимодействий в приложение React
Like-button-celebration - это библиотека, разработанная для добавления анимированных кнопок для лайков, снятия лайков, голосования вверх и настраиваемых взаимодействий на ваши блоги, статьи и веб-контент. С помощью этой библиотеки вы легко можете интегрировать интерактивные кнопки, которые празднующие действия пользователей, добавляя приятные анимации в ваше веб-приложение. Она предоставляет различные параметры настройки, такие как состояние кнопки (активное или неактивное), размер иконки, изображение и др. В пакете также приведены примеры использования компонентов HeartLike, ThumbLike и CustomButton, а также указаны настройки, которые можно использовать для настройки анимации.
Github
Like-button-celebration - это библиотека, разработанная для добавления анимированных кнопок для лайков, снятия лайков, голосования вверх и настраиваемых взаимодействий на ваши блоги, статьи и веб-контент. С помощью этой библиотеки вы легко можете интегрировать интерактивные кнопки, которые празднующие действия пользователей, добавляя приятные анимации в ваше веб-приложение. Она предоставляет различные параметры настройки, такие как состояние кнопки (активное или неактивное), размер иконки, изображение и др. В пакете также приведены примеры использования компонентов HeartLike, ThumbLike и CustomButton, а также указаны настройки, которые можно использовать для настройки анимации.
Github
Настраиваемый компонент toast для React
Этот пакет из GitHub представляет собой настраиваемый компонент для отображения всплывающих сообщений (toast) в React. Для начала работы с библиотекой необходимо установить ее в проект с помощью команды "npm install alert". Затем нужно добавить компонент <Toaster/> в приложение, который будет отображать все ваши сообщения. После этого можно использовать функцию toast() из любого места в приложении. Подробную документацию об API и реализации можно найти в ближайшем будущем.
Github
Этот пакет из GitHub представляет собой настраиваемый компонент для отображения всплывающих сообщений (toast) в React. Для начала работы с библиотекой необходимо установить ее в проект с помощью команды "npm install alert". Затем нужно добавить компонент <Toaster/> в приложение, который будет отображать все ваши сообщения. После этого можно использовать функцию toast() из любого места в приложении. Подробную документацию об API и реализации можно найти в ближайшем будущем.
Github
Приложение для перевода, созданное с помощью React
Данный пакет из GitHub содержит библиотеки для создания переводчика веб-приложения. В его состав входят следующие библиотеки: @reduxjs/toolkit, react-redux, redux, axios и react select. Основным источником для перевода текста является Tranlator App Source, доступный по ссылке https://rapidapi.com/dickyagustin/api/text-translator2.
Github
Данный пакет из GitHub содержит библиотеки для создания переводчика веб-приложения. В его состав входят следующие библиотеки: @reduxjs/toolkit, react-redux, redux, axios и react select. Основным источником для перевода текста является Tranlator App Source, доступный по ссылке https://rapidapi.com/dickyagustin/api/text-translator2.
Github
Карта отслеживания рейсов с React.js
Flight Radar: on Map – это пакет на GitHub, который предоставляет возможность отслеживать полеты в реальном времени на интерактивной карте. В пакете используются следующие библиотеки: reduxjs/toolkit, react-redux, thunk, axios, react-leaflet, leaflet и react-paginate. Пакет уже включает в себя необходимые зависимости, поэтому нет необходимости их отдельно скачивать. Исходные данные о полетах получаются с помощью API с указанными географическими координатами.
Github
Flight Radar: on Map – это пакет на GitHub, который предоставляет возможность отслеживать полеты в реальном времени на интерактивной карте. В пакете используются следующие библиотеки: reduxjs/toolkit, react-redux, thunk, axios, react-leaflet, leaflet и react-paginate. Пакет уже включает в себя необходимые зависимости, поэтому нет необходимости их отдельно скачивать. Исходные данные о полетах получаются с помощью API с указанными географическими координатами.
Github
Следующий шаблон проверки подлинности shadcn firebase
Этот пакет в GitHub представляет собой шаблон (boilerplate) для создания системы аутентификации, использующей технологии NEXTJS, SHADCNUI, REACT HOOK FORM, ZOD и FIREBASE. Для работы необходимо создать проект Firebase и заполнить информацию в файле .env. В системе поддерживаются 3 метода аутентификации: Google, Email/Password и GitHub. Чтобы добавить один из этих методов, необходимо включить его в консоли Firebase и создать приложение на GitHub для получения соответствующей информации.
Github
Этот пакет в GitHub представляет собой шаблон (boilerplate) для создания системы аутентификации, использующей технологии NEXTJS, SHADCNUI, REACT HOOK FORM, ZOD и FIREBASE. Для работы необходимо создать проект Firebase и заполнить информацию в файле .env. В системе поддерживаются 3 метода аутентификации: Google, Email/Password и GitHub. Чтобы добавить один из этих методов, необходимо включить его в консоли Firebase и создать приложение на GitHub для получения соответствующей информации.
Github
Расширение Chrome для предварительного просмотра разметки в chat.openai.com
Данный пакет из GitHub представляет собой расширение для Chrome под названием ChatGPT Markup Preview Extension (PoC), которое позволяет предварительно просматривать разметку HTML в чате на chat.openai.com. Расширение отображает предварительный просмотр HTML-кода в блоках кода. Поддерживается как HTML, так и TSX (TypeScript с расширением JSX) с использованием библиотеки React, а также подгружается стилизация с помощью Tailwind CSS. У расширения также есть возможность копирования предварительного просмотра как изображение для вставки в чат. Для установки необходимо скачать последнюю версию архива chatgpt-markup-preview.zip с GitHub, разархивировать его и загрузить распакованное расширение в Chrome через разработческий режим на странице chrome://extensions.
Github
Данный пакет из GitHub представляет собой расширение для Chrome под названием ChatGPT Markup Preview Extension (PoC), которое позволяет предварительно просматривать разметку HTML в чате на chat.openai.com. Расширение отображает предварительный просмотр HTML-кода в блоках кода. Поддерживается как HTML, так и TSX (TypeScript с расширением JSX) с использованием библиотеки React, а также подгружается стилизация с помощью Tailwind CSS. У расширения также есть возможность копирования предварительного просмотра как изображение для вставки в чат. Для установки необходимо скачать последнюю версию архива chatgpt-markup-preview.zip с GitHub, разархивировать его и загрузить распакованное расширение в Chrome через разработческий режим на странице chrome://extensions.
Github
Интерфейс чата Ollama и OpenAI
Пакет LLM Chatter, версия 0.0.2, представляет собой одно HTML-файловое приложение для общения с локальными моделями большой языковой модели (LLM) Ollama или LLM OpenAI.com. Для установки нужно запустить несколько команд, включая установку Ollama и добавление хотя бы одной модели. Затем необходимо запустить локальный сервер и открыть приложение в веб-браузере. Дополнительно, можно зарегистрировать аккаунт на openai.com и получить API-ключ, который можно использовать при использовании OpenAI Chat. Также предоставляются инструкции по установке дополнительного сервера node.js Express для использования с LangChain URL. Приложение построено с использованием Vite/Bun/React/TailwindCSS/FontAwesome, использует иконки от Font Awesome и делает API-запросы к нескольким ресурсам: http://localhost:11434 (ollama), http://localhost:8080 (сервер langchain-ollama) и https://api.openai.com.
Github
Пакет LLM Chatter, версия 0.0.2, представляет собой одно HTML-файловое приложение для общения с локальными моделями большой языковой модели (LLM) Ollama или LLM OpenAI.com. Для установки нужно запустить несколько команд, включая установку Ollama и добавление хотя бы одной модели. Затем необходимо запустить локальный сервер и открыть приложение в веб-браузере. Дополнительно, можно зарегистрировать аккаунт на openai.com и получить API-ключ, который можно использовать при использовании OpenAI Chat. Также предоставляются инструкции по установке дополнительного сервера node.js Express для использования с LangChain URL. Приложение построено с использованием Vite/Bun/React/TailwindCSS/FontAwesome, использует иконки от Font Awesome и делает API-запросы к нескольким ресурсам: http://localhost:11434 (ollama), http://localhost:8080 (сервер langchain-ollama) и https://api.openai.com.
Github
Многодорожечный веб-аудиоредактор и проигрыватель с предварительным просмотром формы сигнала
React-studio-js - это пакет на GitHub, который предоставляет набор функций для манипулирования звуковыми дорожками в приложении React. Это позволяет пользователям записывать, обрезать, разбивать и сдвигать треки, а также выполнять операции CRUD для аннотаций. Пакет требует корректной работы webaudio в браузере и поддерживает версии браузера, совместимые с Can I Use?. Пакет может быть установлен с помощью npm, и на GitHub доступен демонстрационный пример React.
Github
React-studio-js - это пакет на GitHub, который предоставляет набор функций для манипулирования звуковыми дорожками в приложении React. Это позволяет пользователям записывать, обрезать, разбивать и сдвигать треки, а также выполнять операции CRUD для аннотаций. Пакет требует корректной работы webaudio в браузере и поддерживает версии браузера, совместимые с Can I Use?. Пакет может быть установлен с помощью npm, и на GitHub доступен демонстрационный пример React.
Github
Набор компонентов, связанных с формой, для React
Этот пакет npm предоставляет набор компонентов для форм в React. Вы можете использовать эти компоненты для удобного создания форм. Для всех компонентов доступны CSS-переменные для темизации и классные имена. Есть встроенная поддержка темного режима. В пакете также предоставлены инструкции по установке, документация, примеры и демо-страницы для каждого компонента.
Github
Этот пакет npm предоставляет набор компонентов для форм в React. Вы можете использовать эти компоненты для удобного создания форм. Для всех компонентов доступны CSS-переменные для темизации и классные имена. Есть встроенная поддержка темного режима. В пакете также предоставлены инструкции по установке, документация, примеры и демо-страницы для каждого компонента.
Github