JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://unpkg.com/vue/dist/vue.js"></script>

<div id="app">
  <!-- EXERCISE 1: Implement a "uwfirst" filter which transforms the first 
  character of each word to uppercase. Use this filter to transform the 
  paragraph's title with the v-bind directive.
  HINT: Use JavaScript's "split" function to split the message into words. -->
  <p v-bind:title="message | uwfirst">{{ message }}</p>
  
  <!-- EXERCISE 2: Apply the filter from the first exercise to the below 
  paragraph. Then implement a filter which removes any spaces and chain these 
  two filters together. -->
  <p>{{ message | uwfirst | nospace }}</p>
</div>

JavaScript

var vm = new Vue({
	el: '#app',
  data: {
    message: 'hello world!'
  },
  filters: {
  	uwfirst(value) {
    	if (!value) {
      	return '';
      }
    	let words = value.split(' ');
      words = words.map(word => word.charAt(0).toUpperCase() + word.slice(1));
      return words.join(' ');
    },
    nospace(value) {
    	if (!value) {
      	return '';
      }
    	return value.replace(' ', '');
    }
  }
});