Skip to content

LarissaOlimpio/CineTag

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

25 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

CineTag

Introdução

Este projeto foi criado a partir do curso da Alura - React:Praticando com Js, com a instrutora Mônica Hillman, onde a ideia é a criação de uma plataforma de compartilhamento de filmes que possibilita a ação tanto de assistir quanto de favoritar um item. Além disso, ao clicarmos na imagem seremos redirecionado para a tela de Player, onde é exibido o vídeo. Dessa forma, foi utilizado React, HTML5, CSS3 e JavaScript então pude colocar em prática o conhecimento sobre rotas dinâmicas, normais e aninhadas, hooks como useState, useEffect e useContext e consumo de Api. Neste caso foi utilizado Mock Api - serviço de web gratuito que nos permite simular uma Api Adicionei também alguns elementos visuais e utilizei também CSS module para evitar conflitos entre estilos. Ainda estou trabalhando com a responsividade, embora eu prefira utilizar o conceito de mobile firts, neste projeto tive como foco o aprendizado em React fixando todo aprendizado dos cursos até aqui então utilizei a base do css disponibilizado pela instrutora.

Processo de refatoração - design responsivo

🪧 CineTag
🏷️ Tecnologias React, JavaScript, Html5, CSS3 (tecnologias utilizadas)
🚀 URL https://cine-tag-vert.vercel.app/
cinetag.mp4

Como rodar o projeto:

Você pode clonar o projeto e rodá-lo localmente seguindo os passos abaixo

  1. git clone https://github.com/LarissaOlimpio/CineTag.git para clonar o projeto
  2. yarn ou npm install para instalar as dependências do projeto
  3. yarn start ou npm start para rodar o projeto
  4. Acessar http://localhost:3000 no navegador

Para criar a API fake, utilizei o site My JSON Server : https://my-json-server.typicode.com/

Seguindo estes passos:

Criar um repositório on GitHub (<your-username>/<your-repo>)
Criar um arquivo db.json 
Visitar "https://my-json-server.typicode.com/your-username/your-repo" para acessar seu servidor.

**Link para o repositório da API utilizada: https://github.com/LarissaOlimpio/cinetag-api

Projeto criado com Create-React-App, para saber mais acesse a documentação: https://create-react-app.dev/docs/getting-started/