Class Session: Monday Sep 24, 2018

Scripting: Client Side and Server Side


Preparations for this Session

Read What is Javascript? This is a link to a very popular online javascript book. Read only the text under the What is Javascript? heading. We will not have time to go into this book in any depth.

Look over these pens on code pen: document.write, js via the DOM tree, Javascript Function example (you will not have to learn how to write complex javascript in this class, but I do want to demo a few challenging examples.)

Read this page on PHP.

top/reload prep panel

Definitions

Client side Scripting: Javascript

Client Side scripting languages run on the users device. Javascript is the most prevalent client-side scripting language, and will run on the users device provided the user has not disabled javascript*.

* It's advantageous to create sites that can fall back to html and css in the event of javascript failure, but sometimes javascript is so necessary for the goals of the site that it is difficult to provide fallbacks. It's beyond the scope of this session to go into depth on this subject, but if you are interested, take a look at  progressive enhancement and graceful degradation. It's not without controversy: see The Problem with Progressive Enhancement and Progressive Enhancement Makes Me Sad.

Server side Scripting: PHP

Serverside scripting languages are executed on the server side. The most popular server-side scripting language is PHP. PHP is the driving force behind many major sites and content management platforms. We will discuss several of these in this class session.

The opal site has php installed. To verify PHP is installed, you can log into opal and get to your command prompt and check the version with the version flag:

[lblakej@opal ~]$ _

type php -v

[lblakej@opal ~]$ php -v

This will print the PHP version running on the SILS server:

[lblakej@opal ~]$ php -v
PHP 5.4.16 (cli) (built: Aug  5 2016 07:50:38)
Copyright (c) 1997-2013 The PHP Group
Zend Engine v2.4.0, Copyright (c) 1998-2013 Zend Technologies

This code pen example contains some very basic javascript that showcases how javascript interacts with the DOM. It also contains code that demonstrates the use of variables, arithmetic, and  strings. We will also take a side trip down the path of sudden complexity when we are confronted with what is a simple task in a spreadsheet: convert a number to currency. We will see that this is not quite so easy in javascript. So what does one usually do when confronted with a coding problem? Search Google, of course. Sometimes the answer is found right away. Other times, it takes a more challenging route. For instance, you might find someone that has solved the problem with 14 lines of code, or may have even found a javascript library, like accounting.js or numeral.js to do the job. Or you might find someone that has solved the problem in one line of code, like in our example.

See the Pen Getting Started with Javascript by Lawrence Jones (@lblakej) on CodePen.



Quick links

opal login: ssh ONYEN@opal.ils.unc.edu
opal password: ONYEN password

Instructor

Creative Commons License
This work is licensed under a Creative Commons Attribution-NonCommercial-ShareAlike 3.0 Unported License.

Office hours by appointment.