Browsing:

Month: October 2010

ASP.NET MVC, Code

Fluent Nhibernate and ASP.NET MVC

October 31, 2010

For those of you who follow our personal tweets (yeah we have to tweet more with our @itsletnl account), you probably noticed how we’re currently involved (or obsessed) by Fluent Nhibernate. Fluent Nhibernate FTW!

Itslet Fluent Nhibernate

Fluent Nhibernate uses poco mappings instead of XML mapping, like its big brother Nhibernate. There is no strong argument to use Fluent Nhibernate instead of Nhibernate, it is just a matter of taste to me. Although, Fluent Nhibernate can automap and autopersist your entities, based on convention, and Nhibernate cannot.

Getting started with Fluent Nhibernate is very simple. Just read their excellent getting started guide. It doesn’t make much sense to repeat that on this website with different entities.

But how do we get started with ASP.NET MVC? How do I connect with the Fluent Nhibernate session gracefully?

Handling sessions

I used the book of Jason Dentler to find out more. The most common pattern in web application is the session-per-request. We open the session when the request begins and close it when it ends.

Nhibernate has a contextual session feature which allows a session to be associated with some application specific scope (unit of work). You need to set the current_session_context_class property in the hibernate-configuration section of web.config. But as we use Fluent Nhibernate, we have to use the ‘ExposeConfiguration’ method.

Here is my Global.asax.cs. Check out line 45: .ExposeConfiguration(c => c.SetProperty(“current_session_context_class”, “thread_static”))’.

Now we can refer to that session in our controller, like this:

In the example the person is fetched from the database. But to make the app more production worthy, we would use dependency injection rather than directly access the current session. Also, we would not have exposed our connectionstring like that.
But that is a completely new blogpost.

Code

Github quickstart

October 29, 2010

Here are some quick guidelines to get up and running with Github quickly.
This article assumes you are on Windows and use Visual Studio for coding, but it could very well be another OS or IDE.
Create an account first at Github.
Create a new repository.

Download and install Git here and install according to this guidelines.

Now, rightclick on your Visual Studio project folder and choose ‘Git Bash here’. We are going to generate SSH keys first.
Type:
[code]
$ ssh-keygen –C ‘barbarabarend@gmail.com’ –t rsa”
[/code]
Accept all the defaults and don’t enter a passphrase.

now type:
[code]
$ cd ~/.ssh
$ vim id_rsa.pub
[/code]

now copy all the contents of this file and paste it in the Github website under Account:

Now, navigate to your Visual Studio project folder. And type:

[code]
$ git config –global user.name "Barbara Barend"
$ git config –global user.email barbarabarend@gmail.com
[/code]

Or whatever your name is.

[code]
$ git init
$ touch README
$ git add README
$ git commit -m ‘first commit’
$ git remote add MyRemoteRepo git@github.com:YOURGITHUBNAME/test.git
$ git push MyRemoteRepo master
[/code]

Line 5 is one line!

Now the Readme file is placed in your Github repository.

So, at this point you verified that you can actually upload your codefiles to Github and it’s time to upload the whole project. But you probably want to ignore a few files and folders (e.g debug and bin and so on).
To exclude files from being posted to Github, you need to create a .gitignore file. Like this:

[code]
$ touch .gitignore
[/code]

Now, edit this file with your favorite text editor and make it look like this:
[code]
obj
bin
*.csproj.user
*.suo
*.cache
Thumbs.db

# Other useful stuff
*.bak
*.cache
*.log
*.swp
*.user
mysecrettextfile.txt
passwords.txt
[/code]

Just basically add what you don’t want to be included. Upload the .gitignore as well:

[code]
$ git add .gitignore
$ git commit -m ‘my ignored files’
$ git push MyRemoteRepo master
[/code]

Okay, now push your Visual Studio Solution to Github:

[code]
$ git add .
$ git commit -m ‘the whole she-bang’
$ git push MyRemoteRepo master
[/code]

Now what if you want to add existing code? Like the fabulous ShoeShoe app as discussed in the former blogpost?
Create a new folder for these files and start the Git bash.

[code]
$ git init
$ git remote add MyRemoteShoeRepo git@github.com:YOURGITHUBNAME/MyShoeShoes.git
$ git clone git@github.com:YOURGITHUBNAME/MyShoeShoes.git
[/code]

