DEV Community

loading...

What is VueJS

CleverInsect
An IST student from Penn State
・2 min read

JavaScript:

To explain what VueJS is we need to first define what JavaScript is. JavaScript is used with HTML and CSS to create webpages, but unlike HTML which is used to display the information and CSS which controls the page layout, JavaScript is used to control the webpage's overall behavior. JavaScript is a way to make the webpage more interactive for the users. With JavaScript you can also change the contents of HTML and CSS.

VueJS:

VueJS is a progressive JavaScript framework. It is known as progressive because it is highly adoptable and can easily work with pre-existing applications. VueJS can split a webpage into different reusable elements. One of the major qualities of VueJS is that it is reactive. Reactive means that when data is changed or altered VueJS will automatically update the webpage to match the altered data.

My VueJS Component:

In Codepen I made a very simple resume using HTML, CSS, and VueJS. Using VueJS I created expressions to store the information and then had the expressions placed in the HTML code to have them displayed to the resume page.
Here is a picture showing VueJS expressions underlined in blue
image

In the photo below it shows the expressions being defined in VueJS
image

In the skills/interests section the expression used represents a list so I needed to use a for loop to have all the elements in the list to be displayed.
Codepen:
https://codepen.io/cleverinsect/pen/zYoBZye
YouTube:
https://youtu.be/DzpgAzONCo0
Helpful Sources of Information:
https://vuejs.org/v2/guide/index.html#What-is-Vue-js
https://www.w3schools.com/js/default.asp

Discussion (0)

Forem Open with the Forem app