Vb.net solution structure, demo and code generator
Account Home | Help | Blog | Contact us | Log Out


Welcome to Kbytes > Articles

Vb.net solution structure, demo and code generator

Posted By: siteadmin on 07/03/2018 10:00:00

Vb.net solution structure, demo and code generator

Contents

Introduction
Benefits of this approach
Project Setup
Project Structure
  Demo Object Definition
  LibFuncs and Services
  devroot and javascript helpers
Template Code
  Add New
  Edit/Remove
  Display
Automatic Code Generation
Summary

Introduction

I will show you how to create a complete VB.net application solution which is simple for other programmers to understand and will act as a basic template for developing all kinds of website and internet applications including the server-side for mobile apps such as Android and IoS.

I'm a server-side data guy; so this project is ideal if you want to develop your application "data-first".  This is often not the way applications are developed - the "opposite" way is commonly used by web designers; in this case a client is shown some "mockup screens" that have no data function behind them.   In this method I produced the server side "services" that are manipulated by clients (the website, mobile apps, background Windows Apps or Windows Services) and ensure that the server is complete and functional before handing over to a web designer/UX/UI front end guy who will add the look-and-feel of the site.

I have written some code generators what will use some very basic Javascript code to manipulate the Services to show that they are working.  These will be replaced by fancy Ajax and JQuery calls by a designer later in the process.  What will be produced is an "interface" which can be documented that can be given to any "client" writer and they will be able to complete their task without refering back to you.

Benefits of this approach

Unless your application can be documented from day 1, and only the most simple web/applications can be, the best way to develop a system is via rapid cycles of development and then using insights gleaned from each cycle to develop the datamodel and systems.  This can be iterated until the solution is ready.

If you use a web designer to "mock up" the system initally clients can be distracted from the function of the system, by the form.... "I don't like that colour..." type comments.

By using this "data-first"- method, the function of the application is "zoomed in" and later features can be added by any capable client writer.

A massive benefit of this way of doing things is that you can be confident your developed system works as expected and Clients can written in any form later; e.g. change of webserver technology e.g Refreshing the look and feel of the website, a new Mobile operating system client type - every one of those writers will use your Services without any effort on your part.

Project Setup

This is an in depth look at how I do it at Kbytes.co.uk   It took a long time for me to get into .net  I was for many years a VBS/ASP coder.  During the noughties I’d look at Web forms and groan.  Why so much layered on top by Microsoft?  So much MS-Terminology. Groan.  So I largely ignored it.

Fast forward 2012; and I discovered asp.net MVC that was just about getting stable by then.  OK.. Much better.   I highly recommend this route for any VB6/ASP coders still out there (all 3 of you).  If you are new to asp.net MVC this will give you a framework to rapidly develop any system, with scaffolder code that you can then build into.

Steps:

I have used Visual Studio 2013 for these steps.  Later versions you might have to dig around a little as Microsoft has a tendency to move things around between versions, but the function will still be there.

New Other Solution
ClassLib
Website
Create Standard Folders and Files

New Other Solution

I alway create a new Other Solution because I always want an "umbrella" project as even though you might be initally creating a website, eneviably you will want to add other functions, like "background services" that email clients periodically or update services that pull data periodically from a web service.

In Visual Studio New.. Project.. Other Project Types and then give the Blank Solution the Name of the "Umbrella Project"

ClassLib

The Class Library is where most of the "business logic" of your application will go.

The benefit of putting it all in a Class Library is that you can reference it from another project, in the first case the website project, but later from other applications e.g. a Windows Forms app that might like to use the same functions.

Right Click the Solution in Solution Explorer and create a Class Library.  Call it ClassLib.

Website

For the purposes of this demonstration you will need a Blank Website project.  I make it Empty with Web Forms and MVC hookups.  This allows me to add a simple web form, and also generic handlers which are the key to building a system that is easily extensible and refreshable.

Consider the Website as just another "client" to your Server Side solution.  Later clients will be Android and IoS apps, for example.  They will use the same Service calls to operate as your website does.

Create Standard Folders and Files

Now in the Class Library create the folders,  Responses, Requests and Objects.

In the Website create the folders; Services and devroot.

Your Solution Explorer should look like this:

 

 

Project Structure

Demo Object Definition

For this demo I will use a "product" as the example. So this could be any product that is used in an online store, or in a sales ledger for example.

Create the database table with the fields you need in SQL Server Management Studio

Add the fields you need.  I have used some basic fields that you might expect.

