{"id":19611410,"url":"https://github.com/adrianemaciel/aluratube","last_synced_at":"2026-02-11T09:03:54.625Z","repository":{"id":124126777,"uuid":"563151600","full_name":"adrianemaciel/aluratube","owner":"adrianemaciel","description":"Evento disponibilizado pela Alura para desenvolver o AluraTube, um projeto em React","archived":false,"fork":false,"pushed_at":"2022-11-11T00:47:14.000Z","size":39,"stargazers_count":4,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-04-23T18:09:48.589Z","etag":null,"topics":["imersaoreact","reactjs"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/adrianemaciel.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","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":"2022-11-08T02:23:59.000Z","updated_at":"2024-01-06T14:03:28.000Z","dependencies_parsed_at":null,"dependency_job_id":"773c4d9d-3573-4aa9-96f9-246b30534f42","html_url":"https://github.com/adrianemaciel/aluratube","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/adrianemaciel%2Faluratube","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/adrianemaciel%2Faluratube/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/adrianemaciel%2Faluratube/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/adrianemaciel%2Faluratube/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/adrianemaciel","download_url":"https://codeload.github.com/adrianemaciel/aluratube/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":250487531,"owners_count":21438612,"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":["imersaoreact","reactjs"],"created_at":"2024-11-11T10:38:57.290Z","updated_at":"2026-02-11T09:03:49.585Z","avatar_url":"https://github.com/adrianemaciel.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# IMERSÃO REACT - AluraTube\n\n## AULA 01: A WEB, OS COMPONENTES E O DEPLOY.\n\n- Criamos o projeto inicial com NextJS;\n- Vimos NPM scripts;\n- Entendemos como checar a versão do Node e que o NPM vem junto com o projeto;\n- Utilizamos o npx gitignore node para gerar o gitignore do projeto;\n- Vimos a criação de um componente com React;\n- Vimos como trabalhar com estilos no React;\n- Como trabalhar com StyledComponents;\n- Vimos como usar Props no React;\n- Vimos sobre o children do React;\n- Ao final pegamos o CSS já pré-criado pelo DevSoutinho, adicionamos no nosso projeto e seguimos com os desafios.\n\n## AULA 02: ENTENDENDO STATE E FAZENDO A BUSCA DO ALURATUBE\n\n- Criamos o nosso search.js;\n- Aprendemos sobre State;\n- Vimos o conceito de Prop-drilling;\n- No final, criamos o banner utilizando Styled Components e passando Props por ele.\n\n## AULA 03: IMPLEMENTANDO DARK MODE COM CONTEXTAPI\n\n- Começamos olhando o Design Systems;\n- Falamos sobre a importância de ter contratos de cores e valores de Design;\n- Criamos o componente Dark Mode Switch;\n- Criamos um state local no nosso componente de Dark Mode Switch;\n- Começamos a trabalhar esse state para não fazer Prop Drilling e sim ter um contexto que nos permite acessar os dados de forma \"global\";\n- E por fim, um Provider que configura quais dados vão estar disponíveis no contexto.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fadrianemaciel%2Faluratube","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fadrianemaciel%2Faluratube","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fadrianemaciel%2Faluratube/lists"}