Tag Archives: coding

HOW THE PANDEMIC PROVED WHY YOU SHOULD BECOME A WEB DEVELOPER IN 2021 AND BEYOND 👨🏿‍💻

By: Leon 2K Asare

The global pandemic known as the coranavirus has proven that any business or economy can be shutdown. But, unlike the United States of America or foreign superpowers, as indivduals citizens, it is illegal for us to print our own money. Therefore, if we want to produce cashflow during an economic decline, it will have to be by improving our skillset and hustling. One of the best skills you should considering learning (for economic reasons), is web development. You can turn that skillset into a grand hustle by freelancing (contract work) for indivdual aspiring entrepreneurs, mom and pop businesses to large international companies like Apple and Microsoft.

With remote coding, unlike most 9-5 jobs like hotels, restaurants, bars and tourism related companies who had to layoff or fire staff members during the global pandemic, no one can lay you off as a freelance web developer. Sure, some people can decide to stop doing business with you, and you can decide to stop doing business with them for whatever reason, but no one can prevent you from freelancing , and acquiring new clients and projects.

The Option of Self-Study:

Unlike many other professionals like Plumbers, construction workers, electricians, lawyers and doctors, you don’t need to spend thousands of dollars to attend a trade school or university. Hell, you don’t even have to spend money going to a coding bootcamp, because it is known in the software engineering industry that a lot of web developers are self-taught.

The University Of You:

Your education as a self-taught web developer will come come via books by authors like Jon Duckett, who has written and published books on various coding languages and libraries like HTML, CSS, Javascript, Jquery, PHP and Mysql. There are also websites like W3schools.com, which is a free online coding academy, with its own coding editor. W3school has various coding certificate programs, but you don’t need to take one of the certificate programs to use the code editors or complete the courses for free. But, for those people who would still like to have a certificate to add to their portfolio, you can take the examine for a certificate program for about 100 US bucks. That being said, the true test of your knowledge is not going to be gained through taking coding exams, and most of the people who will seek your service could careless about what exams you have passed and the certificates you have acquired. The people who seek your services only care about what you can do for them. And no better way to show a potential client about the work you can do is by showing them your past projects in your portfolio.

The Pay:

As a newbie web developer if you have little or no reputation, you should expect little or no pay (this will change over time if your skills and reputation continue to grow). In fact your first projects on your portfolio should be your own passion projects. They don’t have to be your dream projects, but projects that you have a passion for, this will give you the motivation to code, even when you don’t want to. For example, if you are a hobbist photographer, you may want to create a photography blog from scratch. Your next step should be getting a web development blog, so that you can share your knowledge with aspiring programmers, and you can in return grow your name in the coding community.

Note: Make sure to share your blog posts on all of your social networks, including : Facebook, Twitter and Linkedin.

The Next Step:

Your next step I would suggest the aspiring web developer do is sign-up to freelance and employment websites like: Upwork, Steady, Craigslist, Glassdoor, LinkedIn, etc. So, that you can connect with people and businesses that want to pay for your programming skills. I would suggest charging lower prices at first, to increase the likelihood of getting a gig contract offer, and as your reputation icreases on the previously mentioned websites/apps, you will be able to steadily increase your price, which in the Bay Area can reach well over a hundred thousand dollars a year.

HTML AND CSS BASICS: WHY USE HTML COMMENTS <!– –> ?

Leon “2K” Asare

FIRST WHAT ARE HTML COMMENTS?

HTML <!–comments–> are little sentences or paragraphs that you put into your HTML document.  The comments can be read by (you) the web developer,  but are not meant to be viewed by your website visitors.

THEN WHY USE COMMENTS IF VISITORS CAN’T SEE THEM?

The usefulness of HTML comments come in the fact that they can and should be used as notes for web developers. For example,  let’s assume that you have a large HTML document,  with many links, sections, images and hundreds if not thousands of lines of code. It would be a very good idea to put comments in each section and area that has it’s own unique task. The reason for this is because the next time you revisit your code to upgrade it, you may need to be reminded of the reason each section of your code was invented for, also if you work in a team, your development team will  find it helpful if your comments help guide then through the matrix of your code syntax.

Creating Your First HTML Document/Webpage

Note: I am a Windows user, so I will educate you on how I code as a PC user.

By: Leon “2K” Asare

To start your first html web document go to the programs section on your computer.

Finding Notepad on your PC.
Or if you can’t find it, type in the name Notepad in the programs section.

The simplest and easiest way to get started is to go to your All Programs section and select Notepad.

Note: there are also free text editors that are much better and easier to use than Notepad. My favorite is Visual Studio Code,  but there are many more.

Why HTML?

The building blocks of websites and apps and web development is HTML, which stands for Hypertext Markup Language. With this language alone, you can code your website and upload  it to the internet. Obviously,  your website won’t look very pretty with out CSS (Cascading Stylesheets) and won’t be that functional without Javascript,  but with HTML alone, you can add text, images, links, create lists, etc.

Note: how to add links from W3schools.com
Adding pictures with HTML,  courtesy of W3schools.com
Adding a basic table with HTML

Getting Started Coding

Note: Most Html elements, also called tags have an open < and > closing bracket.

These are meta tags, these will not be seen by a visitor to your website.  They will be explained more later.  Picture courtesy of W3schools.com
The tags within the <body> tags </body> will be seen by the visitor,  unless they are comments <!–comment–>. comments are used to remind you of something you placed in your code.

How HTML tags are used

The meta tags within the head will not be seen by your visitors to your website.  Meta tags or metadata are what tell a browser how to perceive or view your website.  Here are some examples:

Every HTML document starts with the <DOCTYPE html> tag, it tells the browser this is an HTML document.

The <html lang=”en-us”> tag, tells the browser what language you are using in your document.

The <meta charset=”utf-8″> tells the browser what characters or alphabet you are using in your document.

The <meta name =”viewport” content=”width=device-width, initial-scale=1.0″> tag tells the browser to scale your website based on the size/scale of the screen.

The <meta name=”description” content=”This is an example”> tag tells your browser what the webpage/website is about.

The <meta name=”keywords” content=”your, keywords, go, here”> are where you put keys words that help your website place higher with search engines.

The <meta name=”author” content=”your name”> This tells the browser who wrote the Website.

The <title>Example</title> is were you place the name of your webpage.

The opening <body> and closing </body> tags are where you put your content that you want to be viewed by the website visitor.

The headings tags, which start at <h1> heading</h1> and  ends with <h6> Heading </h6>. Heading one is the largest and most important,  Heading six is the smallest and least important Heading.

The <p> tag is where you put your paragraph it ends with the </p>. Everything in between will be seen by the website visitor.

The <a href=”leontheprogressivecoder.com”>The Progressive Coder Website link</a>. The (a) anchor  and href tells your browser where to go. The so-called “href” or “anchor” tag, ends with </a>. Note : the text in between the opening <a href> and closing tag </a> is where your visitors will click on to go to the site or page you want your visitors to go.

How to Save Your First HTML Document

Saving your Website on Notepad.

Go to file menu and select save as. For your first page it will be index.html. Each additional page will saved according to their title and function, for example: about.html will be your about page.

Visual Studio Code is a little different,  instead of using All Files, you would choose the “save as type” as HTML.

Note: If you intend to utilize more than one page for your project,  you will want to create a folder for that specific project.