So this was quick and dirty, but it does the trick.

Code

Entity Framework Part 5 Model First : Create a database with the Complex Types.

October 24, 2010

A cool feature we are gonna try out in the model first architecture of the entity framework are “Complex Types” a container for property values who are not entities, but a collection of fields that are in line in a table row, a set of columns or properties and not necessary tables itself, to keep a nice clean application based model and have your attributes grouped together.

Model First and Complex Types add new features and possibilities:

We are going to build a console app with Entityframework 4 and name it MyShoeShoes. First we add a new item and choose the ADO.NET Data Model. We choose the empty model:

We call the Model shoe.edmx and now we are going to add our first new entity called: ‘Shoe’ in the Model Browser

Right click-> add a complex type instead of table rows. With Complex Types you can group together specific collections. In the Model browser you see the Complex type, here we add new lines, Add -> Scaler Property- we add extra shoe properties, in this case a group of ShoeTypes; Heels, Sneakers, Boots etc.

Now we have created Complex Types that do not show up in the design surface, that is for entities only.

Now all we have to do is right click the Shoe entity and choose ‘add Complex Property’ and name it ShoeType and it automatically sets it to the complex type we’ve just created: ShoeType.

Now we are going to add a hierarchy, which inherits from the Shoe entity with some extra details we want to use with the Shoe entity. We create an entity and set the base type to Shoe. Now remember this model is a ConceptualEntityModel and we can always tweak this in the database later!

Next entity we create is the ShoeDescription and add an association to it on Shoe, so it links to the Shoe table.

Our model is ready: We have Shoe with a grouped ShoeType, so we can index our ShoeTypes on Type-a-Shoe, We created a Shoe Colour Hierarchy to Shoe, Since one ShoeType can have many colours and a table ShoeDescription always has a relation in Shoe.

Maybe you’ve noticed that our console app gives an error when you try to built the app: “Error 11007:Entity type ‘EntityName’ is not mapped when Entity is only mapped to function import” No worries! this error will be solved as soon as we build our database, as the database is generated it will create the mappings for you.

We have all the data we need for our application so it’s time to generate a database from this model

The next steps are very easy, we are asked to choose a data connection, don’t get distracted by the Shoe.dbo line, we choose a “New Connection” since we have built a brand new Model to create a database from. The connection string is created here as well.

Set the connection Properties and name the new database, we call it MyShoeShoes:

The next step generates a dll file, but this is not run automatically,  we need to create the tables in our database. The database dll will be generated by a so called T4 template and can be modified.

When we look into the generated DLL, we see that the associations are created and it sets the ID as primary key, We call this Table per type, it creates the hierarchy Shoecolor as it’s own table with a Shoe_ prefix: ‘Shoe_Shoecolor’ in the database.

We have to manually run this query in the SQLServer, since the RTM is not completed in VS2010 EF4, but this is just a matter of time. Now refresh the MySHoeSHoes database and pop the tables are generated:

We have now created a complete database from a Model we built in Visual Studio with EF4, how cool is that!

Tooltip

Tool tip of the Month: Microsoft WebMatrix the codedummy treasure

October 23, 2010

New to (web)development? or need a kick start, then WebMatrix is the tool for you.
With this tool you can built applications on open source products available via the Microsoft Webplatform. You just need the Microsoft Web platform Installer and a little space on your harddisk.
Today’s websites are all about interaction, the static or overcrowded flash generated websites are loosing their ground.
A cool webmatrix beta has been released, give it a try, play around with it and improve your skills. Who knows maybe you built your first application!

Now you ask me, what is so exciting about WebMatrix? I will quote Microsoft: “Webmatrix is small, Simple and seamless”. It provides you with a compact platform with all the professional tools right under your nose. No need to install a heavy sql server on your machine. It runs on SQL Compact, an embedded database and if your data grows explosive you just migrate to a bigger server in no-time.

To show you how easily a basic app is created we are goin’ to built a webgallery with webmatrix
we choose the webmatrix gallery pro, insert your database information; in this case we create a user named kuromi from sanrio and an db administrator and press enter…

Gallery server pro is loaded and the database is running. Press Run and the website is loaded.

