Sencha JavaScript Framework

Posted: September 18, 2011 in Techie Stuffs

I was doing a lot of Research finding an appropriate JavaScript Framework when I came to know about something called “Sencha”. Lot of Programmers and Technical Lead find it pretty difficult to suggest a “JavaScript Framework” or “UI Components for Web” and end up finding many on the web, following are some of those UI Frameworks I have used and worked on :

Hard to believe all of the above mentioned UI Components would surely confused even though they have got tonnes of examples on their website but it is what it is.

I particularly like Telerik, jQuery and Sencha as well. But since we are talking about Sencha let this be for Sencha only.

Sencha is nothing but a set of pre- compiled JavaScripts which has its own framework and lets you do your stuffs without doing post-backs its more of a Framework and can extend your JavaScript toolkits. Some of the points why I would use Sencha over other JavaScript Frameworks:

  1. Sencha JavaScript Framework is Cross-Browser by default so you don’t have to code for every browser.
  2. Follows the Class hierarchy.
  3. Very Well documented.
  4. It is just a layer and can extend your own JavaScripts.
  5. Has a good huge community.
  6. Has its own big set of Widgets can be used easily.
  7. Ext Designer makes it more easy.

What else to talk about go find yourself Sencha, and is it a winner let me know and you know how to contact me 😉

Advertisements

Protected by Copyscape Online Plagiarism Tool
Recent Controversy  on Internet called the “LulzSec“. A recently united so called “hackers” got together and hacked some huge databases right starting from FBI to Sony and anonymous yahoo/aol/gmail users now that’s some filthy crap. I would not say or comment on who they are or what they are up to but I got following points :

  • Did they really hacked these databases or was it nothing more than using Google Droks to find some of these information ?
  • If they are really into busting websites or internet security then why are they shutting their Shop?
  • Why would PirateBay delete their “50 days of LulZ” torrent ?
  • Why there has been so much of fuss between JESTER and LulZ?

I do not know the answers yet but whatever the case may be a lot of Internet Security has been exposed and webmasters are you awake yet ? Get up Now !

Recently there has been sites I know either at work or personal having pretty tight security yet they have loopholes should I be informing those people about their tight security or sit quietly and enjoy people like “LulZ” to kick their asses.

That’s all for now folks….will write more when i have done more research on LulZ and other such groups.

Lately I’ve been thinking about this new technology launched by Microsoft “Razor” and “MVC3 Framework” and the thought process says there are less material available on could so I thought I would post what all I know and have explored in the past 3 months. I am in the process of designing an application which is based on MVC3 with Razor as the GUI Language.

First let’s have a close look at what MVC 3 is, MVC3 is nothing but Model View Control version 3 which gives a little more flexibility over a classic MVC Application.

Model:

So what is a Model?

The Entities you define in your project that carry database objects are Models for example let’s talk about an Entity Post, a post would have Title, Body, Created Date Time and so on and following is how it should be created, there are tools available for the model to be generated automatically out of your Database and those can also be used to save time:

public class Post

{

public Post()

{

Categories = new List<Category>();

}

public virtual long Id { get; set; }

public virtual string Title { get; set; }0

public virtual string Body { get; set; }

public virtual DateTime CreationDate { get; set; }

public virtual bool IsPublic { get; set; }

public virtual IList<Core.Domain.Model.Category> Categories { get; set; }

}

Controller:

So what is a controller? Basic English says something which controls everything. Let’s take a scenario where there is a need to create / update and read posts as per our above mentioned Model so what all method would we need for such actions.

  • Create Method
  • Read Method
  • Delete Method
  • Update Method

Hence we would require a Controller page for these actions, in Visual Studio 2010 when we create a MVC3 Driven application it creates the Folder structure of our application in the following manner:

Folder Structure MVC3

Here we see a Folder for Models, Controllers, Views and Content. We have already created our Model(Entity) in the Models folder, now we will be created a Controller class. So Just go ahead and right click on Controllers and Choose Add->Controller and Visual Studio will create a class inherited from Controller Class with a default method ActionResult Method Index:

Post Controller MVC3

The Method ActionResult does nothing but encapsulates the result of an action method and is used to perform a framework level operation on behalf of the action method and returns its View, so this is what would actually  be called by the View Page.

For instance if we want to return a simple string from our Controller method to the View page, we will simply write the following and on our View Page we will call the ViewBag. Message which we will see soon.

public ActionResult Index()

{

ViewBag.Message = “Some Message”;

return View();

}

Where were we before doing this? Creating the controller class Methods. So the Controller methods for our CRUD Operation or any other generic method that we might want to call inside our application hence we will create four methods for each operation :

public ActionResult Create(MyModelName objModel)

{

//Call the Business Logic for Saving your entity

BusinessLogicClass obj = new BusinessLogicClass();

obj.Save(objModel);

return View();

}

Similarly write your Update/Delete and Read Methods.

Lets jump on to View.

View:

View is nothing but more of the UI Side of Application where we Render the output of our application, you must have heard in ASP.NET Web Application we create ASPX,ASCX,MASTER Pages. Here the Concept in Razor is a little different everything we create is going to be in .CSHTML which will help us render and show the GUI we are expecting the application to show. Following is a quick comparison:

Component Type ASP.NET Application Razor Application
User Control .ASCX registered & rendered in ASPX .CSHTML used as Partial Rendering on Razor Page
Web Page .ASPX nested in Master Page .CSHTML used as RenderBody Method on Razor Master Page
Master Page .MASTER page .CSHTML Created under Shared Folder with _Layout.cshtml or _Somename.cshtml name

Let’s check out how does a CSHTML Page looks like,while we see the Page coding you will realize how similar this is with a Classic ASP Page:

CSHTML Coding Structure

Watch the Code Closely, anything starting with @ is nothing but more like a code that you would write in C# or VB.NET, let me explain as soon as you put an @ symbol you will get Intellisense and you can choose your code.

@ViewBag.Title is a dynamice webviewpage .ViewBag property that is used to return the title from our Controller Class.

@Html.Partial is for rendering the Partial page or control as an HTML encoded string.

@RenderBody() is for rendering the portion of our content page.

Now go get started with your own MVC3 Razor Application and shoot if you have any questions. Till then Stay frosty folks J and there’s more to come in next 10 days.

Unit Testing is a big Question now a days when we talk about the latest technology, but can we really rely on manual unit testing a very complex piece of code ? I guess no ! so what to do ? here comes in picture the new Visual Studio 2010

Lets take an example that we have to build a piece of Code that would Add two integers, and following is the code:

Once you are done coding your method/function right click on your Method and Choose “Create Unit Tests…” as mentioned in the below screen shot

After selecting “Create Unit Tests…” from the Context menu you will get a screen for Creating Unit Test, chose your Method/Function name and hit OK button give your Test Project name and Continue to the Test Class

Once your Test Project is created, Visual Studio will now automatically open  the Test Class with a Method attibuted as “[TestMethod()]” as given below and method you selected will be present inside this Test method. Provide the parameter values and continue to run your project by making this Test Project as start up project:

In our example we provided lFirstNumber as 10, lSecondNumber as 20 and expected as 30 which is nothing be the output of “AddTwoNumbers” method. After running we will get the following result which is nothing but the passed Unit Test:

In case we had given wrong result the Unit test would have failed :

Hope this post will help you create your Unit test and build better applications , thanks