CS50x 2025 - Lecture 8 - HTML, CSS, JavaScript

แชร์
ฝัง
  • เผยแพร่เมื่อ 27 ม.ค. 2025

ความคิดเห็น • 25

  • @0work1-jw4cf
    @0work1-jw4cf 2 หลายเดือนก่อน +23

    fiftyville was the best problem so far I enjoyed it

  • @Athenaforever2308
    @Athenaforever2308 8 วันที่ผ่านมา

    Thank you Professor Malan, you are such a great lecturer!!! I had watched one version of this lecture 2 years ago so I re-watched this one on playback speed 1.5! Having you speak at that speed, I feel that I will be dreaming of lecture 8 tonight, your voice is definitely etched in my mind.

  • @seanhenney
    @seanhenney 2 หลายเดือนก่อน +3

    This was fantastic. A marked improvement from the old lecture.

  • @GemmaMR818
    @GemmaMR818 หลายเดือนก่อน +1

    This is amazing. Easy breakdown and Instructor engaging.

  • @jsacodes916
    @jsacodes916 2 หลายเดือนก่อน +2

    His delivery is so smooth it's incredibly impressive.

  • @understand-webdev
    @understand-webdev 2 หลายเดือนก่อน +4

    2:59:50 "It's like python syntax but worse".
    As a JavaScript programmer, I feel hurt... 😭😂
    I've been learning web development for over a year now and I did learn/understand some good stuff here and in other lessons too.
    Thank you very much Sir David Malan 🙏🏾

  • @viettrieu1354
    @viettrieu1354 7 วันที่ผ่านมา

    Timestamps (Powered by Merlin AI)
    00:02 - Introduction to web programming and fundamentals of the internet.
    02:10 - Servers in data centers route information using software and protocols like TCP/IP.
    07:11 - Understanding the basics of how IP addresses facilitate communication over the internet.
    09:26 - Data routing involves various factors influencing delivery efficiency.
    14:04 - TCP uses ports to manage diverse internet services effectively.
    16:29 - TCP/IP uniquely addresses computers and ensures data delivery.
    20:52 - DNS system enables recursive IP address lookups for domain names.
    23:00 - DNS translates domain names to IP addresses and vice versa.
    26:59 - Understanding DNS and HTTP protocols in web engineering.
    29:14 - Understanding secure URLs and their components.
    33:41 - Understanding TLDs and HTTP protocols in web requests.
    35:49 - Understanding HTTP requests and responses in web development.
    39:58 - Introduction to browser developer tools and network monitoring.
    41:59 - Status codes and their meanings in web development.
    46:07 - Understanding HTTP status codes and URL redirection.
    48:14 - Introduction to HTML as a foundational web language.
    52:18 - Setting up a local web server in VS Code for HTML development.
    54:25 - Introduction to HTML structure and basic web page creation.
    58:39 - Understanding the structure and function of HTML using the Document Object Model (DOM).
    1:00:42 - Understanding how server communications and ports work in web development.
    1:04:36 - HTML tags define structure and formatting of web content.
    1:06:41 - Using HTML tags helps define text hierarchy and structure for web pages.
    1:10:46 - Introduction to HTML tables and comment syntax.
    1:12:48 - Understanding table and image tags in HTML for web data representation.
    1:16:57 - Enhancing web accessibility with alt attributes and video controls.
    1:18:59 - Understanding HTML attributes and creating hyperlinks in web pages.
    1:23:04 - Exploring web development tools for HTML inspection and external links.
    1:25:17 - Interactivity and inspection of web pages through developer tools.
    1:29:15 - HTML can be deceptive, leading users to unintended websites.
    1:31:22 - Understanding HTTP parameters in URL for form submission.
    1:35:41 - Creating a functional search form with HTML and integrating Google search.
    1:37:58 - Improving search form usability with HTML attributes.
    1:41:50 - Form validation is crucial for ensuring correct user input in HTML forms.
    1:43:52 - Understanding regular expressions for pattern matching in programming.
    1:48:17 - Validating user input ensures correct data format in web forms.
    1:50:23 - Input validation and web page styling with CSS are essential for user experience.
    1:54:18 - Introduction to using style attributes for web page design.
    1:56:22 - Styling HTML content using CSS enhances webpage aesthetics.
    2:00:29 - Understanding the use of the body tag for styling with CSS.
    2:02:31 - Understanding semantic HTML structure enhances web page clarity and design.
    2:06:47 - Exploring browser developer tools for real-time CSS edits.
    2:08:54 - Adjusting font sizes and using CSS classes for styling in web development.
    2:13:07 - Styling links with CSS for visual appeal.
    2:15:13 - Learn to enhance link visibility and accessibility using CSS.
    2:19:30 - Understanding the use of IDs and classes in HTML and CSS.
    2:21:38 - Introduction of semantic HTML for better table structure and aesthetics.
    2:25:39 - Exploring font styling and Bootstrap for web design enhancements.
    2:27:36 - Introduction to JavaScript's dynamic capabilities in web development.
    2:31:45 - Understanding JavaScript placement in HTML for effective coding.
    2:33:54 - JavaScript enables responsive web interactions through event handling in browsers.
    2:38:13 - Using JavaScript to handle form submission without sending data to the server.
    2:40:21 - Introduction to JavaScript's document object for element selection.
    2:44:42 - Implementing event listeners for form submission in JavaScript.
    2:46:49 - Using event.preventDefault to stop form submission in JavaScript.
    2:50:59 - Diagnosing JavaScript errors related to DOM elements timing.
    2:53:09 - Use 'DOMContentLoaded' to execute JavaScript after HTML loads.
    2:57:31 - Creating dynamic text responses using JavaScript and HTML elements.
    2:59:37 - Event-driven JavaScript updates webpage backgrounds using buttons.
    3:04:03 - JavaScript enables dynamic manipulation of CSS and visibility in web pages.
    3:06:22 - JavaScript enables control over web pages, reviving outdated HTML features.
    3:10:46 - Learn how JavaScript updates web pages dynamically for applications like autocomplete.

  • @benoitchamplon7149
    @benoitchamplon7149 2 หลายเดือนก่อน +1

    What an elite port to use!

  • @PANDURANG99
    @PANDURANG99 2 หลายเดือนก่อน +1

    Great, waiting for it

  • @daniel_osterman
    @daniel_osterman 2 หลายเดือนก่อน

    Thanks for sharing this

  • @Satyajit5858
    @Satyajit5858 2 หลายเดือนก่อน

    Great explanation

    • @Learnwithtanmay-96
      @Learnwithtanmay-96 2 หลายเดือนก่อน

      th-cam.com/video/NFlJ9zVW82w/w-d-xo.html

  • @CordersGallaxy
    @CordersGallaxy 2 หลายเดือนก่อน +8

    I just understood JavaScript way better, thank you.

    • @TheVirtualArena24
      @TheVirtualArena24 2 หลายเดือนก่อน

      how much javascript is covered here? is this video enough to make basic web apps? do we need to know any programming lang before doing this?

    • @db2360
      @db2360 15 วันที่ผ่านมา +1

      If you are looking for a comprehensive web based course this is not for you

  • @johnnguyen8065
    @johnnguyen8065 2 หลายเดือนก่อน +2

    I just learned that the characters Yuliia and David are located somewhere around Cambridge Massachusetts and that the other character John is located in Orange County, California 😁😁😁🥰🥰🥰👍👍👍

  • @AlAlex-o6i
    @AlAlex-o6i 2 หลายเดือนก่อน +4

    Hi, is the lecture from edX and this the same? Because this one is a little bit longer, I would like to know whether there is any extra lesson in this lecture. Thank you.

  • @mdryan8
    @mdryan8 หลายเดือนก่อน

  • @ceasar_69
    @ceasar_69 2 หลายเดือนก่อน

    3:00:07

  • @Ramiobomb
    @Ramiobomb 2 หลายเดือนก่อน +2

    Sorry if I missed this part, but how do I close the "http-server" command? I noticed I can't add commands on the terminal after server launch without opening a new one (The $ mark disappeared in the first terminal). Thank you.

    • @davidjmalan
      @davidjmalan 2 หลายเดือนก่อน +6

      Control-c!

    • @Ramiobomb
      @Ramiobomb 2 หลายเดือนก่อน

      @@davidjmalan Thank you very much!!!!!

  • @styr993
    @styr993 12 วันที่ผ่านมา

    1:40:03

  • @ELFBDS
    @ELFBDS 2 หลายเดือนก่อน +2

    3:12:59 👀❣

  • @Cruisewithmkings
    @Cruisewithmkings 2 หลายเดือนก่อน +3

    CS students react here