How to fix IntelliSense in VisualStudio for Razor ViewEngine.

If you don’t have IntelliSense in VisualStudio for Razor view, you might be using wrong project type like class library or your configuration is wrong. For last one it is enough adjust your web.config file in Views folder. But for first case you need to make several steps to enable it. Here those steps as follows :

  • Add references to following ddls : System.Web.Razor, System.Web.WebPages, System.Web.WebPages.Razor. Those you can find in packages folders like Microsoft.AspNet….. (Please check first if you have MVC installed using nuget package manager.)
  • Create new MVC project with Visual Studio. Unload MVC project file and copy Project type Guids into your project: <ProjectTypeGuids>{349c5851-65df-11da-9384-00065b846f21};{fae04ec0-301f-11d3-bf4b-00c04f79efbc}</ProjectTypeGuids>
  • The same do with imports. I copied those to mine project as well. :

    <Import Project=$(VSToolsPath)\WebApplications\Microsoft.WebApplication.targets Condition=‘$(VSToolsPath)’ != ” />

      <Import Project=$(MSBuildExtensionsPath32)\Microsoft\VisualStudio\v10.0\WebApplications\Microsoft.WebApplication.targets Condition=false />

      <Target Name=MvcBuildViews AfterTargets=AfterBuild Condition=‘$(MvcBuildViews)’==’true’>

        <AspNetCompiler VirtualPath=temp PhysicalPath=$(WebProjectOutputDir) />

      </Target>

 

Now reload and rebuild your project and have fun with Razor View Engine.

Posted in Development

2015 in review

The WordPress.com stats helper monkeys prepared a 2015 annual report for this blog.

Here’s an excerpt:

The concert hall at the Sydney Opera House holds 2,700 people. This blog was viewed about 9,200 times in 2015. If it were a concert at Sydney Opera House, it would take about 3 sold-out performances for that many people to see it.

Click here to see the complete report

Posted in Uncategorized

JsonForm

we saw a lot of json-schema implementations nowadays. What I like about json schema that’s based on json – most popular an open standard used primarily to transmit data between a server and web application, as an alternative to XML.

We still don’t have such stand-alone standard like Json Schema, but it’s coming and I believe that in the market we need big player like jQuery, Google or Microsoft saying : hey guys, here is a json schema, from here you can do this and this, here tools, use it wisely …

I saw really good implementations with json schema, but I think that there is space for one more open-source project. So I’m glad to announce my first big open-source project I’m gonna build with help of big brother internet.

Why it should matter ?

  • I do not love software development 🙂 I really do, but it’s time consuming process and I’m tired, tired of do things which can be much simpler.
  • I do not love write things twice. Web or mobile software development has a bad habit of repeating.
  • Even as software developer I like simplicity. I like idea generate and fill out those forms without writing any single line of code
  • I saw a lot of products and companies which invest a lot of time for doing simple things. 10 layers for simple web app, insane mappings, huge overwhelming ORM mappers, many to many relationship, validation, code interception and templates is not a rocket science anymore. And sometimes why I should matter those things if my goal is create simple fully functioning form.

What it will do

  • First step is defining schema : form name, display types, data types, validation rules. Regarding each combination of display type and data type you will get particular settings set.

define form

Also you can work in advanced level and enter more developer specific functionality :

Screen Shot 2015-05-20 at 10.28.22

  • Second step is load brand new form. You have two options here : put generated code into html or load form the internet.

Screen Shot 2015-05-20 at 10.34.57

  • And finally you can collect your data.

Screen Shot 2015-05-20 at 10.36.56

What is so different from other implementations ?

  • it will have tools for the end user and he will be able create forms without any single line of code.
  • it will have option for advance configuration
  • in form you can add other forms, multiple them : person has 3 addresses – shipping, home, business.
  • Form elements can be filled out from 3rd party source : web service, feeds, database.
  • Workflow after submitting form.  On submit you can define what you gonna do.

Sounds like I’m going to create new Custom Forms functionality like Orchard CMS has ? Well, maybe, but this is more based on json and javascript. As a backend I see NoSQL. 

This will be my hobby project. First implementation is already in my home made project – startup.

Code will be placed into bitbucket repo soon : https://bitbucket.org/djovaisas/jsonform

Domain is registered ! – http://jsonform.com I already spent 8 Eur per domain, so there is no way back !!!! 🙂

For now – its only on my head, any contribution and collaboration is appreciated. This summer with help of several interns I will provide source code and working environment. Cya

Posted in Development, Startup

DataContracts VS MessageContracts

Lastly I was asked explain MessageContracts need.

