Build a Vue App with Poi

John Lindquist
InstructorJohn Lindquist
Share this video with your friends

Social Share Links

Send Tweet

Poi uses the Vue babel presets by default, so there is no additional install required to get up-and-running. You can even use the .vue file format without having to configure anything.

Instructor: [00:01] Since Poi was developed by a Vue contributor, all of the defaults are essentially configured for Vue. We can import Vue from 'vue' since it's included. Then, with a new Vue instance, we can set the element to the app id and then render out.

[00:17] We'll create our render function with h and then some JSX, and say "Hello." You can see this renders out "Hello" even though the only thing I've created is this index file. I didn't have to install Vue. There are no Node modules or anything.

[00:31] I can even come into here, create a new file called app.vue, create my single-file component. We'll create a div and have some data for this as well. Export default to some object with some data on it and return an object with a message that says "Party Time." Then render this message out here.

[00:59] In my index file, I can easily import App from './app.vue'. Instead of rendering out some JSX, I can just drop my app in here, hit save, and it's "Party Time."