skylab-clone icon indicating copy to clipboard operation
skylab-clone copied to clipboard

🧑🏻‍🚀🚀 Clone do site Skylab, plataforma de estudos da Rocketseat.

Skylab-Clone

Sobre   |    Requisitos   |    Começando   |    ReactJS >

Skylab-Clone

Demo da aplicação

:page_with_curl: Sobre

Este repositório contém uma aplicação em ReactJS utilizando TypeScript.

Essa é a aplicação clone do Skylab, a plataforma de aulas da Rocketseat. Fiz o clone de apenas algumas telas da plataforma, como o listagem de cursos, listagem de aulas do curso Starter, dashboard do curso GoStack e a listagem de aulas do curso GoStack.

Nesse projeto tive o objetivo de aprimorar minhas habilidades em construção de interfaces e layouts responsivos ultilizando a biblioteca styled-components. Outra biblioteca muito utilizada foi a Skeleton, para efeitos de carregamento enquanto uma requisição a API fake é feita.

:hammer: Tecnologias

Esse projeto foi desenvolvido com as seguintes tecnologias:

:books: Requisitos

  • Ter Git para clonar o projeto.
  • Ter Node.js instalado.

:rocket: Começando

  # Clonar o projeto:
  $ git clone https://github.com/MatheusPires99/skylab-clone

  # Entrar no diretório:
  $ cd skylab-clone/frontend

:gear: Iniciando server

Para iniciar o server na aplicação crie um arquivo chamado .env na raiz da pasta frontend.

Dentro desse arquivo, você pode colocar na variável ambiente REACT_APP_API_URL duas opções:

  • http://localhost:3333 -> Caso queira rodar o projeto totalmente local. Para isso, rode o comando:
  json-server server.json -p 3333
  • https://my-json-server.typicode.com/MatheusPires99/skylab-clone -> Caso queria usar o meu server.

:computer: Iniciando front-end

  # Instalar as dependências:
  $ yarn

  # Rodar a aplicação:
  $ yarn start

Feito com ❤️ por Matheus Pires 👋🏻 Get in touch!