Day 1 and 2 of My Full-Stack Journey: Learning HTML and Discovering MDN Docs

Day 1 and 2 of My Full-Stack Journey: Learning HTML and Discovering MDN Docs

Embarking on the journey to become a full-stack developer is both exciting and challenging. Here’s a recap of my first two days, where I dived into the world of HTML and discovered the invaluable resource that is MDN Docs.

Day 1: Introduction to HTML

The first step in my full-stack journey was getting acquainted with HTML. HTML, or HyperText Markup Language, is the backbone of any website. It structures the content and defines elements such as headings, paragraphs, and links.

I started with understanding the basic structure of an HTML document:

This simple template introduced me to the essential tags:

  • <!DOCTYPE html>: Declares the document type and version of HTML.

  • <html>: The root element of an HTML page.

  • <head>: Contains meta-information about the document.

  • <title>: Specifies the title of the document.

  • <body>: Contains the visible content of the page.

Day 2: Discovering MDN Docs and Creating a Personal Portfolio

On the second day, I stumbled upon MDN (Mozilla Developer Network) Docs, an incredible resource for web developers. MDN Docs provides comprehensive and well-documented information on HTML, CSS, JavaScript, and more. It quickly became my go-to guide for learning and troubleshooting.

With the basics of HTML in my toolkit, I decided to put my new knowledge to the test.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Sharooq Portfolio</title>
</head>
<body>
    <img src="photo (1).jpg" alt="Sharooq img">
    <h1>Shaik.Sharooq</h1>
    <h2>Education</h2>
    <ol>
        <p><b>High School: </b> Bhasyam Public School <br>
            <b>Intermediate:</b> NRI Arts and Science Junior College <br>
            <b>Engineering: </b>Kallam Haranadha Reddy Institute of Technology</p>
        <h2>Hobbies</h2>
        <ol type="revrse">
            <li>Watching Movies</li>
            <li>Reading Novels</li>
            <li>Online Gaming</li>
    </ol>
    <h2>Contact</h2>
    <p><b>Mobile : </b>xxxxxxx <br><b>Email: </b>xxxxxxx <br>
        <a href="www.linkedin.com/in/sharooq-shaik">LinkedIn</a>
    </p>
</body>
</html>

Key Takeaways

  • HTML Basics: Understanding the foundational structure of an HTML document is crucial.

  • MDN Docs: This resource is incredibly helpful for learning and reference.

  • Hands-on Practice: Building a personal portfolio was a great way to apply what I learned.

I’m thrilled with the progress I’ve made in just two days and excited to continue my journey. Stay tuned for more updates on my full-stack adventure.