idjevm / exercise.html_day-1-exercises

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

My First Few Edits

  • Objective - To create 4 independent webpages, each requiring specific features to be implemented.
  • Purpose - To establish familiarity with basic HTML
  • Description
    • You are provided with four different html template files in a templates directory at the root of this project.
    • Using the html tags that you already know, modify the html content so each individual file looks similar to their respective image.

Part 1 - Clone the project

  • Begin by forking this project into a personal repository.
    • To do this, click the Fork button located at the top right of this page.
  • Navigate to your github profile to find the newly forked repository.
  • Clone the repository from your account into the ~/dev directory.
    • cd ~/dev
    • git clone https://www.github.com/{MYUSERNAME}/{PROJECTNAME}
  • Open the newly cloned project in a code editor (Visual Studio Code, for example).

Part 2 - syntax_template.html

  • Edit the syntax_template.html file to have the appropriate typographical emphasis.
  • Upon completion of edits navigate to the root directory of your project from your Git Bash terminal. From the terminal, execute the following commands:
    • git add .
      • adds all of the file-changes in the current directory to staging.
        • Tip: execute pwd to view your present working directory
    • git commit -m "finished edits on 'syntax_template.html' "
      • saves staged changes to local repository along with a brief description of changes made.
    • git push -u origin master
      • uploads local repository content to a remote repository.
  • The edits should render a webpage which resembles the image below

Part 3 - body_template.html

  • Edit the body_template.html file to have the appropriate heading tags as well as typographical emphasis.
  • Upon completion of edits navigate to the root directory of your project from your Git Bash terminal. From the terminal, execute the following commands:
    • git add .
    • git commit -m "finished edits on 'body_template.html' "
    • git push -u origin master
  • The edits should render a webpage which resembles the image below

Part 4 - models_template.html

  • Edit the models_template.html file to each of the following features:

    • heading tag
    • typographical emphasis
    • hyperlink which references one of the other previously edited webpages.
      • Bonus - Implement a mechanism for opening link in new tab upon being clicked.
  • Upon completion of edits navigate to the root directory of your project from your Git Bash terminal. From the terminal, execute the following commands:

    • git add .
    • git commit -m "finished edits on 'models_template.html' "
    • git push -u origin master
  • The edits should render a webpage which resembles the image below

Part 5 - headings_template.html

  • Edit the headings_template.html file to each of the following features:

    • heading tag
    • typographical emphasis
    • HTML entities
  • Upon completion of edits navigate to the root directory of your project from your Git Bash terminal. From the terminal, execute the following commands:

    • git add .
    • git commit -m "finished edits on 'headings_template.html' "
    • git push -u origin master
  • The edits should render a webpage which resembles the image below

About


Languages

Language:HTML 100.0%