Dsx_wechat
- Ini adalah klien WeChat tiruan Vue
- Alamat proyek Github: https://github.com/GGwujun/Dsx_wechat
- Aplikasi Web yang meniru WeChat, memiliki obrolan nyata dan fungsi lainnya, dan diimplementasikan dengan memisahkan bagian depan dan belakang. Front-end didasarkan pada kerangka Vue 2.0, back-end didasarkan pada Node.js + Express + MongoDB, dan fungsi obrolan serta fungsi menambahkan teman diimplementasikan melalui Websocket.
- Selamat mengikuti akun publik saya:
- Tumpukan teknologi front-end: vue 2.0, vue-cli, vuex, vue-router, webpack 2.x, pug, sass, babel, dll.;
- Tumpukan teknologi back-end: Node.js, Express, sesi ekspres, WebSocket(ws), MongoDB, luwak, ES6, dll.
Pendahuluan
- Saya telah mempelajari Vue selama beberapa waktu, tetapi perusahaan tidak menggunakan Vue. Untuk mempraktikkan Vue, saya telah melakukan beberapa proyek pribadi, besar dan kecil, dan meniru WeChat versi PC. pengalaman di sisi PC kurang bagus, Anda harus login lagi setelah menyegarkan sebelum dapat mengirim pesan ke teman.
- Yang paling banyak digunakan di perusahaan ini adalah ionic, kerangka UI parsial yang berfokus pada aplikasi web seluler, yang juga menggunakan kerangka kerja AngularJS. Cordova digunakan untuk pengemasan, dan kemudian saya berpikir untuk menggunakan Vue untuk membuat klien WeChat dan mengemasnya dengan Cordova.
- Saat ini, perangkat keras ponsel sudah sangat bagus. Pengalaman aplikasi kemasan dasar Cordova masih sangat lancar. Aplikasi satu halaman dengan Vue pada dasarnya dapat menjadi aplikasi asli tanpa perbedaan apa pun.
- Bagian front-end dibuat dan dikemas menggunakan vue-cli, dan diberi kode dengan bucket keluarga vue (vue, vuex, vue-router)
- Gunakan aksio untuk membuat permintaan sumber daya
- Backend dikembangkan menggunakan arsitektur ekspres Node.js. Saat ini antarmukanya tidak banyak, tetapi akan terus diperbarui.
pelayan
- Dikembangkan menggunakan Nodejs + Express
- Sadarilah registrasi, login, logout, lihat teman, beranda pribadi, tambah teman, obrolan satu lawan satu, dan obrolan grup
- Alamat proyek Github: https://github.com/GGwujun/chatserve
Pratinjau
Unduh apk
Klik di sini untuk mengunduh dan menginstal apk. Saat ini, apk hanya mendukung sistem Android (5.0 atau lebih tinggi) (karena proyek masih dalam pengembangan, beberapa fungsi mungkin bukan yang terbaru atau untuk sementara tidak tersedia).
Pengguna baru harus masuk dengan mendaftarkan akun, dan pengguna terdaftar dapat langsung login. Saat ini, Akun tidak mendukung pesan offline, juga tidak mendukung penambahan pengguna offline sebagai teman (fungsi terkait pesan instan harus memastikan bahwa pihak lain sedang online)
penggunaan lokal
Dengan asumsi Anda telah menginstal Node.js
, kloning repositori langsung ke area lokal Anda, instal semua plug-in dan mulai server. Disarankan untuk menggunakan Google Chrome dan melihatnya dalam mode debugging seluler (http://localhost:8808/).
# clone
git clone https://github.com/GGwujun/Dsx_wechat.git
# 进入到目录 安装所有依赖包 国内建议使用cnpm
cd Dsx_wechat
npm install
# 开启本地服务器 监听8808端口
npm run dev
Kiat
- Tidak mungkin untuk mendaftar atau memperoleh data karena antarmuka backend yang saya konfigurasikan adalah server saya. Anda dapat mengunduh sendiri kode backend dan menyebarkannya ke server Anda sendiri, tetapi secara umum kode tersebut dapat diakses.
- Jika Anda ingin membangun server sendiri, selain menginstal dependensi terkait node, Anda juga perlu menginstal database MongoDB.
fungsi
Proyek ini telah mengimplementasikan dukungan server backend dengan fungsi obrolan nyata. Silakan transfer bagian backend di sini
- Gaya desain antarmuka klien WeChat imitasi tinggi, dengan animasi push, pop, modal, pemberhentian, dan animasi transisi lainnya;
- Fungsi registrasi, login dan logout dapat mengingat status login dan menghindari login berulang kali;
- Fungsi ruang obrolan, semua pengguna online dapat melakukan obrolan grup;
- Untuk menambah teman, Anda harus memastikan pihak lain sedang online sebelum Anda dapat menambahkan teman dengan benar;
- Pengguna dapat mengobrol secara pribadi. Saat ini, pihak lain harus online sebelum mereka dapat mengobrol secara normal;
- Saat ini hanya obrolan teks saja yang didukung.
Lebih banyak fitur untuk dilanjutkan...
Jika menurut Anda proyek ini bagus, silakan bintangi dan bagikan!