Fayde

Silverlight Everywhere, No Plugins

  • Want to deliver a rich native application experience to the desktop, web, and mobile platforms with one technology?
  • Tired of dealing with HTML and CSS hacks, browser inconsistencies, and lack of features?
  • Enjoyed the intuitive and powerful XAML while building WPF or Silverlight applications?
  • Like building applications with a reactive UI using data bindings?
  • Need to migrate your Silverlight applications?

Fayde is an open-source Javascript application framework that provides all these capabilities through its XAML layout/rendering engine. Unlike other frameworks, which focus exclusively on being an application framework, Fayde frees you from the confines of developing applications using HTML and CSS. It completely replaces it with XAML, an "eXtensible Application Markup Language".

Fayde is Silverlight on all platforms. It is written entirely in Javascript, so it can be used on all platforms and browsers. To deploy it as a desktop application, just compile it using node-webkit.


Fantasy Football Draft Demo
Source Code

Todo Application Demo
Source Code

Get Connected

Sign up to stay in touch with the Fayde team and contribute to the direction of this product.

Get Started

The easiest way to start developing with Fayde is to use the Yeoman generator the Fayde team has developed. This will allow you to set up and run a new Fayde application with just a couple commands.

  1. Install Dependencies

    If you already have npm, Gulp, and Yeoman installed you can move on to Step 2. If not, please follow the directions below.

    Node and npm

    Gulp

    Yeoman

  2. Fayde Yeoman Generator

    npm install -g generator-fayde

    The Fayde Yeoman Generator is a utility we will use in order to set up the Fayde project. It will create and configure all the files necessary to build and run a Fayde application.

    Install the Fayde Yeoman Generator globally by typing the command: npm install -g generator-fayde

  3. Unify

    npm install -g fayde-unify

    Unify is a very small command line tool for setting up and managing javascript libraries and typescript exports. Currently this is a requirement in order to run the fayde yeoman generator and only has to be run once.

    Install unify globally by typing the command: npm install -g fayde-unify

  4. Yo Fayde

    From your command prompt, navigate to the directory where you would like to create your application.

    Run "yo fayde" in order to create your application. Enter a name for your application and choose whether you would like to include two optional modules:

    - exjs is a Typescript library that allows you to use Linq style syntax when working with Arrays.

    - Fayde.Controls is a controls library for Fayde with things like TreeView, Menu, and TabControl.

  5. Gulp Serve

    Fayde projects are set up as Typescript projects. Running "gulp" from the command line will compile the Typescript into Javascript. To run your application, type "gulp serve" from the command line. This will open up your default browser and load the Fayde application. Any changes to views or code will automatically reload in the browser.

  6. Develop Your Application

    Start building your application and watch it change as you type your XAML. Live-reload is set up so the browser will reload and display your changes as soon as you save.

    More documentation and tutorials are coming soon. Source code from the demos above is available to help you begin developing your Fayde applications.

Feature Support

Fayde has been initially developed as a port of Silverlight and includes all major features:

Core Controls

Border, TextBox, TextBlock, ProgressBar, Button, RepeatButton, ToggleButton, RadioButton, CheckBox, PasswordBox, Slider, ScrollViewer, ComboBox, ListBox, TreeView, TabControl, Image, and more

Styles and Templates

ResourceDictionary, Theme, Style, DataTemplate, ControlTemplate, HierarchicalDataTemplate, ItemsPanelTemplate

Binding Support

Binding, Value Converters, RelativeSource, Mode, StringFormat

Colors and Gradients

TileBrush, ImageBrush, SolidColorBrush, LinearGradientBrush

Validation Support

ValidationSummary, validation binding properties, input adorners and more

Animation Support

VisualStateManager, Storyboard, and all animations

Layout Panels

StackPanel, WrapPanel, Grid, and Canvas

Page Based Navigation

Page, Frame, HyperlinkButton, UriMapper, and Browser History

Shapes and Transforms

Rectangle, Line, Ellipse, and Path using vector graphics

In addition, Fayde has added support for:

GridItemsControl

A new control with similar features to a DataGrid but constructed in a much more modular, extensible, and stylable manner.

Panel

An abstract control in Silverlight, it can be used in Fayde to do layering.

Routing

A more advanced way to do page-based navigation with MVVM.

EventBinding

