Updated the development setup description

canary
WolverinDEV 2020-04-18 22:30:02 +02:00
parent 01f0bff142
commit e641cef629
2 changed files with 32 additions and 28 deletions

View File

@ -9,6 +9,7 @@
- Improved context menu subcontainer selection - Improved context menu subcontainer selection
- Fixed client channel permission tab within the permission editor (previously you've been kick from the server) - Fixed client channel permission tab within the permission editor (previously you've been kick from the server)
- Added the ability to collapse/expend the channel tree - Added the ability to collapse/expend the channel tree
- Removed PHP dependencies from the project. PHP isn't needed anymore
* **11.04.20** * **11.04.20**
- Only show the host message when its not empty - Only show the host message when its not empty

View File

@ -2,38 +2,42 @@
## 1.0 Requirements ## 1.0 Requirements
The following tools or applications are required to develop the web client: The following tools or applications are required to develop the web client:
- [1.1 IDE](#11-ide) - [1.1 IDE](#11-ide)
- [1.2 PHP](#12-php) - [1.2 NodeJS](#12-nodejs)
- [1.3 NodeJS](#13-nodejs) - [1.2.2 NPM](#122-npm)
- [1.3.2 NPM](#132-npm) - [1.3 Git bash](#13-git-bash)
- [1.4 Git bash](#14-git-bash) - [1.4 Docker](#14-docker)
### 1.1 IDE ### 1.1 IDE
It does not matter which IDE you use, It does not matter which IDE you use,
you could even use a command line text editor for developing. you could even use a command line text editor for developing.
### 1.2 PHP ### 1.2 NodeJS
For having a test environment you require an installation of PHP 5 or grater.
You could just download PHP from [here](https://windows.php.net/download#php-7.4).
Note:
`php.exe` must be accessible via the command line.
This means you'll have to add the `bin` folder to your `PATH` variable.
### 1.3 NodeJS
For building and serving you require `nodejs` grater than 8. For building and serving you require `nodejs` grater than 8.
Nodejs is easily downloadable from [here](). Nodejs is easily downloadable from [here]().
Ensure you've added `node.exe` to the environment path! Ensure you've added `node.exe` to the environment path!
### 1.3.2 NPM ### 1.2.2 NPM
Normally NPM already comes with the NodeJS installer. Normally NPM already comes with the NodeJS installer.
So you don't really have to worry about it. So you don't really have to worry about it.
NPM min 6.X is required to develop this project. NPM min 6.X is required to develop this project.
With NPM you could easily download all required dependencies by just typing `npm install`. With NPM you could easily download all required dependencies by just typing `npm install`.
IMPORTANT: NPM must be available within the PATH environment variable! IMPORTANT: NPM must be available within the PATH environment variable!
### 1.4 Git bash ### 1.3 Git bash
For using the `.sh` build scripts you require Git Bash. For using the `.sh` build scripts you require Git Bash.
A minimum of 4.2 is recommend, but in general every modern version should work. A minimum of 4.2 is recommend, but in general every modern version should work.
### 1.4 Docker
For building the native scripts you need docker.
Just install docker from [docker.com](https://docs.docker.com).
Attention: If you're having Windows make sure you're running linux containers!
In order to setup the later required containers, just execute these commands:
Make sure you're within the web source directory! If not replace the `$(pwd)` the the path the web client is located at
```shell script
docker run -dit --name emscripten -v "$(pwd)":"/src/" trzeci/emscripten:sdk-incoming-64bit bash
```
## 2.0 Project initialization ## 2.0 Project initialization
### 2.1 Cloning the WebClient ### 2.1 Cloning the WebClient
@ -50,26 +54,18 @@ git submodule update --init
### 2.2 Setting up native scripts ### 2.2 Setting up native scripts
TeaWeb uses the Opus audio codec. Because almost no browser supports it out of the box TeaWeb uses the Opus audio codec. Because almost no browser supports it out of the box
we've to implement our own de/encoder. For this we're using `emscripten` to compile the codec. we've to implement our own de/encoder. For this we're using `emscripten` to compile the codec.
Because this is a quite time consuming task we already offer prebuild javascript and wasm files. In order to build the required javascript and wasm files just executing this in your git bash:
So we just need to download them. Just execute the `download_compiled_files.sh` shell script within the `asm` folder.
```shell script ```shell script
./asm/download_compiled_files.sh docker exec -it emscripten bash -c 'web/native-codec/build.sh'
``` ```
### 2.3 Initializing NPM ### 2.3 Initializing NPM
To download all required packages simply type: To download all required packages simply type:
```shell script ```shell script
npm install npm install
``` ```
### 2.4 Initial client compilation ### 2.4 You're ready to go and start developing
Before you could start ahead with developing you've to compile everything.
Just execute the `web_build.sh` script:
```shell script
./scripts/web_build.sh development
```
### 2.5 Starting the development environment
To start the development environment which automatically compiles all your changed To start the development environment which automatically compiles all your changed
scripts and style sheets you simply have to execute: scripts and style sheets you simply have to execute:
```shell script ```shell script
@ -78,5 +74,12 @@ npm start web
This will also spin up a temporary web server where you could test out your newest changes. This will also spin up a temporary web server where you could test out your newest changes.
The server will by default listen on `http://localhost:8081` The server will by default listen on `http://localhost:8081`
### 2.6 You're ready ### 2.5 Using your UI within the TeaClient
Now you're ready to start ahead and implement your own great ideas. An explanation how this works will come later. Stay tuned!
### 2.6 Generate a release package
In order to build your own TeaWeb-Package just execute the `scripts/build.sh` script.
```shell script
./scripts/build.sh web rel
```
You could also create a debug packaged just by replacing `rel` with `dev`.