This 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 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
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:
- Lecture = 3 hours per week
- Reading study, video watching, and homework = 12 hours per week
- Browser installed should be Chrome
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.
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:
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.
YouTube Video Links:
Watch the following videos to enhance your learning of data representations:
- WATCH: Mechanical Binary Counter Video 2m
- WATCH: Converting Decimal, Binary and Hexadecimal Video 17m
- WATCH: ASCII Video 8m
- WATCH: Decode unicode: TEDxVienna Video 18m
- How To Do Binary Addition 4m
- Two’s Complement, and Binary Signed Magnitude 4m
- Binary Subtraction with Two’s Complement 4m
- Multiplying in Binary 5m
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.
- HTML5 Tutorial For Beginners - part 1 - Getting Started 8m
- HTML5 Tutorial For Beginners - part 2 - Text 6m
- HTML5 Tutorial For Beginners - part 3 - Images and Hyperlinks 6m
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.
- Web Page with Visual Studio Code
- Visual Studio Code - Getting Started with Git(Hub)
- Visual Studio Code: HTML, CSS & JS Tips
- 5 Awesome Visual Studio Code Extensions for Writing HTML
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.
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:
- freedom.html (part A)
- combustion.html (part B)
- index.html (Part C)
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.
- Slide Set 3: Sequential Structure Programming
- Assignment 2: Sequential Structure Programs (Due Week 4 class)
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.
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
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.
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.
Print and examine Slide Set 4, and create the Program Design document for all parts of Assignment 3 described below:
Week 4 Duties
- Complete Assignment 3
- Do Design Phase before class
- Do Implementation Phase after Design
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.