DotVVM Academy Anew

|
Publikováno:

The new version of DotVVM Academy has finally been released!

This new version comes not only with a new design made from scratch, but also a lot of new and improved functionality and content:

A New Lesson

Yes, a brand new lesson providing an interactive introduction to the DataContext property. It replaces the Form Controls lesson that mostly just duplicated content from DotVVM Docs.

landing-page

The Code Editor

The Ace editor got replaced with Monaco as it has arguably a better API and its design and user experience is closer to Visual Studio, which most our users use, and should thus provide a more familiar environment.

monaco

Download Sample Solution

At the end of every lesson, you'll find a "Download Solution" button. This button lets you download an archive with a prepared DotVVM project implementing the current lesson that can be run on your machine.

Interactive Samples

You can also try out the subject of every lesson in its final step. However, in order to ensure safety of the application, the interactive sample doesn't use the actual user solution but one prepared by the author of the lesson.

interactive-sample

If you are interested in how Academy works, you can find the source code on GitHub. We also welcome help with new lessons or with translation to other languages.

Safer Validation

Since the user code cannot be trusted, Academy performs a number of checks on it and runs it only if they pass. Both the check and the eventual run are done in a separate process so that the main application is safer from attacks and compiler crashes (e.g. this Roslyn issue).

Course Format

This change perhaps isn't as noticeable as the others but definitely worth mentioning. The code samples and the lessons themselves got moved out of long XML files that contained a mixture of XML, Markdown, C#, and DotHTML into a separate, more manageable file tree. This change also allowed us to share code among different language variants of a lesson.

Validation Scripts

Back in the old version of Academy, validation of a user's code has been done through very thin, very hard-coded abstractions over the DotHTML and C# (Roslyn) compiler. It was part of the main application itself, which meant that every time a change needed to made, the whole application had to be published again and restarted.

A snippet from the old approach:

public class Lesson1CommonValidator
{
    public static List<Property> CreateStep4Properties()
    {
        return new List<Property>
        {
            new Property("Number1", "int", ControlBindName.TextBoxText),
            new Property("Number2", "int", ControlBindName.TextBoxText),
            new Property("Result", "int", ControlBindName.TextBoxText)
        };
    }

    public static void ValidateBasicControls(ResolvedTreeRoot resolvedTreeRoot)
    {
        DotHtmlCommonValidator.CheckControlTypeCount<TextBox>(resolvedTreeRoot, 3);
        DotHtmlCommonValidator.CheckControlTypeCount<Button>(resolvedTreeRoot, 1);
    }

    public static void ValidateTextBoxBindings(ResolvedTreeRoot resolvedTreeRoot)
    {
        ValidateBasicControls(resolvedTreeRoot);
        DotHtmlCommonValidator.ValidatePropertiesBindings(resolvedTreeRoot, CreateStep4Properties());
    }
}

The "testResource_locationFallback" script has been loaded. And so last but not least, the new version of Academy solves these issues using C# scripts and a more indirect, abstract API to validate a piece of code:

#load "00_constants.csx"

using DotvvmAcademy.Validation.Unit;
using DotvvmAcademy.Validation.CSharp;
using DotvvmAcademy.Validation.CSharp.Unit;

public CSharpUnit Unit { get; set; } = new CSharpUnit();

Unit.GetType<int>()
    .Allow();

var viewModel = Unit.GetType(ViewModelName);
viewModel.GetProperty(ResultName)
    .Allow()
    .RequireType<int>()
    .RequireGetter()
    .RequireSetter();

viewModel.GetProperty(DifferenceName)
    .Allow()
    .RequireType<int>()
    .RequireGetter()
    .RequireSetter();

What the future holds for DotVVM Academy? Perhaps more lessons. Maybe we'll even release the validation and course format APIs as separate libraries. That remains to be seen.

Whatever happens, I thank our talented designers, front-end developers, and everyone who contributed their feedback during the development. It had taken a lot longer than expected but Academy has finally been released anew.

Adam Štepánek
Adam Štepánek
Ostatní články z kategorie: DotVVM Blog