Giter VIP home page Giter VIP logo

granular's Introduction

Granular - WPF for JavaScript

Granular is a re-implementation of WPF, compiled to JavaScript, allowing WPF applications to run in the browser (using Bridge.NET C# to JavaScript compiler).

Installation

  1. Create a Wpf application, call it WpfApplication1
  2. Add a Class Library to the solution, call it WpfApplication1.Web
  3. Install Granular NuGet package into WpfApplication1.Web
    (from Package Manager Console: Install-Package Granular -ProjectName WpfApplication1.Web)
  4. Build
  5. Open WpfApplication1.Web\bin\Debug\bridge\index.html

A list of common issues can be found here

Why?

WPF defines many advanced UI concepts (such as visual / logical trees, layouts, routed events, resources, bindings and many others), and it also naturally supports MVVM and other UI patterns, with Granular we can enjoy all of them in the web.

Features

Granular supports many of WPF features, such as xamls, templates, binding, animations and many others.
A full list of the currently implemented features can be found here

Live demo

GranularPad is a good showcase of the current Granular framework capabilities.
(Don't forget to inspect the visual tree in the DOM :)

A small example of how it works

The following solution contains two projects:

  1. WPF application - This is the project that's being developed and tested, in this case, it contains a window with templated buttons (which incorporates many of WPF capabilities).

  2. Web application - Containing only links to the first WPF application files, it references Granular (instead of WPF) and it's being compiled to JavaScript using Saltarelle.

Visual Studio - Solution window

This is what the WPF application looks like (as you would expect)

WPF application window

And this is what the Web application looks like (exactly the same, except it has a browser around it :)

Web application window

The main advantage of this approach is that the development and testing is done solely in Visual Studio, away from any browser or JavaScript debugger.
Also there is no need to deal with all the html/css and fashionable JS frameworks mess, Granular exposes the WPF strong and well-defined APIs, and the whole development process is much cleaner and faster.

Moving forward

Granular is still under development, and there are a lot of ways it can be moved forward. Any help from developers who are passionate about WPF (or not-so-passionate about the html/css ecosystem) would be much appreciated :)

granular's People

Contributors

yuvaltz avatar mihamarkic avatar suchiman avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.