Computer Science Lessons

A comprehensive library of computer science lessons - including basic and advanced topics - meant as a learning and teaching resource hub for students and teachers, authored by Henry F. Bruckman Vargas, Ph.D.

Table of Contents

Introduction to Computer Science

• Importance, Purpose, Use, and Value of Computing and Informatics
• Computer Scientist Profile
• Problem Solving and Algorithmic Thinking
• Human-Computer Interaction (HCI) and User Interface/Experience (UI/UX)
• Security (Computer/Network/System)
• Architecture (Computer/Network/System)
• Databases and Information Systems
• Operating Systems and Virtualization
• Computer Graphics and Visualization
• Artificial Intelligence
• Parallel, Distributed, and Cloud Computing
• Software Engineering
• Emergent Topics and Technologies
• Issues, Concerns, and Considerations (Societal, Ethical, Moral, Legal, Professional)
  
  

Programming I

Setting Up and Getting Started

• Setting Up the Development Environment
  • Windows OS
  • Visual Studio Code (VS Code)
  • Git/GitHub
  • C# and .Net in VS Code
  • Java in VS Code
  • Python in VS Code
  • Node.JS in VS Code
• Writing, Building, and Running Your First Program
• Understanding Source Code (Syntax, Case-Sensitivity)
• Understanding Compilation (Building with Scripts, Compile-Time Errors)
• Understanding Execution (Debugging with Breakpoints and Console Outputs, Runtime Errors)
• Understanding IDE UI/UX (Shortcuts and Feedback)

Data Types I

• Primitive (Built-In) and Wrappers (Object-Based)
• Variables (var, let, int) and Constants (const, final, readonly)
• Literals and Escaped Characters ('\n', '\t', '\u13567')

Operators I

• Unary (+, -, ++, --)
• Arithmetic (+, -, *, /, %, ^, **)
• Assignment (=, +=, -=, *=, /=)
• Relational (==, !=, <, <=, >, >=)
• Logical or Boolean (!, ||, &&)
• Ternary (? :)

Expressions I

