Resultado Visual Esperado:

💻 Como rodar o projeto:

Após clonar o projeto, acesse ele via seu terminal e execute os comandos:

yarn 

yarn start

O app estará disponível no seu browser pelo endereço http://localhost:3000

Lembrando que será necessário criar uma conta no Firebase e um projeto para disponibilizar um Realtime Database.

Um exemplo de regras compatíveis para o Realtime Database seria:

{
  "rules": {
   	"rooms": {
      ".read": false,
      ".write": "auth != null",
      "$roomId": {
        ".read": true,
        ".write": "auth != null && (!data.exists() || data.child('authorId').val() == auth.id)",
          "questions": {
            ".read": true,
              ".write": "auth != null && (!data.exists() || data.parent().child('authorId').val() == auth.id)",
                "likes":{
                  ".read": true,
                    ".write": "auth != null && (!data.exists() || data.child('authorId').val() == auth.id)",
                }
          }
      }
    }
  }
}

O arquivo firebase.ts também deverá ser modificado e substituido com as configurações do seu projeto no firebase ou deverá ser criado o .env.local no projeto conforme o exemplo abaixo:

# Firebase 
REACT_APP_API_KEY="FIREBASE CONFIG AQUI"
REACT_APP_AUTH_DOMAIN="FIREBASE CONFIG AQUI"
REACT_APP_DATABASE_URL="FIREBASE CONFIG AQUI"
REACT_APP_PROJECT_ID="FIREBASE CONFIG AQUI"
REACT_APP_STORAGE_BUCKET="FIREBASE CONFIG AQUI"
REACT_APP_MESSAGING_SENDER_ID="FIREBASE CONFIG AQUI"
REACT_APP_APP_ID="FIREBASE CONFIG AQUI"

🛠 Tecnologias:

React.js • TypeScript • Firebase • Sass •

Feito com 💜 por Évelin Marques