Web Fundamentals

A collection of posts designed for beginners who want to get into front-end development. We'll go over HTML, CSS and JavaScript and get you started on your programming journey.

Front-end development is all about creating the parts of a website that users see and interact with. HTML is like the skeleton, giving structure to the content—things like headings, paragraphs, and buttons. CSS is what makes everything look good, adding colors, fonts, and layouts to the mix. Then there's JavaScript, which brings it all to life by making the website interactive, like responding when you click a button or type into a form.

Together, these tools make websites both beautiful and functional, creating a smooth and enjoyable experience for users.

In this series, you'll learn how to tackle each to build your own projects.

Read now

  • Landon Johnson

    4 articles • 8,020 words

    View profile
    Hello there, my name is Lj. I am a full stack developer.

  • Eduardo Pratti

    10 articles • 20,047 words

    View profile
    UI designer and developer wannabe. Cares about negative space, layout grids and Bloodborne challenge runs.

  • Obi Baratt

    1 articles • 2,799 words

    View profile
    Obi is a software engineer building businesses, communities, and the ecosystems that connect them. He leads the Idea Foundry, a development agency & startup studio, and co-organizes both the Sacramento JavaScript Meetup and the BizTech Mixer.

Chapter listing

  1. HTML

    The first chapter of this series offers an introductory dive into the box model, HTML defaults and semantic elements.

  2. CSS - The Basics

    The second chapter in our front-end series. Let's delve right into the world of CSS, variables and selectors.

  3. CSS - Inheritance & Hierarchy

    The third chapter of our series talks about the cascade hierarchy in CSS, including inheritance and specificity.

  4. Flexbox

    In the fourth chapter of our series, we'll look at flexbox, a powerful layout feature that allows you to create responsive designs with ease.

  5. Grid

    In the fifth chapter of our series, we're going to be introduced to CSS grid, a well-known feature to display content, and used in almost every website you visit.

  6. Responsive Design

    The sixth chapter tackles responsive design, breakpoints, media queries and more!

  7. JavaScript Basics

    The seventh chapter of this series contains the first look into JavaScript and its basic components.

  8. Understanding the DOM

    In our eight chapter, we learn how the browser internally handles HTML and CSS to show the user webpages on-screen.

  9. Manipulating the DOM with JavaScript

    The ninth chapter of this series finally goes over the DOM, how to manipulate it, and how to make our components interactive!