Online Class: Introduction to JavaScript

JavaScript is one of the most popular languages in the world. As software development moves towards cloud applications, JavaScript is the main option when the developer wants to run code on the client's browser or desktop. This is referred to as "client-side scripting." Most modern browsers include support for JavaScript functionality, so the developer doesn't need to force users to install third-party scripting software. Instead, the browser automatically understands the code and runs the client-side script without further installations from the developer. Conversely, if you wanted to run software on the browser that isn't supported by modern browsers, you would need to write and support a browser plugin, which can be much more difficult than just supporting JavaScript. 

In this course, we'll learn about JavaScript, how to get started, and the way JavaScript and libraries have evolved to give programmers the ability to create asynchronous calls to web servers and create fast, creative user interfaces through the cloud and a user's local browser. 

Why Use JavaScript? 

If you code in backend software code such as PHP or C#, you are probably wondering why you would ever need JavaScript. Newer platforms integrate well with JavaScript libraries, but you can use backend, server-side code for much of the interface presentation and processing in the browser. There are several reasons to use JavaScript. 

First, you can create asynchronous calls to a web server without forcing the entire page to reload. In older coding days, when you sent just one input back to the server, the entire page content would post back to the server. The user would have to wait for the page to post to the server, the server would process the response, and then the server would send another page back to the browser. This could take a few seconds, and the result could mean that the user needed several minutes to get through a checkout section of your ecommerce site or create an account on the server. With JavaScript and Ajax, you can submit a small part of your web form and post the response back to the user without making the entire page load. This means that the user can perform other actions on your site without waiting for the process to respond from the server. 

Next, JavaScript is much faster than server-side code for basic UI functionality. JavaScript is better for drop-down menus or popups when the user hovers over an item. These little effects are much too time-consuming and tedious for server-side code. When a user clicks a menu item and a sub-menu displays, you can use JavaScript for a fast drop-down response. To use server-side script, you'd have to send the click event back to the server, process the results, and then reload the entire menu back to the user. 

JavaScript is used for several current user interface (UI) products. If you install any third-party UI elements on your website, the third-party elements are likely using JavaScript. For instance, a slider that toggles images from one slide to the next uses JavaScript to change the images every few seconds. The UI element designer sets the JavaScript timer, and makes a call to the JavaScript function that changes the images. This is just one example of the way JavaScript is used in UI elements (including the drop-down menu example previously). When you hover over an image and a larger image is displayed, this is another example of JavaScript. 

What Supports JavaScript? 

JavaScript is supported by most major browsers. One issue with using JavaScript over other server-side languages is that JavaScript depends on the user's browser and the operating system. What works on a Windows Internet Explorer computer might not work on a Linux computer running Firefox. This can be an issue when you're creating public platforms that are meant to reach as many people as possible. For instance, if you run an ecommerce site, you don't want to limit the amount of people who can run your site simply because your JavaScript code doesn't run on a group of user's computers. This can be one of the downfalls of JavaScript. 

When using basic JavaScript, you can be sure that most modern browsers support JavaScript code. The only issue is that some JavaScript commands are slightly different in Internet Explorer than they are in Firefox and Chrome. You'll notice that most large websites have a JS library for IE and a library for other browsers. This is due to these slight coding differences. 

JavaScript is supported by the big browsers including Chrome, Firefox, Safari, and Internet Explorer. You can use tools such as Google Analytics to determine the popular browsers used on your site. Identify the common browsers used on your site and then ensure that your JavaScript libraries are compatible with common browsers. You want to limit your incompatibility issues as much as possible. For instance, Internet Explorer version 6 was included with Windows XP and supported years ago. There are still many people who still use this version of IE, but the browser is incompatible with most JS libraries used today. 

When Not to Use JavaScript 

Even though JavaScript is a part of any coder's arsenal, there are some times you don't want to use JavaScript. First, JavaScript is still not perfected for mobile devices. This means that you don't want to make a mobile site heavy with JavaScript programming. JavaScript libraries can use too many resources on older mobile devices, and some older mobile devices don't understand newer JavaScript coding. 

Next, JavaScript is not always secure. There are several validation and coding mistakes that make your website vulnerable to SQL injection or cross-site hacking due to JavaScript scripts. When you run code on a user's computer, it means you have access to the local machine. This can then mean your visitors are vulnerable if the JavaScript is not coded properly. For instance, if you use JavaScript input to then write the input to the user's browser, the hacker can use this vulnerability to create XSS scripts that write content into server input. The input can then be passed to your server in the form elements, which in turn can execute SQL on the database server. XSS and SQL injection can get very complex, but these two hacking sources can stem from poor JavaScript coding design. 

Another issue with JavaScript is that it isn't well understood by bots. When you build websites meant for the public, you probably want code that's easily crawled and understood by search engine bots such as Google, Bing or Yahoo. Google has been making efforts to crawl and understand JavaScript code and how it relates to a user interface and user experience elements. But this is newer technology and several elements in JavaScript are still in beta with search engines. In other words, if you want to make a site that is easily understood by search engines, you should limit JavaScript to only when you need it. Chances are that you'll need JavaScript at some point in your website coding, but you don't always need it when creating HTML elements. 

You can potentially use JavaScript in all of your elements, but you should always limit its use to when you need it or when it makes a better user interface. You should highly consider JavaScript before you implement it. Is it better for users? Will it make the site faster and improve the user experience? Will it be more beneficial than server-side scripting? All of these questions should be answered before you decide to implement any type of code on your site. Also, consider the security benefits and losses when using JavaScript, and make sure you consider any cross-script hacking before you implement interaction between JavaScript and your SQL commands. 

We've given you an overview of the good and the bad elements of JavaScript, and now it's time to learn some of the JavaScript code you can use in your websites. JavaScript works directly with CSS elements as well, so you will see how you can interface JavaScript that references HTML elements that will then feed into CSS to style your site.