Over a million developers have joined DZone.
{{announcement.body}}
{{announcement.title}}

Creating a Web Operating System in C#

DZone's Guide to

Creating a Web Operating System in C#

In this article, developer describes the process of creating an open source web operating system and a language for it, and what it can be used for.

· Web Dev Zone ·
Free Resource

Deploying code to production can be filled with uncertainty. Reduce the risks, and deploy earlier and more often. Download this free guide to learn more. Brought to you in partnership with Rollbar.

Maybe you're wondering what a "web operating system" is? In order to explain that, we must take a look at a traditional operating system's primary functions. The main task of an operating system is to provide a uniform way to access the underlying hardware, with the goal of simplifying the creation of applications. Hence, the "kernel" in an operating system, becomes an API which the developer can consume, to transparently access the underlying hardware of the machine. This is often referred to as "HAL," implying "Hardware Abstraction Layer."

An operating system also contains other functions - but the primary goal is to simplify the creation of apps for the end application developer, by abstracting away the "boring stuff," and making everything easier to use from an application development point of view.

With the above in mind, a "web operating system" is arguably already defined, and its definition becomes the following; "A Web Operating System's primary goal is to make it easier to create WEB applications." Hence, the line between a Web Operating System, and a Web Application Framework, arguably becomes blurry, and the two can often be used (almost) as synonyms for each other.

I have created a Web Operating System. Its name is Phosphorus Five, and it is open source. And in fact, it's contained in a simple Open Source ZIP file, allowing you to run it through, for instance, Visual Studio or Mono Develop, in less than 5 minutes. This is because, arguably, it is simply a bunch of libraries, combined into a Framework, running on top of ASP.NET or Mono. Hence, don't let the word "operating system" scare you. You can see a 1-minute long video demonstrating some of its features below.


Some of Phosphorus Five's main design goals were as follows.

  1. Make it at least 10x easier to create web apps.

  2. Allow for dynamically installing and uninstalling applications and modules, without interfering with its normal operation.

  3. Make security a "commodity" such that the system is "secure by default," offloading the developer from as many security concerns as possible.

In order to make it easier to create web apps, I had to solve all the common problems developers are facing when they want to create a rich web app. These problems include Ajax widgets and controls, such as Tab Views, Tree View controls, Uploading of files over Ajax requests, etc., etc., etc. These parts of Phosphorus Five are encapsulated in a module called "Micro." Micro also serves as a CSS framework, which allows the developer to create his web apps responsively, such that they work across all devices. To make this customizable, I also had to provide "hooks" into the core of the CSS framework, allowing the end developer to create his own "themes" or "skins." So Micro is arguably for Phosphorus Five what Gnome or KDE is to Linux. Or if you're a Windows guy, you can compare Micro to "Common Controls" from windows, or the "Windows parts" on top of DOS for that matter.

In addition, the primary GUI module, the "Desktop" module, also provides a lot of helper functions, such as allowing a user to log in and log out, with GUI helper components. It also provides helper functions to install and uninstall modules and applications, and other types of services. Authentication and authorization are also simply "taken care of" by the underlying system, following all best practices in regards to passwords, and other security concerns.

I also had to make sure it became dead simple to work "incrementally," and incrementally building up more and more complex constructs, by leveraging either your own components and modules in your own (next) apps and/or modules - and making it easy to leverage third-party modules and apps, the same way you would consume a "library assembly" in for instance C#. This just so happens to coincide with the second point in our above list of goals.

The second thing I had to do, which might sound slightly more unintuitive, was to create my own programming language. Simply since as far as I know, there are no programming languages out there, that allows for dynamically execute code, to such an extent, that installation and uninstallation of modules can be done by simply x-copying files to the server, without interfering with your server's normal operation. The programming language I created is called "Hyperlambda" and it is at the core of Phosphorus Five.

Hyperlambda had to be extremely easy to learn since I realized that having developers learn a new programming language, is like asking a BMW owner to switch to Volvo. Hyperlambda hence contains no OO constructs and is 100% functional in nature. Hence its name, implying "Hyper" (web) and "Lambda" (function objects). Hyperlambda also only contains four simple control structures or syntactic elements, so it is largely self-describing - at least for anyone having seen for instance YAML or JSON before.

Hyperlambda is a simple abstraction on top of C#, which thanks to a clever design pattern called Active Events, allows you to invoke "hooks" in C# easily. So, in fact, the language is actually more of a file format, describing a relational "Node" structure, allowing you to declare a node, which serves as arguments to such Active Events. And creating your own Active Events in for instance C#, and use these as your own "language extensions," is as easy as declaring your method with an ActiveEvent attribute. Hyperlambda is in its syntax actually quite similar to YAML or JSON. Below is an example of how to create a modal window. This declares a "lambda object," or a "function object," which you can evaluate using the core "eval" function from Phosphorus Five.

/*
 * Creates a modal window.
 */
create-widgets
  micro.widgets.modal:my-modal
    widgets
      h3
        innerValue:This is a header
      p
        innerValue:This is a paragraph
      div
        class:right
        widgets
          button
            innerValue:Close
            onclick

              // Closes modal window.
              delete-widget:my-modal

In fact, any experienced web developer can probably already easily understand the relationships between the "nodes" in the above Hyperlambda, and what HTML/DOM it ends up producing as a result. Below is a screenshot of how the above Hyperlambda ends up looking like if you run it through for instance "Hypereval." Hypereval is one of the pre-installed modules from Phosphorus Five, that allows you to evaluate Hyperlambda in "immediate" mode.

Image title

Then all I had to do was to prove that it works, in addition to providing a tooling chain for developers, which they could leverage to actually consume Phosphorus Five. Below is a list of the apps and modules I chose to focus on initially.

  1. Hyper IDE - A web-based IDE or "Integrated Development Environment" supporting 100+ programming languages out of the box.

  2. Camphora Five - A CRUD app generator, allowing you to create CRUD apps in seconds, by simply declaring which columns you want in your database schema, and let the underlying framework automatically "generate" your app accordingly.

  3. Hypereval - A Hyperlambda "terminal," allowing you to evaluate Hyperlambda in "immediate" mode, which is useful for both learning Hyperlambda, in addition to administrating your server. Hypereval also supports storing snippets of Hyperlambda in your MySQL database, which further adds to the componentization of the system as a whole.

  4. Magic Menu - A global navbar module, which supports speech recognition and speech synthesis, to navigate your menu items, in addition to supporting literally "millions" of menu items.

  5. Peeples - The authentication and authorization module, allowing you to create and maintain your users, and their privileges on your system.

Below is a screenshot of the system, with all 5 modules installed.

Phosphorus Five 'desktop'

Below is a screenshot of Hyper IDE, as I am editing a CSS file, with AutoComplete and the whole experience.

Image title

You can download Phosphorus Five here.

References - MSDN Articles about Phosphorus Five.

  1. Active Events, one design pattern instead of a dozen

  2. Make C# more dynamic with Hyperlambda

  3. Could Managed Ajax put your web apps in the fast lane?

Deploying code to production can be filled with uncertainty. Reduce the risks, and deploy earlier and more often. Download this free guide to learn more. Brought to you in partnership with Rollbar.

Topics:
c# ,asp.net ,web dev ,open source ,web application development

Opinions expressed by DZone contributors are their own.

{{ parent.title || parent.header.title}}

{{ parent.tldr }}

{{ parent.urlSource.name }}