Vue Workflow: Creating the Frontend

Vue

HTML

HTML or Hypertext Markup Language is the standard markup language for creating a displaying documents on a website. It is like the skeleton of the webpage as it is where you put all of the text of the webpage. It allows you to create lists with bullet points, forms, hyperlinks. In HTML, all of your elements are contained within tags (<></>). For example if i wanted to create a form, I could do:

<form>
    <label></label>
    <input></input>
</form>

And while its not necessarily the best option for styling, you can change fonts, text sizes, or even colors with it.

CSS

CSS or Cascading Style Sheets is a style sheet language used to design a webpage given the HTML outline. In our project we use it to change certain colors, sizes of text, positions of elements, and even hover animations for buttons. The HTML elements in a project can be styled according to their tag:

<h1><h1/>

class:

<h1 class = "case2"></h1>

or id:

<h1 id = "case3"></h1>

These different methods of styling would be done like this, in their respective order:

h1 {
   font-size: 12px;
}

.case2 {
   font-size: 12px;
}

#case3 {
   font-size: 12px;
}

JavaScript

To Be Continued