Learning Javascript and Programming

[mikegg]

I'm a beginner trying to learn JS.

I use Sublime Text 3. Is there a program out there that will run my Javascript code line by line, giving me the values of each variable at each line?

 

[Net]

firebug

 

[mrjminer]

firebug

Or for IE, press "F12" for debug mode and select the JavaScript window.

For non-browser based, Visual Studio Express for ASP.

For PHP, there are some non-browser based means through an IDE. I use PHP Storm because its pretty cheap. NetBeans might handle debugging (have never used debugging with it), and it is free. There are probably tons of other options you could look at for PHP

 

[purbeast0]

chrome is a million times better than firefox (with firebug) for development, and firefox (with firebug) is a million times better than ie is for development.

use chrome and open the developer tools then you can view all of the sources and step through them line by line and see all of the values.

 

[Cogman]

chrome is a million times better than firefox (with firebug) for development, and firefox (with firebug) is a million times better than ie is for development.

use chrome and open the developer tools then you can view all of the sources and step through them line by line and see all of the values.

I agree with this statement.

Chrome's developer tools are amazing. Very fast, well integrated, and they are powerful.

Firebug has most of the same functionality, but my experience is that it is slower, sometimes buggier, and it would sometimes cause pages to crash.

IE's tools are ok, but really not as good as firebug.

 

[Net]

or web inspector in safari if your on a mac, you can turn that on in preferences

 

[smackababy]

I agree with this statement.

Chrome's developer tools are amazing. Very fast, well integrated, and they are powerful.

Firebug has most of the same functionality, but my experience is that it is slower, sometimes buggier, and it would sometimes cause pages to crash.

IE's tools are ok, but really not as good as firebug.

The only problem I have with Chrome is they do not allow you to view and edit the requests and responses being sent. There is a addon for Firefox that allows that and Chrome itself doesn't give any access to it.

 

[purbeast0]

The only problem I have with Chrome is they do not allow you to view and edit the requests and responses being sent. There is a addon for Firefox that allows that and Chrome itself doesn't give any access to it.

you can view the requests/responses no problem in chrome. as for editing them though i don't know anything about that so you are probably correct there. you could probably put a breakpoint before the request is being made though and just change the data right before the call that hits your backend.

 

[smackababy]

you can view the requests/responses no problem in chrome. as for editing them though i don't know anything about that so you are probably correct there. you could probably put a breakpoint before the request is being made though and just change the data right before the call that hits your backend.

The amount of times I've been in a situation where I needed to view the request and response data was two, so it isn't a huge deal. But, it is just something that isn't available for some reason on Chrome. The intentionally block addons from having access to that information. I suppose it makes sense from a security standpoint, but when I am developing, I don't care about the average Joe needing his hand held.

 

[Cogman]

The amount of times I've been in a situation where I needed to view the request and response data was two, so it isn't a huge deal. But, it is just something that isn't available for some reason on Chrome. The intentionally block addons from having access to that information. I suppose it makes sense from a security standpoint, but when I am developing, I don't care about the average Joe needing his hand held.

I don't get it. You can pretty easily view the responses being sent, it is the Network tab. It give you everything that is being sent from everywhere (including add ons).

Editing is a different problem. You can edit live data, css, and html in chrome. If you want to manipulate the data, throw down a breakpoint and do it. The only thing you really can't do is edit the data directly from the network tab, but I've never really ran into a situation where that was something I really REALLY wanted to do.

 

[smackababy]

I don't get it. You can pretty easily view the responses being sent, it is the Network tab. It give you everything that is being sent from everywhere (including add ons).

Editing is a different problem. You can edit live data, css, and html in chrome. If you want to manipulate the data, throw down a breakpoint and do it. The only thing you really can't do is edit the data directly from the network tab, but I've never really ran into a situation where that was something I really REALLY wanted to do.

My issue was something outside our program was sending a value in the request I couldn't manipulate in my code, however, for certain reasons, I needed to change it. A very specific situations that hardly ever comes up (which is why I can't even tell you the name of the add-on, as I've used it only a few times).

 

[mikegg]

Decided to go with Webstorm. For whatever reason, I dislike using Chrome's console for debugging.

 

[purbeast0]

The amount of times I've been in a situation where I needed to view the request and response data was two, so it isn't a huge deal. But, it is just something that isn't available for some reason on Chrome. The intentionally block addons from having access to that information. I suppose it makes sense from a security standpoint, but when I am developing, I don't care about the average Joe needing his hand held.

you can view the request/response data in chrome no problem. just click the network tab and find the request and you can view both of them.

EDIT:

oh i just read your other response. if that is the case, get the chrome addon postman. it's very easy to use and lets you send whatever requests you want to whatever endpoints, and view the responses.

https://chrome.google.com/webstore/detail/postman-rest-client/fdmmgilgnpjigdojojpjoooidkmcomcm?hl=en

 

[purbeast0]

Decided to go with Webstorm. For whatever reason, I dislike using Chrome's console for debugging.

if you are trying to use the console for debugging, you're doing it wrong heh.

they have a built in debugger, just view the sources tab and put breakpoints in the sources that you want to break on.

not sure what webstorm is though so i can't comment on that.

 

[mikegg]

if you are trying to use the console for debugging, you're doing it wrong heh.

they have a built in debugger, just view the sources tab and put breakpoints in the sources that you want to break on.

not sure what webstorm is though so i can't comment on that.

It uses Node.js's Javascript Engine(aka Chrome's engine) to debug code. It's an IDE made specifically for JS, HTML and CSS.

 

[gruven]

Webstorm is pretty nice, and very well done.

Although, you are already using sublime text, you can install node.js locally, and install SublimeREPL in sublime using the package manager and use that with node. It allows you to run code line by line.

 

[purbeast0]

ah cool i may have to check that out. other than my little projects at home all of the webapp stuff i've done also has backend groovy/java so i've been sticking with intellij for development, but i use the debugger in chrome when debugging the front end, and intellij when debugging the backend. i will grab it at home though and check it out because i do have to update one of my sites.

 

[smackababy]

you can view the request/response data in chrome no problem. just click the network tab and find the request and you can view both of them.

EDIT:

oh i just read your other response. if that is the case, get the chrome addon postman. it's very easy to use and lets you send whatever requests you want to whatever endpoints, and view the responses.

https://chrome.google.com/webstore/detail/postman-rest-client/fdmmgilgnpjigdojojpjoooidkmcomcm?hl=en

Must be pretty new then (past 2-3 years). I found the tool I needed when I needed it. Haven't needed it either. I've been using Chrome a long time and don't plan on changing. I remember when using extensions required adding them as arguments to the executable path. =(

 

[purbeast0]

Must be pretty new then (past 2-3 years). I found the tool I needed when I needed it. Haven't needed it either. I've been using Chrome a long time and don't plan on changing. I remember when using extensions required adding them as arguments to the executable path. =(

yeah i didn't get into webapp stuff until summer of 2012 and that is when one of my (new) coworkers told me about it.