{"id":15089078,"url":"https://github.com/vipreal/star-wars-react","last_synced_at":"2026-01-04T14:32:29.062Z","repository":{"id":250475307,"uuid":"834207492","full_name":"VipReaL/Star-Wars-React","owner":"VipReaL","description":"Проект Star Wars 🪐: любительский сайт ключевых персонажей вселенной Star Wars.","archived":false,"fork":false,"pushed_at":"2024-08-08T15:36:42.000Z","size":10731,"stargazers_count":1,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-03-21T09:16:14.647Z","etag":null,"topics":["css","html","javascript","react","react-router","redux","storybook"],"latest_commit_sha":null,"homepage":"https://vipreal.github.io/Star-Wars-React/","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/VipReaL.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2024-07-26T16:49:29.000Z","updated_at":"2025-02-24T17:49:32.000Z","dependencies_parsed_at":"2024-07-27T18:31:37.822Z","dependency_job_id":"640fdcb0-616f-4b54-94de-f8c2d80816e6","html_url":"https://github.com/VipReaL/Star-Wars-React","commit_stats":{"total_commits":23,"total_committers":1,"mean_commits":23.0,"dds":0.0,"last_synced_commit":"21fbf3687cc7a37998782c3406b837f2bb00838f"},"previous_names":["vipreal/star-wars-react"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/VipReaL%2FStar-Wars-React","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/VipReaL%2FStar-Wars-React/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/VipReaL%2FStar-Wars-React/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/VipReaL%2FStar-Wars-React/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/VipReaL","download_url":"https://codeload.github.com/VipReaL/Star-Wars-React/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":244767802,"owners_count":20507110,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["css","html","javascript","react","react-router","redux","storybook"],"created_at":"2024-09-25T08:39:53.517Z","updated_at":"2026-01-04T14:32:29.018Z","avatar_url":"https://github.com/VipReaL.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Проект Star Wars 🪐\n\n[Посмотреть проект Star Wars 🪐](https://vipreal.github.io/Star-Wars-React/)  \n[Посмотреть storybook проектa Star Wars 🪐](https://vipreal.github.io/Star-Wars-React/storybook)\n\n- На главной странице реализована возможность выбора темы со сменой фона и цвета текста\n- На странице Персонажи выводится список ключевых персонажей вселенной звёздных войн, можно просматривать подробную статистику и добавлять в избранное.\n- Реализован поиск по персонажам\n- Реализована страница not-found\n- Реализована страница fail\n\n# ⛓️‍💥 Использованы API\n- https://swapi.dev (основное API)\n- https://swapi.py4e.com (запасное API - если основное не работает)\n- https://starwars-visualguide.com (изображения для API)\n\n# ⚙️ Использованы технологии\n## React.js\n- Разворачивание приложения с create-react-app\n- Состояние компонента (хук useState)\n- Жизненный цикл компонента (хук useEffect)\n- Context API (хук useContext)\n- Рефы и DOM (хук useRef)\n- Создание собственных хуков\n- Фрагменты\n- Паттерн Higher-Order Component\n- Паттерн Подъём состояния\n- Обработка событий\n- Controlled Components\n- Подключение CSS, css-modules, библиотека classnames\n- Библиотека prop-types для валидации props\n## React Router\n- Базовый роутинг\n- URL Parameters\n- Query Parameters\n- Обработка страницы 404 (Not Found)\n- Хуки useLocation и useHistory\n## Redux\n- Базовая структура react-redux-приложения\n- Хуки useDispatch, useSelector\n- Redux Middleware\n- Создание асинхронных action с библиотекой redux-thunk\n- Отслеживание состояния store с redux-devtools-extension\n## Общее\n- Задание Alias в React-приложении (библиотека react-app-rewire-alias)\n- Деплой приложения на GitHub Pages (библиотека gh-pages)\n- Создание Ui-Kit из визуальных компонентов и публикация в @storybook\n- Библиотека lodash с готовыми функциями\n- Visual Studio Code. Сниппеты и плагины\n## JavaScript\n- Методы работы с массивами: map, filter, forEach\n- Асинхронность: Promise, Async Functions\n- ES6-модули (import и export)\n- Оператор разворота для объектов (props для компонента)\n- Деструктуризация массивов и объектов\n- Тернарные операторы\n- Работа с Local Storage\n- Работа с API с использованием Fetch\n## Вёрстка\n- CSS Custom Properties, изменение через JavaScript\n- CSS Filters\n- CSS Flexbox\n- CSS Multi Columns\n- Стилизация скроллбара\n## Технологии\n- TypeScript\n- Firebase регистрация\n- Material UI, стилизация через css-in-js\n- Redux Thunk\n- React Hook Form для обработки данных форм\n## Функционал\n- Роутер. Анимация при переходе между страницами\n- Добавить шрифты\n\n# 🛠 Установка и запуск\n```bash\n# Установка\nnpm i                    # установка зависимостей\n```\n```bash\n# Основные команды\nnpm run start            # запустить приложение в режиме разработки\nnpm run storybook        # запустить storybook\nnpm run deploy           # развернуть приложение в Github Pages\n```\n```bash\n# Deploy\nnpm run build            # builds the app for production\nnpm run build-storybook  # storybook build\nnpm run build-gh-pages   # deploy on Github Pages\n```\n```bash\n# Not used\nnpm run eject            # remove the single build dependency\nnpm run deploy-storybook # storybook deploy\n```\n\n## NPM\n```bash\nnpm i --save classnames lodash prop-types react react-dom react-redux react-router react-router-dom react-scripts redux redux-devtools-extension redux-thunk\n```\n```bash\nnpm i --save-dev @storybook/addon-actions @storybook/addon-essentials @storybook/addon-links @storybook/node-logger @storybook/preset-create-react-app @storybook/react @storybook/storybook-deployer gh-pages react-app-rewire-alias react-app-rewired\n```\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fvipreal%2Fstar-wars-react","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fvipreal%2Fstar-wars-react","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fvipreal%2Fstar-wars-react/lists"}