Hello there,
First, let me introduce myself. My name is Allison and my journey into TECH begins here as a Frontend Developer . i also want to simplify the process for people struggling with the basics.
MY FIRST STEPS
Over the last four years, I've worked in customer service in a variety of industries and realised that the typical product creation process between clients and developers was flawed. Often times, developers fail to communicate with clients throughout the development process, resulting in a final product which does not achieve the goal sought by the customer and end user.
As a result, I decided to pursue a completely different career path that emphasizes highly focused communication and transparent design patterns. In addition to working to craft applications according to the client's specifications, I provide daily updates to make certain the project aligns with the client's objectives. Ultimately, the right product will be delivered on time and within budget.
I started with HTML after watching so many youtube videos which was confusing at first because every body had different method and steps . Let me give a brief explanation of HTML.
HTML is the standard language that is used for creating web pages and web applications. Every time you access a website, a server sends an HTML file to your computer and your browser interprets and displays the information included in that file. In fact, all the information you are reading now is simply data that has been stored in an HTML file and sent to your browser.
Here’s the best thing about HTML – it’s a simple language to learn.
Most people can learn the basics of HTML in just a few hours, and with a solid HTML foundation, you can progress to more complex languages such as CSS and JavaScript.
What Is HTML?
HTML stands for HyperText Markup Language, which can be a confusing term for many beginners. The best way to explain HTML is to examine the meaning of each word.
HyperText refers to text that contains links to other texts. Every time you click on a highlighted or underlined link that takes you to another page, you are using hypertext. As more and more pages use hypertext to link to each other, a “web” of pages starts to form. This is where we get the term World Wide Web.
Markup refers to the special symbols or codes that are inserted into a document to tell the web browser how to display the document data. For example, markup code may tell the browser to display a phrase in bold or italic text, or may tell the browser which parts of the document are headings and which are paragraphs. HTML is just one of a number of languages that uses markup code.
Language refers to the idea that the code is standardized. Just like regular spoken languages, there are certain rules that everyone must follow when writing HTML. This is so that all browsers can understand and interpret the code. There are many different programming languages, and you may have heard of some of the popular ones such as Java, Python and Ruby. Each language has its own unique set of rules, and many languages can be used in combination with HTML to create amazing webpages and applications.
What Does HTML Code Look Like?
Basically, HTML code looks just like regular text. The most identifiable feature of HTML code is the use of angle brackets. These angle brackets enclose the markup code which tells the browser how to display the document data.
Here’s an example of some simple HTML code:
<!DOCTYPE html>
Page Title
This is a heading.
This is a paragraph.
If you save this code into a text file with the filename “test.html” and open it in your browser, it should display a page like this:
It’s not very exciting, but it’s a good example of a website in its simplest form. Even without any knowledge of HTML, you can probably understand a little bit about how HTML works by simply looking at the code above and comparing it to the image.
How Does HTML Relate To Other Programming Languages?
If you’ve done any research on web development and design, you’ve probably come across articles or guides that mention CSS and JavaScript.
HTML, CSS and JavaScript are the three main languages that are used to create most webpages. Each of the languages has a different function and each has different rules, but they all work together to give webpages content, design and functionality.
As i mentioned before, HTML is the foundation of any site. The HTML code contains the site’s basic structure and content, which includes all the text, links, tables, links to images and other such elements.
CSS (Cascading Style Sheets) is used to define the design of the page, including things like the size of each element and how it looks. With CSS, you can set things like the style of the font you are using, the background color of the page, and the width of the border around elements on the page.
JavaScript is a more complex language that is used to create interactive elements on your page. When you hover your mouse over an image on a website and the image morphs or changes, that’s JavaScript editing your original HTML code. When you click on a product on a shopping website and your shopping cart automatically updates, that’s JavaScript too.
CSS and JavaScript can add design and functionality to a site, but without HTML, you won’t have a site to begin with. In fact, most sites will still display HTML data even if the CSS and JavaScript code is broken.
One of the best things about learning how to write HTML code is that you don’t need to buy any special software to get started. You can write and edit HTML code in any regular text editor.
Windows users can write code using the Notepad app which comes pre-installed with all versions of the operating system. Mac users can write code using the OSX equivalent which is call TextEdit.
However, if you’re planning to do a lot of coding, it’s probably a good idea to download and install a text editor that is specifically designed for coding. These apps have various features and add-ons that help you keep your code clean and readable, and will allow you to code more efficiently.
Some popular features are highlighting different code elements, autocompletion of code, automatic syntax checking based on which programming language you are using, and multiple tabs for easy switching between documents. I use VSCODE but you can also use Sublime Text Editor or Atom .
MY FIRST HTML PROJECT
Here is the Demo link : how-to-make-tea-mzallison.vercel.app
I created this website during the CODE INSTITUTE bootcamp. It was quite simple and I enjoyed the experience. If you strive to become a programmer like me, you will have to work late nights and drink lots of coffee😉. For this project I used my code editor, updated on Github, and deployed using Vercel. I'll explain how I did this in my next write-up so you don't get confused.
Things that I have learnt building this project,
▶️ Good Folder structure for Projects
▶️ How to use font awesome and the onclick tag
▶️ How to list items
▶️ How to use font awesome icons
▶️ Use of hover effect
▶️ How to deploy from Github to Vercel
It would be great to hear your suggestions!
Thanks For Reading❤️
Top comments (0)