First glance to Emmet

emmet_logotype

Emmet(previously called Zen Coding) is a set of tools, normally added to the IDE or the text editor by using a third party plugin or extension that allow web developers to speed up writing HTML and CSS. Because Emmet is an open source project, you’ll find a plenty of open source plugins that you can install for your favorite text editor like Notepad++, Sublime Text, Eclipse and even Visual Studio.

For the developers who have some knowledge in C#, Emmet is very similar to C# snippets that are built-in Visual Studio IDE like

  • ctor for creating a constructor to the class file
  • prop for adding a class property

Continue reading

Advertisements

Adding a custom context menu item to Outlook 2013

visual-studio-2013

 

One of the most common feature provided by VSTO is Office UI Customization and when we talk about UI Customization that’s mean most of the time:

  • Adding a Button to an existing Ribbon
  • Adding a new Ribbon
  • Adding an context menu item
  • Adding a custom Task Pane
  • Adding a custom Form Region

In this article, I’m going to show you how to add a new item to the built-in Outlook 2013 context menu. Just remember that: by following the next steps you can add a custom item to any of Office Suite components contextual menu. Continue reading

Building an Outlook 2013 Add-in

visual-studio-2013

Creating Add-ins for office products has become easier than before thanks to VSTO. It stands for Visual Studio Tools for Office and it’s a set of tools(Visual studio project templates and an API) that allows developers create Add-ins for Microsoft office using any managed code like C# and VB.Net.
In this blog post, I’m going to show you how to build a Add-in for Outlook 2013 using C# and VS 2013. Just remember that all steps and code snippet that you’re going to see here is not specific for Outlook Add-ins but all other office components like Word and Excel. Continue reading

Uploading files in ASP.Net MVC

asplogo-square

 

Uploading files in a web application is a common task that every web developer has done at least a couple of times but implementing this task in ASP.Net MVC is kind of different than other web frameworks.
In this article, we’re going to see how we can upload files to the server in ASP.net MVC framework and you’ll see how much easier this is can be done because almost all the nasty work is already done for us.

Single file upload

First of all we need a HTTP GET action that will render the upload file Form. The view will be very simple, something like this: Continue reading

Validation Attributes in ASP.Net MVC

asplogo-square

In this article I’m going to show you how to use some of the validation attributes provided by the asp.net MVC framework that can be used to validate your models and you’ll see by the end of this article how easy to use them and especially how much time you’re going to save comparing with the explicit model validation way.
Before we start, you need to know that all of these attributes are defined in the System.ComponentModel.DataAnnotations namespace, so make sure to import it before starting to use any validation attribute Continue reading

Creating a custom HTML Helper in ASP.Net MVC

asplogo-square
Asp.net MVC has many built-in Razor HTML Helpers that you can use them to create your views. By using these Helpers, you’re going to reduce the time you normally need to create a view by using HTML from scratch.

What’s an HTML Helper

An HTML helper is just a method that returns a string that contains a valid HTML, for example it can contain a valid password input HTML tag.
There is many built-in HTML hlepers in ASP.Net MVC like (not a complete list): Continue reading

Processing images in C# easily using ImageProcessor

Have you ever wanted to manipulate images from your C# program but don’t know how or may be you started writing your custom code from scratch and you found that it’s a lot harder and painful than it looks. From now on don’t push yourself too hard most of the work is done for you in ImageProcessor

ImageProcessor is an open source library written in C# that allows developers to process any type of image on the fly from their application. It doesn’t matter if you’re writing a desktop or a web application, ImageProcessor will make processing image a simple and easy task to perform. Continue reading

Mastering CSS selectors

css

There are many basic things every web developer MUST master early in his career and one of them is definitely: CSS Selectors and you see I said MUST not SHOULD because of the importance of the subject

A css selector is a matching pattern used to select any HTML elements in the page in order to style them or manipulate them using Javascript or any other JS library. As a web developer you will use these selectors a lot when you develop any website or web application, you will use them in your CSS files or in your Javascript code, so that’s why you have to learn an comprehend every and each one of them. Continue reading

Javascript TDD using Qunit and Karma

karma Karma is a Javascript Test Runner created by the AngularJS team(mainly Vojta Jína) in order to run your Javascript unit tests in multiple Browsers and devices at the same time.

Installing all the prerequisites

Because Karma is an NPM Package, you have to make sure that you’ve installed Node.js already. Personally I like to install Karma and all the dependent plugins locally in my project folder. To install Karma type this command in your Terminal:

npm install karma --save-dev

Continue reading

Improve your productivity with grunt JS

grund-js-opt

 

As a web developer, there are many tasks that every and each one of us do in a regular basis and some of these tasks are:

  • Compile coffeescript to javascript
  • Compile Sass or LESS to css
  • Check the quality of your code using one of the famous javascript linters like JsHint or JsLint
  • Minify JS and CSS files for deployment in the production environment
  • Minify your images
  • Run your unit tests

Continue reading