4 files changed, 70 insertions, 0 deletions
diff --git a/resources/js/app.js b/resources/js/app.js
index 40c55f6..c34da8c 100644
--- a/resources/js/app.js
+++ b/resources/js/app.js
@@ -1 +1,24 @@
+/**
+ * First we will load all of this project's JavaScript dependencies which
+ * includes Vue and other libraries. It is a great starting point when
+ * building robust, powerful web applications using Vue and Laravel.
+ */
+
 require('./bootstrap');
+
+window.Vue = require('vue');
+import 'vue-chessboard/dist/vue-chessboard.browser.js';
+
+const files = require.context('./', true, /\.vue$/i)
+files.keys().map(key => Vue.component(key.split('/').pop().split('.')[0], files(key).default))
+
+/**
+ * Next, we will create a fresh Vue application instance and attach it to
+ * the page. Then, you may begin adding components to this application
+ * or customize the JavaScript scaffolding to fit your unique needs.
+ */
+
+const app = new Vue({
+    el: '#app'
+});
+
diff --git a/resources/js/components/chessTable.vue b/resources/js/components/chessTable.vue
new file mode 100644
index 0000000..45eeb99
--- /dev/null
+++ b/resources/js/components/chessTable.vue
@@ -0,0 +1,33 @@
+<template>
+    <div class="">
+        <chessboard :showThreats="showThreats" @onMove="showInfo"></chessboard>
+    </div>
+
+</template>
+
+<script>
+import {chessboard} from 'vue-chessboard'
+import jQuery from 'jquery'
+
+export default {
+    name: 'App',
+    components: {
+        chessboard
+    },
+    data () {
+        return {
+            currentPosition: {},
+            showThreats: false,
+            positionNumber: 0,
+            started: false,
+            isStartModalActive: true,
+            positionInfo: {},
+        }
+    },
+    methods: {
+        showInfo(info) {
+            this.positionInfo = info
+        }
+    }
+}
+</script>
+\ No newline at end of file
diff --git a/resources/sass/app.scss b/resources/sass/app.scss
index 8337712..c03e2bb 100644
--- a/resources/sass/app.scss
+++ b/resources/sass/app.scss
@@ -1 +1,2 @@
 //
+@import '~vue-chessboard/dist/vue-chessboard.css';
+\ No newline at end of file
diff --git a/resources/views/chess.blade.php b/resources/views/chess.blade.php
new file mode 100644
index 0000000..1c87bf2
--- /dev/null
+++ b/resources/views/chess.blade.php
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<html lang="en" dir="ltr">
+    <head>
+        <meta charset="utf-8">
+        <title></title>
+    </head>
+    <body>
+        <div id="app">
+            <chess-table></chess-table>
+        </div>
+        <script src="js/app.js"></script>
+    </body>
+</html>
+\ No newline at end of file