mern chart app

Aplikasi obrolan

Ini adalah aplikasi web obrolan normal seperti aplikasi lainnya. Sepenuhnya responsif, lompatan pertama seluler. Dibangun dengan tumpukan utama. Di -host dengan Netlify.

Mulai

Anda dapat melihat proyek ini langsung di sini.

Membangun dengan

Ini adalah teknologi utama yang digunakan dalam proyek ini.

• MongoDB - Database Berbasis Dokumen NoSQL
• ExpressJS - Kerangka kerja NodeJS untuk aplikasi web dan seluler
• Bereaksi - Perpustakaan JavaScript untuk Membangun Antarmuka Pengguna
• Redux - wadah negara yang dapat diprediksi untuk aplikasi JS
• NODEJS - Mesin Runtime Javascript yang dibangun di atas mesin JavaScript V8 Chrome yang menjalankan JavaScript di luar browser web

Beberapa teknologi lainnya adalah,

• Sass - bahasa skrip preprosesor untuk CSS
• React-Bootstrap-Kerangka kerja front-end paling populer untuk komponen UI
• Bootstrap - Kerangka kerja front -end paling populer
• Pusher - Menggerakkan pengalaman realtime untuk seluler dan web
• JWT - JSON Web Token adalah metode RFC 7519 standar terbuka untuk mewakili klaim dengan aman antara dua pihak
• Mongoose-Mongoose menyediakan solusi langsung berbasis skema untuk memodelkan data aplikasi Anda
• Multer - Paket untuk file handeling dari data formulir
• PUG - Template Generator untuk rendering sisi server.

Pengaturan lokal

Klien dan server memiliki repositori yang terpisah dan oleh karena itu dua server akan berjalan pada saat yang sama di direktori level root yang berbeda. Jadi, simpan secara terpisah.

Prasyarat

Instal Node, NPM, dan GIT.

Pengaturan Server

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

cd chat-app-api

npm install nodemon -g

npm install

Buat file config.env di root dan tambahkan beberapa variabel 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

Sekarang Anda sudah selesai dan dapat memulai server pengembangan Anda

 npm run dev

Pengaturan Klien

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

cd chat-app-client

npm install

Buat file .env di root dan tambahkan variabel env, karena saya telah menggunakan sass.

 SASS_PATH=node_modules:src/*

Buat folder konfigurasi di dalam folder /src dan buat file dev.js di dalam folder konfigurasi untuk menambahkan beberapa tombol rahasia.

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

Sekarang Anda selesai untuk sisi klien juga dan dapat memulai server pengembangan reaksi Anda

 npm run dev

Sekarang harus membuka beranda aplikasi obrolan ini di browser default Anda