Giter Club home page Giter Club logo

001-chatbox's Introduction

001-chatbox


Buenas! Esse repositório tem uma história interessante por trás. Mas o tldr; é o seguinte:

Comecei a aprender JavaScript em novembro/21; descobri um curso gratuito com 2 meses de duração mantido por empresas de tecnologia que ficavam de olho nos alunos e alunas; O primeiro módulo começaria no fim de jan./22; Eu me inscrevi; No início do curso, o professor deu um spoiler do final: seremos capazes de criar uma página de site com HTML, CSS e JS em que há um pseudo-chat com algumas funcionalidades.

Assim, do dia 1, eu decidi reproduzir o programa por conta própria.

O plano era aprender em paralelo o que fosse necessário e ter o chatbox pronto antes do final do curso - sem copiar código que eu não entenda.


Funcionalidades exigidas

  • Página única com duas colunas de conteúdo:
    • À esquerda: título e criação de usuário
    • À direita: chatbox
  • Criação de usuário:
    • Espaço para inserir o username
    • Seletor de cor para ser exibida no chat
    • Botão de enviar
  • Chatbox:
    • Seletor de usuário
    • Caixa de texto para enviar mensagens
    • Área de exibição das mensagens enviadas
      • Mensagem: usuário com a cor + texto;
      • Exibição em coluna, mais recente abaixo;

Funcionalidades extras (yay)

Coisas que eu gostaria de adicionar

  • Responsividade
  • Página bonita com paleta de cores legal
  • Pesquisa de mensagens
    • Por palavra
    • Por usuário
  • Ao invés de duas colunas fazer uma coluna só
    • Primeiro aparecer a criação de usuário
    • Depois o chatbox (com botão de voltar)
    • Fazer tudo numa única página via JavaScript

Deadline de conclusão: 01 GAIAN* 2022

*data revista baseado em outras prioridades de estudo


Changelog

2022\E\25 - Criação de Usuários ++ add: branch para ajustar a criação de usuários e a organização dos dados nos objetos ++ add: objetos "Message" possuem timestamp, carregam nome do autor e corpo de texto ++ add: Class Users e Class Message são usadas pra fabricar novos usuários e novas mensagens e passar ambos para o objeto "users" e para o log em "chatbox". ++ add: objeto chatbox para conter log de mensagens a serem exibidas (ainda não exibe a partir do log)

  • UPCOMING:
  • Ajustes na forma de exibição das mensagens no chatbox para exibir o log[]

2022\B\11 - Início dos logs +- mudança na descrição do repositório; ++ adição: "Diagrama Chatbox.drawio" // Para ajudar a pensar a organização da informação de usuários e mensagens;

001-chatbox's People

Contributors

cpt-westphalen avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.