diff --git a/backend/config/main.php b/backend/config/main.php
index 641bb13..d6663eb 100644
--- a/backend/config/main.php
+++ b/backend/config/main.php
@@ -52,6 +52,9 @@
                 'rules'               => [
                     [ 'class'      => 'yii\rest\UrlRule',
                       'controller' => 'call',
+                      'extraPatterns' => [
+                          'GET search' => 'search',
+                      ]
                     ],
                 ],
             ],
diff --git a/backend/controllers/CallController.php b/backend/controllers/CallController.php
index 959a7e5..0e4cd23 100755
--- a/backend/controllers/CallController.php
+++ b/backend/controllers/CallController.php
@@ -2,9 +2,27 @@
     
     namespace backend\controllers;
     
+    use common\models\Call;
+    use yii\data\ActiveDataProvider;
     use yii\rest\ActiveController;
     
     class CallController extends ActiveController
     {
         public $modelClass = 'common\models\Call';
+        
+        public function actionSearch($word)
+        {
+            return new ActiveDataProvider(
+                [
+                    'query' => Call::find()
+                                   ->filterWhere(
+                                       [
+                                           'ilike',
+                                           'company',
+                                           trim($word),
+                                       ]
+                                   ),
+                ]
+            );
+        }
     }
\ No newline at end of file
diff --git a/composer.json b/composer.json
index a5b6c2f..8f47ca6 100644
--- a/composer.json
+++ b/composer.json
@@ -18,7 +18,9 @@
         "yiisoft/yii2": "~2.0.6",
         "yiisoft/yii2-bootstrap": "~2.0.0",
         "yiisoft/yii2-swiftmailer": "~2.0.0 || ~2.1.0",
-        "bower-asset/materialize": "^0.100.2"
+        "bower-asset/materialize": "^0.100.2",
+        "bower-asset/vue": "^2.5",
+        "bower-asset/axios": "^0.18.0"
     },
     "require-dev": {
         "yiisoft/yii2-debug": "~2.0.0",
diff --git a/composer.lock b/composer.lock
index e5a34ec..eed415f 100644
--- a/composer.lock
+++ b/composer.lock
@@ -4,9 +4,28 @@
         "Read more about it at https://getcomposer.org/doc/01-basic-usage.md#composer-lock-the-lock-file",
         "This file is @generated automatically"
     ],
