diff --git a/public/js/app.js b/public/js/app.js
index af679a2d..86dee4ad 100644
--- a/public/js/app.js
+++ b/public/js/app.js
@@ -16286,37 +16286,63 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */   "default": () => __WEBPACK_DEFAULT_EXPORT__
 /* harmony export */ });
 /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = ({
-  props: ["foo"],
-  setup: function setup() {
-    var greeting = "Greetings";
+  data: function data() {
     return {
-      greeting: greeting
+      products: null
     };
+  },
+  mounted: function mounted() {
+    var _this = this;
+
+    axios.get("/api/products").then(function (response) {
+      // commit('updateProducts', response.data);
+      console.log("We got a response!");
+      console.log(response.data);
+      _this.products = response.data;
+      console.log(_this.products);
+    })["catch"](function (error) {
+      return console.error(error);
+    });
   }
+  /*setup() {
+      const products = {};
+      return { products };
+  },*/
+
 });
 
 /***/ }),
 
-/***/ "./node_modules/babel-loader/lib/index.js??clonedRuleSet-5.use[0]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./resources/js/components/TestComponent.vue?vue&type=script&lang=js":
-/*!*******************************************************************************************************************************************************************************************************!*\
-  !*** ./node_modules/babel-loader/lib/index.js??clonedRuleSet-5.use[0]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./resources/js/components/TestComponent.vue?vue&type=script&lang=js ***!
-  \*******************************************************************************************************************************************************************************************************/
+/***/ "./node_modules/babel-loader/lib/index.js??clonedRuleSet-5.use[0]!./node_modules/vue-loader/dist/templateLoader.js??ruleSet[1].rules[2]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./resources/js/components/NewComponent.vue?vue&type=template&id=5e77f4a8":
+/*!**********************************************************************************************************************************************************************************************************************************************************************************!*\
+  !*** ./node_modules/babel-loader/lib/index.js??clonedRuleSet-5.use[0]!./node_modules/vue-loader/dist/templateLoader.js??ruleSet[1].rules[2]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./resources/js/components/NewComponent.vue?vue&type=template&id=5e77f4a8 ***!
+  \**********************************************************************************************************************************************************************************************************************************************************************************/
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
 "use strict";
 __webpack_require__.r(__webpack_exports__);
 /* harmony export */ __webpack_require__.d(__webpack_exports__, {
-/* harmony export */   "default": () => __WEBPACK_DEFAULT_EXPORT__
+/* harmony export */   "render": () => /* binding */ render
 /* harmony export */ });
-/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = ({
-  props: ["foo"],
-  setup: function setup() {
-    var greeting = "Greetings";
-    return {
-      greeting: greeting
-    };
-  }
-});
+/* harmony import */ var vue__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! vue */ "./node_modules/vue/dist/vue.esm-bundler.js");
+
+
+var _hoisted_1 = /*#__PURE__*/(0,vue__WEBPACK_IMPORTED_MODULE_0__.createTextVNode)(" Vue ");
+
+var _hoisted_2 = {
+  key: 0
+};
+function render(_ctx, _cache, $props, $setup, $data, $options) {
+  return (0,vue__WEBPACK_IMPORTED_MODULE_0__.openBlock)(), (0,vue__WEBPACK_IMPORTED_MODULE_0__.createBlock)("div", null, [_hoisted_1, $data.products ? ((0,vue__WEBPACK_IMPORTED_MODULE_0__.openBlock)(), (0,vue__WEBPACK_IMPORTED_MODULE_0__.createBlock)("div", _hoisted_2, [((0,vue__WEBPACK_IMPORTED_MODULE_0__.openBlock)(true), (0,vue__WEBPACK_IMPORTED_MODULE_0__.createBlock)(vue__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,vue__WEBPACK_IMPORTED_MODULE_0__.renderList)($data.products, function (product) {
+    return (0,vue__WEBPACK_IMPORTED_MODULE_0__.openBlock)(), (0,vue__WEBPACK_IMPORTED_MODULE_0__.createBlock)("div", {
+      key: product.id
+    }, (0,vue__WEBPACK_IMPORTED_MODULE_0__.toDisplayString)(product.id) + " - " + (0,vue__WEBPACK_IMPORTED_MODULE_0__.toDisplayString)(product.name) + " - " + (0,vue__WEBPACK_IMPORTED_MODULE_0__.toDisplayString)(product.description) + " - " + (0,vue__WEBPACK_IMPORTED_MODULE_0__.toDisplayString)(product.price), 1
+    /* TEXT */
+    );
+  }), 128
+  /* KEYED_FRAGMENT */
+  ))])) : (0,vue__WEBPACK_IMPORTED_MODULE_0__.createCommentVNode)("v-if", true)]);
+}
 
 /***/ }),
 
