Debug Java Script in chrome browser

Hello Guys,

I hope you are enjoying your weekend.Here I am back with my new post.Today I am gonna tell you how to debug Java Script in Chrome Browser.People generally make use of alerts in their scripts to watch some value which can easily be seen through debugging.Obviously it works but what I am trying to say is that it wastes your time and makes your code look ugly.So we can debug our Java Script by using chrome debugger.you can start your chrome browser debugger from Settings > Tool > Java Script Consol or there is a short cut for it CTRL+SHIFT+J in windows.Consol will open at the bottom of your browser.There you can see all your errors and warnings which come after compilation fo your JS.So you can fix all your compilation problems by looking into the consol.Now it's turn to fix rum time error.For that we can debug your JS step by step.

1. Open Source tab in your console.

2. Go to your file in navigator.Double click on your file.It'll open,scroll it down little bit and there you can see your JS methods and events.

3. Now we need to set a break point.Firstly let me explain what a breakpoint is , to those who are unaware of the term .Break point is a point where your program will be paused after setting it and then you can execute the program line by line.For setting a break point just click on the left side over the line numbers.One blue mark will appear it means break point has been set up.You can see all your break points on the right side panel of your console.Once you set your break point, the browser will store it for that page so you can close your page and when you open it next time your break points will applied to your page automatically.

4. Once your break point is set up.you can execute it.Suppose you have set your break point inside your button click event.For triggering it just click that button your program will execute and paused at that line.

5.Once your program is paused you are at run time environment which means you can watch you variables or expression value.You can execute your program line by line by pressing F8 or you can go to your next break point by  pressing F10.

6.For watching your variables value click show console button second from the left at the bottom of you console.Your console will be opened,right click and clear the console.Now type your variable name which you want to watch.Just keep one thing in your mind that the line must be executed in your program where that variable is initiating or getting the value.After typing variable name just press enter.You will get your variable value.

7. Suppose your variable is containing any XML then you can watch any expression or Xpath in console.

8. The console gives u many options which you could apply to your variable which in turn could be a better option for you to get the value. The Console gives you the flexibilty to try new options on your variable .

This was very useful for me in designing UI's.It made me faster in UI designing and better in term of using syntax.Now I try to get the best solutions out of all the available ways of doing it.In this technique you don't have to put alerts at many places to check you variable's value and don't have to run your pages again and again.I hope this will help you also.Please dont hesitate in asking any question related to this post.Your comments are most welcomed.

Power of notepad++

Hello Guys,

I hope you tried short cuts from my last post.Today I am going to tell you some more tricks to play with XML in Notepad++.Webservice is in fashion now a days.So whoever is working on web service must has to fight with XML always.So here Notepad++ can help you a little bit.You may know there are so many plugins are available over the internet which make your Notepad++ more powerful and handy.XML tool is one of them.For installing any plugin go to Plugins >Plugin Manager > Show Plugin Manager.Your screen will be looking similar to below.

Find XML Tool plugin in Available Tab,select it and click Install.Now this plugins will be available in Installed Tab.Close Plugin Manager and restart your notepad.

Now let's start having fun.I have one string like below and I want to change it to XML.

Select the string and go to Plugins > XML Tools(now it will be available there) > Convert Selection Text to XML and your string will be changed into XML.

So you have got your XML but it's not well formed XML.For doing it in well form select the XML and go to Plugins > XML Tools > Pretty Print(XML Only- with line breaks) or there is a short cut for it.Press CTRL+ALT+SHIFT+B.Your XML will be looking like this.

You can check for syntax in your XML.Go to Plugins > XML Tools > Check XML Syntax now.It will tell if there is any syntax error.

So finally you have your XML in well formed without any syntax error.Just for your knowledge you can change your file type also.Go to Language and select XML.
Now suppose you want to get the XPath for a node called "fppCode".Select the node and go to Plugins > XML Tools > Current XML Path. You will get the xpath for the node.This functionality is very useful when there is a very big XML and you want xpath of a node.Obviously you can do it other way also but it's gonna take time.

Now if you have a XML and you want to evaluate one XPath from this XML.Go to Plugins > XML Tools > Evaluate Xpath Expression.You will get the a screen looking like below.Just give Xpath you want to evaluate and Press "Evaluate" button.it's will you value of that XPath if it is correct.

It's very common to comment and uncomment tags or nodes in XML for that there is short cut.For comment press CTRL+ALT+SHIFT+C and for uncomment press CTRL+ALT+SHIFT+R.

I hope this will help you in fighting with XML little bit once you are in habit to use these short cuts.Dont try to mug up them just start using them.After some times your hand will be running over key borad by themselves.There are some other functions available in this plugin you can try by yourselves.

Play with Notepad++

Hello Guys,

This is my first blog I am writing.One day I was sitting in the office doing nothing suddenly this thought came into my mind that why shouldn't I start writing a blog.So I decided to write but next challenge in front of me was the topic that I should start with.Then I thought what would the easiest thing for me to write as I am a technical person so what else could it be.So I decided to write on something related to technical stuff but then I thought why would people like to read my technical stuff when they can find everything over internet in just one click.The next thought came into my mind was that as a software engineer our life is already hell so why shouldn't i write something to make it easier.Then finally I decided that I would give you some tricks or shortcuts which I have learnt in my 3 years of experience and those tricks or shortcuts might be useful in your life specially for the fresher guys who are not from technical branches like me.

So guys lets start with the simplest thing which comes in our daily routine of everybody's life Notepad ++.Most of the people use notepad just for writing some text but if you really explore it.it's very powerful tool.Let's explore it little bit....

1.So many time in our work we need to copy one line many times.Generally what would you do is copy the whole line and paste is as many times you want.Notepad++ provides you a shortcut for that press Ctrl+D and see the magic.It's will write a duplicate line just below the line your cursor is in.

2.If you want to delete the current line just press CTRL+L.

3.If you want to convert any text to upper case select the text and press CTRL+SHIFT+U.

4.If you want to convert any text to lower case select the text and press CTRL+U.

5.This is interesting.If you want to move any line up and down then CTRL+SHIFT+UP ARROW for moving up and  CTRL+SHIFT+DOWN ARROW for moving down.

There are so many such type of shortcuts.I am writing only which come useful in your daily programming or in any other work.So the next is...

6.If you want to go any specific line number in your text file use CTRL+G.

7.If you want to block/unblock any line or number of lines in your JavaScript file just select all the lines and press CTRL+Q.

8.Suppose you are writing any java function or JavaScript function in Notepad and this function in very long I mean you can't see both the brackets of this function together and you have to find out the other end of this function just press CTRL+B.It will take you to the matching brace.

9.Suppose there are two consecutive lines and you want to join them then select both lines and press CTRL+J.It will join second line at the end of first line.If you want to break a line into two line just press CTRL+SHIFT+J.It's will break your line from where your cursor is present now.

10.The last but not the least you can define your shortcut keys,Just go to Setting>Shortcut Mapper and define your own keys.

I hope you are enjoying.These are  very basic things which will make your life little bit easier for sure and you will start saving your time once you are in practice of using these keys.