Try Tuts+ Premium, Get Cash Back!
JavaScript From Null: Video Series
basixvideos

JavaScript from Null: Video Series

Tutorial Details
  • Subject: JavaScript
  • Estimated Difficulty: Basix
  • Tutorial Format: 29 Minute Screencast
This entry is part 1 of 7 in the series javascript-from-null

The Full Series

Thanks to the wide adoption of libraries like jQuery and Mootools, JavaScript’s popularity has skyrocketed in the last few years. However, in the process, an interesting thing occurred: many newer developers are learning these libraries without taking the time to actually learn about raw JavaScript techniques. What percentage of jQuery users don’t know how to fade out an element with only raw JS? My guess is that it’s much higher than many would think.

If you want to truly understand the library you’re working with, and improve your skill-set, it’s vital that you learn the fundamentals of raw JavaScript.

This screencast series focuses exclusively on JavaScript, and will take you from your first “Hello, World” alert up to more advanced topics.

Catch Up


Chapter 1: Hello, World

Series NavigationJavaScript from Null: Chapter 2»

Note: Want to add some source code? Type <pre><code> before it and </code></pre> after it. Find out more
  • http://sdf sdf

    Stupendously usefull!! Thank you very much and looking forward to the next one.

  • http://www.dynamicpalette.com Chris Seckler

    Thanks for the great series! Hope you keep em coming!

  • http://www.dynamicpalette.com Chris Seckler

    Hi Jeffrey,

    I really enjoy the different tutorials Envato offers on varying web development subjects, but in particular the web dev series. I often find it hard to find them unless I stumble upon them though.

    Is there a page that lists of all the web dev series from all the sites with links to all the episodes? I am referring to the types of series like ‘Wordpress for Designers’, ‘Code Igniter from Scratch’, ‘Diving into PHP ’, ‘jQuery for Absolute Beginners’, ‘Regex for Dummies’, ‘JavaScript from Null’, ‘ASP.NET from Scratch’ and so on (Basically any tutorials that have more than one part in it).

    I would love to see a page that lists them all along with links to each episode in each series. Would you please consider doing that so it’s easy for people to find the episodes as well as possibly discover new ones they might not have known about?

    Thanks. You guys rock!

    • Adrian

      ehh.. go to Jeffrey (home)page and enter the vault section look for “My Tutorials and Screencasts” ;]

      • http://www.dynamicpalette.com Chris Seckler

        Ok, thats nice to find SOME of them, but Jeffrey Way is not the author for all of the series of turorials on nettuts and themeforest, so that’s not ALL of them.

  • anto

    well done clear and simple
    TANKS

  • http://www.streamphotography.com.au Duke

    Sweet… i watched you PHP seriers and been eager to see if you made one about JS… PHP I am getting but JS still is out of my league, this is making it a lot easier to read those book… Cheers Jeff. Top Notch mate!

  • http://wevlop.com deb

    Just watched. Many thanks to the person whoever he is for retaining the download option on the blip.tv site.

    Understood it well, only towards the end it became somewhat fast [english is not my first language :) ].

    Jeff, which tutorial site do you recommend to check out during the time you will come up with the second part?

    • http://www.jeffrey-way.com Jeffrey Way
      Author

      I’d recommend this site called Nettuts+. :)

  • http://www.paresh.com pinak

    great stuff here

  • Giovanni

    Absolutely Fantastic!!

  • w1sh

    JayWay … best tut ever. Good job. Please more of this. JS all the way through, then PHP, then more. :)

    • w1sh

      Remind me not to comment mid-video.. holy crap.

  • http://richarddas.com Richard Das

    What’s with the 30 second commercial in the video? I was going to just leave this site, but then decided to post this comment during the commercial instead. Come on tutsplus, this isn’t television! It’s the interweb!! Ditch the lame ad (some random video about a coffee mug? I don’t know… the sound is turned down and I’ve scrolled to the bottom of the page anyways).

    • http://richarddas.com Richard Das

      oh balls, I just submitted that comment and the page refreshed… now I have to sit through the video again! I guess I’ll just come back to the page when it’s done.

      Please remove the ads?? They’re intrusive and annoying…

      • Asad

        Richard, Jeffrey and Nettuts took the time to design, make and edit this video. That time and labor costs money. In order to get the money to then design, make and edit this video for you, they have to do certain things. Money making things, you might say. One of those would be an ad.

  • http://www.benjamin-franck.com Ben

    I not a high skill javascript user, but I know a bit.
    I watched this screencast by curiousity, and I like it a lot !

    You have a nice way of teaching stuff !
    Keep on the good work !!

    Thanks for me, and all the guys out there that will learn from you !
    Cheers!

    Ben.

  • b

    this was really great…thanks for putting it together!

  • Sunil

    great tutorial

  • Irimia

    Nice one!

  • http://designintheraw.com Roy Ho

    As always Jeffrey your video tutorials are awesome and very clearly spoken. You should become a teacher!!

    You seem to be very patient as well in your teachings….Keep it up!

  • Marc

    Jeffrey, would you recommend using ? Or rather the way you explained it in 2: Declare the Correct DocType in this tutorial http://net.tutsplus.com/tutorials/html-css-techniques/30-html-best-practices-for-beginners/

    Thanks
    Marc

  • Marc

    Hm, I meant !DOCTYPE html

  • http://www.ethanandjamie.com/ Ethan Gardner

    It’s nice to see a return to fundamentals. In order to use a framework correctly, it is important to really understand the quirks of the js language. Without this understanding, it leads to a lot of repetition and inefficient coding, so I’m glad that the tuts+ network is making these tutorials.

  • http://twitter.com/xrommelx xRommelx

    hi this is just great, thank you for this NETUTS+

  • http://osmondinteractive.com Jon Osmond

    Thank you Jeff!

  • RamperJ

    Good Job! I can see ur hardwork in each and every second of your every VDO! It helps alot to the newbies and even for pros to upgrade their knowledge….

    Thanks alot Jeff!!!

  • Fily

    Wow! Nice tutorial. Thanks a lot!

  • Deoxys

    AWE…. SOME!!!
    I even paid for Training-DVDs about JavaScript, but this here is a lot more worthy than them…. Wonderful…

  • JR

    Even though I’ve been doing some front-end development for a few years using HTML and CSS I was completely lost on this. I don’t know really anything about JavaScript and while this gave me an intro to what it can do I feel like I have no understanding of any of the fundamentals like syntax, etc.

    On top of that, it’s way too fast. Am I supposed to follow along and do the things as you do them? I had to pause this every 10 seconds and rewind to make sure I was typing things correctly.

    I like to think I’m not a dumb guy…am I completely missing something here?

  • Omid

    I`m newbie ,
    Above movie is an advertisement , what`s wrong !?
    I can`t see any JS tutorial in that movie !

  • Omid

    Above movie is an advertisement !
    How can I get main movie?

  • Shane

    Hey this was great. Love your tutorials Jeff :).

  • http://walody.com kersh

    Thank you a lot for this tutorial! It’s really useful, quick and (of course) simple! I really appreciate your tuts! :)

  • Parvez

    this was really great…thanks for putting it together!

  • pixelBender67

    I love this site !
    Thanks Jeff for pointing me here, I was looking to learn some basics of javaScript and here it is, best on the web :)

  • http://lmfao.com Martin

    You sound like a gay nerd.

    • Andrew Bob

      I agree with u :)

  • http://dimatadesign.com GusDeCooL

    Already watch this.
    really impressed with this video.
    especially about Firebug Explanation.
    console.log(variable)

    really good explanation,
    even i who not really good with english can understand this this video content

  • http://www.entdyn.com Korky

    Outstanding series as usual, but a couple of clarifications:

    1) Firebug is NOT exclusive to Firefox. There is a product called Firebug Lite from the same folks which has most of the major features, and is available for Google Chrome and other browsers (http://getfirebug.com/firebuglite)

    2) Safari has the same functions as Firebug and they are built into its browser through the Web Inspector. In fact, it’s superior in a number of ways. The following website will give a short tutorial how to enable it in Safari:

    http://www.tuaw.com/2008/12/11/terminal-tip-enable-safari-web-inspector/

    Cheers.

  • Ross

    Video not playing for me….

  • http://inkdev.com Carlos Bolanos

    Jeffrey I gotta tell u this men im a huge fan of ur work and thanks to you im advancing so much im web development
    and i’m pretty sure this serie is going to be pretty usefull
    but why u dont make more Codeigniter from scratch tuts are u over with them
    i have seen em all and jquery for absolute begginers too x)
    keep the good work

  • cfry

    Hello. When I open the downloaded file in Firebug and go the Dom panel, all it gives me is: window. I can’t for the life of me seem to get it to list all of the available functions and Dom elements. Can anyone help?

  • Ganesh

    Really cool one Jeff, thank you.

    -Ganesh.

  • Kwan

    Thank you very much. It is very useful.

  • http://www.easy-pm.de Tom

    Great Tutorial. Thanks!

  • http://www.easy-pm.de IT Projektmanagement

    It is very useful. Thank you very much.

  • http://www.rickmarkus.com Rick

    Very strange editing error around 26:50.

    You never manually ad:

    DoSomethingElse();

    But it just appears on your index.html after you cut back from the console view in Firebug.

    I spent about 10 minutes trying to figure out why “Joe” wouldn’t show up in my console.

    • Eko

      I have same error in function doSomethingElse() in 26:50 minutes,
      Joe isn’t show up in my console just Jeff.

      Very strange thing, I use Firebugs 1.91, maybe the tool is too new.

      • Asad

        You have to call the function DoSomethingElse(); after defining it. I think Jeff edited that part of the video out. If you look in his code you can see it there.

  • kevin

    After watching and learning so much from Jeffrey Way, I felt guilty getting so much stuff for free.
    I am now a preminum member. I am getting even more stuff now for the price of a good meal. Thanks Jeffrey Way. Do not stop rolling out the stuff.

  • http://tutsmais.com.br/blog/ Ofelquis

    wow! great…

    Thanks =D

  • Chance

    While I appreciate the time taken to make this tutorial, it is not very beginner friendly. As a beginner things were left too unexplained. I got lost during the function part and never caught on from there, it was just too fast paced. Things were just not explained fluently enough for a total beginner. This is more designed for people somewhat familiar with JavaScript, or for people who took a hiatus and are returning. Syntax was not explained at all, and for most beginners, such as myself, that is one of the hardest parts of learning a new language.

  • http://www.thomasberry.ca Thomas

    Thanks again Jeff. I love your tuts – not to be confused with toots.

  • Kamran Khan

    Thanks Jeff for this exciting series of JavaScript. I’m a huge fans of your work and the way you teach Web Development. Please ,Please Keep the tutorial Coming .. We Want More please.

  • Jones

    is JS fundamentals 101 and advanced javascript both courses fullfill me with all of the skills and knowledge of javascript ?