Jeremy Morgan

Mostly Coherent Ramblings of a Silicon Forest Software Developer

How to Install ASP.Net 5 on Ubuntu Linux

One of the primary goals of the ASP.Net 5 (codenamed vNext) project is cross platform development, and it’s become easier than ever to develop ASP.Net applications on Linux and OSX. Today we’re going to take a look at how to do this with Ubuntu Linux server.

1. Get Your System Ready

Let’s get our system started. For this tutorial I’m using a Digital Ocean droplet. These are only $5 per month, and if you click this link to sign up you’ll get a $10 credit.

I installed a blank Ubuntu 14.04 64 bit server. First, run the following:

1
sudo apt-get update&&sudo apt-get dist-upgrade

This will make sure we have the newest package lists and upgrade packages if they are available.

Next we’ll need to install Mono. The current stable version for Ubuntu is 3.2.8, which won’t run ASP.Net, so we will have to pull it directly from the Mono repositories:

1
2
3
4
sudo apt-key adv --keyserver keyserver.ubuntu.com --recv-keys 3FA7E0328081BFF6A14DA29AA6A19B38D3D831EF
echo "deb http://download.mono-project.com/repo/debian wheezy main" | sudo tee /etc/apt/sources.list.d/mono-xamarin.list
sudo apt-get update
sudo apt-get install mono-complete

To make sure it installed correctly, type in

1
mono -V

Next, we’ll install some prerequisites that we’ll need to fetch and build some items from source:

1
sudo apt-get install -y autoconf build-essential git-core libtool unzip curl

Also, to run web services we’ll need to install libuv. We’ll have to build it from source and link it:

1
2
3
4
5
6
7
8
cd /opt
sudo git clone https://github.com/libuv/libuv.git
cd libuv
sudo ./autogen.sh
sudo ./configure
sudo make
sudo make install
sudo ln -s /usr/local/lib/libuv.so /usr/lib/libuv.so.1

Now our system should be ready for ASP.Net 5.

2. Set up ASP.Net 5

Now that we’ve got that set up, let’s put ASP.Net 5 on here. First we’ll install KVM:

1
curl -sSL https://raw.githubusercontent.com/aspnet/Home/master/kvminstall.sh | sh && source ~/.k/kvm/kvm.sh

Note: if you want to go real bleeding edge, you can install DNVM instead, shich is the replacement for KVM:

1
curl -sSL https://raw.githubusercontent.com/aspnet/Home/dev/dnvminstall.sh | DNX_BRANCH=dev sh && source ~/.dnx/dnvm/dnvm.sh

Now, let’s install DNX (the .Net execution environment)

1
kvm upgrade

If you downloaded DNVM above instead, run:

1
dnvm upgrade

3. Clone an ASP.Net Sample

Now we’ll clone the sample repositories:

1
2
3
4
mkdir ~/aspnet
cd ~/aspnet
git clone https://github.com/aspnet/Home.git
cd ~/aspnet/Home/samples/HelloMvc

This is the sample we’ll choose to build. Type in the following to build the packages for it:

1
kpm restore

Now we can start it up:

1
k kestrel

You should see a screen that looks like this:

Congrats! You now have ASP.Net 5 running on Ubuntu Linux!

If you would like to run this as a background process, type in

1
nohup k kestrel &

Note that this should not yet be used for production servers!

Conclusion

I have found several articles online about how to do this, but many of them seemed innaccurate, missing peices or out of date. This is common with bleeding edge stuff. I’ll try to update this as much as possible.

This is a good way to set up cheap instances of ASP.Net for your projects. At only $5 a month you could have several application servers running for your project for very little. As I stated before you can get a $10 credit from Digital Ocean by using this link to sign up, or you can use some of the other low cost Linux hosts out there to set up some low cost, fast ASP.Net 5 servers.

Enjoy!

Open Graph Tags Are Terribly Important

Today I want to talk about something that’s pretty important for your blog, even if it’s a tech blog. It’s Open Graph tags, and it’s a fairly easy way to get more people to your site, and get it noticed. I haven’t done an SEO or Marketing type article on this site in two years, but I think this is pretty fitting for anyone working on websites. Is your company doing this? They should be.

What are Open Graph Tags?

The Open Graph Protocol was originally developed for representation on social sites. There has been a lot of shuffling around standards, but for the most part you can easily set up something that will work well with 3 major social media sites:

There are many uses with these tags when it comes to applications and mobile use, but we’re going to focus on another benefit: making your links on these sites more informative. Here is the basic information needed:

  • Title (usually the title tag of your page)
  • Image (This is what will display in your link)
  • Description (This is a description)

