search

7.HeaderToHamburger-HuffPostClone

BNTA logo

hashtag
HuffPost Clone - Starting Point - Header To Hamburger

hashtag
Objectives

  • Initialise as git repository

  • Emmet Abbreviation

  • Copy Hamburger SVG

  • Bad Hamburger

  • Better Hamburger

  • Good Hamburger

hashtag
Table of contents

hashtag
Initialise as Git Repository

To create a new folder:

When you create a new folder that is going to contain your project you should initialise it as a git repo:

If you have already a created a github repository, you can link the local version to the online github repository by typing something similar to:

After that is done we can make commits as we go along to version control our project and then push our changes to the local repository to the github repository which you'll see later.

hashtag
Emmet Abbreviation

  • Emmet abbreviations are shortcuts that when typed in a .html file within vscode will be expanded in to a code block.

If you type:

Then hit enter or the tab key (whilst within a .html file), it will expand in to the code below:

hashtag
Copying an SVG from a Webpage

You can copy svgs from webpages by inspecting the svg element, right clicking, going to copy and then copy element as the image below shows.

Copy SVG

hashtag
Bad Hamburger

hashtag
Better Hamburger

hashtag
Good Hamburger

PreviousmarkdownNextHTML_CSS

Last updated