learning javascipt; need a programing environment...

Discussion in 'Web Design and Development' started by jonpeter, Nov 12, 2013.

  1. jonpeter macrumors member

    Sep 19, 2013
    So I've gotten through code academies html/css course and I'm attempting to teach myself javascript through a number of online resources as well as "Javascript for absolute beginners" by Terry McNavage as my main source.

    Anyways, as my title explains... I need a program to test my code and whatnot. So any suggestions haha?

    In the book, Mcnavage recommends the firebug extension in firefox. My problem lies in the fact that he wants me to "load the following blank HTML document, firebug.html in the downloads at www.apress.com, in Firefox." and i just don't understand how i am supposed to go about it. Which is frustrating.

    anyways, although I am open to any suggestions, firebug's one attribute that interests me is that fact that if i were to write "superman"; in firebug, the code would run and spit out superman... that quickly. Or at least that is what I'm led to believe.

    Either way, thanks for looking and any possible suggestions.
  2. johngwheeler macrumors 6502

    Dec 30, 2010
    I come from a land down-under...
    Javascript development

    Firebug is an "in browser" extension that displays markup, CSS & JavaScript for the currently selected page. There are similar built-in tools for Chrome (settings->tools->developer tools) and Safari. These aren't really what I'd call development tools but are invaluable for understanding hw a web page is constructed and to provide run-time debugging.

    You don't actually need anything other than a text editor to develop JavaScript, but your life will be easier if you use a decent IDE / code editor, and debugging tools such as Firebug.

    If you Google "javascript development tools" you will get a heap of information on editing tools that support JavaScript, providing syntax checking, code completion etc. Have a look at: http://www.infoworld.com/slideshow/60973/9-development-tools-tuned-javascript-200545#slide1


  3. iPaintCode macrumors regular


    Jun 24, 2012
    Metro Detroit
    Chrome DevTools is what I'd call an invaluable development tool for any web developer. Firebug is very abysmal compared to Chrome's version of WebKit DevTools. Paul Irish has a great collection of videos on DevTools, from entry level to seasoned level, look them up on YouTube. The other JavaScript tool is jslint or jshint (a fork of jslint and more popular these days) for debugging JavaScript, you can use tools like Grunt.js for running task like jshint ect... Some editors have live jshint tools, SublimeText has a nice package installer for adding Linting tools, I tend to avoid IDE's, but WebStorm is a solid IDE.

    IMHO learn Chrome DevTools inside and out, they're your best friend for web development, ESPECIALLY JavaScript.
  4. mark! macrumors 65816


    Feb 4, 2006
  5. theluggage macrumors 68040

    Jul 29, 2011
    As others have posted, all the major browsers have developer tools built in (on Safari you need to go to "Preferences -> Advanced -> Show Develop Menu" to enable them). Chrome is probably the best.

    If you want a full-blown integrated development environment (IDE) for actually writing your code, I'd suggest you look at NetBeans - see https://netbeans.org/features/html5/index.html - which integrates with Chrome for debugging.

    However, you may want to start off with just a straightforward text editor like TextWrangler which is perfectly adequate for writing .js and .html files for testing in a browser. I'm not one of those purists who thinks that learning on an IDE will turn you into a bad programmer - but because the IDEs tend to be quite complex, with their own learning curve, and their Javascript/HTML support is often a new-ish feature bolted on to a Java IDE (and I don't think that features like help look up, auto-completion will ever work as well with Javascript as they do with strongly-typed, class-based languages).

    Not that IDEs aren't useful when you start to work with larger projects, version control, embedded JSDoc documentation etc. but maybe get your head around Javascript first.
  6. jtara macrumors 65816

    Mar 23, 2009
    Well, if it's really a blank document, then it doesn't much matter *which* blank document you load, now does it?

    You can load a document from your local filesystem with - surprise, surprise - File, Open. Or from the web (another big surprise) by typing into your browser's location bar.

    So, you have your choice. You can download this "blank" document to your local file system and load it from there, or you can load it directly from the web.

    Any more questions, just ask... ;)

Share This Page