Git Product home page Git Product logo

js-expert's Introduction

JS Expert III 🖥

GitHub top language GitHub last commit

SobreJS Expert IIIInstalaçãoTecnologiasAutor

Sobre

Projeto desenvolvido durante a semana JS Expert 03 cujo objetivo foi criar um chat de terminal.

Wallpaper

JS Expert III

Chat de CLI em real-time construído com Javascript durante evento JS Expert III.

Durante essa semana entendemos na pratica como construir CLI utilizando Javascript. Para isso utilizamos um projeto prático onde construímos um chat de linha de comando.

Para ver o app em funcionamento precisamos subir o servidor e logo após conectarmos como clientes em instâncias de terminal diferentes.

No arquivos package.json da pasta client, na seção scripts temos os usuários previamente cadastrados para executarmos nossa aplicação. Você pode alterar as salas que os usuários serão direcionados e alterar os nomes também, como preferir.

Vamos agora ver como o projeto funciona com o GIf abaixo:

Demonstração do app

O primeiro terminal é o terminal que inicializa o servidor e recebe os logs de usuários que conectaram e desconectaram da aplicação. No terminal a direita do server em execução, 'logamos' na aplicação como user01 e nos terminais seguintes como user02 e user03.

Em cada instância do chat teremos três colunas e o campo para o usuário digitar sua mensagem, onde da esquerda para a direita representam:

  • Todas as mensagens enviadas na sala pelo o usuário logado e pelos outros usuários presente na sala.
  • Logs de atividades: Indicará quando usuários conectarem e desconectarem da sala atual.
  • Usuário atualmente logados e conectados na sala atual.

Instalação

Antes de começar, você vai precisar ter instalado em sua máquina as seguintes ferramentas: Git e Node.js. Além disso é bom ter um editor para trabalhar com o código como VSCode.

🎲 Rodando o servidor

# Clone este repositório
$ git clone [email protected]:MrRioja/js-expert.git

# Acesse a pasta do projeto no terminal/cmd
$ cd js-expert

# Vá para a pasta server
$ cd hacker-chat/server

# Instale as dependências
$ npm install
# Caso prefira usar o Yarn execute o comando abaixo
$ yarn

# Execute a aplicação em modo de desenvolvimento
$ npm run dev
# Caso prefira usar o Yarn execute o comando abaixo
$ yarn dev

# O servidor iniciará na porta 9898 ou na porta definida no arquivo .env na variável PORT - acesse <http://localhost:9898>

🖥 Rodando a CLI

# Clone este repositório
$ git clone [email protected]:MrRioja/js-expert.git

# Acesse a pasta do projeto no terminal/cmd
$ cd js-expert

# Vá para a pasta client
$ cd hacker-chat/client

# Instale as dependências
$ npm install
# Caso prefira usar o Yarn execute o comando abaixo
$ yarn

# Execute a aplicação como um usuário e acesse o chat pela CLI
$ npm run user01
# Caso prefira usar o Yarn execute o comando abaixo
$ yarn user01

# Na seção script do package.json disponível na raiz da pasta client temos os usuários possíveis, bem como seus nomes de usuário cadastrados no chat e as salas as quais eles serão adicionados

Tecnologias

My Skills

Autor

Luiz Rioja

Backend Developer

LinkedIn GitHub Gmail WhatsApp Skype

js-expert's People

Contributors

mrrioja avatar

Watchers

 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.