Let’s start up the project.
We’re going to use the Vue CLI.
As usual, you are free to use it locally or use the web-based CodeSandbox environment.
Even though we’ll use Vuex later on, we’ll start from the bare bones Vue CLI sample app.
We create the app using the
vue create command. I gave it the name
githubusers, but you can choose whatever you want, of course.
We choose the default preset, which includes Vue with Babel support:
and after Vue CLI downloads everything we need, we’re ready to go:
We change to the app folder, and we run
npm run serve.
Now let’s do a little bit of analysys.
We’ll need 3 components to start with.
First, a Form component. This is the one that will hold the form, and ask GitHub for the data of a user.
Then we’ll have a CardsList component. This will be reponsible for printing out the user cards, their removal and more.
Finally, the smallest piece of our app is the Card component. It will hold the individual user card display.