chat app client

App de bate -papo

É um aplicativo de bate -papo normal como qualquer outro aplicativo. Totalmente responsivo, Mobile First Aproach. Construa com a pilha Mern. Hospedado com netlify.

Comece

Você pode ver este projeto ao vivo aqui.

Construir com

Essas foram as principais tecnologias usadas neste projeto.

• MongoDB - Banco de dados baseado em documentos NoSQL
• ExpressJS - NodeJS Framework para aplicativos da Web e móveis
• React - Biblioteca JavaScript para criar interfaces de usuário
• Redux - um contêiner de estado previsível para aplicativos JS
• Nodejs - Javascript Runtime Engine criado no mecanismo JavaScript V8 do Chrome A que executa JavaScript fora do navegador da web

Algumas outras tecnologias são,

• SASS - Linguagem de script de pré -processador para CSS
• React-Bootstrap-A estrutura de front-end mais popular para componentes da interface do usuário
• Bootstrap - a estrutura de front -end mais popular
• Pusher - Alimentando experiências em tempo real para celular e web
• JWT - JSON Web Tokens é um método aberto e padrão da indústria 7519 para representar reivindicações com segurança entre duas partes
• Mongoose-Mongoose fornece uma solução direta e baseada em esquema para modelar seus dados de aplicativo
• Multer - pacote para arquivos de manutenção a partir de dados de formulário
• Pug - gerador de modelos para renderização do lado do servidor.

Configuração local

O cliente e o servidor possuem repositório separado e, portanto, dois servidores estarão em execução ao mesmo tempo em diferentes diretórios de nível raiz. Então, mantenha -os separadamente.

Pré -requisitos

Instale o nó, npm e git.

Configuração do servidor

 git clone https://github.com/ramankarki/chat-app-api.git

cd chat-app-api

npm install nodemon -g

npm install

Crie um arquivo config.env no root e adicione algumas variáveis ​​ENV.

 NODE_ENV=development
DB_STRING=your mongodb database string

// I have used sendgrid to send emails,
// create a sendgrid account and after your setup is done add your credentials here

SENDGRID_USERNAME=your sendgrid username
SENDGRID_PW=your sendgrid password
EMAIL_FROM=email from which you are sending mails.

JWT_SECRET=any random string you want (preferred min 32 strings)
JWT_EXPIRES_IN=expiry date for your jwt tokens
JWT_COOKIE_EXPIRES_IN=expiry date for your cookies

// I have used pusher to make this app real time
// create a pusher account and after your setup is done add your credentials here

PUSHER_APP_ID=your pusher app id
PUSHER_KEY=your pusher app key
PUSHER_SECRET_KEY=your pusher secret key
PUSHER_CLUSTER=your pusher app cluster

Agora você terminou e pode iniciar seu servidor de desenvolvimento

 npm run dev

Configuração do cliente

git clone https://github.com/ramankarki/chat-app-client.git

cd chat-app-client

npm install

Crie um arquivo .env no root e adicione uma variável Env, pois eu usei SASS.

 SASS_PATH=node_modules:src/*

Crie uma pasta de configuração Inside /Src Pasta e crie o arquivo dev.js dentro da pasta de configuração para adicionar algumas teclas secretas.

 module.exports = {
  PUSHER_KEY: "YOUR PUSHER KEY FOR CLIENT SIDE",
  PUSHER_CLUSTER: "YOUR PUSHER CLUTER",
};

Agora você também terminou para o lado do cliente e pode iniciar seu servidor de desenvolvimento do React

 npm run dev

Agora ele deve abrir a página inicial deste aplicativo de bate -papo no seu navegador padrão