DEV Community

Cover image for Web Desktop Environment in Go
Toby Chui
Toby Chui

Posted on

Web Desktop Environment in Go

For the last 3 - 4 years, I have been working on a relatively large project called the "ArOZ Online System" (or arozos since v1.0), which is a web desktop environment for everything. I used to write it in PHP5, then moved to PHP7 and finally Go in early this year.

Just last week, I (finally) released the arozos v0.510 preview edition on Github. And I think it is time for me to share it to everyone who love to have a cloud based working environment like I do.

Alt Text
(A dark theme screenshot, arozos v0.510)

GitHub logo tobychui / arozos

General purposed Web Desktop Operating Platform / OS for Raspberry Pis, Now written in Go!

Image

IMPORTANT NOTES

The current arozos is still under intense development. System structure might change at any time. Please only develop on the current existing ArOZ Gateway Interface (AGI) JavaScript Interface or standard HTML webapps with ao_module.js endpoints.

Features

User Interface

  • Web Desktop Interface (Better than Synology DSM)
  • Ubuntu remix Windows style startup menu and task bars
  • Clean and easy to use File Manager (Support drag drop, upload etc)
  • Simplistic System Setting Menu
  • No-bull-shit module naming scheme

Networking

  • FTP Server
  • WebDAV Server
  • UPnP Port Forwarding
  • Samba (Supported via 3rd party sub-services)
  • WiFi Management (Support wpa_supplicant for Rpi or nmcli for Armbian)

File / Disk Management

  • Mount / Format Disk Utilities (support NTFS, EXT4 and more!)
  • Virtual File System Architecture
  • File Sharing (Similar to Google Drive)
  • Basic File Operations with Real-time Progress (Copy / Cut / Paste / New File or Folder etc)

Others

  • Require as little as 512MB system memory and…

🖥️ What is Web Desktop Environment?

Web Desktop Environment, as its name suggested, is a desktop interface (or front-end as the web developers call it) that run on your web browser. What is interesting about this kind of interface is that the environment is based on the web infrastructure, aka as soon as you have a laptop or devices that can connect to the internet, you can access your desktop anywhere you like.

Compare to a traditional way of using your computer which you need to sit in front of your monitor, a web desktop environment provides you the freedom to "work anywhere" with internet access.

🖼️ Screenshots

Alt Text
Alt Text
Alt Text
Alt Text
Alt Text

📽️ Demo Video

Showcasing basic Desktop, File Explorer, Audio / Video WebApps and my favorite WebApp - FFmpeg Factory and NotepadA (based on Visual Studio Code's Editor)

❔ Why develop a Web Desktop yourself?

Originally, I was not planning to develop a web desktop system. I was just looking for a solution to store my music and video collections. And I also love to have a Synology but couldn't afford one.

Finally, I decided to write myself a PHP script to get the job done. Due to other needs in my university studies as a CS student, I added more and more features to the original php scripts like notepads and a web based code editor. When I notice that I am adding too many things to my system, it already become a web desktop environment with glue code everywhere 😱😱😱.

And you can still find the "php web desktop system" under my github repo (Beta LTS branch)
Alt Text
https://github.com/tobychui/arozos/tree/Beta_LTS

No worry, the 1.0 version will rewritten everything and it will no-longer be spaghetti 😉.

💾 Lets get into the technical stuffs

The arozos is made using many complex levels of abstract layers and many custom developed modules. If you try to visualize the relationship between different modules into a diagram of some kind, it will look like this.
Alt Text

There are too much details here but I want to share a few implementations related to this system that might interest you.

Hot-swappable Reverse Proxy as an WebApp

Many of the Web Desktop Environment in the open source world requires specially written WebApps to be integrated into their system before they can be used. However, the ecosystem for Web Desktop system are so small and close that it is not possible for any web desktop open source projects to require their developers to make a "special version of the WebApp that compatible with the Web Desktop system". Namely OS.js and X-WebDesktop

Making use of configurable reverse proxy system, it is much easier to integrate new WebApps into the Web Desktop environment. What you need is a binary of the other service and a bash script that convert the arguments passed from the Web Desktop System exec command to the services' port argument.
Alt Text

Example Reverse Proxy WebApp: AriaNg
Alt Text

JavaScript Virtual Machine & Go func()

Another feature that might interest you is what I called the "AGI" - ArOZ Gateway Interface. It is actually a JavaScript Virtual Machine embedded into the arozos core binary and allow WebApp modules to access file system / permission system functions written in Go through AJAX request.
Alt Text

The system is powered by the Otto JavaScript interpreter and a custom developed arozos virtual path systems. These two combines created a virtual-environment for WebApp's code and prevent WebApps from crashing the web desktop system.

Here is an short piece of AGI code for reference. It basically JavaScript with custom libraries.

//UnitTest/backend/filelib.glob.js
console.log("Listing Music Files on Desktop");
requirelib("filelib");
var fileList = filelib.glob("user:/Desktop/*.mp3");
sendJSONResp(JSON.stringify(fileList));
Enter fullscreen mode Exit fullscreen mode

🤔 Web Desktop Environment and Mobile?

In recent years, more and more people are replacing their laptop with mobile devices. In my opinion, web desktop is perfectly fine to run on mobile devices like smartphone, what's needed is a bit UI updates and optimization.

Here are some work-in-progress image of the arozos web desktop for mobile (PWA supported!)

Alt Text
Alt Text
Alt Text
Alt Text
Alt Text

💡 Ideas and Comments?

I have been working on this project alone for more than 3 years now and it will be nice to hear any kind of comments or idea from you guys. It will be great if you can comment and start some discussion below, thanks :))))

Want to know more?

If you are really interested into this project, feel free to check out the project in https://github.com/tobychui/arozos/

GitHub logo tobychui / arozos

General purposed Web Desktop Operating Platform / OS for Raspberry Pis, Now written in Go!

Image

IMPORTANT NOTES

The current arozos is still under intense development. System structure might change at any time. Please only develop on the current existing ArOZ Gateway Interface (AGI) JavaScript Interface or standard HTML webapps with ao_module.js endpoints.

Features

User Interface

  • Web Desktop Interface (Better than Synology DSM)
  • Ubuntu remix Windows style startup menu and task bars
  • Clean and easy to use File Manager (Support drag drop, upload etc)
  • Simplistic System Setting Menu
  • No-bull-shit module naming scheme

Networking

  • FTP Server
  • WebDAV Server
  • UPnP Port Forwarding
  • Samba (Supported via 3rd party sub-services)
  • WiFi Management (Support wpa_supplicant for Rpi or nmcli for Armbian)

File / Disk Management

  • Mount / Format Disk Utilities (support NTFS, EXT4 and more!)
  • Virtual File System Architecture
  • File Sharing (Similar to Google Drive)
  • Basic File Operations with Real-time Progress (Copy / Cut / Paste / New File or Folder etc)

Others

  • Require as little as 512MB system memory and…

Oldest comments (4)

Collapse
 
ndiuel profile image
ndiuel

Wow bro, this is massive stuff. I once had the idea to develop a web os, it seemed so complex I got scared..Massive stuff bro well done

Collapse
 
tobychui profile image
Toby Chui

Thanks :)))

Collapse
 
souris profile image
Souris

this is a very interesting project, I hope it's not too heavy.

Collapse
 
tobychui profile image
Toby Chui

Tested to run perfectly on Raspberry Pi 4B 2G version :D