Author: Code Maze

Creating Vue.js Client Side – Using ref Keyword to Reference Components (Details and Delete Components)

In the previous part, we have learned how to create and listen to events. We have implemented functionality for all three buttons which emit custom events named details, update and delete and now we are going to implement functionalities for these events. For the complete series navigation visit: Vue.js Series. To download the source code for this part, visit Details and Deleting Owner Entity Source Code. This post is divided into several sections: Creating Owner Details Component Deleting the Owner Entity Conclusion Creating Owner Details Component In the previous part, we have created the custom details event and an...

Read More

Creating Vue.js Client Side – Components Props and Events

We have implemented everything that we have learned so far, from navigation and API services to data display. It’s time to dive deeper into more complicated things which we are going to make easy to understand. We are going to make an additional component and then show how communication between parent-child components works. For the complete series navigation visit: Vue.js Series. To download the source code for this part, visit Components Props and Events. This post is divided into several sections: Creating a New Component Event Handling Conclusion Creating a New Component Do you remember the OwnerList component from...

Read More

Creating Vue.js Client Side – Creating Components and Displaying Data from Backend

We have learned how to create an API service and fetch data from the backend. Now, it’s time to display that data to a user and for that, we need to create a component. As we mentioned in Part 1 of this series, the Vue.js components consist of three parts: a template, a script and a style. After we create a component, we have various ways to use it. We can register it globally to use it in any other component. Otherwise, we can internally register it inside a single component and it will be available only in that...

Read More

Creating Vue.js Client Side – Axios HTTP Client and Environment Files

We have learned how to create Vue.js components and how to create and use navigation, but we are still missing one of the most important things in our project. It’s time to get some actual data from our backend and to display it in our components. To accomplish that, we need to use the HTTP Client library and because Vue.js doesn’t have its own, we are going to use Axios. Furthermore, we need to configure Axios to send requests to our backend server depending on the environment our application is on. For the complete series navigation visit: Vue.js Series....

Read More

Creating Vue.js Client Side – Routing and Navigation

Right now, we have a working Vue.js application and we are ready to implement some functionalities in it. But before we start creating some great functionalities we are going to create the navigation to be able to navigate through our application. We already have vue-router in the application and we are going to use it to create new routes and connect it to the components. We are going to use the Bootstrap library for styling our components. For the complete navigation of this series, you can visit Vue.js Series. To download the source code for this part, visit Routing...

Read More