The project is open and any contribution is welcome!
There are many ways to contribute to the XMPP Web such as reporting bugs, suggesting features and submitting pull requests.
Before writing code / submitting pull request, please create a feature request in order to discuss your idea.
When writing some code, lint it with provided rules: npm run lint
(your pull request will not be merged until checks succeed).
Read conventional commits and write your commit messages accordingly.
You can add provided git commit-msg
hook (which execute a basic message checking) with the following command: npm run configure-git-hook
.
Application is build around 4 components:
- XmppClient.js which is responsible for low-level XMPP logic (connect, parse stanza, ...) it relies on xmpp.js,
- XmppSocket.js which is responsible for application level XMPP logic,
- Pinia store which, as its name implies, store the data (contacts, rooms, messages, ...) for the entire application (Vue components read data through it),
- Vue components which include display and interaction logic of their own.
This app is build using Vue 3, you can found useful information on documentation.
The UI part is using Oruga library.
In order to contribute to this application, you need to:
- Fork the repo and clone it in folder of your choice (in example
/var/www/xmpp-web
):git clone https://github.com/<your_user>/xmpp-web.git /var/www/xmpp-web
- Access the frontend folder in a shell
cd /var/www/xmpp-web
for next steps (2a or 2b, then 3)
- install prerequisite:
- Node.js
- npm
npm install npm@latest -g
- Build the project
npm install
and wait for the downloads - Start the vite server
npm run dev
If you are using Docker, you can use the Dockerfile-dev to avoid installing Node.js on your local computer:
-
Build dev image:
docker build \ -f docs/docker/Dockerfile-dev \ -t nioc/xmpp-web:node-alpine-dev \ .
-
Run run vite server in container:
docker run -it \ -p 3000:3000 \ --rm \ -v "$(pwd)":/app \ -v "/app/node_modules" \ --name xmpp-web-1 \ nioc/xmpp-web:node-alpine-dev
- Open your browser on http://localhost:3000 (vite handle hot reload after changes)
- Edit
public/local.js
according to your XMPP server configuration (you can add it in.gitignore
file to avoid to restore it before commit) - Edit the code (I suggest using Visual Studio Code with Vetur)
- When you are satisfied with your work, run the linter
npm run lint
- Create a dedicated branch with explicit feature name
git checkout -b feat#123-my_awesome_feature
- Commit your changes (with a detailled message, using conventional commits):
git commit -am 'feat(guest): Add an awesome feature for guest' -m 'Close #123'
- Push to the branch:
git push origin feat#123-my_awesome_feature
- Submit a pull request
You can find some docker XMPP server setups in this folder.