Heads up! To view this whole video, sign in with your Treehouse account or enroll in your free 7-day trial. Sign In Enroll

Hello Front-End Web Development (FEWD)

Preview

Start a free Courses trial
to watch this video

Sign up for Treehouse

HTML, CSS, JavaScript

2:50 with Anwar Montasir

In our last video, we learned that front-end web developers use code to create the content seen and interacted with by users on websites and web applications. We also learned that developers combine three languages to do so: HTML, CSS, and JavaScript. But what are these three languages? And how are they different from one another? Let’s take a look.

Further reading

Related Discussions

Have questions about this video? Start a discussion with the community and Treehouse staff.

Sign up

    Related Discussions

    Have questions about this video? Start a discussion with the community and Treehouse staff.

    Sign up

    In our last video, we learned that 0:00
    front-end web developers use code to create the content seen and 0:03
    interacted with by users on websites and web applications. 0:08
    We also learned that developers combine three languages to do so. 0:13
    HTML, CSS, and JavaScript. 0:16
    But what are these three languages? 0:20
    And how are they different from one another? 0:23
    Let's take a look. 0:25
    Each webpage is made up of three different layers that work together 0:27
    to deliver an experience to the user. 0:31
    There's a content layer, a presentation layer, and a behavior layer. 0:34
    The content layer is HTML, short for Hypertext Markup Language. 0:40
    HTML provides the structural foundation of a webpage. 0:46
    Content like headings, paragraphs, bulleted lists, 0:51
    links, and images are defined by our HTML. Front-end developers 0:55
    use HTML tags to turn web content into HTML elements. 1:01
    For example, if we want the browser to display the phrase “Hello World”, 1:07
    we need to surround that phrase with HTML tags 1:12
    telling the browser what type of content it is. 1:15
    Is it a heading? Or maybe a paragraph? 1:19
    The presentation layer is CSS, short for Cascading Style Sheets. 1:22
    CSS controls the appearance of our HTML. 1:27
    We use our style sheets to style the HTML with colors, 1:31
    font sizes, backgrounds, layouts, and much more. 1:36
    CSS also allows us to adapt our content to various devices, 1:42
    screen sizes, and resolutions. Front-end developers 1:47
    write CSS code to change the appearance of HTML elements. 1:51
    Since our phrase “Hello world” is a paragraph, we can write code 1:57
    that changes that text from the default black color to red, or to blue. 2:02
    The behavior layer is normally handled by JavaScript, 2:07
    which provides real-time user interaction. 2:11
    Front-end developers use JavaScript to respond to user input and 2:14
    to dynamically update web content. 2:19
    JavaScript is also used by back-end developers in 2:21
    communicating with databases. As a result, JavaScript 2:25
    can definitely get quite a bit more complex than HTML and 2:31
    CSS, so we won't be covering it just yet. 2:35
    Our goal for this workshop is to write enough HTML and 2:39
    CSS to create a simple webpage. 2:43
    We'll get set up to do that in our next video. 2:46

    You need to sign up for Treehouse in order to download course files.

    Sign up

      You need to sign up for Treehouse in order to set up Workspace

      Sign up