DEV Community

Cover image for My Web Development Journey Day-1: HTML πŸš€
Bidut Sharkar Shemanto
Bidut Sharkar Shemanto

Posted on

4

My Web Development Journey Day-1: HTML πŸš€

Last month, I decided to sign up for a web development course by Jhankar Mahbub bhai - Programming Hero. The reason I signed up is because of the intense support system of Programming Hero and it teaches you with a certain goal - land a job/internship after completing the course.

Next year (2025) I will graduate from my university, and I don't want to be unemployed after that. So, I took on the mission of becoming a web developer by the end of 2024.

Module 1: Learn and Explore HTML πŸ“š

Topics I learned:

  1. HTML Structure (title, favicon)
  2. HTML tags: Paragraphs, Headings, Button, Line break
  3. Tag Attributes, elements
  4. Text Formatting (small, strong, bold, italic, emphasize)
  5. Block vs Inline
  6. Lists (Ordered, Unordered)
  7. Ordered list types
  8. Unordered list types
  9. Anchor tag (open in new tab, download)
  10. Image

This is the HTML I wrote for practice:


<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>My Travel Blog</title>
    <link rel="icon" href="\travel.png">
</head>
<body>
    <div>
        <!-- This this the welcoming Section -->
        <h1>Welcome To My Blog!</h1>
        <h2>I am Shemanto,<span style="color: #e0a82e; font-weight: bold;">THE TRAVELER</span></h2>
    </div>

    <div>
        <!--The places I Traveled-->
        <h3>These are the places I traveled so far:</h3>
        <ol type="i">
            <li>Sundorban</li>
            <li>Rajshahi</li>
            <li>Chittagong</li>
            <li>Rongpur</li>
            <li>Mymensingh</li>

        </ol>

    </div>

    <div>
        <!-- Favorite Food Lists -->
         <h3>My favorite food lists</h3>
         <ul type="square">
            <li>Rice & Egg vaji with hot lantil</li>
            <li>Mutton Biriani</li>
            <li>Guava Fruit</li>
            <li>Pocket Gate er Khichuri & Dim vaji with Tomato vorta</li>
         </ul>
    </div>

    <div>
        <!-- Images of Food  -->
         <h3>This are the images of Foods that I liked so far</h3>
         <span><img src="https://images.immediate.co.uk/production/volatile/sites/30/2020/08/chorizo-mozarella-gnocchi-bake-cropped-9ab73a3.jpg?quality=90&resize=556,505" alt="torkari" width="300" height="300"></span>
         <span><img src="https://loveincorporated.blob.core.windows.net/contentimages/gallery/d99329d6-ce59-4e2d-9513-96a879c7a4ae-gnocchibake.jpg" alt="sukna torkari" width="300" height="300"></span>
         <span><img src="https://media.self.com/photos/5acf7250164ba7734f61bca2/4:3/w_320%2Cc_limit/DINNER_09_BAKEDEGGS_071.jpg" alt="tomato torkari" width="300" height="300"></span>
         <span><img src="https://images.immediate.co.uk/production/volatile/sites/30/2022/08/Corndogs-7832ef6.jpg?quality=90&resize=556,505" alt="fastfood" width="300" height="300"></span>
    </div>

    <div>
        <button> <a href="https://www.linkedin.com/in/shemanto/" target="_blank">My LinkedIn Account</a> </button>
        <button><a href="\travel.png" download="download image">Download FabIcon</a></button>
    </div>

</body>
</html>
Enter fullscreen mode Exit fullscreen mode

Practice HTML

SurveyJS custom survey software

JavaScript UI Libraries for Surveys and Forms

SurveyJS lets you build a JSON-based form management system that integrates with any backend, giving you full control over your data and no user limits. Includes support for custom question types, skip logic, integrated CCS editor, PDF export, real-time analytics & more.

Learn more

Top comments (0)

A Workflow Copilot. Tailored to You.

Pieces.app image

Our desktop app, with its intelligent copilot, streamlines coding by generating snippets, extracting code from screenshots, and accelerating problem-solving.

Read the docs

πŸ‘‹ Kindness is contagious

Please leave a ❀️ or a friendly comment on this post if you found it helpful!

Okay