diff --git a/content/dev/build/web/_index.en.md b/content/dev/build/web/_index.en.md index ea346b8..3df6ee6 100644 --- a/content/dev/build/web/_index.en.md +++ b/content/dev/build/web/_index.en.md @@ -5,8 +5,7 @@ weight: 23 ## How to build on Linux - -Run below on Linux or Mac (works on Windows too, however you may need to slightly modify some commands, *e.g.* change `wget` to `curl.exe -O`): +Run below on Linux or Mac (works on Windows too, however you may need to slightly modify some commands, e.g. change `wget` to `curl.exe -O`): ```sh git clone https://github.com/JelleBuning/rustdesk.git @@ -14,12 +13,12 @@ cd rustdesk git switch fix_build cd flutter/web/js -# install protoc first http://google.github.io/proto-lens/installing-protoc.html +# Install protoc first, see: https://google.github.io/proto-lens/installing-protoc.html npm install ts-proto -# only works with vite<=2.8, see: https://github.com/vitejs/vite/blob/main/docs/guide/build.md#chunking-strategy +# Only works with vite <= 2.8, see: https://github.com/vitejs/vite/blob/main/docs/guide/build.md#chunking-strategy npm install vite@2.8 -# required for yarn build +# Required for yarn build npm install yarn -g npm install typescript -g npm install protoc -g @@ -28,9 +27,9 @@ yarn build cd .. -# about details of yuv converter, check this https://github.com/rustdesk/rustdesk/issues/364#issuecomment-1023562050 +# About details of yuv converter, check this https://github.com/rustdesk/rustdesk/issues/364#issuecomment-1023562050 wget https://github.com/rustdesk/doc.rustdesk.com/releases/download/console/web_deps.tar.gz -# decompress to the current directory +# Decompress to the current directory tar xzf web_deps.tar.gz cd .. @@ -43,31 +42,33 @@ flutter run -d chrome ## How to build with Docker -Run below on Linux or Mac -- Begin by installing fultter for [Linux](https://docs.flutter.dev/get-started/install/linux#install-flutter-manually) or [MacOS](https://docs.flutter.dev/get-started/install/macos) -- Setup the flutter app locally +Run below on Linux or Mac: +- Begin by installing flutter for [Linux](https://docs.flutter.dev/get-started/install/linux#install-flutter-manually) or [macOS](https://docs.flutter.dev/get-started/install/macos) +- Setup the flutter app locally: + ```sh git clone https://github.com/JelleBuning/rustdesk.git cd rustdesk git switch fix_build cd flutter/web/js -# install protoc first http://google.github.io/proto-lens/installing-protoc.html +# Install protoc first, see: https://google.github.io/proto-lens/installing-protoc.html npm install ts-proto -# only works with vite<=2.8, see: https://github.com/vitejs/vite/blob/main/docs/guide/build.md#chunking-strategy +# Only works with vite <= 2.8, see: https://github.com/vitejs/vite/blob/main/docs/guide/build.md#chunking-strategy npm install vite@2.8 -# required for yarn build +# Required for yarn build npm install yarn -g npm install typescript -g npm install protoc -g yarn build ``` + - Create a `Dockerfile` with the following content under `flutter` directory: ```Dockerfile -# Install Operating system and dependencies +# Install operating system and dependencies FROM ubuntu:20.04 ENV DEBIAN_FRONTEND=noninteractive @@ -76,7 +77,7 @@ RUN apt-get update RUN apt-get install -y curl git wget unzip libgconf-2-4 gdb libstdc++6 libglu1-mesa fonts-droid-fallback lib32stdc++6 python3 clang cmake ninja-build pkg-config libgtk-3-dev RUN apt-get clean -# download Flutter SDK from Flutter Github repo +# Download Flutter SDK from Flutter Github repo RUN git clone https://github.com/flutter/flutter.git /usr/local/flutter # Set flutter environment path @@ -93,7 +94,7 @@ RUN flutter config --enable-web # Copy files to container and build RUN mkdir /app/ # I was unable to build web app from dockerfile -# so instead I built it locally and commented the "flutter build web" in this file +# So instead I built it locally and commented the "flutter build web" in this file COPY . /app/ WORKDIR /app/ # RUN flutter build web @@ -101,13 +102,15 @@ WORKDIR /app/ # Record the exposed port EXPOSE 5000 -# make server startup script executable and start the web server +# Make server startup script executable and start the web server RUN ["chmod", "+x", "/app/server/server.sh"] ENTRYPOINT [ "/app/server/server.sh"] ``` + - Create `server` directory under `flutter` - Create a `server.sh` file with the following content under `flutter/server` directory: + ```sh #!/bin/bash @@ -118,31 +121,42 @@ PORT=5000 echo 'preparing port' $PORT '...' fuser -k 5000/tcp -# switch directories +# Switch directory cd build/web/ # Start the server echo 'Server starting on port' $PORT '...' python3 -m http.server $PORT ``` -- Build the docker image + +- Build the docker image: + ```sh docker build -t rustdesk-web-client . ``` -- Run the docker image + +- Run the docker image: + ```sh docker run -p 5000:5000 rustdesk-web-client ``` + - Open your browser and go to `localhost:5000` to see the web app -### Rustdesk Web Client using existing Docker image +### RustDesk Web Client using existing Docker image + If you do not want to build the docker image yourself, you can use the image I built and uploaded to [Docker Hub](https://hub.docker.com/r/keyurbhole/flutter_web_desk) -- Pull the image + +- Pull the image: + ```sh docker pull keyurbhole/flutter_web_desk ``` -- Run the image + +- Run the image: + ```sh docker run -p 5000:5000 keyurbhole/flutter_web_desk ``` -- Open your browser and go to `localhost:5000` to see the web app \ No newline at end of file + +- Open your browser and go to `localhost:5000` to see the web app