<script>
export default {
  name: "CounterComponent",
  data: function() {
    return {
      counter: 100,
      name: "Baywest",
    }
  },
  methods:{
    increment: function() {
      this.counter++;
    },
    decrement: function() {
      this.counter--;
    }

  }
};
</script>

<template>
<div class="container mt-5">
  <div class="row">
    <div class="col">
      <p>Counter: {{this.counter}}</p>
      <button class="btn btn-success m-2" @click="increment()">Increament</button>
      <button class="btn btn-warning m-2" @click="decrement()">Dereament</button>
    </div>
  </div>
</div>
</template>

<style scoped lang="css">

</style>