Typically when building web service, developers pay close attention to the data structures and serialization issues and do not need to concern themselves with the structure of the messages in which the data is carried. For these applications, creating data contracts for the parameters or return values is straightforward.

However, sometimes complete control over the structure of a SOAP message is just as important as control over its contents. This is especially true when interoperability is important or to specifically control security issues at the level of the message or message part. In these cases, you can create a message contract that enables you to specify the structure of the precise SOAP message required.

Here is the code from one of my service I prefer to work with.

Screen Shot 2015-04-27 at 15.53.06

A DataContract (DTO) is a description of a type that is exposed and supported by your service. A MessageContract is an abstraction over a SOAP message that allows you to explicitly dictate the structure of the underlying message.They are meant to compliment each other and serve different purposes.

Why not in response side not use NotificationDataContract (can be called NotificationDTO) ?

Small changes can break all clients.

Let’s say I have requested for lookup data (Id and Name is enough to fulfill some drop down list in UI). In such case your response can look like List or PersonsDTO (second is better). For comming requirement it might be not enough have only two properties in PersonDTO – Id and Name. E.g. we need extra info about credibility, add list of orders, etc… We need more. What we going to do ?

First option : expand existing DataContract and put more properties to it

It might be the case that you will expand PersonDTO data transfer object(Data Contract). You will add more and more properties. But for front-end developer can be tricky manage those properties in UI. Looking at PersonDTO class you cannot be sure in which operations it was used.

Second option : rename PersonDTO to PersonSmallDTO ?

If you would prefer work in this way – that’s fine for me till I’m not involved in your team. Also this is a breaking change if you change response DTO name in service side . You change service layer, so your clients should be aware of that.

>>>

In my way I suggest you clearly define message – for what your service actions is responsible ?

Beneath messaging you can get more :

Having massages into separate assembly allows you be more flexible. You can have base classes, one for list requests where you can expecting such parameters like paging, sorting, another base class can consist of base parameters with common properties : version, token, api key.

GetPricesRequest : BaseRequest, IPaginationRequest

public interface IPaginationRequest
    {
        string Column { getset; }
        SortDirection Direction { getset; }
        int PageSize { getset; }
        int PageNumber { getset; }
    }

As I mentioned above you can have base class for all properties which consist of common properties. So you can do either global filtering in Service Stack or add service behavior in WCF for checking those properties accordingly.

For many of us DataContracts is enough, for me – interoperability, single responsibility and clarity.

To summary this I would like to share with you guys ServiceStack thoughts about message contracts. Have a good reading :

https://github.com/ServiceStack/ServiceStack/wiki/Why-Servicestack#wcf-the-anti-dto-web-services-framework

Posted in Development

Deploying angularjs, bower grunt application to Windows Azure

if you have on-premise server please follow this link to have instructions how to deploy angularjs app with TeamCity.

Deployment steps are common for all node applications. You need have all dependencies first and then build your app, test it, move to public area if necessary.

so it would be :

1) npm install

if (your package.json doesn’t have bower and grunt defined you need call it separately like : npm install bower –g, npm install grunt-cli –g ….

2) bower install

resolve your dependencies with app functionality

3) grunt build

To work with azure I installed kudu tool : npm install azure-cli –-global

so if you have azure SDK installed you can run now : azure site deploymentscript –-node 

2 files should be created .deployment and deploy.cmd

You can look at file deploy.cmd and you can see that 1st step (npm install) is already covered for you. I copied code and added 2 more steps :

:: 5. Install bower packages
IF EXIST “%DEPLOYMENT_TARGET%\bower.json” (
  pushd “%DEPLOYMENT_TARGET%”
  call :ExecuteCmd bower install
  IF !ERRORLEVEL! NEQ 0 goto error
  popd
)

:: 6. Grunt build
IF EXIST “%DEPLOYMENT_TARGET%\Gruntfile.js” (
   pushd “%DEPLOYMENT_TARGET%”
  call :ExecuteCmd grunt devBuild
  IF !ERRORLEVEL! NEQ 0 goto error
  popd
)

if your package file is missing bower dependency you can install it separately :

:: 4. Install bower
IF EXIST “%DEPLOYMENT_TARGET%\bower.json” (
  pushd “%DEPLOYMENT_TARGET%”
  call :ExecuteCmd !NPM_CMD! install bower -g
  IF !ERRORLEVEL! NEQ 0 goto error
  popd
)

what can I say : works in my machine !!! sorry I mean works in some Azure machine…

Posted in Deploying, Infrastructure

Deploying angularjs, bower grunt application to Windows server using TeamCity

