A faster way to build enterprise app

VCL.JS is a TypeScript open-source platform for building an enterprise web apps in a fraction of the time, whether you’re an expert developer or just getting started.VCL.JS takes the Delphi approach into the HTML5 world.

email


Rich Component Library

vcl20VCL.JS components cover controls like pages (TPage class), controls (e.g., TButton, TCombo, TLabel classes) as well as database access (e.g., TQuery components).The component approach allows programmers to extend the VCL with many visual and non-visual additional components.

100% Bootstrap

tweetBootstrap is an open source framework that provides designers and developers with a straightforward way to create web interfaces that employ responsive design. Bootstrap utilizes JavaScript (including jQuery), CSS, and HTML and includes support for CSS3 and HTML5.

100% TypeScript

tsLogo80TypeScript offers classes, modules, and interfaces to help you build robust components. These features are available at development time for high-confidence application development, but are compiled into simple JavaScript.

Visual Studio Integration

vs35 Visual Studio 2012 Developers can install the VCL.JS plugin to get project and item templates.Add page,modal or backend method in no time.

100% Open Source

VCL.JS is free,open source and always will be!

COMPONENTS

Experience the future of the web platform with VCL.JS components framework.Components allow you to create web application, using html to describe their markup and TypeScript to implement custom behavior.

//Simple dbgrid bounded to a query
import V = require("VCL/VCL");
export class PageHome extends V.TPage {
    constructor() {
    super();

    //create a backend query
    var qur = new V.TQuery(this);
    qur.SQL = "SELECT CustomerKey, FirstName, LastName FROM Customers";
    qur.open();

    //create a grid on the screen
    var grd = new V.TDBGrid(this, "grd");
    grd.Dataset = qur; //bind the grid to the dataset
    grd.PageSize = 15;

    var col = grd.createColumn(“FirstName”);
    var col = grd.createColumn(“Lastname”,”Last Name”);
    }
}

<div class="row>
<div id="grd" class="span9"/></div>

SINGLE PAGE APPLICATION

Build a scalable TypeScript apps ! VCL.JS makes it easy to create sophisticated, multi-page TypeScript app with great URL support, in a fraction of the code you’d write in any other frameworks.

//Simple routing example
import V = require("VCL/VCL");

export class PageHome extends V.TPage {
constructor() {
    super();

    //create a backend query
    var btn = new V.TButton(this);
    btn.onClicked = ()=>({
    V.Application.navigateToPage("Page2",
    ["George Clooney"]);
    }
}
//Page2.ts
import V = require("VCL/VCL");

export class Page2 extends V.TPage {
constructor(customerName : string) {
    super();

    //create a backend query
    var txt = new V.TText(thism,"custName");
    txt.Text = customerName

}

Fork me on GitHub
  • littlehouse

    Could you provide a ajax post example with the following create or update or delete operation?

  • vcljs support

    http://vcljs.com/create-server-side-method/

    Hope this will give u some ideas on how to devlop server side

  • tcrever

    It looks impressive! great idea to use the Delphi approach.

  • Paolo Marino

    That’s a wonderful RAD: I wonder why nobody knows it. But it’s really the future…

  • Gary Miller

    Since this software appears to accept JavaScript (TypeScript compiles to JavaScript) database commands from the front end. How are users prevented from transmitting their own JavaScript commands that they’ve tailored with their own SQL injected? (similar to a SQL injection attack).

    In a Framework like Angular you still have to develop server side components to push your data to the front end instead of the front end directly requesting it in database fashion.

  • vcl

    hi gary
    the sql injection is for inhouse small apllication. a more generic approch you can use TQueryremote or write your own server side

  • vcl

    tnx

  • Paolo Marino

    Hi everybody

    I have installed the VCL plugin on Microsoft Visual Studio 2013: when you create a new VCL project e recompile there are a lot of errors on d3.v3.ts library. Dropping the d3.v3.ts lib from the project and recompiling it seems to work fine. It is right?

    Thanks

  • Nati Krisi

    hi

    yes u r correct
    r u sure u used the latest version?
    we removed it from last version

  • Paolo Marino

    I downloaded the last version but it has the same size of that I installed.. At any rate Can I install over the old without problems?
    Thanks

  • Paolo Marino

    Hi
    I noticed that the menu doesn’t close after you select a item. That’s a problem on mobile as it’s seems that non jump is made unless you scroll the screen..
    By

  • vcl

    yep

  • Nati Krisi

    can u send us a sample code?

  • Paolo Marino

    http://www.vcljs.com/Demo

    If you resize the browser up to a smartphone screen you can see what I mean
    By

  • Nati Krisi

    if you talking about the top menu this is bootstrap default behavior.