From Novice to Coder: Beginning of Web Development.

From Novice to Coder: Beginning of Web Development.

Table of contents

No heading

No headings in the article.

Today is the day I'm starting a new journey. A journey of writing regular blogs on my progress around Web Development as a beginner.

But before this, to give an idea of the background where I'm coming from: I'm currently a 2nd Year(sophomore) student at IIT Madras(Chennai), pursuing my BS in Data Science & Applications. I have a basic knowledge of certain programming languages such as Python and Java but still didn't reach the level of understanding of any DSA concepts as I never got into programming in my school days. The only time I took it seriously is after getting into my college and studying it with an IIT Ropar professor Dr Sudarshan Iyengar who taught us Python last year. He is truly one of the best teachers to learn programming from. That was the time I started my journey in programming and understood how much could be done just by writing a few lines of code and how every technology is somehow dependent upon these lines of code. So, I started getting deep into the field but then realized that if I want to build something on the internet, first of all, I need to create its presence on the internet and I decided to go through the path of Web Development to create an internet presence first for myself and then for a product I want to build. Now, yes there are many ways nowadays if I just want to create a website but to be honest I used platforms like WordPress, Wix, or even Webflow to build a website without using code other than Webflow, everything seems like it's limiting my imagination and if I want to build something that is going deep in my mind. Then, I need to learn web development.

Also, it was not the only reason, because as a student currently in my 2nd year, I want to learn something which could build a path for me to get into the tech industry through internships or any freelance projects. After all, the amount of knowledge we get from working around real-world problems with people who are already in a place where we want to be could not be compared with any project we build according to our own while watching tutorials on YouTube.

So, today's date is 15-05-23 and I'm putting up a goal for myself to learn Web Development from scratch, starting today till I get an internship in the Web Development field with the deadline of 1 complete year till 15-05-24.

As of today I'm a complete beginner in Web Development with only knowledge I have is basic HTML tags which we learn in school days and some information on the field of Web Development that it's divided into 2 parts :

[You Could click on any one of the following headings to look into the whole roadmap]

  • Frontend Development: Technologies I need to learn for this are HTML, CSS, JavaScript, Frameworks/Libraries like React, NextJS, Tailwind CSS, etc. (All this information is taken from the roadmap provided by WeMakeDev on Github.)

  • Backend Development: Basics of Operating System, Relational Database, NoSQL Database, APIs, Microservice, Web Security, Testing, etc. It also contains many other technologies through which we could dive even deeper into the topic.

So, for today: I started with HTML to get some hands-on experience and get a bit familiar with the topic by doing something that could be physically visible while putting in the effort.

From tomorrow I would be starting to read documents related to topics like: "What is Web Development" and "What does a Web Developer do" to get a better understanding of the topic from scratch even though I know a little bit about these things but I think I need to dive deeper from the start if I want to get better in it by understanding its root. Also, this is the process that is provided in the roadmap so I would try to stick around as much as possible. So, stay tuned and keep checking out my new blogs which I'm going to write daily from today till I land an internship somewhere (and even after :))

Also, if anyone's wondering where I'm learning HTML so it's Code Academy because here I could get hands-on experience while learning these topics so that the process remains more practical than watching a tutorial video while doing nothing, like getting a theoretical lecture.

For now, I want to share a few of the things I learned today (other than some basic commands like <html>, <head>, <title>, <p>, etc which most people have a fair idea about) while exploring HTML:

  •     1.<!DOCTYPE html>
        This command gives an information to the browser about what document type to expect (in this case, it's HTML).
    
        2.<!--value-->
        This is used to write comments in HTML for making it more convenient to read (Anything written inside this is not implemented with HTML code).
    
        3.<div></div>
        Defines a division or a section in an HTML document. The <div> tag is used as a container for HTML elements.
    
        4.<ul></ul>
        Unordered list to write text in list format with bullet points.
    
        5.<ol></ol>
        Ordered list to write text in lit format with numbered points.
    
        6.<li></li>
        List tag is used inside both of these <ol> and <ul> to write the value inside these lists.
    

For inserting Media or linking to another page/website:

  •     7.IMAGE: <img src="adress.jpg" alt="adress">
        This is a self closing tag and (alt) is used to display text in case image doesn't laods or visually impaired people could listen to this transcript in place of image.
    
        8.VIDEO: <video src="video.mp4" width="xx" height="xx" controls> Video not supported </video>
        Similar to image tag while it also contains (controls) attribute to make the video controls to be present automatically in the browser.
    
        9.<nav></nav>: The <nav> HTML element represents a section of a page whose purpose is to provide navigation links, either within the current document or to other documents.
    
        10.Link: <a href="adress.com">name of page</a>
        Links to the web adress that is being provided inside href attribute. These are written inside <nav> tag to seperate them as a navigation links. Although it's not compulsory and could be used without <nav> tag.
    

    These are a few of the new HTML tags which I learned today that I didn't have a fair idea about earlier.

So, this concludes my Day 1 of learning Web Development. Check out tomorrow's blog which would give insights about What Web Developers do? As I'm going to start reading this Document (you could check it out if you want to read it by yourself) by Frontend Masters.