Twitter Bootstrap and LESS talks

Twitter Bootstrap is great. I’ve given a couple of talks on this subject and am scheduled to give a couple more. Feel free to grab the presentation and the code for the talks.

I hope to carve out some time in the near future to create a proper blog post about this topic. Do yourself a favor and grab ‘Twitter Bootstrap with LESS source’ from NuGet and start using it in your projects. It is really beneficial.

Quick run down to get going with the source code. If you grab Twitter Bootstrap with LESS source from NuGet it puts the .less files under /Content/less/*.less. Then in your aspx/php/html/whatever page add a stylesheet reference to the bootstrap.less file.

The bootstrap.less does an import of all the other .less files that make up bootstrap. (There is also responsive.less which imports all .less files needed to make your site responsive. Responsiveness in this context refers to rendering your HTML elements differently based on resolution. So if you are using a tablet your site can look differently than when it is on a phone versus a large monitor with a high resolution. This is done via CSS media queries.

Twitter Bootstrap (with LESS) comes with the less.js file. This is fine if you want to bring down the less file and have it generate CSS on the fly on the client. Another way is to ‘compile’ the less files into css content at development time. Another way is to add the dotless .net assembly to have any .less GET requests processed from that assembly by changing the web.config and adding a handler for the .less extension. This is the method the demo code uses.

LESS is fantastic. I highly recommend you look at it and use it instead of CSS. There are other languages like LESS (SASS and Stylus) but LESS is what Twitter Bootstrap uses and is the most syntactically like CSS.

Another note about dotless: If you are using IIS or IIS Express you want to remove the httpHandler section from the system.web section. For IIS/IIS Express it only needs (allows) it in the system.webServer section.

While this just scratches the surface of the talk it should be good enough to get going with these great technologies. So have fun!

-Chad

2012-05-28Chad Carter 2 Comments

Windows 8 Consumer Preview on my Development Machine

Over the weekend I created a bootable VHD with the Windows 8 Consumer Preview operation system on my development machine.

My initial reaction on my dev machine on Monday morning was that it was less than compelling. However, after using it for just a half a day I think it is very compelling. I’m just scratching the surface but I definitely love this OS already. I still think there needs to be some instructions for folks that get to desktop mode that may not know how to easily get back to the start screen, but that can easily be done with a short cut on the desktop to go back or even a ‘Start Button’ on the task bar. Once you know you just have to hover on the side of the screen to hit the Windows charm or hit the Windows Key on the keyboard (which is how I got back) it is no big deal, but for folks who don’t know it could be frustrating.

I also installed Windows 8 Consumer Preview directly on the metal on my ASUS EP121. Touch is very impressive on the tablet. I fell in love with it immediately. The key to anyone trying to use Windows 8 Consumer Preview on the ASUS EP121 is to download the drivers from the ASUS website first. I have Bluetooth working on it and it is great.

On my development machine, which is what this post is about, I have 2 GPUs. They are both NVIDIA’s GeForce GTX 560 Ti models. I ran into a few issues with the system rebooting on me after displaying RGB dots all over the screen. Updating the drivers helped but it would still do it. Then I changed the “Power Management Mode” in “Manage 3D Settings” in the NVIDIA Control Panel to “Prefer Maximum Performance” and I changed the “Multi-display/mixed-GPU acceleration” to “Single display performance mode.” After making that change the machine still locked up and rebooted once this week but hadn’t for almost 4 days. So these changes made it more stable but it didn’t solve the problem entirely.

Before I get into the actual experience, I figured I would talk a moment about the setup I went through to get the VHD setup. I started with Scott Hanselman’s blog posts on the subject. My machine doesn’t like booting from a USB device and I didn’t want to make a DVD so I used the tip from the commenter on the blog post and setup the VHD that way.

I backed up my Boot Manager Database by running the following:

BCDEDIT /export c:bcdbackup.bak

I gave my VHD 200GB of space but at this point only have used 59GB so far.

When I done installing it came up with Windows 8 with no issues. I was very happy. I was running Windows 8 from the metal via the VHD.

Now, something that made my move easier is the fact that when I installed Windows 7 on this machine back in June when I bought it I split out my Users folders (and Program Files) to my 3TB HDD instead of my 128GB SSD where the OS was installed.

Since I had all the documents on my non OS drive I was able to easily connect to it from my Windows 8 OS.

I have two monitors (would like a third but don’t have room on my desk). Originally the Windows 8 start screen was on the left monitor. I right clicked the taskbar on the right-hand side and selected “Make this my main taskbar”. This moved the start screen to the right like you see above. (You can click the images to get larger images.)

What I noticed is when I started using the metro apps while also doing something on the desktop is I had no idea what time it was. Currently, the time on the taskbar is put on the same screen as the Windows 8 start screen (so if the start screen is visible, the clock on the taskbar isn’t visible.) The only way to see the clock on the start screen (or in a Metro app) is by hovering the mouse on the right side of the screen. This brings up the charms (search, setting, start, etc) as well as the clock in the bottom left quadrant of the screen. That isn’t acceptable to me. I want to be able to glance at a clock.

So I made the Windows Gadget clock visible. (I hadn’t ever used the gadgets in the past.) As you can see I put it on the bottom of my desktop screen. It has a “Always on top” checkbox, but it doesn’t always work. So in the following screens you will see that I just made sure the window didn’t obscure it.

In the above screenshot you will see that I’m using VS 11 as well as SQL Server Management Studio and a PowerShell window where I’ve utilized posh-git so I didn’t have to use Git-Bash. I really like PowerShell.

When I’m not using a Metro app and want both screens to be my desktop I can obviously do that as well. Here I have two more PowerShell windows opened as well as Windows Live Writer (so I can write this blog post.) One of the PowerShell windows is using posh-hg since I do a lot of personal development using Mercurial and Kiln from Fog Creek. The other PowerShell window is just for random stuff I need to do on the machine. I created some functions so I can just put “dohg” or “dogit” and it will load up posh-hg or posh-git and set different color schemes. This way I can easily know which window I need to do my work in.

The above screenshot shows how I opened up my Metro mail client and then put it in a snap view so I could have that going while I still utilized the majority of my two screens with desktop apps.

I like the Metro mail client. Being able to see all 5 of my active email addresses is very beneficial. I found myself using my Windows Phone 7 to quickly check for incoming messages before. Now, I can easily see it through this mail app.

Although the above isn’t very practical if you are trying to do something on the desktop, I found it to be very productive to switch over to filled mode (opposite of snapped mode) to respond to an email.

If I made it full screen I would have to snap it back and then move a window on my other screen to get the system to go back to desktop mode with the Metro snapped app displayed. This way I am able to easily move it from filled mode to snapped mode.

Unfortunately, I had to revert to using Outlook again as I just couldn’t easily add attachments and my exchange contacts (i.e. coworkers) wouldn’t automatically populate in new messages. All my contacts from my hotmail and gmail accounts were fine, but not from my company’s address book in Exchange.

So when I brought up Outlook it started to sync. I didn’t want it to do that since I knew my Gigs of emails were on my D drive. So I exited Outlook and ran the following command to have Outlook point to my existing file (after deleting the .ost file it was making):

cd "C:UsersChadAppDataLocalMicrosoftOutlook”

mklink "Outlook Data File – ccarter@robertsonmarketing.com.ost" "D:UsersChadAppDataLocalMicrosoftOutlookOutlook Data File – ccarter@robertsonmarketing.com.ost"

Then when I booted up Outlook it grabbed my existing file and only had a day of emails to retrieve. (I tried the Metro mail client for a full day before reverting back to Outlook.) I still use the Metro mail app for my other 4 active email addresses though. I do like it.

The above screen was when I ran the basic Direct3D template and then put it in fill mode. So I was using VS 11 to run/debug the Metro app that was in fill mode. Still having my email up.

Those final two images show the Metro Reader application. The writing is too small to be useful when it is in a snapped mode but I did enjoy using it in the fill mode.

Once I had the machine the way I wanted it. (I LOVE IT!) I wanted to create a ~~restore~~ refresh point. I followed this article and had it created in about 35 minutes.

It takes a long time to get past that 0% though so don’t give up.

My next steps will be blowing away the VHD and reformatting my SSD that has Windows 7 on it to use Windows 8 Consumer Preview. I’ll be using this restore point once I get it installed. I like using Windows 8 that much. I’ve not lost any productivity in using it and using VS11 in Windows 8 is excellent.

Just some quick tips from my using Windows 8 Consumer Preview this past week:

Corners are important! Hovering your mouse on the Top Left of the main Metro screen (in Desktop mode or Metro mode) brings up previously used Metro applications. Handy!

Moving your mouse to the Top Right (or really anywhere on the Right edge) and you will get the charms.

Windows + . (period) Will alternate your Metro app from Full screen to Filled to Snapped. Very handy.

Semantic Zoom: On the tablet you can do the typical pinch zoom gesture but with a mouse and keyboard you select a little magnifying glass on the bottom right of the Metro screen.

I enjoy using IE10 as well (in Metro and on the Desktop).

I’m glad we can still pin things to the taskbar on the desktop as that is very handy.

I love the lock screen. I like how integrated everything is from my ~~Windows Live ID~~, .~~NET Passport~~, Windows Account to my Facebook and Twitter accounts. It is all very nice. It is like my Windows Phone 7 has grown up and become a full blown PC. Go Figure.

So if you are debating on jumping in on the Windows 8 Consumer Preview hopefully this will help you make that decision. I love developing on Windows 8 Consumer. I think you will too – especially if you have two (or more) monitors.

-Chad

2012-04-06Chad Carter 1 Comment

Alcohol and Geek Conferences

So there was a lot of tweets today about alcohol at conferences and folks feeling left out.

The original post was actually making a point about not being able to have meaningful conversations with smart folks once they get sauced. I’ve definitely ran into that at some conferences. While at the Microsoft MVP conference last month there was someone who had consumed too much and abruptly interrupted a conversation I was having with someone else. I’m always opened to including anyone in any conversation I’m having at a conference, but this was overbearing and obnoxious. It wasn’t the conference’s fault but the person who consumed too much. Now that I think of it, this happened twice on two different nights at the conference by different people. Hadn’t thought about it much before.

A lot of the article seemed to address something that I haven’t ran into – conference organizers talking up the booze. Most of the conferences I have gone to are Microsoft conferences. From Convergence with big budgets for their partners and customers who spend millions of dollars on different ERP systems (like Dynamics AX, GP and NAV as well as Dynamics CRM) to Gamefest which has just a few hundred game developers (mainly guys from AAA studios and some indie folks like myself) along with those in between. I’ve also been to some community conferences like Codestock. There was alcohol available but it wasn’t a drunkfest – or at least I didn’t see it if it was. So perhaps it is just the JS conferences where this occurs or perhaps I’m too blind to see it. There typically is some party event but it seems that most folks leave those to go to a bar to hang out and/or really get hammered. I’ve not joined anyone at the bar after the main event closes down at 10 or so. It seems it is common for folks to not come back until 2AM or so. They typically miss the sessions the next morning. I’m not going to miss a session when I’ve paid money for the conference. Some folks go just to socialize and have those conversations while sessions are going on. I typically don’t. I could see great benefit in that, but unless there is no topic I’m interested in or the speaker is having a hard time I tend to stick to sessions. I do like open spaces for the times when nothing else fits.

Regardless, I didn’t feel excluded because folks were drinking and I wasn’t. I chose not to go to the bars in wee hours of the morning but even if it wasn’t at a bar I’d probably not go anyway since I’d want to get to the sessions in the morning. I’m definitely not a Brogrammer. Oh well, wasn’t cool in high school, why should I start now?

Warning: Contains Offensive Language

This has nothing to do with conferences, but when thinking about feeling left out I recall going out to dinner with some coworkers and their wives about a decade ago. We all had a good time, I thought.

A couple months later I found out that the group had done a couple more of those dinners but I hadn’t heard about them. I was confused as to why I wasn’t asked to join them again. When I asked a good friend why we weren’t invited he told me.

It seems that my wife and I were the only people that didn’t order any alcohol. I was shocked to hear this was why I was excluded. I asked if I came across as descending or anything. I was assured that I wasn’t but they didn’t feel comfortable drinking around us.

That blew me away. So I felt left out but it was because I made them feel uncomfortable. I didn’t say anything about them consuming the beverages. Just the act of me ordering a Mountain Dew instead of a Budweiser caused discomfort with my coworkers. I still don’t understand this. Regardless, you won’t hear me passing judgment on someone who is drinking beer or wine. I hope people don’t pass judgment on me because I prefer carbonated drinks.

So I guess when it comes to drinking at conferences I think the thing I try to do is make sure I’m not making someone else uncomfortable. I’m not uncomfortable talking to someone with a beer or wine glass in their hand. I don’t want them to be uncomfortable with me because I have a soft drink in mine.

There are better ways to have meaningful conversations than at a loud bar or party event. I typically don’t stay at those too long because you can’t have a good conversation. I’ll go back to my room and write some code and reflect on the things I learned. I hadn’t really considered those events really part of the conference so I didn’t mind. Of course, open bars have got to be expensive. I sure hope I’m not paying for that in the price of my conference ticket.

In my opinion conferences are there so we can learn and be around folks with the same interests. Meaningful conversations are easier to have when someone isn’t plastered but I’ve only seen that a few times. Of course, I head back to the hotel room around the time folks are looking for a bar after the party so I probably avoid seeing a lot of it.

As with everything, moderation is the key. Anything to excess is bad – including coding non stop and constantly thinking about work. That is excess and it isn’t healthy and I constantly do it.