OIM3690 - Web Technologies

2025 Spring

Session 16 (3/25)

contain

Today's Agenda

Welcome/News/Announcements

  • Midterm Feedback Survey
    • Thank you for your feedback!
  • Communications:
    • Meet with me in person during office hours at least once this semester.
    • Email - specify course # in subject title, e.g., "OIM3690: GitHub settings"
    • Use Slack/GitHub when asking code-related questions
  • Questions?

Midterm Feedback Survey Results (anonymized)

  • Link on Canvas - Session 15

🌟 Highlights

  • 💡 Most helpful topics:
    • GitHub – widely appreciated and reused in other projects
    • HTML – surprisingly easy and intuitive
    • In-class coding activities and real-time feedback
    • Coding games (e.g., Flexbox Froggy) for fast concept grasping
  • ❗ Most difficult areas:
    • CSS Grid & Flexbox – hard to visualize and remember coordinates
    • JavaScript – functions, loops, event handling, and debugging
    • Remembering (?) syntax for quizzes
    • Default layout behavior (non-Flex/Grid)

🤖 Use of GenAI Tools

  • Usage varies:
    • Some students use GenAI frequently (debugging, syntax help)
    • Others prefer to code manually or rely on YouTube for explanations
  • Primary use cases:
    • Fixing bugs when stuck
    • Understanding syntax quickly
    • Exploring features beyond course materials

📚 Topics Students Want to Learn

  • Advanced JavaScript & interactivity
  • Backend connections (e.g., cloud databases)
  • Web publishing & custom domains
  • Python-related content (for data analysis pathway)
  • Visual design & animations for websites

💬 Suggestions for Improvement

  • Add exercise instructions to Canvas, not just in slides
  • Record lectures for review and quiz prep
  • Provide practice quizzes or study guides
  • Spend more in-class time on walkthroughs and debugging
  • Clarify AI usage policy in coding tasks

What we have learned so far...

  • HTML: basic tags, image, links, list, id, class, div, span, table, form, audio/video, iframe...
  • CSS: syntax, selectors, Why cascading, flexbox, grids
  • Website: design
  • JavaScript
    • Event, element
    • Variables
    • Functions

Quick Quiz

  • Can you give an example of declaring a string variable?
  • Is it allowed to use var to declare variables in our class?
  • How do we increment a numerical variable, say num, in JavaScript?
  •  const a = 10;
 const b = a % 3; // What is the value of b?
  • What keyword do we use to define a function in JavaScript?
  • What happens if you define a function but never call it?
  • What is this? - 'b'+'a'+ +'a'+'a'

Recommendations

Session 16