As it currently stands, this question is not a good fit for our Q&A format. We expect answers to be supported by facts, references, or expertise, but this question will likely solicit debate, arguments, polling, or extended discussion. If you feel that this question can be improved and possibly reopened, visit the help center for guidance.
Closed 10 years ago.
I've notices I'm not capable to debug correctly js. I'm only using alert() as a spread sentences technique but I need something better. So... which tool do you use?
For Firefox Firebug it's the best, has a lot of useful features, the Console API is great, you can log, make assertions, profiling, timing and much more.
For IE, the Developer Tools of IE 8 is better than nothing, for earlier versions of IE, try the Developer Toolbar.
For Chrome and Safari, check the WebKit inspector and debugging tools.
In Firefox, Firebug and its console which provides a panel for debugging along with an object for programmatically evaluating inside of a script, eg
console.log('test')
Safari and the family of Webkit enhanced browsers have built-in inspectors/consoles.
Opera has Dragonfly.
There are several plugins for Internet Explorer, such as DebugBar and IE8 has a pretty neat built-in Developer Toolbar.
If you're on Linux you can even install spidermonkey-bin, which is the interpreter used by Firefox and invoke it with js in the console.
Chrome and IE8 have surprisingly good debugging consoles.
If you use Firefox, you'll need to install Firebug to compete.
For cross-browser logging you could use log4javascript.
Firebug is very good. However, if you are on Windows you should check out the Developer Tools in IE 8. The integrated debugger allows for breakpoints and uses a lot of great elements probably taken from Visual Studio concepts. You have an interactive console, etc. You can get to it using F12.
Firebug lite is also good in a pinch
Firebug's a must. I've recently also started to use IE8's inner debugging tool and it's pretty nice as well.
To track down performance issues:
Of course there is Firebug with Yahoo's yslow plugin
Internet Explorer has dynaTrace Ajax (John Resig blogged about it lately).
Google Chrome now has the Speed Tracer extension.
Related
As it currently stands, this question is not a good fit for our Q&A format. We expect answers to be supported by facts, references, or expertise, but this question will likely solicit debate, arguments, polling, or extended discussion. If you feel that this question can be improved and possibly reopened, visit the help center for guidance.
Closed 10 years ago.
I need to make a desktop application using CSS/HTML5/JavaScript. This application should work cross-platform (Linux/Mac/Windows) and will be distributed as a simple executable (not an installer), where the user simply opens it and can start using it right away. It also needs to work offline, on machines where internet is not accessible.
So I thought WebKit would be the perfect choice. In fact I went ahead, installed Xcode, and in little time I had an executable that opened a window and loaded some CSS/HTML/JavaScript.
However, my issue is that I don't have Linux/Windows machines. I can't afford buying a Windows copy and I don't want to go through the effort of having to install the OS and installing the Visual Studio or whatever thing, and trying to make an executable for those platforms as well.
I was wondering if there was a pre-built executable for each platform that comes with WebKit. So that all I have to do is change the icon of the application, the name and tell it where to get the html/css/javascript and it would make an executable for the platforms I need.
Is this possible? What are my best alternatives?
You can use node-webkit.
It uses webkit to render the webpage and execute the Javascript, and you will have access to all the Node.js javascript API (reading/writing files, …)
Update: Titanium Desktop is an open sourced project nowadays and named "TideSDK"
http://www.tidesdk.org/
You may try both of below. I have used Titanium Desktop: It is webkit based and also becoming an open source project.
http://www.appcelerator.com/products/titanium-desktop-application-development/
You can also use Embedded Chromium project, but this might require some knowledge on other then HTML/CSS/JS
http://code.google.com/p/chromiumembedded/
There is certainly some way to do this with Qt / QtWebkit / QWebview. But, it is certainly involved.
There is also a Gtk Webkit.
You would still need an installer, but you can look into Adobe Air. You can build apps that even leverage AS3 libraries as well as make them entirely with HTML5/CSS3 and your flavor of Javascript. Best of luck to you.
Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 8 years ago.
Improve this question
There are quite a few tools out there to debug JavaScript and CSS. Firebug, "Alert" messages, Script Debugger, MSE7.exe
I was wondering if anyone could chime in on which one happens to be the best and easiest tool to debug JavaScript and CSS issues?
Thanks
Firebug and Chrome Dev tools are pretty much the gold standard client side.
Chrome docs:
http://code.google.com/chrome/devtools/docs/overview.html
Firebug docs:
http://getfirebug.com/wiki/index.php/Main_Page
As for CSS, Firebug has "Style" and "Computed" tabs. Just select an element, and inspect those tabs. I cannot think of any CSS issue that cannot be resolved with these.
For me, using Firebug (especially in Firefox) is the best solution.
Instead of using Alert messages have you tried console.log('your message')? This will save you clicking alert windows and output messages in the firebug console.
My personal choise is Chrome with its developer tools. Inspect element for css debugging, and Scripts tab for javascript source debugging. You may also use Console for js logging
But actually, web site should support debugging too. In production versions, generally both css and js files are minimized and concatenated, which is hard to debug.
Firefox : Firebug
IE : F12 and alert
I am an avid Firebug user, but another think you should consider is linting (validate against rules and best practices). This will not only help you learn some best practices but can also help identify coding issues before you get to the browser.
Here is a web based js lint tool which you have to paste your code into. Another alternative would be to find a plugin or extension for your IDE. For example, if you were an eclipse user, you can install the jslint plugin and check your code as you write it.
IE F12 is too slow to debug. With a heavy web apps, the browser will freeze for ages.
As it currently stands, this question is not a good fit for our Q&A format. We expect answers to be supported by facts, references, or expertise, but this question will likely solicit debate, arguments, polling, or extended discussion. If you feel that this question can be improved and possibly reopened, visit the help center for guidance.
Closed 9 years ago.
I'm currently develloping a Chrome Extension and i'm searching for more ergonomy by finding a good IDE who can manage javascript and also Chrome Extension API.
Thanks in advance.
Use Aptana Studio and add the following scripts to File references.
chrome_extensions.js
webkit_dom.js
Congratulations! You now have a very capable javascript editor with autocomplete support for chrome APIs
EDIT
You can have the same functionality in Visual Studio, which has (in my opinion) even better support for javascript. In fact I think it's the best javascript editor around (quiet an achievement for microsoft :))
Just add the following comment to your js files:
/// <reference path="MyExternalFile.js" />
And you get:
I got this to work on IntelliJ by using this API stub (to make the chrome object appear in auto completion)
https://github.com/linux-china/chrome_js_api_stub
In combination with the chrome extension.js
https://code.google.com/p/closure-compiler/source/browse/contrib/externs/chrome_extensions.js
I then added the stub chrome_js_api_stub library and the chrome extension library by following the below directions
http://www.jetbrains.com/idea/webhelp/configuring-javascript-libraries.html
It's not for everyone, but if by ergonomy you mean moving your hands around as little as possible, not reaching for the mouse, VIM is very much designed to keep your fingers on the keyboard and as close to the asdf/jkl; positions as much as possible. It's a pretty steep learning curve, but the payoff is extremely quick workflow.
With the right addons, it's a very decent javascript editor, with syntax highlighting (including jsdoc comments), code completion, jslint integration, etc
For Aptana Studio 3: (plugin for Eclipse tested)
Find a library you are interested in...Save it to your disk, and then drag it into your project. It does not matter where in the project it sits, so you can create a new folder for files like this if you like.
!! The project must be some type of web project: Web, PHP, Python, Ruby, Rails.
http://wiki.appcelerator.org/display/tis/Using+JavaScript+Libraries
As it currently stands, this question is not a good fit for our Q&A format. We expect answers to be supported by facts, references, or expertise, but this question will likely solicit debate, arguments, polling, or extended discussion. If you feel that this question can be improved and possibly reopened, visit the help center for guidance.
Closed 12 years ago.
What is the best windows environment to use while developing web application with heavy javascript coding? Does any tools other than VS have some kind of intellisense for javascript?
Look at cloud9ide, netbeans, vs2010, webstorm, Aptana, Eclipse.
I mean have your pick!
Cloud9IDE is a web based IDE thats run in a server. You just go to the website and develop, write and debug your code in the browser. Just login and write. But this is in closed beta and very young. It needs to mature
Netbeans is familiar for those who have used it for java. It's javascript support is good and compared to aptana, eclipse & vs2010 I prefer it.
WebStorm is a great IDE made for front-end developers. This like VS isn't free but it's significantly cheaper then VS. I would recommend WebStorm currently for having good features like intellisense, git integration and refactoring tools build in.
Of course you can always use VIM, Emacs or Notepad++ for your javascript.
'Best' is very much relative to the user. Personally, I've used Komodo Edit (if my memory serves me correctly has intellisense for JS), Eclipse (dunno about intellisense), Notepad++, Vi and finally Emacs.
Emacs is my editor of choice for everything. If you know your way around the commands, key binds and system commands well enough (if you're on Windows, you should install Cygwin and learn it imho), it's without a doubt the most effective dev environment available.
(No need to spark a religious emacs vs. vi debate here - I do like Vi too, just not as much ;))
Netbeans works as good as anything for me - but it's really down to personal taste! There's loads out there, give them a go and see what works best for you.
TextMate. Lightweight, performs very well, extremely configurable, lots and lots of nice built-in bundles.
I know you say 'other than VS,' but Visual Studio 2010 has really great javascript support. Have a look at these posts by Scott Gutherie on the subject:
http://weblogs.asp.net/scottgu/archive/2010/04/08/javascript-intellisense-improvements-with-vs-2010.aspx
http://weblogs.asp.net/scottgu/archive/2008/11/21/jquery-intellisense-in-vs-2008.aspx
The second post applies to improvements introduced in Visual Studio 2008, but it certainly holds true for the 2010 edition. If you are needing intellisence in your standalone script files I suggest you read this blog post on the subject. Do you find something lacking in Visual Studio's javascript support that has you searching for another solution?
As it currently stands, this question is not a good fit for our Q&A format. We expect answers to be supported by facts, references, or expertise, but this question will likely solicit debate, arguments, polling, or extended discussion. If you feel that this question can be improved and possibly reopened, visit the help center for guidance.
Closed 10 years ago.
What's the best way to debug Javascript on Internet Explorer?
Depends on what tools you have available to you.
If you have a copy of Visual Studio, I'd use the Visual Studio debugger. It works pretty well. You'll need to try following the instructions in that link if you don't have a full copy of Visual Studio, otherwise it's built in to the IDE and is pretty simple to use.
Another option is Firebug Lite, which is pretty good for most situations, but you need to add a script reference to every page you want to debug in order for it to work.
Using Microsoft Script Editor is an option too:
See my answer here.
I try to run the same code in Firefox to see if Firebug will be any help. But, with IE specific errors, this obviously doesn't work.
You could always fall back on alert statements peppered throughout your suspect code. It's not pretty or easy, though.
The VS debugger is usually decent, but things like Firebug Lite never worked well for me.
google says :
http://blogs.msdn.com/ie/archive/2004/10/26/247912.aspx
http://www.jonathanboutelle.com/mt/archives/2006/01/howto_debug_jav.html
Use MS Visual Studio (free) to debug JS, explained here: http://www.berniecode.com/blog/2007/03/08/how-to-debug-javascript-with-visual-web-developer-express/
I tend to use a mix of blackbird, Companion.JS and Microsoft Script Editor.
I have got to say, that Firebug is unstable for my current project, maybe because I use jQuery. But it is the best because of his interface and feature list. As to stability, I have no claims on Microsoft Script Editor. But it's useless for cases, when script has syntax errors
As to Visual Studio's debugger, I didn't try that one
By the way, Firebug lite can be used through bookmarklet (http://remysharp.com/2007/03/13/firebug-in-ie-for-any-web-site/). So there is no need "to add a script reference to every page you want to debug in order for it to work"
I have been using IE8 beta with its built in debugger for a few months now. It is very powerful and works well. It has a few trivial glitches, but is the best tool I have used so far for client side debugging.
http://www.microsoft.com/windows/Internet-explorer/beta/default.aspx
It's a big commitment to install the IE8 beta, though.