Веб-сайт для визуализации графиков, созданный с использованием React
Данный проект представляет собой веб-сайт для визуализации графов, созданный с использованием React, TypeScript и Ant Design. Он демонстрирует мои навыки работы с функциональностью перетаскивания и управления состоянием, создания чистого и удобного пользовательского интерфейса с использованием компонентов Ant Design, а также применения типов и интерфейсов TypeScript для повышения качества кода и его поддержки. Сайт позволяет пользователям взаимодействовать с графами, визуализировать и манипулировать ими с помощью перетаскивания, что обеспечивает интуитивное и увлекательное взаимодействие с графами.
Github
Данный проект представляет собой веб-сайт для визуализации графов, созданный с использованием React, TypeScript и Ant Design. Он демонстрирует мои навыки работы с функциональностью перетаскивания и управления состоянием, создания чистого и удобного пользовательского интерфейса с использованием компонентов Ant Design, а также применения типов и интерфейсов TypeScript для повышения качества кода и его поддержки. Сайт позволяет пользователям взаимодействовать с графами, визуализировать и манипулировать ими с помощью перетаскивания, что обеспечивает интуитивное и увлекательное взаимодействие с графами.
Github
Эффект выпадающего текста матрицы в React с использованием HTML canvas
React Matrix Animation - компонент React, который позволяет создавать эффект текста из фильма "Матрица". Модуль устанавливается с использованием NPM и имеет несколько настраиваемых параметров, таких как размер элементов символов, скорость затухания, цвет фона и цвет шрифта. Модуль также предоставляет возможность вносить вклад в его разработку.
Github
React Matrix Animation - компонент React, который позволяет создавать эффект текста из фильма "Матрица". Модуль устанавливается с использованием NPM и имеет несколько настраиваемых параметров, таких как размер элементов символов, скорость затухания, цвет фона и цвет шрифта. Модуль также предоставляет возможность вносить вклад в его разработку.
Github
Веб-сайт о недвижимости, созданный с использованием React
Homzy - A Real Estate Website - это веб-сайт по недвижимости, который упрощает процесс покупки и продажи недвижимости. Он предоставляет удобный интерфейс для владельцев недвижимости, чтобы они могли размещать свои объекты, и для потенциальных покупателей, чтобы они могли искать и просматривать доступные объекты. Веб-сайт позволяет пользователям искать недвижимость в любом месте и просматривать окружающие районы для лучшего понимания обстановки. Пользователи также могут отмечать понравившиеся объекты и добавлять их в список избранных для будущего просмотра. Для обеспечения безопасности и удобства аутентификации используется Auth0 как для клиентской, так и для серверной аутентификации. UI-компоненты разработаны с использованием библиотеки Mantine для создания качественного и отзывчивого пользовательского интерфейса.
Github
Homzy - A Real Estate Website - это веб-сайт по недвижимости, который упрощает процесс покупки и продажи недвижимости. Он предоставляет удобный интерфейс для владельцев недвижимости, чтобы они могли размещать свои объекты, и для потенциальных покупателей, чтобы они могли искать и просматривать доступные объекты. Веб-сайт позволяет пользователям искать недвижимость в любом месте и просматривать окружающие районы для лучшего понимания обстановки. Пользователи также могут отмечать понравившиеся объекты и добавлять их в список избранных для будущего просмотра. Для обеспечения безопасности и удобства аутентификации используется Auth0 как для клиентской, так и для серверной аутентификации. UI-компоненты разработаны с использованием библиотеки Mantine для создания качественного и отзывчивого пользовательского интерфейса.
Github
Клон Spotify, созданный с использованием React.js
Этот репозиторий на GitHub содержит клон Spotify, построенный с использованием React.js, который имеет целью воспроизвести некоторые основные функции популярного музыкального сервиса Spotify. Он позволяет пользователям войти в свои учетные записи Spotify и получить доступ к их плейлистам. Приложение использует Spotify API и требует действующий client ID, полученный на сайте Spotify for Developers, для аутентификации. Проект также использует Axios для обработки запросов к API и Styled Components для стилизации пользовательского интерфейса.
Github
Этот репозиторий на GitHub содержит клон Spotify, построенный с использованием React.js, который имеет целью воспроизвести некоторые основные функции популярного музыкального сервиса Spotify. Он позволяет пользователям войти в свои учетные записи Spotify и получить доступ к их плейлистам. Приложение использует Spotify API и требует действующий client ID, полученный на сайте Spotify for Developers, для аутентификации. Проект также использует Axios для обработки запросов к API и Styled Components для стилизации пользовательского интерфейса.
Github
Доска для перетаскивания канбанов с помощью React
В этом пакете из Github показано, как создать Kanban-доску с функцией перетаскивания и падения с использованием React, TypeScript, TailwindCSS и dnd-kit. Видео охватывает следующие шаги: создание столбцов и задач с помощью компонентов React, включение функции перетаскивания и падения для столбцов и задач, использование функции редактирования содержимого и заголовка задач и столбцов, стилизация пользовательского интерфейса с помощью классов утилит TailwindCSS. Этот проект отлично подходит для практики навыков работы с React и изучения новых библиотек. Вы также получите полезный инструмент, который можно использовать для собственных проектов или дополнительной настройки.
Github
В этом пакете из Github показано, как создать Kanban-доску с функцией перетаскивания и падения с использованием React, TypeScript, TailwindCSS и dnd-kit. Видео охватывает следующие шаги: создание столбцов и задач с помощью компонентов React, включение функции перетаскивания и падения для столбцов и задач, использование функции редактирования содержимого и заголовка задач и столбцов, стилизация пользовательского интерфейса с помощью классов утилит TailwindCSS. Этот проект отлично подходит для практики навыков работы с React и изучения новых библиотек. Вы также получите полезный инструмент, который можно использовать для собственных проектов или дополнительной настройки.
Github
Библиотека, которая помогает вам проверять ваши формы в React
Этот пакет из GitHub - руководство по использованию библиотеки React Hook Form, которая помогает валидировать формы в React. Она очень проста в использовании, легкая и быстрая. Эта библиотека является отличной альтернативой Formik. Установка производится через git clone и npm install, а также доступна демонстрация на живом примере по ссылке.
Github
Этот пакет из GitHub - руководство по использованию библиотеки React Hook Form, которая помогает валидировать формы в React. Она очень проста в использовании, легкая и быстрая. Эта библиотека является отличной альтернативой Formik. Установка производится через git clone и npm install, а также доступна демонстрация на живом примере по ссылке.
Github
Симулятор, близкий к некоторым фанатским играм Yu-Gi-Oh
Этот проект в GitHub представляет собой симулятор карточной игры Digimon TCG (Trading Card Game), созданный в рамках учебного курса neuefische educational capstone project. В настоящее время он находится в состоянии полной функциональности и позволяет игрокам строить колоды, редактировать их и задавать активную колоду и аватар на странице профиля. Используемые технологии, фреймворки и библиотеки включают React, Spring Boot, MongoDB и другие, а для развертывания проекта используется GitHub Actions и Docker. Важно отметить, что это неофициальный проект фанатов, не связанный с Bandai Co., Ltd. или Digimon франшизой, и используемые материалы либо созданы авторами проекта, либо использованы с разрешения соответствующих создателей. Цель проекта - отдать дань уважения и показать свою любовь к Digimon и его фан-сообществу.
Github
Этот проект в GitHub представляет собой симулятор карточной игры Digimon TCG (Trading Card Game), созданный в рамках учебного курса neuefische educational capstone project. В настоящее время он находится в состоянии полной функциональности и позволяет игрокам строить колоды, редактировать их и задавать активную колоду и аватар на странице профиля. Используемые технологии, фреймворки и библиотеки включают React, Spring Boot, MongoDB и другие, а для развертывания проекта используется GitHub Actions и Docker. Важно отметить, что это неофициальный проект фанатов, не связанный с Bandai Co., Ltd. или Digimon франшизой, и используемые материалы либо созданы авторами проекта, либо использованы с разрешения соответствующих создателей. Цель проекта - отдать дань уважения и показать свою любовь к Digimon и его фан-сообществу.
Github
Универсальный компонент React, который позволяет пользователям без особых усилий просматривать коллекцию изображений
Hover-Carousel - это универсальный интерактивный компонент React, который позволяет пользователям без особых усилий просматривать коллекцию изображений, наведя курсор на контейнер и перемещая мышь горизонтально. Он обеспечивает плавную прокрутку и разработан таким образом, чтобы быть адаптивным к различным устройствам и размерам экрана. Компонент легкий и эффективный, настраиваемый, и вклад в проект приветствуется.
Github
Hover-Carousel - это универсальный интерактивный компонент React, который позволяет пользователям без особых усилий просматривать коллекцию изображений, наведя курсор на контейнер и перемещая мышь горизонтально. Он обеспечивает плавную прокрутку и разработан таким образом, чтобы быть адаптивным к различным устройствам и размерам экрана. Компонент легкий и эффективный, настраиваемый, и вклад в проект приветствуется.
Github
Веб-сайт, на котором ваш профиль в Twitter ( 𝕏 ) и Github будет доступен всему миру
Пакет из GitHub представляет собой веб-сайт, на котором можно разместить информацию о своем аккаунте в Twitter и Github. В файле формата JSON указываются значения для имени пользователя в Twitter, реального имени, имени пользователя в Github, цвета фона баннера и небольшого описания о себе. Для установки проекта необходимо его форкнуть, клонировать на ПК, а затем добавить свой профиль, отредактировав файл JSON. После этого можно создать Pull Request для внесения изменений в исходный репозиторий.
Github
Пакет из GitHub представляет собой веб-сайт, на котором можно разместить информацию о своем аккаунте в Twitter и Github. В файле формата JSON указываются значения для имени пользователя в Twitter, реального имени, имени пользователя в Github, цвета фона баннера и небольшого описания о себе. Для установки проекта необходимо его форкнуть, клонировать на ПК, а затем добавить свой профиль, отредактировав файл JSON. После этого можно создать Pull Request для внесения изменений в исходный репозиторий.
Github
Проект, который упрощает и автоматизирует процесс управления запасами в клинике CSU
Проект Simplified CSU-Clinic's IMS представляет собой систему управления инвентаризацией лекарств в клинике. В проекте используются такие технологии, как ReactJS, Typescript, Supabase и PostgreSQL. Система позволяет добавлять и управлять запасами лекарств, просматривать информацию о добавленных лекарствах, создавать и управлять шкафами и ящиками для хранения лекарств. Данный проект не является полностью функциональной системой для производственного использования и предназначен исключительно для демонстрации возможностей.
Github
Проект Simplified CSU-Clinic's IMS представляет собой систему управления инвентаризацией лекарств в клинике. В проекте используются такие технологии, как ReactJS, Typescript, Supabase и PostgreSQL. Система позволяет добавлять и управлять запасами лекарств, просматривать информацию о добавленных лекарствах, создавать и управлять шкафами и ящиками для хранения лекарств. Данный проект не является полностью функциональной системой для производственного использования и предназначен исключительно для демонстрации возможностей.
Github
Клон Amazon с аутентификацией с использованием Firebase, разработанный с использованием React
Этот пакет из GitHub представляет собой полноценное веб-приложение, которое воспроизводит основные функции популярной платформы электронной коммерции Amazon. Приложение использует Firebase для аутентификации пользователей, Firestore для хранения данных и Stripe для обработки онлайн-платежей. Бэкэнд создан с использованием Node.js и Express, а фронтэнд - с помощью React. Возможности включают аутентификацию пользователей, просмотр различных товаров, добавление и удаление товаров из корзины, оформление покупки с использованием Stripe для реальных платежей, обновление товаров в реальном времени и отзывчивый дизайн для мобильных устройств и компьютеров.
Github
Этот пакет из GitHub представляет собой полноценное веб-приложение, которое воспроизводит основные функции популярной платформы электронной коммерции Amazon. Приложение использует Firebase для аутентификации пользователей, Firestore для хранения данных и Stripe для обработки онлайн-платежей. Бэкэнд создан с использованием Node.js и Express, а фронтэнд - с помощью React. Возможности включают аутентификацию пользователей, просмотр различных товаров, добавление и удаление товаров из корзины, оформление покупки с использованием Stripe для реальных платежей, обновление товаров в реальном времени и отзывчивый дизайн для мобильных устройств и компьютеров.
Github
Crowdy DApp, созданное с использованием Reactjs
Crowdy dApp - это децентрализованная платформа для краудфандинга, где вы можете создавать собственные кампании и собирать средства для вашего проекта. Платформа работает на основе технологии блокчейн, что обеспечивает прозрачность, безопасность и отчетность. Главная цель платформы - предоставить краудфандинг на основе блокчейна, обеспечивая децентрализацию и множество преимуществ, связанных с этой технологией.
Github
Crowdy dApp - это децентрализованная платформа для краудфандинга, где вы можете создавать собственные кампании и собирать средства для вашего проекта. Платформа работает на основе технологии блокчейн, что обеспечивает прозрачность, безопасность и отчетность. Главная цель платформы - предоставить краудфандинг на основе блокчейна, обеспечивая децентрализацию и множество преимуществ, связанных с этой технологией.
Github
Веб-приложение React для бронирования каюты с аутентификацией и авторизацией
The Wild Oasis - это веб-сайт веб-приложения React, который позволяет пользователям бронировать каюты с функциями аутентификации и авторизации. Он использует Supabase в качестве службы базы данных и включает в себя панель мониторинга с диаграммой и функцией темного режима. Доступ к веб-сайту возможен только в режиме настольного компьютера или планшета, и он использует различные технологии, такие как HTML, CSS, JavaScript, React.js , Supabase, React Query, React Icons, React router, Стилизованные компоненты, перезарядки и Vite.
Github
The Wild Oasis - это веб-сайт веб-приложения React, который позволяет пользователям бронировать каюты с функциями аутентификации и авторизации. Он использует Supabase в качестве службы базы данных и включает в себя панель мониторинга с диаграммой и функцией темного режима. Доступ к веб-сайту возможен только в режиме настольного компьютера или планшета, и он использует различные технологии, такие как HTML, CSS, JavaScript, React.js , Supabase, React Query, React Icons, React router, Стилизованные компоненты, перезарядки и Vite.
Github
Приложение React, которое отображает случайные цитаты дяди Айро из "Аватара"
Uncle Iroh Quote Generator - это React-приложение, которое показывает случайные цитаты от Дяди Иро из сериала "Аватар: Последний маг воздуха". Используемые технологии: React, Vite, Tailwind CSS. Чтобы запустить приложение локально, нужно склонировать проект, установить зависимости и запустить сервер. Вклад в проект всегда приветствуется!
Github
Uncle Iroh Quote Generator - это React-приложение, которое показывает случайные цитаты от Дяди Иро из сериала "Аватар: Последний маг воздуха". Используемые технологии: React, Vite, Tailwind CSS. Чтобы запустить приложение локально, нужно склонировать проект, установить зависимости и запустить сервер. Вклад в проект всегда приветствуется!
Github
Веб-сайт игрового браузера, созданный с использованием пользовательского интерфейса React и Chakra
GameHub - это веб-приложение, разработанное на React и использующее библиотеку пользовательского интерфейса Chakra UI. Оно получает данные о различных играх с сайта https://rawg.io/ и отображает их с помощью Chakra UI. Приложение может быть запущено локально с помощью команды 'npm run dev' и также может быть собрано для продакшна с помощью команды 'vite build', что создаст директорию 'dist'. Также доступна онлайн-демо-версия приложения по ссылке https://felstar.com/demo/gamehub/.
Github
GameHub - это веб-приложение, разработанное на React и использующее библиотеку пользовательского интерфейса Chakra UI. Оно получает данные о различных играх с сайта https://rawg.io/ и отображает их с помощью Chakra UI. Приложение может быть запущено локально с помощью команды 'npm run dev' и также может быть собрано для продакшна с помощью команды 'vite build', что создаст директорию 'dist'. Также доступна онлайн-демо-версия приложения по ссылке https://felstar.com/demo/gamehub/.
Github
Отправьте свою идею и получите список похожих идей, в которые YCombinator инвестировал ранее
Этот проект позволяет отправить свою идею и получить список похожих идей, в которые YCombinator уже инвестировал. Для создания проекта использовались такие технологии, как Neon для серверного хранения Postgres, pg_embedding для векторного хранения и поиска, Next.js для фреймворка React, Vercel для платформы развертывания, OpenAI API для генерации векторных вложений, TailwindCSS для фреймворка CSS, Upstash Redis для ограничения скорости, Zod для проверки типов, React Query для получения и кэширования данных и компонент Drawer для React.
Github
Этот проект позволяет отправить свою идею и получить список похожих идей, в которые YCombinator уже инвестировал. Для создания проекта использовались такие технологии, как Neon для серверного хранения Postgres, pg_embedding для векторного хранения и поиска, Next.js для фреймворка React, Vercel для платформы развертывания, OpenAI API для генерации векторных вложений, TailwindCSS для фреймворка CSS, Upstash Redis для ограничения скорости, Zod для проверки типов, React Query для получения и кэширования данных и компонент Drawer для React.
Github
Целевая страница для gym, созданная с использованием React, Typescript и Tailwind CSS
Этот пакет на GitHub представляет собой страницу фитнес-центра, построенную с использованием React и TypeScript, с целью демонстрации услуг фитнес-клуба и привлечения потенциальных клиентов. Она имеет современный и адаптивный дизайн, обеспечивающий отличный пользовательский опыт на различных устройствах. Включает в себя интерактивные компоненты, анимации, интеграцию с внешними API для отображения расписания занятий, акций и других функций, а также TypeScript для проверки типов и улучшенной поддержки кода.
Github
Этот пакет на GitHub представляет собой страницу фитнес-центра, построенную с использованием React и TypeScript, с целью демонстрации услуг фитнес-клуба и привлечения потенциальных клиентов. Она имеет современный и адаптивный дизайн, обеспечивающий отличный пользовательский опыт на различных устройствах. Включает в себя интерактивные компоненты, анимации, интеграцию с внешними API для отображения расписания занятий, акций и других функций, а также TypeScript для проверки типов и улучшенной поддержки кода.
Github
Веб-приложение, которое позволяет студентам организовывать свои учебные материалы и управлять ими
Brain-Box - это веб-приложение, которое позволяет студентам организовывать и управлять своими учебными материалами, включая предметы, главы, заметки и видео ссылки. Оно обладает функциями авторизации, создания и просмотра предметов и глав, добавления и управления заметками и видео ссылками, а также обновления в реальном времени. Приложение построено на стеке технологий React, React Router, Firebase Authentication, Tailwind CSS и развернуто на Vercel.
Github
Brain-Box - это веб-приложение, которое позволяет студентам организовывать и управлять своими учебными материалами, включая предметы, главы, заметки и видео ссылки. Оно обладает функциями авторизации, создания и просмотра предметов и глав, добавления и управления заметками и видео ссылками, а также обновления в реальном времени. Приложение построено на стеке технологий React, React Router, Firebase Authentication, Tailwind CSS и развернуто на Vercel.
Github
Веб-приложение для электронной коммерции, созданное с использованием React и Redux Toolkit
Проект E-Commerce с использованием React и Redux Toolkit является веб-приложением электронной коммерции, в котором реализована функция фильтрации товаров по цене с помощью интерактивного ползунка. Приложение также использует внешний API для получения актуальной информации о товарах. Пользователи могут добавлять товары в корзину, удалять их и просматривать содержимое корзины для более удобного управления выбранными товарами.
Github
Проект E-Commerce с использованием React и Redux Toolkit является веб-приложением электронной коммерции, в котором реализована функция фильтрации товаров по цене с помощью интерактивного ползунка. Приложение также использует внешний API для получения актуальной информации о товарах. Пользователи могут добавлять товары в корзину, удалять их и просматривать содержимое корзины для более удобного управления выбранными товарами.
Github
Клон ChatGPT, созданный с помощью MERN и использующий OpenAI API
ChatGPT - это клон проекта chatGPT, созданный с использованием MERN и API OpenAI. Он позволяет вести разговоры, максимально приближенные к человеческим. Возможности включают PWA, автономную работу, вход с паролем, восстановление пароля, вход и регистрацию через Google, сохранение истории чатов, удаление аккаунта, светлую и темную темы и отзывчивый дизайн. Для запуска проекта необходимо установить необходимые зависимости, добавить переменные окружения и запустить соответствующие команды.
Github
ChatGPT - это клон проекта chatGPT, созданный с использованием MERN и API OpenAI. Он позволяет вести разговоры, максимально приближенные к человеческим. Возможности включают PWA, автономную работу, вход с паролем, восстановление пароля, вход и регистрацию через Google, сохранение истории чатов, удаление аккаунта, светлую и темную темы и отзывчивый дизайн. Для запуска проекта необходимо установить необходимые зависимости, добавить переменные окружения и запустить соответствующие команды.
Github