@@ -16329,17 +16355,14 @@ __webpack_require__.r(__webpack_exports__);
 "use strict";
 __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var vue__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! vue */ "./node_modules/vue/dist/vue.esm-bundler.js");
-/* harmony import */ var _components_TestComponent_vue__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./components/TestComponent.vue */ "./resources/js/components/TestComponent.vue");
-/* harmony import */ var _components_NewComponent_vue__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./components/NewComponent.vue */ "./resources/js/components/NewComponent.vue");
+/* harmony import */ var _components_NewComponent_vue__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./components/NewComponent.vue */ "./resources/js/components/NewComponent.vue");
 __webpack_require__(/*! ./bootstrap */ "./resources/js/bootstrap.js");
 
 
 
-
 (0,vue__WEBPACK_IMPORTED_MODULE_0__.createApp)({
   components: {
-    TestComponent: _components_TestComponent_vue__WEBPACK_IMPORTED_MODULE_1__.default,
-    NewComponent: _components_NewComponent_vue__WEBPACK_IMPORTED_MODULE_2__.default
+    NewComponent: _components_NewComponent_vue__WEBPACK_IMPORTED_MODULE_1__.default
   }
 }).mount("#app");
 
@@ -33758,12 +33781,12 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */ __webpack_require__.d(__webpack_exports__, {
 /* harmony export */   "default": () => __WEBPACK_DEFAULT_EXPORT__
 /* harmony export */ });
-/* harmony import */ var _NewComponent_vue_vue_type_template_id_5e77f4a8_bindings_foo_props_greeting_setup_maybe_ref___WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./NewComponent.vue?vue&type=template&id=5e77f4a8&bindings={"foo":"props","greeting":"setup-maybe-ref"} */ "./resources/js/components/NewComponent.vue?vue&type=template&id=5e77f4a8&bindings={\"foo\":\"props\",\"greeting\":\"setup-maybe-ref\"}");
+/* harmony import */ var _NewComponent_vue_vue_type_template_id_5e77f4a8__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./NewComponent.vue?vue&type=template&id=5e77f4a8 */ "./resources/js/components/NewComponent.vue?vue&type=template&id=5e77f4a8");
 /* harmony import */ var _NewComponent_vue_vue_type_script_lang_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./NewComponent.vue?vue&type=script&lang=js */ "./resources/js/components/NewComponent.vue?vue&type=script&lang=js");
 
 
 
-_NewComponent_vue_vue_type_script_lang_js__WEBPACK_IMPORTED_MODULE_1__.default.render = _NewComponent_vue_vue_type_template_id_5e77f4a8_bindings_foo_props_greeting_setup_maybe_ref___WEBPACK_IMPORTED_MODULE_0__.render
+_NewComponent_vue_vue_type_script_lang_js__WEBPACK_IMPORTED_MODULE_1__.default.render = _NewComponent_vue_vue_type_template_id_5e77f4a8__WEBPACK_IMPORTED_MODULE_0__.render
 /* hot reload */
 if (false) {}
 
@@ -33773,32 +33796,6 @@ _NewComponent_vue_vue_type_script_lang_js__WEBPACK_IMPORTED_MODULE_1__.default._
 
 /***/ }),
 