This is what I would consider the bare minimum for a decent webpage. Here is what one of my links looks like from this site:

Open Graph Tags for SEO

Chances are you’ve seen tons of these types of links and thought nothing of it. Facebook and Google both try to make a best effort to find a large image, your title and description on it’s own. Most of the time it’s ok, even the space jam site has something showing up and it hasn’t been updated since the 90s.

Open Graph Tags for SEO

But you’ve also probably seen ones like this:

Open Graph Tags for SEO

This is what happens when there is no Open Graph data and the site can’t be crawled properly. It makes for an unattractive link with little or no information. Not just on Facebook, but all the major social media sites.

The Open Graph tags are essential to getting you more clicks, and more shares. Your site needs them. Period.

Even if your site isn’t one that gets shared socially much it still provides a more professional appearance. Not to mention sites like LinkedIn are now using them as well.

Implementing Open Graph Tags

There are a myriad of ways to implement these, depending on your CMS. WordPress has several plugins and other ways to get them into your pages. Any CMS should be able to implement them because they’re only meta tags. How smoothly you can get the data to dynamically populate it might be trickier. Since that’s out of the scope of this article instead I’ll show you what tags you should have on all your pages:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
<meta itemprop="name" content="[ TITLE ]" />
<meta itemprop="image" content="[ LISTING IMAGE ]" />
<meta itemprop="description" content="[ ARTICLE DESCRIPTION ]" />

<meta name="description" content="[ ARTICLE DESCRIPTION ]" />
<meta name="author" content="[ AUTHOR FULL NAME ]" />

<meta property="article:author" content="[ GOOGLE+ AUTHOR URL ]" />
<meta property="article:published_time" content="[ PUBLISHED TIMESTAMP ]" />
<meta property="article:section" content="[ CATEGORY ]" />

<meta property="og:title" content="[ TITLE ]" />
<meta property="og:type" content="article" />
<meta property="og:description" content="[ ARTICLE DESCRIPTION ]" />
<meta property="og:image" content="[ LISTING IMAGE ]" />
<meta property="og:url" content="[ CANONICAL URL OF ITEM ]" />
<meta property="og:site_name" content="[ WEBSITE NAME ]" />

<meta name="twitter:card" content="summary">
<meta name="twitter:title" content="[ TITLE ]">
<meta name="twitter:description" content="[ ARTICLE DESCRIPTION ]">
<meta name="twitter:image" content="[ LISTING IMAGE ]">
<meta name="twitter:url" content="[ CANONICAL URL OF ITEM ]">

These are the tags I have implemented on my site. You may notice this violates DRY (Don’t Repeat Yourself) but the reason we repeat the information is because each service has their own name for the tags. These tags cover what’s needed for great presentation on Facebook, Google+, Twitter and LinkedIn.

If you can edit HTML in your CMS and put in dynamic values this should be fairly easy. In Octopress (what I use for this site) it only took a few minutes to implement. If you have a self built CMS I would highly reccomend putting it in.

Summary

Open Graph tags are definitely a “quick win”. They’re quickly implemented with a large benefit. Your links when posted on social media will be more attractive and professional. People will be much more likely to share the link because it will look good on their timeline.

It’s not something programmers generally think about, but it could give your blog a great boost, or get some extra traffic and customers for your company, for a small investment.

How to Blink an LED on a Raspberry Pi 2

The blinking LED is the “hello world” of the maker community, and today I’ll show you how easy it is to do with the Raspberry Pi 2 (or Model B)! We’re going to use Python and WiringPi for this project.

What you’ll need

For this article I’m using a Raspberry Pi 2, but you can also use a Raspberry Pi Model B. You will also need:

"Blink an LED Raspberry Pi 2"

  • A GPIO Adapter
  • Breadboard
  • Resistor
  • LED

What I am using for this project is highly recommended the Canakit for Raspberry Pi which contains everything in the list above. (This is an Amazon affiliate link).

Any decent breadboard or even a set of jumpers will work for this project.

How to Blink an LED with Python

The quickest way to get that LED to blink is to take a look at the pins of the GPIO and decide which one to tie to. Then you can use Python and the Raspberry Pi GPIO Library to create a script to light it up.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
import RPi.GPIO as GPIO             ## Import GPIO Library
import time                         ## Import 'time' library (for 'sleep')

blue = 7                            ## These are our LEDs
ourdelay = 1                        ## Delay
# pins 4,17,18,21,22,23,24,25

GPIO.setmode(GPIO.BOARD)            ## Use BOARD pin numbering
GPIO.setup(pin, GPIO.OUT)        ## set output

## function to save code

