How to use IMDB Api with Vue.js
Published on September 19, 2017
2 min read
Hi everyone. I will tell you how did i make this project(VuejsIMDB). I made this project while learning Vue.js and it really worked.
First of all ,maybe you can think why i am using Vue , why it is not React. Because Vue.js library easier to learn and really small library. Now let's start coding.You must install your pc Node.js for install vue-cli. After you installed Node you will write your command line :
npm install --global vue-cli
After finish this command now vue-cli installed you pc globally you will run this command for create project :
vue init webpack-simple my-projectNow your project created and enter the project folder with this command and run other commands. This commands will install other npm packages for work with Vue.js
$ cd my-project <br />
$ npm install <br />
$ npm run dev <br />
Vue.js framework has a components for page. This components has a .vue file path. We will create a two component.
- Film component
- Search component
Film.vue
Search.vue
After created components we must use this in App.vue. It's a main page for out template. If we don't add created components inside App.vue file, we can't see out components on page.
App.vue
After these operations our project needs to run well. But i will share package.json file with you.
Package.json
After the coding you must serve your project with vue-cli. Enter this command and you will see project on webpage ( use " localhost:8080 ").
npm run dev
In this article we have seen how to do a simple API call with Vue.js. After this practice, you can apply different applications to improve your development. You can implement it using different API calls.