-/***/ "./resources/js/components/TestComponent.vue":
-/*!***************************************************!*\
-  !*** ./resources/js/components/TestComponent.vue ***!
-  \***************************************************/
-/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
-
-"use strict";
-__webpack_require__.r(__webpack_exports__);
-/* harmony export */ __webpack_require__.d(__webpack_exports__, {
-/* harmony export */   "default": () => __WEBPACK_DEFAULT_EXPORT__
-/* harmony export */ });
-/* harmony import */ var _TestComponent_vue_vue_type_template_id_70d64aa0_bindings_foo_props_greeting_setup_maybe_ref___WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./TestComponent.vue?vue&type=template&id=70d64aa0&bindings={"foo":"props","greeting":"setup-maybe-ref"} */ "./resources/js/components/TestComponent.vue?vue&type=template&id=70d64aa0&bindings={\"foo\":\"props\",\"greeting\":\"setup-maybe-ref\"}");
-/* harmony import */ var _TestComponent_vue_vue_type_script_lang_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./TestComponent.vue?vue&type=script&lang=js */ "./resources/js/components/TestComponent.vue?vue&type=script&lang=js");
-
-
-
-_TestComponent_vue_vue_type_script_lang_js__WEBPACK_IMPORTED_MODULE_1__.default.render = _TestComponent_vue_vue_type_template_id_70d64aa0_bindings_foo_props_greeting_setup_maybe_ref___WEBPACK_IMPORTED_MODULE_0__.render
-/* hot reload */
-if (false) {}
-
-_TestComponent_vue_vue_type_script_lang_js__WEBPACK_IMPORTED_MODULE_1__.default.__file = "resources/js/components/TestComponent.vue"
-
-/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (_TestComponent_vue_vue_type_script_lang_js__WEBPACK_IMPORTED_MODULE_1__.default);
-
-/***/ }),
-
 /***/ "./resources/js/components/NewComponent.vue?vue&type=script&lang=js":
 /*!**************************************************************************!*\
   !*** ./resources/js/components/NewComponent.vue?vue&type=script&lang=js ***!
@@ -33815,111 +33812,19 @@ __webpack_require__.r(__webpack_exports__);
 
 /***/ }),
 
-/***/ "./resources/js/components/TestComponent.vue?vue&type=script&lang=js":
-/*!***************************************************************************!*\
-  !*** ./resources/js/components/TestComponent.vue?vue&type=script&lang=js ***!
-  \***************************************************************************/
+/***/ "./resources/js/components/NewComponent.vue?vue&type=template&id=5e77f4a8":
+/*!********************************************************************************!*\
+  !*** ./resources/js/components/NewComponent.vue?vue&type=template&id=5e77f4a8 ***!
+  \********************************************************************************/
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
 "use strict";
 __webpack_require__.r(__webpack_exports__);
 /* harmony export */ __webpack_require__.d(__webpack_exports__, {
-/* harmony export */   "default": () => /* reexport safe */ _node_modules_babel_loader_lib_index_js_clonedRuleSet_5_use_0_node_modules_vue_loader_dist_index_js_ruleSet_0_use_0_TestComponent_vue_vue_type_script_lang_js__WEBPACK_IMPORTED_MODULE_0__.default
+/* harmony export */   "render": () => /* reexport safe */ _node_modules_babel_loader_lib_index_js_clonedRuleSet_5_use_0_node_modules_vue_loader_dist_templateLoader_js_ruleSet_1_rules_2_node_modules_vue_loader_dist_index_js_ruleSet_0_use_0_NewComponent_vue_vue_type_template_id_5e77f4a8__WEBPACK_IMPORTED_MODULE_0__.render
 /* harmony export */ });
-/* harmony import */ var _node_modules_babel_loader_lib_index_js_clonedRuleSet_5_use_0_node_modules_vue_loader_dist_index_js_ruleSet_0_use_0_TestComponent_vue_vue_type_script_lang_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! -!../../../node_modules/babel-loader/lib/index.js??clonedRuleSet-5.use[0]!../../../node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./TestComponent.vue?vue&type=script&lang=js */ "./node_modules/babel-loader/lib/index.js??clonedRuleSet-5.use[0]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./resources/js/components/TestComponent.vue?vue&type=script&lang=js");
- 
+/* harmony import */ var _node_modules_babel_loader_lib_index_js_clonedRuleSet_5_use_0_node_modules_vue_loader_dist_templateLoader_js_ruleSet_1_rules_2_node_modules_vue_loader_dist_index_js_ruleSet_0_use_0_NewComponent_vue_vue_type_template_id_5e77f4a8__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! -!../../../node_modules/babel-loader/lib/index.js??clonedRuleSet-5.use[0]!../../../node_modules/vue-loader/dist/templateLoader.js??ruleSet[1].rules[2]!../../../node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./NewComponent.vue?vue&type=template&id=5e77f4a8 */ "./node_modules/babel-loader/lib/index.js??clonedRuleSet-5.use[0]!./node_modules/vue-loader/dist/templateLoader.js??ruleSet[1].rules[2]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./resources/js/components/NewComponent.vue?vue&type=template&id=5e77f4a8");
 
