/blackboard-vue-tutorial

A blackboard created using the vue framework

Primary LanguageJavaScript

The Vue.js Blackboard Tutorial

This is a sample tutorial used to experiment with the features of Vue.js. I created a blackboard that allows users to enter text in a text input and have that text blow up in scale so others can see it easily.

You can learn more about vue.js here - https://vuejs.org/

The walk-through for this application can be found here - https://wftutorials.wordpress.com/2019/01/11/vue-tutorial/

Preview

https://wftutorials.files.wordpress.com/2019/01/vue_tutorial_with_content.png

Installation

# download repo
git clone https://github.com/wyntonfranklin/blackboard-vue-tutorial.git

# make sure vue-cli is installed
npm install -g vue-cli

# Go into repo
cd blackboard-vue-tutorial

#Install dependencies
npm install

#run the app
npm run dev

Features

  • Increase/decrease text size dynamically
  • Save pages and review pages
  • Toggle background - black/white
  • Create new pages

Topics Covered

  • Vue Cli
  • Application Structure
  • Routing
  • Single File Components
  • Templating
  • Declarative Rendering
  • Binding Attributes
  • Methods and Computed Properties
  • Child Components