Head-First Into ASP.NET MVC 5, Bootstrap 3, and AngularJS

by Leave a Comment

AngularJS Hackathon by Fumi Yamazaki
AngularJS Hackathon by Fumi Yamazaki

The current state of web development is ALWAYS in a constant change. It’s challenging to stay top of the latest web technologies because it seems like there is a new framework, library, or toolkit coming out every 60 seconds.

The good thing is that no matter how many new technologies surface, understanding the fundamentals of the technology will allow you to pickup the new wiz-bang tool or technology and master it in no time.

When thinking about the core components of the web, it boils down into 3 technologies: HTML, CSS, and JavaScript. Now, lets briefly explore how these fundamental technologies enable the web.

Quick Overview of HTML, CSS, and JavaScript

If you have done any web development in your career, I’m sure you have had some experience with one or several of these technologies. So, I’ll be extremely brief in my explanations.

  • HTML– responsible for defining the structure of a web page
  • CSS – determines the look-and-feel for the HTML page
  • JavaScript – make web pages to be interactive and provide user feedback

These technologies are at the core of every web framework, library, or tool that exists exist on the web. Knowing that, this allows me to fast-track my learning path whenever I decide to add a new language or technology to my toolbox.

Now we are ready for the good part, I’m going to share my approach for mastering the ASP.NET 5, Boostrap 3, and AngularJS.

My Approach to Fast-Tracking Mastery

I’ve learned that the fastest way (at least based on my experience) is to learn by doing. This requires jumping head-first into the technologies you want to learn.

Now, in order to maximize your learning, you need to decide on what you are expecting to learn, no I’m sorry – master, as you prepare to start your deliberate practice. So, I have decided that I will build something that solves a real problem.

I will be creating a personal budgeting application that will replace a spreadsheet that I’m currently using to manage my our household budget. I will creating list of features that need to be implemented to provide me with the same benefits as my current spreadsheet approach.

That’s All Folks

One of my goals is to ensure that I’m able to use this application on my mobile device. I have decided on using ASP.NET MVC 5, Boostrap 3, and AngularJS as my toolset of choice.

I’m looking forward to sharpening my skills and solving a problem that has been causing me some grief all at the same time. First, I will be exploring the basic concepts of each technology – terms, definitions, etc. I will share my progress along the way to mastery, so stay tuned.

7 ASP.NET vNext Features You’re Guaranteed to Love

by Leave a Comment

This was an extremely informative video, where Scott Hanselman discusses and demos some of the key features we can expect in ASP.NET vNext.

If you decide to give yourself the gift of time by choosing to skip watching the video, I have captured some of the highlights of his presentation.

The presentation starts with Scott listing some trending feedback that is currently circling in the software industry. His points were extremely valid and I’m going to list some of them for references to help set the tone for why the ASP.NET vNext features complement the development for next generation software.

Developers are saying…

Our role is more important than ever before

We are required to innovate and deliver much faster

I need a cross-platform mobile development strategy

Based on this developer feedback, Microsoft is clearly heading in the right direction for enabling developers to leverage their tooling to develop enterprise grade software with rapid iteration cycles. Enough of the build up, let’s jump right into some of the ASP.NET vNext features we can expect from Microsoft in the near future.

1. Running ASP.NET vNext.NET Apps on Localhost of a Mac

In order to fully appreciate this feature, you must have the experience of trying to develop using Microsoft technology on your OS X. I have much appreciation for this feature since I have had to install and maintain a Windows VM for ASP.NET development on my Mac.

The demo of this feature proved that you will have the ability to load your web application via the command line. Once loaded, you can go to localhost (on your Mac), and view you ASP.NET application (remember, on your Mac). That’s pretty nice.

2. Side-by-Side .NET Framework Compatibility

In .NET vNext, you will have the ability to run multiple versions of the .NET Framework side-by-side without any issues whatsoever – well, ideally without any issues =]. This feature may not be as flashy as some of the others, but this may be more beneficial that it might appear initially.

Have you ever wanted to use a new feature that would boost the productivity of you and your development team – just to find out that you are not running the version of the framework that allows you to leverage the feature in all it’s glory. I know that feeling.

The purpose of this feature is to allow you to push the envelop when you hit a similar roadblock. The difference is that you will have the ability to see if you can update your application to the required framework version, without putting the stability of your other applications on the web server in question.

3. ASP.NET vNext Goes A La Carte

ASP.NET vNext will give you the ability to only include the portions of the framework that are required to run your application. This will give you the opportunity to reduce the footprint of your applications by removing the pieces of the framework that are not in use within your project.

This somewhat subtle enhancement has the potential to reduce the load time of your application since your app will only load the framework references it needs.

4. No More Local Development Builds (Like Magic)

When I saw this feature, I immediately imagined the boost in productivity I would experience. In the demo, Scott demonstrates how you would be able to make changes in Visual Studio (VS) and have them instantly take effect in the browser without you having to initiate a rebuild.

We have been able to do this when changes are made to our HTML files for some time now, however, the demo shows that you will be able to change compiled code files without performing a manual rebuild.

In the demo, this was proven when Scott changed a C# file in notepad, hit refresh in the browser, and the changes took effect. He then explained that this is possible because the assemblies that were originally in the bin directory are no longer in the bin directory – I’ll let that simmer a little.

Yeah, you heard me right, there will no longer be assemblies in your ASP.NET vNext application bin directory. I know, that’s crazy-talk. If you don’t watch the video for any other reason, it’s worth taking a peak to satisfy your curiosity.

5. Optimized for Devices vs. The Cloud

Simply put this means that .NET Framework will be optimized for the client and the cloud. Client apps, such as Windows Store, Windows Forms, and Console apps. This will streamline the footprint of your client applications with no effort on your part.

In regards to the cloud, your .NET applications that are running in the cloud, such as ASP.NET vNext Web Forms, MVC, Web Pages, Web API, SignalR, and WCF, will be optimized for high-throughput. So, you can expect better performance from your cloud services, once again with no effort on your part.

6. Apache Cordova Tooling in Visual Studio

Apache Cordova is a platform for building cross-platform applications with HTML, CSS, and JavaScript that can be packaged to run inside a a native mobile device (iOS, Android, and Windows Phone, etc.).

This technology has been peaking my interest for some time now because of the idea of leveraging my existing skill set to write cross platform mobile applications.

7. Debugging the Cloud from Your Local VS Environment

Having the ability to debug your code in the cloud drastically simplifies the development of of your cloud services. It’s always ideal to test your code in a production like environment.

So, this bring this concept to reality by allowing you to use a service like Azure Websites to host your application and literally debug your code as if it is running on your local machine. Based on what I saw in the demo, this will require you to setup your own Virtual Private Network (VPN) in Azure.

I’m not sure how trivial the setup of the VPN is in reality. However, if I have the need to setup my own VPN and it’s not as straightforward as one would hope, I’ll share my experience with the hope of saving you some time. Once it’s setup, this is an extremely powerful feature that will allow you take your cloud development skills to the next level.

Wrapping It Up

Now that you have heard a few of the highlights of what you can expect from ASP.NET vNext. I hope you found this article beneficial. If so, let me know what you think below and let’s kick off the conversation.