Hi, lastly I had a chance improve my deployment skills. Our application we build now is based on AnglularJs framework. To have good practices out of the box we used yeoman. Yeoman is a nice scaffolding tool which allows you start very quickly with web app development. In our case we used angular generator (bower, grunt, bootstrap included)

To have CI deployment in Windows Server we use TeamCity. TeamCity has plugin called “Node.js build runner” by jonnyzzz.node

Deployment steps are common for all node applications. You need have all dependencies first and then build your app, test it, move to public area if necessary.

so it would be :

1) npm install

if (your package.json doesn’t have bower and grunt defined you need call it separately like : npm install bower –g, npm install grunt-cli –g ….

2) bower install

resolve your dependencies with app functionality

3) grunt build

Here is how it looks like in TeamCity :

Screen Shot 2015-04-14 at 11.58.32 

1st step is for getting dependencies regarding your package.json file. I also included grunt installation to be sure if grunt is downloaded before executing grunt commands

Screen Shot 2015-04-14 at 11.59.31

2nd step is grunt command. What it does is just a call “bower install”. I defined this command in grunt file :

grunt.registerTask('resolve', 'install the backend and frontend dependencies', function() {
var exec = require('child_process').exec;
var cb = this.async();
exec('bower install', {cwd: './frontend'}, function(err, stdout, stderr) {
console.log(stdout);
cb();
});
});

 

Screen Shot 2015-04-14 at 11.59.50

3rd step is run my custom build called DevBuild

Screen Shot 2015-04-14 at 12.00.00