Allows the binding of events such as keystrokes directly to commands.

Multi-Touch Support

Develop your applications for laptops, tablets, and phones.

Custom Two-Way Binding

Support for using two-way bindings when building your own custom controls.

ItemsControlParent

A new RelativeSource that allows binding to the ItemsControl from the ItemTemplate.

Unify

Setting up and managing javascript libraries through bower, require, etc can be tedious and difficult. Unify is a project aimed to simplify the addition and configuration of javascript libraries to your Fayde application.

Coming Soon

A lot is happening with Fayde. With all the possibilities that have been unlocked through Fayde, the developers are working to keep up with the dreams of what Fayde can become. This list is just the beginning...

The Fayde team is always looking for contributors. Please contact us with ideas, send us pull requests, or just let us know how your Fayde projects are going. We would love to hear from you.

GridItemsControl Enhancements

The GridItemsControl is a new control introduced in Fayde to handle tabular data instead of DataGrid. Enhancements will be coming in order to support more complex data, styling, and templating scenarios.

Fayde Xsd

An XSD file will be provided for Fayde that will allow the developer to configure in the IDE of their choice. Once configured, it will provide Autocomplete or Intellisense capabilties when developing user interfaces.

Data Connectivity and Web Services

Making it easy to fetch and work with data is key to building any web application. This set of features will take the pains out of composing your application data.

Debugger

Debugging is a necessity. Allowing the developer to debug both the Typescript application code as well as the XAML markup and Bindings is top priority.

Expressions

Expressions are simplified statements that allow the developer to much more easily define things like Bindings or Column and Row Definitions.

Charting and Graphing

Create stunning data visualizations using styles and templates for each component of your visualization.

Touch Gestures

Touch Gestures help you build first-class mobile applications. Some examples are Pinch, Spread, Rotate, etc.

Additional Themes

Get up and running with a brand new beautiful application with little effort.

Advanced Controls

PaginationControl, DatePicker, TimePicker, CalendarControl, and more

Responsive Design

Built in support to detect screen resolutions and adjust your Fayde styles accordingly.

Mobile Device Keyboard

When the user clicks on a text field within Fayde, their virtual keyboard should be displayed in order to enter text.

Why Fayde?

For many years, software developers have been frustrated with platform choices for building applications. One of the most fundamental choices has been "Should I build a web application or a desktop application?".

"If I choose to build a web application, then I can easily deploy everywhere. However, the language, tools, productivity, and overall developer experience is poor. In addition, HTML was created for building documents and not a platform for building applications. As a result, the interface design will suffer because HTML just can't do what it should."

"If I choose to build a desktop application, I can use the languages and tools that will make me productive and capable of delivering a great application. The problem with a desktop application is that it can be difficult to deploy and in most cases I have to build many versions in order to reach my audience."

For many, including the developers at Fayde, things started to change when Microsoft released Silverlight and WPF. Silverlight provided developers with much better languages and tools to deliver first class applications over the web.

  • Unlike HTML and CSS, the layout and styling was very precise and predictable and gave the developer great control over the user interface.
  • It was designed in an extensible manner which allowed the developer great flexibility to extend the platform with their own controls.
  • User interface designers could quickly prototype and build Silverlight user interfaces using Expression Blend without the need of a developer.
  • The developers could build and easily test the business logic of an application isolated from the user interface.
  • Interface designers and developers could leverage the inherent software contract between the interface and the business logic created by Bindings and Commands.

Software development had become much more focused on the business ideas and less on technical limitations...

And then came the death of browser plugins. As Silverlight and Flash/Flex phased out, many developers went back to using server-side rendering technologies such as ASP.NET or Rails. Others have attempted to create client-side frameworks (Angular, Ember, Knockout) with a lot of the same concepts that made Silverlight so popular. However, the problem with all of these approaches is that they are all bound by the limitations and frustrations of HTML and CSS. Unfortunately, the problems with HTML aren't going to be solved anytime soon. As long as the browser wars persist, innovation is restricted and the W3C will continue to require years to release a single specification.

Fayde is a software platform that restores productivity and control to the developer. Initially developed as a port of Silverlight, Fayde is looking to both restore and expand upon what Silverlight provided. As a completely open-source platform, the Fayde team is anxious to see what an extensible platform plus the power of the open-source community can create.