preface
Vue2 telegram imitation project I have learned most of the VUE knowledge used, can be said to cover most of the knowledge of VUE and VUex, through this project to have a deeper understanding of VUE and more flexible application.
Source code address: github.com/xxydrr/vue-… Click to view demo (PC browser preview please switch to mobile phone preview mode at the same time it is recommended to refresh the preview)
Scan the qr code below on the mobile terminal
Qr code view
Technology stack
Scaffolding tools [email protected]
Vue + VUE-Router + VUex + SCSS +mint UI + MUI + ES6
Other: better-scroll + animation.css
- Realize the function
- The page displays animated interaction
- The information sent
- Group function
- Deleting contacts
- Searching for Contacts
- Modify some user information
- Badge component responsive update
- Message Do not Disturb
- Continue to improve…
Summary 1, Telegram latest edition has a small change updated part of the setting edit personal information style time is limited I will not change over.
2. The text chat function is already displayed, and emoji function should be added in the future, especially GIF.
3. Why did I add extra MUI? I added MUI purely to practice how to use this type of UI library, because it is similar to how BOOTstrap is used.
4. This personal project can be used as an example of how vuex is well used because most of the common knowledge of VUex is used.
5. This project is basically realized by using the third-party library of plug-ins, and I have more profound experience in using the third-party library of plug-ins.
6. In the later stage of the project, axios+ Mock or AXIos + Node.js will be added to improve the project. Stay tuned!!
Partial screen shots
Contact screen
The dialogue interface
Personal Settings