And that’s it! The basics of your new application is ready, you can login and start your first album. This was way too easy! We want more, we want to create OUR OWN personal Gallery. That’s we’re visual studio comes in again *sight* I scared you, didn’t I, when not mentioning code and Visual Studio directly. Since most of our reader are already into  code, the fun starts here, and for you starters, dive into visual studio and let the Itslet guide you.

So far for my code evangelism in my October tooltip, hopefully Webmatrix will convince those of you that hesitate if coding is fun and maybe you’ll become a frequent reader of our blog 😉

Web

Make way for HTML5 the full experience in IE9

October 11, 2010

I installed IE9 Platform in March, tested it, tried out my websites and everything looked fine, but it was only until the release of last months Ie9 beta that I found out that our very own blog did not display correctly. The header appears to be broken in IE9 and this is most interesting since twentyten is a standard customizable theme of wordpress!

So it’s time to find out what has changed in the world of HTML!

HTML5 and IE9 brings some cool new features we only could achieve using plug-ins like activeX, Silverlight, Flashplayers etc.
What does HTML5 mean?
No more codecs or frames.
New are footer, header, Navigation, Video, audio, canvas, article, svg
back from the old and recycled are <Ol> <dl> and <small> and also overlapping tags are allowed.

New ECMAScript 5 support – Supports ActionScript, JavaScript en JScript

Enhanced object Model
Selectors
Find elements by: CSS Selectors API

DOM API

getElementsByClassName

Allows css syntax

QuerySelectorAll() API
DOmContentLoaded

It loads the page as soon as the parsing is finished.
HTML5 also enables local storage and remebers your webinput even after a refresh, this new method makes your web available when no internet connection is available, you can even edit and modify web entry off line, the changes will be sent to the server as soon as an internet connection is available again.

It also brings us new binary attributes, whom work, by just being there! Just plain code for video and audio, no flash or silverlight is needed, no plug-ins. full javascript API It works for regular and fullHD video.

code example:

<video src="kewlmuvee.mp4" autoplay controls></video>
document.getElementById("video").play();

We want to ad some user options so they can controll the vid!

<video src="muvee.mpg" id="video">
</video>
<p>
<button onclick="document.getElementById('video').pause()">
Pause</button>
<button onclick="document.getElementById('video').play()">
Play</button>
<button onclick="document.getElementById('video').currentTime = 0">
Back to Beginning</button>

How cool is that!

Also a kewl new feature is Canvas, as a codejunky you don’t want to draw a circle, you just want to Program it!

<html>
<p>HTML 5 Full Circle</p>
<svg>
<circle id=”myCircle” cx=”50%” cy=”50%” r=”100″
fill=”url(#myGradient)”
onmousedown=”alert(‘Itslet says Hi!’);”/>
</svg>
</html>

<canvas>: Drawing programatically on screen, make dynamic pages you can move around and even convert back to a savable format for the guest on your site!

SVG Vector based graphics available, you can manipulate elements like colours in an advanced way, like transparency  and multiple colours.
Multiple Web standard colours can be used in designing websites:
Hexadecimal colours, a very common used webcolour and start with a #.
HSL is a colour standard used for printed matter, (Hue, Saturation and lightness) and (Alpha)transparency

A new Font upcoming standard, which will also make it possible importing (multiple) Fonts “WOFF” in your css (read more about it at web open font format).
(URL) media/Fonttype.woff

With Media queries you can have multiple css types in one page for different media.
So your webpage will display in the correct format on your Phone, Ipad, browsertype etc.
e.g NO.css (Max-width px) with this info available the devices choose what css is loaded to display the site.

Gone in HTML5 but still available:
<Applets> use <embedded>
<big> use css
<blink> use css
<center> use css
<font> use css

But i can tell you about all this great features, but you just have to go and see for yourself, implementing HTML5 in all your webdevelopment will make the web faster, cleaner and simple!

To conclude with the wordpress 2010 theme, it does not seem like a wordpress error at, the css looks fine, so I tried a work around I found at wordpress , and changed the stylesheet at line 365 to “display : inline;”

Want more? Install Platform, IE9 and start by visiting this webpage http://ie.microsoft.com/testdrive/Performance/msPerformance/Default.html?loaded=2

Categories

Social Profile

TheButtonFactory 2009, rights reserved.

Terms of Use - Privacy Policy

WordPress Di Blog Theme