{"id":23310142,"url":"https://github.com/renyzeraa/video-player-zustand","last_synced_at":"2026-04-13T06:03:01.809Z","repository":{"id":251510330,"uuid":"837631835","full_name":"renyzeraa/video-player-zustand","owner":"renyzeraa","description":" Site de cursos, modulos e aulas, implementando Zustand com React","archived":false,"fork":false,"pushed_at":"2024-08-03T19:20:12.000Z","size":206,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-04-07T01:18:24.251Z","etag":null,"topics":["css","react","typescript","zustand"],"latest_commit_sha":null,"homepage":"","language":"TypeScript","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/renyzeraa.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-08-03T14:46:45.000Z","updated_at":"2025-01-27T11:49:44.000Z","dependencies_parsed_at":"2025-02-13T06:44:03.012Z","dependency_job_id":"140e7140-6fa9-4f3a-b504-cfd3a530e1f7","html_url":"https://github.com/renyzeraa/video-player-zustand","commit_stats":null,"previous_names":["renyzeraa/video-player-zustand"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/renyzeraa/video-player-zustand","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/renyzeraa%2Fvideo-player-zustand","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/renyzeraa%2Fvideo-player-zustand/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/renyzeraa%2Fvideo-player-zustand/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/renyzeraa%2Fvideo-player-zustand/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/renyzeraa","download_url":"https://codeload.github.com/renyzeraa/video-player-zustand/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/renyzeraa%2Fvideo-player-zustand/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":279000639,"owners_count":26082879,"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","status":"online","status_checked_at":"2025-10-08T02:00:06.501Z","response_time":56,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"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","react","typescript","zustand"],"created_at":"2024-12-20T13:16:21.416Z","updated_at":"2025-10-09T00:38:48.546Z","avatar_url":"https://github.com/renyzeraa.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Estudo de Implementação do Zustand em React\n\nEste projeto tem como objetivo estudar a implementação do Zustand em uma aplicação React. A aplicação simula um curso fictício, onde o usuário pode assistir a vídeos de aulas e navegar entre módulos e aulas. A estilização do site é feita com Tailwind CSS.\n\n## Instalação\n\n1. Clone o repositório:\n\n```bash\ngit clone https://github.com/renyzeraa/video-player-zustand.git\ncd video-player-zustand\n```\n\n2. Instale as dependências do projeto:\n\n```bash\nnpm install\n```\n\n3. Inicie o servidor uma aba do terminal\n\n```bash\nnpm run server\n```\n\nVai rodar no http://localhost:3000/course 4. Em outra aba do terminal inicie a aplicação\n\n```bash\nnpm run dev\n```\n\nVai rodar no http://localhost:5173/\n\n## Json Server\n\nO JSON Server é utilizado para simular uma API RESTful. O arquivo server.json contém a estrutura de dados das aulas do curso fictício, basta acessar o arquivo na raiz do projeto para ver os dados.\n\n## Tailwind CSS\n\nO Tailwind CSS é utilizado para estilizar a aplicação.\nA configuração está no arquivo tailwind.config.js\n\n## Funcionalidades Principais\n\n1. **Visualização de Vídeos:** Os usuários podem assistir a vídeos de aulas.\n2. **Navegação entre Módulos e Aulas:** A aplicação permite navegar entre diferentes módulos e aulas.\n3. **Gerenciamento de Estado:** O Zustand é utilizado para gerenciar o estado dos módulos e aulas.\n4. **Estilização com Tailwind CSS:** A aplicação é estilizada utilizando classes utilitárias do Tailwind CSS.\n5. Antes de carregar os vídeos é alicado uma animação de Loading.\n\n### Contato\n\n\u003cimg align=\"left\" src=\"https://avatars.githubusercontent.com/renyzeraa?size=100\"\u003e\n\nMade with ❤️ by [Renan Silva](https://github.com/renyzeraa)! \u003cbr\u003e\n🛠 Frontend Developer \u003cbr\u003e\n📍 Santa Catarina - Brazil \u003cbr\u003e\n\n\u003ca href=\"https://www.linkedin.com/in/renyzeraa\" target=\"_blank\"\u003e\u003cimg src=\"https://img.shields.io/badge/LinkedIn-0077B5?style=flat\u0026logo=linkedin\u0026logoColor=white\" alt=\"LinkedIn Badge\" height=\"20\"\u003e\u003c/a\u003e\u0026nbsp;\n\u003ca href=\"mailto:renansilvaytb@gmail.com\" target=\"_blank\"\u003e\u003cimg src=\"https://img.shields.io/badge/Gmail-D14836?style=flat\u0026logo=gmail\u0026logoColor=white\" alt=\"Gmail Badge\" height=\"20\"\u003e\u003c/a\u003e\u0026nbsp;\n\u003ca href=\"#\"\u003e\u003cimg src=\"https://img.shields.io/badge/Discord-%237289DA.svg?logo=discord\u0026logoColor=white\" title=\"renan_s#7826\" alt=\"Discord Badge\" height=\"20\"\u003e\u003c/a\u003e\u0026nbsp;\n\u003ca href=\"https://www.github.com/renyzeraa\" target=\"_blank\"\u003e\u003cimg src=\"https://img.shields.io/badge/GitHub-100000?style=flat\u0026logo=github\u0026logoColor=white\" alt=\"GitHub Badge\" height=\"20\"\u003e\u003c/a\u003e\u0026nbsp;\n\n\u003cbr clear=\"left\"/\u003e\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Frenyzeraa%2Fvideo-player-zustand","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Frenyzeraa%2Fvideo-player-zustand","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Frenyzeraa%2Fvideo-player-zustand/lists"}