Tecnologias   |    Projeto   |    Novidades   |    Layout   |    Como executar   |    Licença   |    Visite o Site

---

✨ Tecnologias

Esse projeto foi desenvolvido com as seguintes tecnologias:

• React
• TypeScript
• Firebase
• Sass

💻 Projeto

O letmeask permite você criar salas de perguntas para tirar as dúvidas da sua audiência. Os usuários podem votar nas perguntas mais interessantes e você como admin pode destacar, excluir e responder as dúvidas mais votadas em lives ou vídeos, por exemplo.

Use agora mesmo:

1. acesse o site https://letmeask-eta.vercel.app
2. faça o login e crie uma sala com o assunto desejado
3. compartilhe o link para seus público e aguarde as perguntas e responda em vídeos ou lives as mais votadas

Se preferir acesse uma sala já criada: https://letmeask-eta.vercel.app/rooms/-Md8slKExuwO6v7rVbWQ

📝 Novidades

• Procurei manter o projeto original mas deixá-lo o mais funcional possível. Segue novidades que implementei em relação ao projeto original.

  • LAYOUT

    • Adicionei Responsividade que era primordial para esse tipo de projeto, testado em chrome e opera e vários dispositivos.
    • Adicionei styles na pasta respectivo componente (facilitar manutenção)
    • Adicionei Componente de Loading
    • Adicionei Favicon
    • Adicionei Page NotFound404 customizada Rocketseat e Adaptei para TSX e SCSS
    • Adicionei MetaTags na index para exibir logo e breve descrição no compartilhamento do link.
    • Alterei Cor do Layout e utilizei Variavel de cores (Primary e Secundary, Link)

  • PWA

    • Adicionei Manifest
    • Adicionei Logos variados tamanhos
    • Adicionei ServiceWork para opção de Instalar APP

  • ROOMS

    • Mesmo componente ROOMS com ADMIN (aproveitamento de código) com mesma rota (sem redirecionamento)
    • Quando Admin Encerra a sala os usuários são desconectados automaticamente
    • Adicionei nome e avatar do author da sala
    • Adicionei instruções para compartilhar o link da sala
    • Adicionei opção de compartilhar (abre compartilhamento do dispositivo)
    • Adicionei opção de usuário fazer login direto na sala (pra quem acessar via link)
    • Adicionei like 👍 para Admin, porque não? =)
    • Usuários podem acessar por código da sala ou inserindo o link no campo ou apenas acessando o link que é o mesmo do admin

  • QUESTIONS

    • Isolei mais ainda o componente QUESTIONS de ROOMS
    • Altura máxima definida para cada question (pra evitar spammers)
    • Scrool customizado quando ultrapassa altura máxima da question
    • Icones de Opções ampliam e mudam de cor com mouse
    • Adicionei Limite de 1000 caracteres com contador para novas perguntas (evitar spammers) e receber perguntas mais objetivas.
    • Mínimo 20 caracteres com alerta recomendando enviar apenas perguntas

  • OUTROS

    • Adicionei editorconfig
    • Adicionei Prettierrc
    • Adicionei componente ASIDE para Home e NewRoom
    • Adicionei na Hospedagem Vercel

🔖 Layout

Você pode visualizar o layout do projeto através desse link É necessário ter conta no Figma para acessá-lo.

🚀 Como executar

• Instale o Node.js
• Instale o Yarn
• Clone o repositório git
• Instale as dependências com yarn
• Crie um projeto no Firebase
• Adicione as credenciais do seu firebase em .env.example
• Altere .env.example para .env.local
• Ative o firebase authentication com a autenticação do google
• Inicie o servidor com yarn start no terminal

Agora você pode acessar localhost:3000 do seu navegador.

📄 Licença

Esse projeto está sob a licença MITVeja o arquivo LICENSE para mais detalhes.

---

Feito com ♥ by DevMaicon 👋🏻 Projeto da semana NLW da Rocketseat