I don’t use –force flag anymore. Instead if i have some build problem I save my option to resolutions section (see this thread https://github.com/bower/bower/issues/866)

And that’s it…

Posted in Deploying, Infrastructure

Top 10 Inspirational movies

Summer is coming and winter is in the past. Here is the list from watched movies I want to share with you guys. I like inspirational movies, books, podcasts. I’m preparing new 10 books I’ve read so far, but for now about movies :

1. Whiplash
2. Interstellar
3. Apocalypse: The Second World War
4. The Imitation Game
5. Gone Girl
6. The Water Diviner
7. The Theory of Everything
8.  Unbroken
9. Million Dollar Arm
10.12 Years a Slave

It’s my personal taste, though… Cheers…

Posted in Uncategorized

2014 in review

The WordPress.com stats helper monkeys prepared a 2014 annual report for this blog.

Here’s an excerpt:

A New York City subway train holds 1,200 people. This blog was viewed about 5,600 times in 2014. If it were a NYC subway train, it would take about 5 trips to carry that many people.

Click here to see the complete report.

Posted in Uncategorized

WordPress Tips and Tricks

Have you ever seen shitty code ?  Open wordpress and you will see. I mean open as developer, try change something what is not in the theme options 🙂 Whole decade I was trying avoid such thing like wordpress regarding code base it has and now my hands are dirty, I already did some investigation on wordpress and have some basic knowledge.

Here is a simple guide for people who wants develop web site regarding No 1 CMS in the world.

Wodpress is based on php, so that means you can start with Notepad. (I suggest Notepad++)

You need install wordpress into server which has support for apache web server, php and mysql database. Don’t do it manually, use wamp. Actually I have IIS web server instead. So use used  this guide and install wordpress on top of IIS.

Ok what’s next  ?

This is not an user guide, this is more about pain I had using wordpress. So here is several tips and tricks you need to know :

  1. It’s slow. WordPress indeed is very slow. Nowadays looking at code you can feel better than several years ago, but there is no good management for code usage. I see a lot of bad requests made by some plugins, other issue is related with web page resources. Despite to the fact that some plugins are useful only for particular page or page sets, javascript and css files are loaded in each page constantly .Of course it’s good thing that browser itself does caching also file minification and output cache are on board. But still I love less calls to the database and see poor html.The good thing is that responsive design, bootstrap framework and other changes related with clean and poor html code are already here.
  2. Have you heard : “He was so lonely that even spam inbox was empty”. Unfortunately this is not the case in real life. Spam is everywhere. Avoid Spam with akismet. I think it’s included by default from version 4.0. If you use contact-form-7 plugin like I do, please add honeypot. Bots somewhat blindly fill in fields, irregardless of whether the field should be filled in or not. This is how a honeypot catches the bot, it introduces an additional field in the form that if filled out will cause the form not to validate. On top of that integrate akismet validation. Akismet will then judge whether this submission is likely to be spam.
  3. Plugin can kill existing functionality so be prepared and after each plugin installation go through your website and check it carefully. I installed plugins like GC Testimonials or Background Music Player Lite and suddenly I realized that gallery menu item disappeared and portfolio doesn’t work anymore. That’s a pity. Success of wordpress is tightly related with amount of plugins like Apple devices with dedicated applications. Unfortunately wordpress plugins’ ecosystem doesn’t have such validation like Apple company does for apps. It’s open source….
  4. SEO – even my grandmother knows what’s SEO. This is first question you will hear from your customer who wants create a web site. I’ve tried 4 of them and WordPress SEO by Team Yoast is the best choice I know so far.
  5. Security – still working on that. Trying iThemes Security
  6. CMS is all about content. Visual Composer has been improved a lot. Backend, Frontend editors can be the option for you. In my opinion it still adds some noise. I’m ok with that because I’m developer and there is no problem work with poor html directly. For this blog I use “Windows Live Writer”.
  7. BackupBuddy – is very helpful plugin which allows you port your existing website from one place to other including database, files and settings. In migrate step you need define new domain address, location of your database and that’s it. BackupBuddy does it perfectly. Moving web site manually is mission impossible ( Ok, ok it’s possible but requires a lot of time and know those places where you need make an adjustment.)

Summary  :

CMS is all about content : how you can easily add content, read content, find it on the internet. If you are advanced developer for wordpress you have a set of nice working tools and plugins and I believe that web site built with wordpress can be safe and fast. It depends on your skills. So don’t blame wordpress like I just did, but be prepared and patient

Posted in Development

Demystifying Google API and OAuth2

Saturday morning usually I start with chess but now I decided play with some code. It really hurts when you start some software development and try use such beast like Google API – huge amount of information, huge amount of working examples with different bunch of code or just breadcrumbs…  It’s not so easy start developing when you don’t understand principles : OAuth, OAuth2, token, refresh token, client secret, client id,  redirect uri, offline, online, scopes …. Why at least I need OAuth2 where is my lovely “basic authentication” with username and password ?

Ok let’s clarify things one by one :

  • Task to be accomplished – what we want to achieve this nice morning and what is our goal and how we can proceed.
  • Authentication – let’s get a passport for flight through the wire
  • Specifics – or how we can create google spreadsheet
  • Documentation – good articles and source code examples I found so far

Task to be accomplished :

To be clever guy I decided learn google API and add data to google spreadsheet and use that data for any purpose later. To have things more complicated let’s play with other users’ data. For such reason we need create an application in Google developers portal

In developers console you need create a project and press magic button : “Enable an API”

Do you remember why I called Google as a monster 🙂 ? Look at that huge APIs’ list : Maps, Books, Youtube, Blogger, Drive, Google+ …. Find your own.

Screen Shot 2014-09-27 at 13.13.50

In which area we decided create an app ? Yes, we agreed work with Drive API – spreadsheets. So we will ask for full, permissive scope to access all of a user’s files.

Authentication :

The Google API also supports older authorization options, such as OAuth 1.0, AuthSub, or ClientLogin; however, in most cases I recommend migrating to OAuth 2.0 if possible. If your application has certain unusual authorization requirements, such as logging in at the same time as requesting data access (hybrid) or domain-wide delegation of authority (2LO), then you cannot currently use OAuth 2.0 tokens. In such cases, you must instead use OAuth 1.0 tokens.

The OAuth 2.0 authorization framework enables a third-party application to obtain limited access to an HTTP service, either on behalf of a resource owner by orchestrating an approval interaction between the resource owner and the HTTP service, or by allowing the third-party application to obtain access on its own behalf

Next step is obtain OAuth 2.0 credentials from the Google Developers Console.

Screen Shot 2014-09-27 at 13.19.41

In APIs & auth section press menu item “Credentials” and “Create new Client ID” button. In the next screen choose : “web application” and change domain if you have it. If you don’t have a domain yet, please follow this blog post and “create” your own binding with fake domain (For Linux platform users  : play with ifconfig I guess)

Ok, as a result we have Client ID, Client Secret, redirect uri. Those are main parameters for authentication.

Let’s be secure and use OAuth 2.0. You may ask about OAuth 2, how it works ? Better read this article which explains this process thoroughly

webflow

The image above has been stolen from article I just mentioned. Forgive me dear Google. We have 3 calls right ? On first step we have intermediate window called “Consent Screen”. This screen allows to the end user decide for : use our app or not use, share resources or not to share. The end user will be informed and he must agree in case he wants continue work with our application further. Remember about “redirect uri” you entered in Google. This is entry of second step and it is for exchanging access token. And last step is about getting data. I insist play with google authplayground to clarify those steps first. Of course if you are pissed off abstractions you can go and build those 1 mile length urls directly into browser. It’s also fine for me 🙂 Starting from authplayground can save you a lot of time and you can be sure about your scope and access rights…

N.B. : First time response gives you (in 2 step) an access token and refresh token, following responses return access token only. So you need store refresh token either in memory or in database. Struggled ? Play with authplayground 😉

Ok I’m clear about how it works. Let’s  write some code. I’m a .NET developer. First thought came into my mind was nuget. So let’s say we have MVC application already. Let’s install some google libs :

Screen Shot 2014-09-24 at 15.39.13

if I’m working with Microsoft ASP.NET MVC I’m predicting that I’m not one in the planet. Should be something regarding MVC right  ?

Here you go :

Screen Shot 2014-09-24 at 15.41.38

I’m pretty sure I have everything I need to have connection with Google.

First thing I want to do is connect to the end user’s drive and create new spreadsheet. Google.Apis libraries have a flow (have those 3 steps in mind). It means you call your ASP .NET MVC action. Before accessing any resource of Google you do authentication first. In “Consent screen” user gives us access rights to his google drive. And we can work with files.

In google controller we will have action called InsertNewSpredsheet.

Screen Shot 2014-09-27 at 13.29.36

AuthorizationCodeMvcApp and AppFlowMetadata is some automation, abstractions you will find in Google.Apis libraries

In AppFlowMetadata you must provide your client Id, secret, scopes and storage of access tokens. See example below  :

Screen Shot 2014-09-27 at 13.28.54

From code I just provided you can see that I’m using File2DataStore. It’s overridden by me. Standard FileDataStore I changed to my own needs. Standard FileDataStore stores auth keys in “C:\WINDOWS\system32\config\systemprofile\AppData\Roaming\Drive.Api.Auth.Store”

Screen Shot 2014-09-27 at 12.24.24

I don’t think so that you will allow IIS_IUSRS users access this location in production environment 🙂 Think twice, don’t do that. Rewrite FileDataSource to your own needs. Here is two examples how you can do it :

https://code.google.com/p/google-api-dotnet-client/source/browse/Src/GoogleApis.DotNet4/Apis/Util/Store/FileDataStore.cs

http://www.daimto.com/google-oauth2-csharp/#FileDataStore

So we have some automation here – flow. When you define redirect uri in google developers console you need refer this url to controller action defined below. So in such case you need add redirect url as :

http://yourproject.com/AuthCallback/IndexAsync

Screen Shot 2014-09-27 at 13.29.07

Specifics

Next step is go back to our action InsertNewSpredsheet and write code which is responsible for file creation :

Screen Shot 2014-09-27 at 13.29.50

We just created excel spreadsheet file into google drive. Here is the list of other mimeTypes for google :

application/vnd.google-apps.audio
application/vnd.google-apps.document
application/vnd.google-apps.drawing
application/vnd.google-apps.file
application/vnd.google-apps.folder
application/vnd.google-apps.form
application/vnd.google-apps.fusiontable
application/vnd.google-apps.kix
application/vnd.google-apps.photo
application/vnd.google-apps.presentation
application/vnd.google-apps.script
application/vnd.google-apps.sites
application/vnd.google-apps.spreadsheet
application/vnd.google-apps.unknown
application/vnd.google-apps.video

To work with google spreadsheet we need add more libs from nuget – Google.GData.Client and Google.Gdata.Spreadsheets :

using Google.GData.Client;
using Google.GData.Spreadsheets;

Following code is for creating query factory for spreadsheetservice. Each request will have all credentials we need :

Screen Shot 2014-09-27 at 13.30.04

One moment. Because it’s not real production example I copied refresh token and added it directly.

Last step is create header row and add first contact. I spent some time with error : Bad Request (400) … In google documentation https://developers.google.com/google-apps/spreadsheets/#adding_a_list_row I didn’t find any information regarding this issue. It seems that you cannot insert just rows. First you need have header row. Cell names of header row should be lowercase and exactly match with your code. So you can either add header row manually or do it using your code like I did.

Screen Shot 2014-09-27 at 13.30.45

That’s it. 2 controllers. One for automate flow, another ours with functionality. I hope this article will save you some time 😉 Cheers

Documentation

https://developers.google.com/  – Start

https://developers.google.com/oauthplayground/ – want to play and understand OAuth2

http://www.asp.net/aspnet/overview/owin-and-katana/owin-oauth-20-authorization-server You can play with OWIN for google authentication

https://developers.google.com/google-apps/spreadsheets/ work with google spreadsheets

https://github.com/googledrive/dredit working example in python, ruby, .net, java, android languages

Posted in Development