Week 0This is a hybrid class and we will meet for one class per week and you will need to work through the course material online each week and submit weekly assignments. Most of the content provided covers computing from a programmers point of view to include data types and programming control structures. You weekly assignments will be analyzing a described problem and create a solution algorithm to solve the problem sequentially using a flowcharts. You will learn to convert a flowchart to code to make a working program.

We will learn the JavaScript language which is one of the most popular interpreted languages in use today. The JavaScript interpreter is contained within all modern browsers and easy to access within an HTML document. JavaScript is the primary scripting language used for website development and also the JS in many WebApp frameworks such as: Node.js, React.js, Backbone.js, Vue.js, Hexo, and Gatsby. It is a great choice for beginners because it is loosely data typed and utilizes an interpreter which will abort when it encounters a line of code it doesn’t understand. Please utilize the Google Chrome browser for the class.

We will be utilizing Scratch to do the flowchart algorithm and you may implement the program solution using scratch.

A great cloud based solution to utilize for the class is https://repl.it/ and I highly recommend you get an account with them. If you have a github.com account from IFSM201 you can link it as your login or sign up using an email address.

If you prefer to work offline then I recommend the Visual Studio Code editor.

If you have a question you can ask in class or email me at:

I will post handouts and hyperlinks to videos for the class on this web page which is accessible at the hosting URL
islandman.org/um/cmis102/.

So lets get started…

This is a fast paced course in an 8 week session.

I recommend you allocate approximately 15 hours per week to this course:

Before the first class, I recommend that you download and print the latest updated version of the of the Syllabus and other Week 1 materials described below which are posted as PDF files. Windows users can use Adobe Acrobat Reader or PDFXChangeViewer

I recommend that you get started with Week 1 content today, by clicking Week 1 in the navigation bar above or scrolling down.

Robert Laurie

Week 1: What is Data?

.This week in lecture we will be discussing the Syllabus, LEO course management system, and investigate Data representation for different number types and character codes. If you enrolled in IFSM201 with me we will expanding coverage in this class to include signed integers, floating point representation for rational numbers, and unicode to write content in any human language. Prior to class, please print and read both PDF files listed below:

Cyber-Cafe [Optional]

Post your non-course or course related comments or ramblings here. Maybe no one will read them except for me. Computers can be frustrating until you realize they are dumb binary machines and with good software we can fix that. That is what this course is about; How to write good procedural command line software in a programming language.

Programming can be fun and frustrating at times too, but a good lucrative career. The following video is what my first programming job was like. Computers are much better now.

Watch the following videos to enhance your learning of data representations:

Week 1 Duties

Complete all conversion problems at the end of the document covered this week in class.

Week 2: Program Design and Tools

Bring a notebook computer and USB thumb drive this week and every week for transferring files. This weeks PowerPoint slides and activities will focus on learning HTML5. The HTML language is a document description language and Assignment 1 requires creating three HTML documents and hosting them on your Github pages account. These activities will be your first steps in computer coding. You could do the coding using your editor in GitHub pages or try either of the code editors suggested below.

Please download and print the following two documents in color before class this week:

Watch the videos to help you get started writing HTML code using a text editor. As an alternative text editor you could also use Notepad++ featured here if you are a windows user which is used in these videos, but Visual Studio Code has more features.

After watching these videos and reviewing Slide Set 2 then do Assignment 1.

For Part B you will need to select colors using RGB codes. You need to select colors that have high contrast between text color and background color. A sites with color samples and RGB codes is: http://www.rapidtables.com/web/color/RGB_Color.htm

Verify your HTML code is valid and works by submitting it to the online validation service at https://validator.w3.org/. If the code validates and displays as you wish then submit hyperlinks for your three HTML files using LEO for Assignment 1 submissions. I will be validating your code…

A good reference web site for HTML is http://www.w3schools.com/tags/default.asp.
I also recommend working through their HTML tutorial from HTML-Introduction to HTML-Color at https://www.w3schools.com/html/

Course Editor Tools

Visual Studio Code Editor