-/***/ }),
-
-/***/ "./resources/js/components/NewComponent.vue?vue&type=template&id=5e77f4a8&bindings={\"foo\":\"props\",\"greeting\":\"setup-maybe-ref\"}":
-/*!**************************************************************************************************************************************!*\
-  !*** ./resources/js/components/NewComponent.vue?vue&type=template&id=5e77f4a8&bindings={"foo":"props","greeting":"setup-maybe-ref"} ***!
-  \**************************************************************************************************************************************/
-/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
-
-"use strict";
-__webpack_require__.r(__webpack_exports__);
-/* harmony export */ __webpack_require__.d(__webpack_exports__, {
-/* harmony export */   "render": () => /* reexport safe */ _node_modules_vue_loader_dist_templateLoader_js_ruleSet_1_rules_2_node_modules_vue_loader_dist_index_js_ruleSet_0_use_0_NewComponent_vue_vue_type_template_id_5e77f4a8_bindings_foo_props_greeting_setup_maybe_ref___WEBPACK_IMPORTED_MODULE_0__.render
-/* harmony export */ });
-/* harmony import */ var _node_modules_vue_loader_dist_templateLoader_js_ruleSet_1_rules_2_node_modules_vue_loader_dist_index_js_ruleSet_0_use_0_NewComponent_vue_vue_type_template_id_5e77f4a8_bindings_foo_props_greeting_setup_maybe_ref___WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! -!../../../node_modules/vue-loader/dist/templateLoader.js??ruleSet[1].rules[2]!../../../node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./NewComponent.vue?vue&type=template&id=5e77f4a8&bindings={"foo":"props","greeting":"setup-maybe-ref"} */ "./node_modules/vue-loader/dist/templateLoader.js??ruleSet[1].rules[2]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./resources/js/components/NewComponent.vue?vue&type=template&id=5e77f4a8&bindings={\"foo\":\"props\",\"greeting\":\"setup-maybe-ref\"}");
-
-
-/***/ }),
-
-/***/ "./resources/js/components/TestComponent.vue?vue&type=template&id=70d64aa0&bindings={\"foo\":\"props\",\"greeting\":\"setup-maybe-ref\"}":
-/*!***************************************************************************************************************************************!*\
-  !*** ./resources/js/components/TestComponent.vue?vue&type=template&id=70d64aa0&bindings={"foo":"props","greeting":"setup-maybe-ref"} ***!
-  \***************************************************************************************************************************************/
-/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
-
-"use strict";
-__webpack_require__.r(__webpack_exports__);
-/* harmony export */ __webpack_require__.d(__webpack_exports__, {
-/* harmony export */   "render": () => /* reexport safe */ _node_modules_vue_loader_dist_templateLoader_js_ruleSet_1_rules_2_node_modules_vue_loader_dist_index_js_ruleSet_0_use_0_TestComponent_vue_vue_type_template_id_70d64aa0_bindings_foo_props_greeting_setup_maybe_ref___WEBPACK_IMPORTED_MODULE_0__.render
-/* harmony export */ });
-/* harmony import */ var _node_modules_vue_loader_dist_templateLoader_js_ruleSet_1_rules_2_node_modules_vue_loader_dist_index_js_ruleSet_0_use_0_TestComponent_vue_vue_type_template_id_70d64aa0_bindings_foo_props_greeting_setup_maybe_ref___WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! -!../../../node_modules/vue-loader/dist/templateLoader.js??ruleSet[1].rules[2]!../../../node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./TestComponent.vue?vue&type=template&id=70d64aa0&bindings={"foo":"props","greeting":"setup-maybe-ref"} */ "./node_modules/vue-loader/dist/templateLoader.js??ruleSet[1].rules[2]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./resources/js/components/TestComponent.vue?vue&type=template&id=70d64aa0&bindings={\"foo\":\"props\",\"greeting\":\"setup-maybe-ref\"}");
-
-
-/***/ }),
-
-/***/ "./node_modules/vue-loader/dist/templateLoader.js??ruleSet[1].rules[2]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./resources/js/components/NewComponent.vue?vue&type=template&id=5e77f4a8&bindings={\"foo\":\"props\",\"greeting\":\"setup-maybe-ref\"}":
-/*!***********************************************************************************************************************************************************************************************************************************************************************!*\
-  !*** ./node_modules/vue-loader/dist/templateLoader.js??ruleSet[1].rules[2]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./resources/js/components/NewComponent.vue?vue&type=template&id=5e77f4a8&bindings={"foo":"props","greeting":"setup-maybe-ref"} ***!
-  \***********************************************************************************************************************************************************************************************************************************************************************/
-/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
-
-"use strict";
-__webpack_require__.r(__webpack_exports__);
-/* harmony export */ __webpack_require__.d(__webpack_exports__, {
-/* harmony export */   "render": () => /* binding */ render
-/* harmony export */ });
-/* harmony import */ var vue__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! vue */ "./node_modules/vue/dist/vue.esm-bundler.js");
-
-
-const _hoisted_1 = /*#__PURE__*/(0,vue__WEBPACK_IMPORTED_MODULE_0__.createTextVNode)("Testing out New Vue 3 components ")
-const _hoisted_2 = /*#__PURE__*/(0,vue__WEBPACK_IMPORTED_MODULE_0__.createVNode)("br", null, null, -1 /* HOISTED */)
-
-function render(_ctx, _cache, $props, $setup, $data, $options) {
-  return ((0,vue__WEBPACK_IMPORTED_MODULE_0__.openBlock)(), (0,vue__WEBPACK_IMPORTED_MODULE_0__.createBlock)(vue__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, [
-    (0,vue__WEBPACK_IMPORTED_MODULE_0__.createVNode)("div", null, [
-      _hoisted_1,
-      _hoisted_2,
-      (0,vue__WEBPACK_IMPORTED_MODULE_0__.createTextVNode)("Greeting: " + (0,vue__WEBPACK_IMPORTED_MODULE_0__.toDisplayString)($setup.greeting), 1 /* TEXT */)
-    ]),
-    (0,vue__WEBPACK_IMPORTED_MODULE_0__.createVNode)("div", null, "Foo: " + (0,vue__WEBPACK_IMPORTED_MODULE_0__.toDisplayString)($props.foo), 1 /* TEXT */)
-  ], 64 /* STABLE_FRAGMENT */))
-}
-
-/***/ }),
-
-/***/ "./node_modules/vue-loader/dist/templateLoader.js??ruleSet[1].rules[2]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./resources/js/components/TestComponent.vue?vue&type=template&id=70d64aa0&bindings={\"foo\":\"props\",\"greeting\":\"setup-maybe-ref\"}":
-/*!************************************************************************************************************************************************************************************************************************************************************************!*\
-  !*** ./node_modules/vue-loader/dist/templateLoader.js??ruleSet[1].rules[2]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./resources/js/components/TestComponent.vue?vue&type=template&id=70d64aa0&bindings={"foo":"props","greeting":"setup-maybe-ref"} ***!
-  \************************************************************************************************************************************************************************************************************************************************************************/
-/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
-
-"use strict";
-__webpack_require__.r(__webpack_exports__);
-/* harmony export */ __webpack_require__.d(__webpack_exports__, {
-/* harmony export */   "render": () => /* binding */ render
-/* harmony export */ });
-/* harmony import */ var vue__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! vue */ "./node_modules/vue/dist/vue.esm-bundler.js");
-
-
-const _hoisted_1 = /*#__PURE__*/(0,vue__WEBPACK_IMPORTED_MODULE_0__.createTextVNode)("Testing out Vue 3 components ")
-const _hoisted_2 = /*#__PURE__*/(0,vue__WEBPACK_IMPORTED_MODULE_0__.createVNode)("br", null, null, -1 /* HOISTED */)
-
-function render(_ctx, _cache, $props, $setup, $data, $options) {
-  return ((0,vue__WEBPACK_IMPORTED_MODULE_0__.openBlock)(), (0,vue__WEBPACK_IMPORTED_MODULE_0__.createBlock)(vue__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, [
-    (0,vue__WEBPACK_IMPORTED_MODULE_0__.createVNode)("div", null, [
-      _hoisted_1,
-      _hoisted_2,
-      (0,vue__WEBPACK_IMPORTED_MODULE_0__.createTextVNode)("Greeting: " + (0,vue__WEBPACK_IMPORTED_MODULE_0__.toDisplayString)($setup.greeting), 1 /* TEXT */)
-    ]),
-    (0,vue__WEBPACK_IMPORTED_MODULE_0__.createVNode)("div", null, "Foo: " + (0,vue__WEBPACK_IMPORTED_MODULE_0__.toDisplayString)($props.foo), 1 /* TEXT */)
-  ], 64 /* STABLE_FRAGMENT */))
-}
 
 /***/ }),
 
