💈 Backend Admin Template

Sobre o projeto   |    Tecnologias   |    Iniciando o projeto   |    Como contribuir   |    Licença

💰 Sobre o projeto

O GoBarber Admin é um projeto desenvolvido a partir da participação no Bootcamp GoStack da #RocketSeat. Durante o curso, a metodologia de ensino é voltada diretamente para atividades práticas, de modo a refletir, ao máximo, o ambiente real encontrado no mercado de trabalho. A partir da ideia da aplicação GoBarber ensinada no BootCamp, houve a iniciativa particular de praticar os conceitos ministrados no curso; sendo assim, essa atividade resultou na criação de um ambiente administrativo, abstraindo a simulação da gestão da aplicação.

🚀 Tecnologias

• Node.js
• ReactJS
• React Native
• TypeScript
• TypeORM
• Express
• React Router DOM
• React Navigation
• React Icons
• Styled Components
• Axios
• Eslint
• Prettier
• EditorConfig
• Lazy Loading
• Code Splitting

💻 Iniciando

Requisitos

• Node.js
• Yarn or npm

**Clone o projeto e acesse o diretório /gobarber-admin, conforme o comando abaixo **

$ git clone https://github.com/danilods/gobarber-admin.git && cd gobarber-admin

Se você for utilizar autenticação com JWT, siga os passos abaixo. Caso opte por utilizar autenticação via Firebase, pule esta estapa e vá para o item "autenticação via Firebase"

Siga os passos a seguir

Backend para simulação de autenticação JWT

O foco do projeto é no backoffice da aplicação, de modo que sua estrutura visual possa ser evoluída. Portanto, o backend foi substituído por um simulador de autenticação com JWT e uma API simulada, utilizando json_server.

Abra uma nova janela do terminal e acesse o diretório gobarber-admin/fake-backend-api

# Starting from the project root folder, go to backend folder
$ cd ../gobarber-admin/fake-backend-api

# Inicie o json_server
$ yarn start or npm start

# Acompanhe a inicialização do servidor.

# Você poderá acessar os dados para autenticação no arquivo users.json
# O arquivo databse.json possibilita você controlar os dados a serem utilizados em um CRUD

Autenticação via Firebase

Em caso de dúvidas quanto à criação de uma base de dados no Firebase, consulte ...

Abra o arquivo firebaseAPI.ts, situado no diretório src/services/firebaseAPI e preencha os campos de configuração com os dados fornecidos pelo firebase, ao criar sua base de dados.

// Initialize Firebase
import * as firebase from 'firebase/app';
import 'firebase/auth';

  const app = firebase.initializeApp({
  apiKey: "API_KEY",
    authDomain: "XXXXXX.firebaseapp.com",
    databaseURL: "https://xxxxxx.firebaseio.com",
    projectId: "PROJECT_ID",
    storageBucket: "xxxxxx.appspot.com",
    messagingSenderId: "MESSAGE_ID",

});

export default app;

### A seguir, vá no arquivo src/routes/Route.tsx e altere o hook de autenticação da seguinte forma:

Substitua:

const {user} = useAuth();

por

const {userFire} = useAuth();

### Pronto! A partir de agora, a aplicação fará autenticação pelo Firebase.

Aplicação

Obs.: Antes de continuar, verifique se a API está incializada.

# Acesse o diretório da aplicação
$ cd gobarber-admin

# Instale as dependências
$ yarn

# Rode a aplicação
$ yarn start

Foi criada uma função para simular atraso na conexão para que fosse possível visualizar e testar o suspense. Você só precisa alterar a função setTimeOut, ou retirá-la, se preferir.

# src/routes/index.tsx

const Dashboard = lazy(() => {
  return new Promise(resolve => setTimeout(resolve, 5 * 1000)).then(
    () =>
      import('../pages/Dashboard')
  );
});

Funcionalidades e componentes previstos para serem implementados:

1. Skeleton - LoadContent;
2. Pagination Component;
3. Modal Component;
4. Chart Component;
5. Autenticação via GMAIL;
6. Autenticação via Facebook; ...

🤔 Como contribuir?

Faça um fork para este repositório

# Usando o github CLI:
$ gh repo fork danilods/gobarber-admin

# Se você não tem GitHub CLI, use o website para isto.

Siga os passos abaixo

# Clone seu fork
$ git clone your-fork-url && cd gobarber-admin

# Criar branch com sua feature
$ git checkout -b my-feature

# Faça um commit com suas alterações
$ git commit -m 'feat: My new feature'

# Envie seu código para o repo remoto
$ git push origin my-feature

Depois que seu pull request for mesclado (merged), você poderá excluir sua branch.

📝 Licença

This project is licensed under the MIT License - see the LICENSE file for details.

---

Desenvolvido por 💜 Danilo de Sousa 👋 Veja meu linkedin