-    "content-hash": "ec09898700dcf10b1fe4b54e61ad8ad4",
+    "content-hash": "b506c80ac36bec49cac93f43643b27ac",
     "packages": [
         {
+            "name": "bower-asset/axios",
+            "version": "v0.18.0",
+            "source": {
+                "type": "git",
+                "url": "https://github.com/axios/axios.git",
+                "reference": "d59c70fdfd35106130e9f783d0dbdcddd145b58f"
+            },
+            "dist": {
+                "type": "zip",
+                "url": "https://api.github.com/repos/axios/axios/zipball/d59c70fdfd35106130e9f783d0dbdcddd145b58f",
+                "reference": "d59c70fdfd35106130e9f783d0dbdcddd145b58f",
+                "shasum": null
+            },
+            "type": "bower-asset",
+            "license": [
+                "MIT"
+            ]
+        },
+        {
             "name": "bower-asset/bootstrap",
             "version": "v3.3.7",
             "source": {
@@ -105,6 +124,22 @@
             "type": "bower-asset"
         },
         {
+            "name": "bower-asset/vue",
+            "version": "v2.5.13",
+            "source": {
+                "type": "git",
+                "url": "https://github.com/vuejs/vue.git",
+                "reference": "d982e344b39391fe91b6dd91d51b2f0310a45e77"
+            },
+            "dist": {
+                "type": "zip",
+                "url": "https://api.github.com/repos/vuejs/vue/zipball/d982e344b39391fe91b6dd91d51b2f0310a45e77",
+                "reference": "d982e344b39391fe91b6dd91d51b2f0310a45e77",
+                "shasum": null
+            },
+            "type": "bower-asset"
+        },
+        {
             "name": "bower-asset/yii2-pjax",
             "version": "2.0.7.1",
             "source": {
diff --git a/frontend/assets/AppAsset.php b/frontend/assets/AppAsset.php
index c247898..44ceed9 100644
--- a/frontend/assets/AppAsset.php
+++ b/frontend/assets/AppAsset.php
@@ -1,23 +1,22 @@
 <?php
-
-namespace frontend\assets;
-
-use yii\web\AssetBundle;
-
-/**
- * Main frontend application asset bundle.
- */
-class AppAsset extends AssetBundle
-{
-    public $basePath = '@webroot';
-    public $baseUrl = '@web';
-    public $css = [
-        'css/site.css',
-    ];
-    public $js = [
-    ];
-    public $depends = [
-        'yii\web\YiiAsset',
-//        'yii\bootstrap\BootstrapAsset',
-    ];
-}
+    
+    namespace frontend\assets;
+    
+    use yii\web\AssetBundle;
+    
+    /**
+     * Main frontend application asset bundle.
+     */
+    class AppAsset extends AssetBundle
+    {
+        public $basePath = '@webroot';
+        public $baseUrl = '@web';
+        public $css = [
+            'css/site.css',
+        ];
+        public $js = [];
+        public $depends = [
+            'yii\web\YiiAsset',
+            'frontend\assets\VueAsset',
+        ];
+    }
diff --git a/frontend/assets/VueAsset.php b/frontend/assets/VueAsset.php
new file mode 100644
index 0000000..652c0ad
--- /dev/null
+++ b/frontend/assets/VueAsset.php
@@ -0,0 +1,20 @@
+<?php
+    
+    namespace frontend\assets;
+    
+    use yii\web\AssetBundle;
+    use yii\web\View;
+    
+    class VueAsset extends AssetBundle
+    {
+        public $sourcePath = '@bower';
+        
+        public $js = [
+            'axios/dist/axios.js',
+            'vue/dist/vue.js',
+        ];
+        
+        public $jsOptions = [
+            'position' => View::POS_BEGIN,
+        ];
+    }
\ No newline at end of file
diff --git a/frontend/views/site/index.php b/frontend/views/site/index.php
index aeab9f0..c33a833 100644
--- a/frontend/views/site/index.php
+++ b/frontend/views/site/index.php
@@ -15,30 +15,67 @@
   
   <div class="body-content">
     
-    <div class="row">
-      <table class="bordered">
-        <thead>
-          <tr>
-            <th>Company</th>
-            <th>Status</th>
-            <th>Duration</th>
-          </tr>
-        </thead>
-        <tbody>
-            <?php
-                foreach ($calls as $call) {
-                    ?>
-                  <tr>
-                    <td><?= $call->company ?></td>
-                    <td><?= $call->status ?></td>
-                    <td><?= $call->duration ?></td>
-                  </tr>
-                    <?php
-                }
-            ?>
-        </tbody>
-      </table>
+    <div id="app">
+      <div class="row">
+        <table class="bordered">
+          <thead>
+            <tr>
+              <th>ID</th>
+              <th>Company</th>
+              <th>Status</th>
+              <th>Duration</th>
+            </tr>
+          </thead>
+          <tbody>
+            <tr v-if="" v-for="call in calls">
+              <td>{{call.id}}</td>
+              <td>{{call.company}}</td>
+              <td>{{call.status}}</td>
+              <td>{{call.duration}}</td>
+            </tr>
+          </tbody>
+        </table>
+        <div class="row">
+          <div class="col s5 input-field">
+            <label for="search-company">Company</label>
+            <input v-model="search" id="search-company" type="text">
+            <button v-on:click="fetchSearch()" class="waves-effect waves-light btn">Search</button>
+          </div>
+          
+        </div>
+      </div>
+      
     </div>
-  
   </div>
 </div>
+
+<script>
+    new Vue({
+        el: '#app',
+        data: {
+            calls: null,
+            search: null
+        },
+        created: function() {
+            this.fetchData()
+        },
+        methods: {
+            fetchData: function() {
+                var self = this;
+                axios.get('/rest/calls')
+                     .then(function(response) {
+                         console.log(response.data);
+                         self.calls = response.data;
+                     });
+            },
+            fetchSearch: function() {
+                var self = this;
+                axios.get('/rest/calls/search?word=' + self.search)
+                     .then(function(response) {
+                         console.log(response.data);
+                         self.calls = response.data;
+                     });
+            }
+        }
+    })
+</script>
\ No newline at end of file
--
libgit2 0.21.4