diff --git a/resources/js/app.js b/resources/js/app.js
index 22f00981..8ca873fe 100644
--- a/resources/js/app.js
+++ b/resources/js/app.js
@@ -2,9 +2,8 @@ require("./bootstrap");
 
 import { createApp } from "vue";
 
-import TestComponent from "./components/TestComponent.vue";
 import NewComponent from "./components/NewComponent.vue";
 
 createApp({
-    components: { TestComponent, NewComponent },
+    components: { NewComponent },
 }).mount("#app");
diff --git a/resources/js/components/NewComponent.vue b/resources/js/components/NewComponent.vue
index f87e4dbe..3390d6c4 100644
--- a/resources/js/components/NewComponent.vue
+++ b/resources/js/components/NewComponent.vue
@@ -1,15 +1,39 @@
 <template>
-    <div>Testing out New Vue 3 components <br />Greeting: {{ greeting }}</div>
-    <div>Foo: {{ foo }}</div>
+    <div>
+        Vue
+        <div v-if="products">
+            <div v-for="product in products" :key="product.id">
+                {{ product.id }} - {{ product.name }} -
+                {{ product.description }} - {{ product.price }}
+            </div>
+        </div>
+    </div>
 </template>
 
 <script>
 export default {
-    props: ["foo"],
-    setup() {
-        const greeting = "Greetings";
-        return { greeting };
+    data() {
+        return {
+            products: null,
+        };
     },
+    mounted() {
+        axios
+            .get("/api/products")
+            .then((response) => {
+                // commit('updateProducts', response.data);
+                console.log("We got a response!");
+                console.log(response.data);
+                this.products = response.data;
+                console.log(this.products);
+            })
+            .catch((error) => console.error(error));
+    },
+
+    /*setup() {
+        const products = {};
+        return { products };
+    },*/
 };
 </script>
 
diff --git a/resources/js/components/TestComponent.vue b/resources/js/components/TestComponent.vue
deleted file mode 100644
index c72f975f..00000000
--- a/resources/js/components/TestComponent.vue
+++ /dev/null
@@ -1,16 +0,0 @@
-<template>
-    <div>Testing out Vue 3 components <br />Greeting: {{ greeting }}</div>
-    <div>Foo: {{ foo }}</div>
-</template>
-
-<script>
-export default {
-    props: ["foo"],
-    setup() {
-        const greeting = "Greetings";
-        return { greeting };
-    },
-};
-</script>
-
-<style></style>
diff --git a/resources/views/welcome.blade.php b/resources/views/welcome.blade.php
index 204e8040..f7af62fa 100644
--- a/resources/views/welcome.blade.php
+++ b/resources/views/welcome.blade.php
@@ -26,13 +26,8 @@
             @endif
 
             <div id="app">
-
-                <test-component foo="bar1"></test-component>
-                <new-component foo="bar2"></new-component>
-
-                <div class="text-white bg-black">White text</div>
+                <new-component></new-component>
             </div>
-
             <script src="{{ mix('js/app.js') }}"></script>
     </body>
 </html>