Testing the power of ASP.NET Web API + AngularJS

Well, this demo project includes a lot more than ASP.NET Web API and AngularJS, but, the main purpose of the project is to test how well this two function together. Because this is the first time that I use AngularJS from scratch to build a project I have picked few PROS and CONS. The demo is automotive data library which includes detailed specification for more than 25.000 car models and has more than 150.000 gallery images for different car brands/models.

car_brands

About SmartCarPick.com website

SmartCarPick.com website contains automotive data that is collected from the open data from few source points. The custom made crawler runs four times per day to check if there are any updates. On the front page all (available) brands are displayed, clicking on the wanted logo will bring you to the brand details page.

bmw_models

There you’ll get all the brand’s Models. By clicking on some of the models you’ll get the sub-models and different makes of that same model.

bmw_submodels

And for the detailed sub-model technical data click the wanted engine version.

bmw_details

Clicking on one of the images will bring you to the gallery for that sub model.

bmw_gallery.png

SmartCarPick Crawler

For building the crawler I’ve used HTML Agility Pack which allowed me to make maintainable, structured and easy understandable code. I’ve used crawler interface that has different implementation for different data sources. The crawler is an independent console application that is scheduled to run on every six hours for checking new data or updates of the existing.

Why use ASP.NET Web API Restful Service

I choose to use Web API RESTful Service because my purpose was mainly to build AngularJS SPA and play with the performance. The secondary reason is that I plan to use that same service to build and Xamarin multi platform application(s) that are going to be deployed for Android, iOS and Windows.

The service is also available for anyone that wants to build some kind of automotive data applications/websites.

AngularJS and Bootstrap 3 for the front end

One of the things that I didn’t like the most about Java Script was that writing a clear and understandable code is almost like mission impossible. With AngularJS and it’s bindings the code is easy structured and easy to maintain.  I’m going to be very short on the experience with AngularJS (if you like more detailed info feel free to contact me). Aside the small problems that I run into the main issue with angular is social sharing and search engine bots. For the social sharing I needed to do URL redirects because most of the social networks are not smart to parse SPA websites with dynamically loaded content. And Google says that most likely they will be able to crawl your website correctly (note “most likely”) . So if you are starting a business website that is publicly available and depends on Google search engine and Facebook shares I would still pick the good old MVC.

Happy coding and any comment about SmartCarPick.com is welcomed!

 

Advertisements

One thought on “Testing the power of ASP.NET Web API + AngularJS

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s