Visual Studio LightSwitch Beta

Introduction

Microsoft launched the Beta version of a new amazing product in the visual studio family of products- the Visual Studio LightSwitch. Visual studio LightSwitch redefined the way of developing an application. In this article we will have a first look into the Visual Studio LightSwitch Beta.

Visual Studio LightSwitch Beta is available for download at http://www.microsoft.com/visualstudio/en-us/lightswitch.

Visual Studio LightSwitch

In traditional software development, before starting the application, we will think or decide many factors like the data store, the deployment environment, how to access external data, how to authenticate, etc.  But, when you use the LightSwitch for developing your new application, you need to take only one decision, which language you are going to use.

Visual Studio LightSwitch allows you to process data from various sources and present it in a very user friendly manner using powerful screens. It supports automatic validations, custom types, custom screen designs and a very easy platform to develop the application.

As LightSwitch is developed on top of .Net technology, the developers can directly start working on the same.

Create the First LightSwitch Application

Once you install the LightSwitch, you will get two additional Visual Studio project templates for LightSwitch applications. One is for C# and another for Visual Basic. 

For our sample, I am using the C# template. Once you create the application, we will get two choices, either to create your own custom table from scratch or to use existing table from any external databases.

Create Table

First, let us create a custom table. Once you select the Create new table option, it opens the following table design screen. 
 

Look at the data types available. We have custom data types for PhoneNumber and Email address, which automatically do the data validation. There is no need to do regular expressions for validating the phone number or email.

Use existing database

Now, I am adding few tables from an existing database (NorthWind). Attach Data Source Wizard allow us to get the data from database, from SharePoint portal and also we can use the WCF RIA services to get the required data.
We can integrate the data from multiple sources like Azure, SharePoint, office document, database, etc. using the Visual Studio LightSwitch.   

For our sample, I am selecting few tables like Product, Orders, etc.

Screen

Once the tables are selected, add Screens, where we are going to display the data. LightSwitch given few Screen template, which we can use directly or you can create your own custom templates and use it. 

Select the screen template and specify which table data needs to be taken as Screen data. Now, I added one screen using each template. Once you add the screen, it opens the screen designer.

Screen Designer

In screen designer, we can add more columns, format the display, use different controls to display a column, format the layout, etc.

Application

Once the tables and the screens are added, our application is ready. Without a single line of code, our application is fully functional with user friendly screens and CRUD operations.  Let us look into the various screens.

Look at the Main screen, where each screen will be added as a Task. First screen will be opened in the first tab of the main area. Also we have the action buttons – Save and Refresh.

Custom Types

You can expand the Phone Number field and enter the Phone numbers in a sub division format. If the Phone number entered is not valid, it will throw the validation exception. 

Automatic validations for the custom types are enabled. In our sample, I entered a wrong email address, which throws the validation error.

Insert Record

Enter the data and click on the Save button to insert the data to the database.

Search Screen

Search Screen template will look like the following screen. Search is like a full-text search in SQL, where it will search every field or column.

Editable Grid Screen

Editable Grid Screen will display the table in an Editable grid. Once you edit the grid, click on save to update the records in database.

List Detail Screen

This screen will display the Main table in a List form. It also displays the related table with filtered data in another grid. Once you select a row in the first list, it automatically filters the data in the related table. 

Also, it allows editing the records of main as well as related table. Double click on one record, which will open the Pop-up window for editing the record.

Customization on Execution

One of the main pain areas of working with an application is the designer part. Once you design and execute the application, you may feel a better idea. Again, you need to modify and execute the same.

Visual Studio LightSwitch will allow us to design the screens while debugging. See the icon on the right top corner - Customize Screen. Click on the icon, which will open the new designer with Application on the top right corner, properties window down and designer options in the left side.

Once you do any changes in the designer, it will reflect the application immediately. Here, I moved few columns to the front and you can see now the TitleOfCourtesy, Title and FirstName columns are appearing before the EmployeeID.

Adding Custom Action

We can add custom action buttons on top of the screens. For the Order List Detail screen, I added a new built-in button – Close.

           
Now the Close Action button will appear only for the OrderListDetail screen.

Deployment

Another major concern with the application development is the deployment technology. Visual Studio LightSwitch is given an amazing support for the deployment. We can deploy the same application in windows as well as web.  
Open the application properties, Under Application Type, select the deployment option.

 
The same application, which we run till now as Windows application, now deployed into the web.

Conclusion

Visual Studio LightSwitch Beta is an Amazing new product from Microsoft. Visual Studio LightSwitch supports the very easy development of applications which can host as windows application as well as web applications. We can create our own custom extensions and use it for designing the application. In this article we talked about few new features of the product. We will discuss more on each feature latter.