Visual Studio Code](https://code.visualstudio.com) is an open source editor project created by Microsoft and available for Windows, MacOS, or Linux. It can be utilized without being online when writing code and can be used for many computer programming languages. It also integrates well with GIT to synchronize code with GitHub pages.

Online cloud based editor Repl.it

Sign up for a Repl.it account. You may use your Github.com account or an email address to set up this account.

After you have created an account and confirmed it via email you will then create your first project by Create a new repl selecting HTML, CSS, JS. This will create the required default HTML code for you.

Watch and take notes for these 9 videos HTML Tutorials - using repl.it

Please work through Assignment 1 utilizing Repl.it creating a separate Repl for each part or Assignment 1.

Graphics editors

If you would like to try a more advanced graphics editor I would recommend GIMP which is free and cross platform or PhotoFiltre version 6 which is windows only.

Week 2 Duties

This week you should host the following files in your GitHub pages website and provide links in LEO to these pages as a submission for Assignment 1:

Week 3: Developing a Sequential Program

Please bring your notebook computer and also a USB (Thumb) Drive, which you may need to print items in the UMUC computer lab. Please store a copy of your most recent code to the USB (Thumb) Drive as a backup and for printing and demonstration purposes.

This Week 3 class we will focus on sequential programming structures and you will design and code two JavaScript programs. Print and read through the following PDF files posted as Slide Set 3 and Assignment 2:

Slide Set 3 and the readings describes the program development process to include analysis, design, implementation, and verification. Important concepts are structured programming principles and the use of flowcharts to describe the sequential processing.

We will build on the concepts learned last week by making an HTML document that encapsulates JavaScript program code within the HTML documents as described in Slide Set 3. You will gain practical hands-on experience in program design and implementation phases with Assignment 2.

thenewboston - JavaScript videos listed below will help you get writing JavaScript code encapsulated HTML code with a text editor:

Learn the Web - JavaScript Syntax utilizes HTML5 code standards in their code and links to the JavaScript program.

A good reference web site forJavaScript is https://www.w3schools.com/jsref/jsref_reference.asp.
I also recommend working through their JavaScript tutorial from JS-Introduction to JS-Assignment at https://www.w3schools.com/js/default.asp. To facilitate data input we will utilize window.prompt() so please read this section https://www.w3schools.com/js/js_popup.asp. To convert string data to numbers you will need to utilize parseInt or parseFloat so review these as well.

Scratch is a great program for prototyping procedural programs using flowchart methodology. It has great graphical features and can be utilized for the development of your assignments.

Week 3 Duties

Assignment 2 is due this week and you will need to write HTML and JavaScript code to make a web pages that satisfy Part A and B program requirements. After hosting two web pages on a web host then submit their 2 URL’s on LEO under assignment 2.

Week 4: Selection Structures

This week we will focus on the selection programming structure that provides the ability of a program to make decisions based on a True or False criteria. Please examine Slide Set 4 and Assignment 3 and create the Program Design document for each part before class this week. Use a word processor to create the Specifications Section, Algorithm Design, and Known Test Data sections. Create input and output displays for desired output for the known test data. Use Scratch, PowerPoint, or another graphics program to make flowcharts. Another interesting option is the Google Chrome plugin draw.io Make sure that you use diamonds for the flowchart symbol for a selection structure with assertion displayed and two arrows out labeled True or False. Embed the flow chart in your Program Design document or attach as file.

Check your JavaScript code by copying pasting the contents contained in the

Use the browser Error Console throughout the implementation process to view errors. This will identify syntax errors as the code is run. Use window.alert(variableName) to display the value of variables during the implementation process to identify logic errors after all syntax errors are cleared.

Create links to your web pages that contain the JavaScript code for each part of this assignment. Make sure all links work for the program implementation files. If they do not you will receive a zero.

Print and examine Slide Set 4, and create the Program Design document for all parts of Assignment 3 described below:

Watch these videos before class. which cover how to write JavaScript code encapsulated HTML code with a selection structure:

Week 4 Duties

For this assignment, you write HTML and JavaScript code to make a web pages that satisfy Part A and B program requirements. After hosting two web pages on a web host then submit their URL’s on LEO. Also create links to these two programs from you home page.

Week 5: Repetition Structures

Week 6: Arrays

Week 7: Functions and Code Reuse

Week 8: Project Presentations

This is the last week of our classes. This week you will be doing the talking doing presentations of your final project.

All work must be completed by Thursday this week. Anything completed after Thursday will not be considered when determining your course grade.

It was a pleasure to have you in the class this session and I wish you much success with your education and career development.