I've set the productId field to Identity and put a seed of 1

Save the table to the database.  I suggest using a 2 or 3 character prefix in this case for the "KbytesWay" demo I'm using KW_ as my prefix.

Now create a Class with the same Properties in the \objects Folder in the Class Library.  You will do this for all simple Object classes that you need e.g. Users, Invoices, Payments.

I suggest here to also use the same prefix as used in the database table above.

Call the Object KW_product (singular because it represents just one product)

You can use the Script Table.. CREATE To.. New Query Editor Window to get the column names in a text format you can paste into Visual Studio and add the Property keyword

 

Copy and paste these results to your KW_product file

Tidy this up so it looks like a proper object definition

Save this KW_product file.

LibFuncs and Services

This is where the "production-ready" code will be written.  I suggest you contain all the "business-logic" of your application in these two places.

LibFuncs

In the root of the Class Library create a class called LibFuncs.product.vb    Notice the .product. identifier.  This allows you to place code relevant to each object into it's own file e.g. LibFuncs.user.vb and LibFuncs.sales.vb.  etc.

The code should then be edited like this;  Add a Partial Keyword to the class definition and add a stub  addProduct sub

 

Services

Now create a new Generic Handler in the \Services folder of the website.  You use a Generic Handler (.ashx) because this type of page's lifecycle is a lot quicker that a standard web form and all you will be doing with this page is outputting JSON to your "client" be it the website or to a mobile app.

 

Call it "ProductService.ashx"

You can logically divide up the functionally here again with ProductsService.ashx or UsersService.ashx etc. The benefit of tying the Service ashx filename to the Object is that you can later transplant e.g. UserService.ashx to another new application and you will know that all the code needed to manage the Users will be in that file.   Later you will discover code that overlaps between the Service files responsibility; it is up to you then where you write this code.  Often I use a file for the application to handle this, in this instance I might use a KbytesWorldService.ashx file to go with the naming convention here.

The Services file are made up of Case statements depending on the parameter that are sent to the page.

Add a reference to the class library from the website project

And Select the ClassLib you created earlier.  It is under the "Solution" tab.

 

Now you can add the code that is used to Add a new product to the system:

Notice the following:

 

 

 

devroot and javascript helpers

I use the devroot folder as the "demostration root" of the site.  As time goes on and I get a webdesigner to make the site look pretty using the MVC system it is useful to have a parallel site structure where I have shown them what I want, and where.  All this goes into the devroot folder.  So the contents that will be loaded when the browser is pointed at \devroot will be what is on the home page of the finished site.

Create a "homepage" by addding a normal web form into that folder.

Create 2 files in there;  a default.aspx and a products.aspx file.

The default file can just have a little explanation text and a link to the products file.

And the products file should be

Javascript Library File

We are building our Services, and in order to test these I recommend using javascript only.  I don't want to get involved in JQuery or any other framework.  My task is to ensure the service interfaces and the database are working correctly.  So we use the minimum clients side code to achieve this.

Javascript works on callbacks to achieve smooth performance on the internet where speeds are slow.  So a function is passed as a parameter to a callback, this function is only executed when the data has been returned.  I term this a X

Add a javascript file in VisualStudio

 

call the javascript file functions.js

Paste the following code into the functions.js file

var sHost = window.location.origin; //IE not support

//IE Support
if (typeof sHost == 'undefined') {

    sHost = window.location.protocol + "//" + window.location.hostname + (window.location.port ? ':' + window.location.port : '');

}
callXHF = function (url, callbackHandler, callbackErrorHandler) {
    var request = new XMLHttpRequest();
    request.onreadystatechange = function () {
        if (request.readyState === 4) {
            if (request.status === 200) {
                callbackHandler(request.responseText);
            } else {
                callbackErrorHandler(request.status, request.statusText, request.responseText);
            }
        }
    };

    request.open('GET', url);
    request.send();

}

function genericErrorHandler(errorcode, errortext, errorresponse) {
    alert("errorcode:" + errorcode + ' \n' + errortext + ' \n' + errorresponse);
}

This javascript code can now be referenced from every Web Form in the \devroot folder.  In your products.aspx file you can add the line:

into the

section of the file.  This will setup the sHost variable and provide the GET version of the callback function.

 

Requests and Responses

In order to ensure that the system that is the developed work


blog comments powered by Disqus

Kbytes Home | Privacy Policy | Contact us | Testing Area

© 2004 - 2018 1 Oak Hill Grove Surbiton Surrey KT6 6DS Phone: +44(020)82617371