• Declarations and Initializations (Naming Hard Rules and Conventions)
• Operator Precedence and Parenthesis
• Type Conversion (Implicit / Explicit, Truncation, Promotion, Casting, Parsing)
• Overflow, Precision Loss, Division By Zero
• Strings and Characters
  • Concatenation and Formatting
  • Utilities (Is???, To???, Contains, IndexOf, Substring, Slice, Split, Join)
  • Multi-Line or Verbatim (@, """, \)
  • Interpolated ($, `, f)

Control Structures I

• Conditional Statements (if, else if, else, switch)
• Loops (while, do-while, for, foreach, for...in, for...of)

Data Structures I

• Arrays
• Linear Search

Functions I

• Invocation or Call
• Arguments
• Return Type

Input/Output I

• Console I/O
• String Parsing and Input Validation

Documentation I

• Line or Inline Comments (// or #)
• Block Comments (/* ... */)
• Consistent Formatting (Indentation, Long-Lines Breaking)
  
  

Programming II

Structured Programming

• Fundamentals Concepts (avoid gotos, excessive breaks / continues, and multiple returns)
• Modularization and Code Reuse

Data Types II

• Nullable (?)

Operators II

• Optional Chaining (?)
• Null-Coalescing (??)
• Nullish Assignment (??=)
• Null-Forgiving (!)
• Index-From-End (^)

Expressions II

• Lambda/Arrow/Anonymous Functions (=> or ->)
• Data Flow Pipelines (Filter-Map-Reduce, Pipe-and-Filter, Streams)
• Negative Indices and Ranges ([-1], [1..4])

Control Structures II

• Nested Loops and Loop Control (break, continue, labels, return)
• Exception Handling (try-catch-finally)
• Resource Management (using, Try-With-Resources)

Data Structures II

• Multi-Dimensional Arrays (Matrices)
• Enums, Structs, Records, and Tuples
• Collections (Lists, Maps, Sets)

Functions II

• Custom Definitions
• Parameters Passing (By Copy, By Reference)
• Variable Scope/Lifetime and Hiding/Masking/Shadowing

Input/Output II

• File I/O
• Absolute vs. Relative Paths

Documentation II

• Doc Comments (/** ... */)
• Code Readability and Style Guides
  
  

Programming III

Object-Oriented Programming (OOP)

• Terminology (Fields, Methods, Class/Instance Members, State, Inner Classes)
• Fundamental Concepts (Encapsulation, Inheritance, Abstraction, Polymorphism)
• Structure and Organization (Properties, Constructors, Destructors, Getters, Setters)
• Common Behaviors (ToString, Equals, GetHashCode)
• Design Patterns (Factory, Singleton, Observer)

Data Types III

• Access Modifiers (public, private, protected, default, internal, const, final, readonly, sealed, static)
• Non-Access Modifiers (abstract, virtual, override, volatile, transient, synchronized, native)
• Type Systems: Static vs. Dynamic, Strong vs. Weak

Operators III

• Type Checks and Casting (instanceof, is, is not, as)
• Bit-Wise (~, |, &, ^, <<, >>, >>>, |=, &=, ^=)
• Overloading
• Double Negation or Bang (!!)
• Short-Circuiting and Pipelining (|, ||, &, &&, |>)

Expressions III

• Generic and Templates
• Truthy / Falsy
• Regular Expressions (Regex)

Control Structures III

• Asynchronous Control (Promises)
  • async/await
  • then-catch-finally

Data Structures III

• Classes, Abstract Classes, and Interfaces
• Abstract Collections (Lists, Stacks, Queues, Deques, Maps, Sets)
• Memory Management and Garbage Collection (new, finalize, delete)

Functions III

• Variadic or Variable-Length Parameters (params, ..., *args)
• (Signature) Overloading and Default Values
• Named Arguments
• (Definition) Overriding
• Recursion
• Callbacks, Higher-Order Functions, and Closures

Input/Output III

• Network I/O
• Common Communication Protocols

Documentation III

• Annotations and Metadata (@)
• Version Tracking (Git/GitHub History/Log)
  • Git Commit Message Conventions
    
    

Front-End Web Development

• Introduction
  • Importance, Purpose, Use, and Value of Front-End Web Development
  • Front-End Web Developer Profile
• User Interface / User Experience (UX/UI)
  • Accessibility
  • Responsive Web
• Absolute vs. Relative Paths
• Hyper Text Markup Language (HTML)
  • Terminology (Element, Empty Element, Attribute, Tags, Container)
  • Syntax and Structure
  • Comments
  • Formatting and Style Guidelines
  • Global Attributes (id, class, style, lang, title, data-*)
    • Event Hooks
  • Document Structure (!DOCTYPE, html, head, body)
    • Head Elements (title, meta, link, style, script, base)
    • Body Elements (h1-h6, p, a, img, ul, ol, li, table, tr, td)
    • Form Elements (form, label, input, select, option, button)
  • Inline vs. Block Elements
  • Generic vs. Semantic vs. Style Elements (div vs section, em vs i)
  • Entities, Symbols, and Emojis
• Cascade Style Sheets (CSS)
  • Terminology (Declaration, Selector, Property)
  • Syntax and Structure
  • Comments
  • Formatting and Style Guidelines
  • Embedding in HTML (Link Element, Style Element, Style Attribute)
  • Selectors (Universal, Element, Hierarchy, Id, Class, Pseudo-Element, Pseudo-Class, Attribute)
  • Specificity (Order Stack, Point System, Style Attribute, !important Modifier)
  • Absolute vs. Relative Units
  • Color Values
  • Generic Font Families
  • Box Model (Content, Padding, Border, Margin/Outline)
  • Layouts (Grid, Flexbox)
  • Properties
    • Alignment-Related (position, display, top, right, bottom, left, margin)
    • Box-Related (box-sizing, box-shadow, width, height, background, padding, border, margin, outline)
    • Text-Related (font, text-*, caret, cursor)
    • Image-Related (float, filter)
    • List-Related (list-style-*)
    • Table-Related (border-collapse, vertical-align)
    • Render-Related (opacity, visibility, overflow)
    • Transitions and Animations (transition, animation)
    • Transform (transform, translate, scale, rotate, skew)
    • Miscellaneous (clear, content, columns, resize, pointer-events)
  • Custom Properties (or Variables)
    • Dynamic Theming
• JavaScript (JS)

  • Review of General Programming Concepts

  • Execution Model

    • Event Loop and Call Stack
    • Single-Threaded Yet Asynchronous
    • Hoisting
    • Garbage Collection
    • Strict Mode

  • Overview of Exclusive Features

    • Data Types (Number, BigInt, NaN, String, Boolean, Symbol, Array, Object, Function, null, undefined)
      • Type Systems: Static vs. Dynamic, Strong vs. Weak
    • Operators
      • Loose vs. Strict Equality (== vs. ===)
      • Type and Instance (typeof, instanceof)
      • Rest / Spread (...)
    • Expressions
      • Dynamic Property Access (obj.propName or obj[propName])
      • Dynamic Code Execution (eval())
      • Truthy / Falsy
      • Destructuring Assignment
        • Object Unpacking (const {name, email} = contact;)
        • Array Unpacking (const [first, second] = numbers;)
      • Spread Syntax
        • Object Copy (const c = {...contact, email: newEmail};)
        • Array Copy (const d = [...numbers, 5, 21];)
      • Rest Parameters (const [first, ...rest] = numbers;)
      • Short-Circuit Evaluation (a && b, a || b)
      • Immediately Invoked Function ((function() { ... })();)
    • Control Structures
      • Loops (for...in, for...of)
      • Asynchronous (Promises + Calbacks, async/await, then-catch-finally)
    • Data Structures
      • Maps and Sets
    • Functions
      • First-Class Citizens
      • Higher-Order Functions and Closures
      • 'this' Binding Rules
    • Input/Output
      • Console Err / Output
      • Prompt, Confirm, and Alert Dialog Boxes
    • Documentation
      • JSDoc Format (/** ... */)

  • Environment APIs

    • Browser Object Model (BOM) (Window, Navigator, Location, History, Screen)
    • Document Object Model (DOM) (Tree, Event, Observers)
    • CSS Object Model (CSSOM)
    • Storage and Data Persistence (Local, Session, Cache, IndexedDB, Cookies)
    • Networking and Communication (Fetch, XMLHttpRequest, WebSocket, EventSource, WebRTC)
    • Location and Sensors (Geolocation, Orientation, Motion, Light, Proximity)
    • Files, Media, and Streams (Blob, Streams, Recorder)
    • Graphics and Visual (WebGL, SVG, Canvas, Web Animations, WebGPU)
    • Performance, Timing, and Workers
    • Security and Identity (Credential, Auth, Credential, CSP, Crypto, Clipboard, Payment)
    • User Interface (Gestures, Speech Recognition / Synthesis, Notifications, Vibration)
    • Hardware and Devices (USB, Bluetooth, Serial, HID, Gamepad, Battery, Fullscreen)
      
      

Back-End Web Development

Review of Front-End Web Development

Back-End Architecture

• Introduction
  • Importance, Purpose, Use, and Value of Back-End Web Development
  • Back-End Web Developer Profile
• System Quality Attributes
• Folder Structure
  • Organized by Layers
  • Organized by Features
  • Choosing Between Them
• Architectural Models
  • Client-Server
  • Peer-to-Peer (P2P)
  • N-Tier
  • Distributed
• Architectural Components
  • Infrastructure (Load Balancers, Nodes, Containers, Web Servers)
  • Application Logic (Routers, Middleware, Controllers, Services, Repositories, Providers)
• Bringing It All Together: Example Scenario
• Architectural Styles, Approaches, and Patterns
  • Application Program Interface (API) (REST, GraphQL, gRPC)
  • Server-Side Rendered (SSR)
  • Client-Side Rendered (CSR)
  • Single-Page Application (SPA)
  • Progressive Web Application (PWA)
    
    

Full-Stack Web Development

Review of Front-End and Back-End Web Development

Rendering Approaches and Patterns

• Server-Side (SSR)
• Client-Side (CSR)
• Hybrid
• Isomorphic
• Progressive Hydration

Application Architectures

• Server-Centric
  • Multi-Page Application (MPA)
  • Static-Site Generation (SSG)
• Client-Centric
  • Single-Page Application (SPA)
  • Progressive Web Application (PWA)
• Hybrid
  • Isomorphic / Universal Application (SSR+CSR)
  • Micro-Frontend: (frontend microapps instead of backend microservices)
  • Jamstack (JavaScript, APIs, and Markup)
  • Islands
• Distributed or Emerging
  • Edge-Rendered
  • Serverless
  • Reactive / Streaming

Integration and Deployment

• DevOps and CI/CD Fundamentals
• Cloud Deployment and Containerization Basics

This work is licensed under a Creative Commons Attribution 4.0 International License (CC BY 4.0).