Integrating Twitter Feeds in Web Applications

After launching my Website now running with ASP.NET MVC3 instead of ASP.NET Web Forms I’ve been asked how a twitter feed can be integrated within a Web page. With ASP.NET Web Helpers this is really an easy task. This blog post demonstrates how the twitter feed can be integrated with ASP.NET Web Pages and also with ASP.NET Web Forms.

Twitter Feed with ASP.NET MVC

Let’s start with an ASP.NET MVC Project using Razor. After the project is created, the ASP.NET Web Helpers Library can be added to the project from the context menu Add Library Package Reference. From the Add Library Package Reference select the ASP.NET Web Helpers Library as shown in the screenshot.

Within the view where the twitter feed should be displayed, the Twitter API can be used as soon as the namespace Microsoft.Web.Helpers is imported.

The Profile method of the Twitter class is used to display the twitter feed. This method is defined using optional parameters as shown in the following screenshot. It’s just necessary to pass the twitter profile name, but it’s also possible to specify if the twitter feed should be continuously refreshed, the number of tweets to be shown, and the colors of the background, tweets, links…

The full code of the view to display the twitter feed is shown in these few lines.

1 @using Microsoft.Web.Helpers
2 @{
3     ViewBag.Title = "Twitter Sample";
4 }
5 
6 <h2>Twitter Sample</h2>
7 
8 @Twitter.Profile("ChristianNagel")

Running the application a nice formatted twitter feed is shown:

More Features from the Twitter Helper

Other than showing a profile, the Twitter class offers several other features. For example, it is possible to display a list from a user. The next figure shows my Formula 1 list.

1 @Twitter.List("christiannagel", "F1")

 

A search is possible as well. With the next sample I’m searching for tweets containing the tag for the Build Windows conference.

1 @Twitter.Search("#bldwin")

A follow me button can be done easily as well.

1 @Twitter.FollowButton("christiannagel")

A tweet button to tweet about something specific from a Webpage can also be placed on a site. The parameters of the TweetButton method can easily be understood with the information about the Tweet button on the twitter site.

Using this code

1 @Twitter.TweetButton(url: "http://www.cninnovation.com", 
2                      userName: "christiannagel", 
3                      tweetText: "attended a cool workshop")

shows this button

Clicking on the button the twitter dialog pops up:

Twitter Feed with ASP.NET Web Forms

If your are still running an ASP.NET Web Forms application, twitter feeds can be integrated as well. The library package reference with the ASP.NET Web Helpers Library can be added in a similar way to Web Forms as was done with ASP.NET MVC. However, as the library package dialog lists no dependencies for this item, there’s still a dependency. It’s just that ASP.NET Web Pages and ASP.NET MVC have referenced this dependency be default, with ASP.NET Web Forms it is necessary to add the assembly System.Web.WebPages to the project. Don’t forget to change the property to copy the assembly locally with the properties of the reference settings.

With the directives of the ASP.NET Web page, the namespace and assembly references can be added to use the Twitter class:

1 <%@ Assembly Name="Microsoft.Web.Helpers" %>
2 <%@ Assembly Name="System.Web.WebPages" %>
3 <%@ Import Namespace="Microsoft.Web.Helpers" %>

 

Now the Twitter class can be used within the ASP.NET Web Forms page in the same way you’ve seen it earlier.

1     <%= Twitter.Profile("christiannagel") %>

Summary

Web helper classes such as the Twitter class are a great extension to make it easier to create Web applications. The Twitter class defined with the ASP.NET Web Helpers library makes it easy to integrate with all the twitter features. And it can be used with all the Microsoft ASP.NET technologies such as ASP.NET MVC, ASP.NET Web Pages, and ASP.NET Web Forms.

More information in my trainings.

Christian

CN innovation

Comments

[Facebook Apps]

This was really useful, I’ve been looking for a way to display my tweets on my site without using the twitter widget.

[industrial training indore]

Hello there I am so delighted I found your blog page, I really found you by mistake, while I was researching for something else,
Regardless I am here now and would just like to say many thanks for a remarkable post and a all round enjoyable blog.Please do keep up the excellent work.
industrial training indore

[Jordan Gurney]

Is there a way to make the twitter feed display in reverse order? So that the most recent tweet is on the top and the oldest tweet is on the bottom?

[Firewalls]

Web developers with social media savvy are in hot demand. Imagine what it would be like to promise your clients a web presence that is fully integrated with their Twitter strategy and makes it easier for their content to go viral on Twitter