def activateLED( pin, delay ):
  GPIO.output(pin, GPIO.HIGH)      ## set HIGH (LED ON)
  time.sleep(delay)                ## wait
  GPIO.output(pin, GPIO.LOW)       ## set LOW (LED OFF)
  return;

activateLED(blue,ourdelay)

GPIO.cleanup()                      ## close down library

As you can see in the code above, it doesn’t take much to get things working. But I’ll explain the code a little deeper.

1
2
import RPi.GPIO as GPIO
import time

The following code imports the Python GPIO library, and the time library. The GPIO library, as you probably guessed is the library for interacting with the GPIO in Python. It does an amazing job of simplifying the process. The time library is there so we can put a delay in, otherwise the blink might be too fast to notice.

1
2
blue = 7
ourdelay = 1

Here I created a variable named “blue” (the color of the LED) and assigned it “7” which is the pin number we want. If I wanted to add multiple LEDs I could name it something like:

1
2
3
blue = 7
red = 13
green 14

I then created a “delay” variable of one second. This way I can change the delay of the lights blinking however I want.

You can name the variables anything you want, but this was just to make it easy to see which LED is which if I wanted to do some fancy light show.

1
GPIO.setmode(GPIO.BOARD)

Then, we set the GPIO mode to “Board” which means we’ll use the numbering of the pin by board instead of GPIO. This makes it a little easier to understand when using a bread board.

With this line of code we set the pin to be an output:

1
GPIO.setup(pin, GPIO.OUT)

There are 2 main commands to turn the LED on then off:

1
2
GPIO.output(pin, GPIO.HIGH)
GPIO.output(pin, GPIO.LOW)

If you wanted to blink an LED twice you would have to repeat the last two lines each time. So I decided to put this in a function and put the pin and delay as parameters. This way making a particular LED blink is as simple as:

1
activateLED(blue,ourdelay)

This is repeatable and saves code when doing larger programs.

To close everything down, we need to run the following:

1
GPIO.cleanup()

It’s that easy! You could easily write a nice Python script that do some pretty cool stuff with just a few lines of code.

How to Blink an LED with WiringPi

For this step we’ll install WiringPi for the libraries to interact with the GPIO. This allows us to do what we just did, but from the command line. We’ll need to install WiringPi:

1
2
3
4
5
cd ~/sources
git clone git://git.drogon.net/wiringPi
cd wiringPi
git pull origin
./build

If successful you should see a screen like this:

"Blink an LED Raspberry Pi 2"

Now we can light up the LED from the command line. Remember the pin 7 in the example above? We can now light up like so:

1
2
gpio mode 7 out
gpio mode 7 1

This will light up the LED. You can turn it off by entering:

1
gpio mode 7 0

"Blink an LED Raspberry Pi 2"

This makes it super easy to light up LEDs from the command line. You could create a pretty neat BASH script to do this, and do some neat things, or call this from other languages.

Summary

I hope this has helped in showing how easy it is to blink an LED on the Raspberry Pi 2/B. Of course as you progress on you’ll want to do far more than just blink an LED, but the GPIO libraries make it very easy to create some neat stuff. If you’ve experimented with this and done something cool, leave me a comment!!

Special Thanks to the folks in this thread on Reddit who helped with some corrections to this article.


Do you like my Rasbperry Pi Tutorials?

I’m constantly hacking on stuff with the Raspberry Pi. If you want to get notified every time I post a new article subscribe to my Raspberry Pi feed here, or you can Sign up for the Raspberry Pi Newsletter spam free!

Raspberry Pi 2 Has Arrived!

So my Raspberry Pi 2 has finally arrived, and I got to take a quick look at it. Pretty impressive so far, though I haven’t done much with it. If you don’t know what’s so great about the Raspberry Pi 2 I’ll give you a quick rundown by comparing it to the others.

Developer Predictions for 2015

Here I will outline my tech predictions for 2015. Specifically in the developer world. While I would never call myself an “authority” or “expert” on development trends I am passionate about this stuff and to my credit I do read Hacker News, Lobsters and Proggit every day. Yes, even on weekends and holidays. So there’s that.

Building C#/ASP.NET Apps on a Mac With vNext

In case you’ve been away from the internet for the last week, you’ve probably heard the big news from the ASP.Net team. They’re embracing open source in a major way. Scott Hanselman wrote a fantastic post about the news that nearly broke the internet (and certainly tested his hosting provider). Microsoft is really backing up their claims that they are committed to Open Source in a major way.

How to Set Up the MEAN Stack on Digital Ocean

If you haven’t heard of the MEAN stack, it’s a combination of technologies for serving up fast websites, using a set of technologies paired very well together. They consist of MongoDB, Express.JS, Angular.JS, and Node.JS. For more information check out MeanJS website for more details.