Book Image

ASP.NET Core and Vue.js

By : Devlin Basilan Duldulao
Book Image

ASP.NET Core and Vue.js

By: Devlin Basilan Duldulao

Overview of this book

Vue.js 3 is faster and smaller than the previous version, and TypeScript’s full support out of the box makes it a more maintainable and easier-to-use version of Vue.js. Then, there's ASP.NET Core 5, which is the fastest .NET web framework today. Together, Vue.js for the frontend and ASP.NET Core 5 for the backend make a powerful combination. This book follows a hands-on approach to implementing practical methodologies for building robust applications using ASP.NET Core 5 and Vue.js 3. The topics here are not deep dive and the book is intended for busy .NET developers who have limited time and want a quick implementation of a clean architecture with popular libraries. You’ll start by setting up your web app’s backend, guided by clean architecture, command query responsibility segregation (CQRS), mediator pattern, and Entity Framework Core 5. The book then shows you how to build the frontend application using best practices, state management with Vuex, Vuetify UI component libraries, Vuelidate for input validations, lazy loading with Vue Router, and JWT authentication. Later, you’ll focus on testing and deployment. All the tutorials in this book support Windows 10, macOS, and Linux users. By the end of this book, you’ll be able to build an enterprise full-stack web app, use the most common npm packages for Vue.js and NuGet packages for ASP.NET Core, and deploy Vue.js and ASP.NET Core to Azure App Service using GitHub Actions.
Table of Contents (25 chapters)
1
Section 1: Getting Started
4
Section 2: Backend Development
13
Section 3: Frontend Development
20
Section 4: Testing and Deployment

Summary

There are so many things that we've done in this chapter. You learned that the Vue CLI is a great tool for scaffolding a project that saves developers a lot of time. You learned the parts of a Vue component, namely, the template block, which is the UI part of the Vue, the script section for writing business logic, and the style block for styling the component. You also learned how to create a Vue component and how to use the common interfaces in Vue, such as v-for for looping, the v-if conditions, and the @ sign for writing events.

You were also able to learn how to write states in a Vue component using ref and how to do data binding using the colon prefix or by using the double curly braces.

Lastly, you learned what props are and how to pass props between two Vue components. You also learned when to use life cycle hooks in a Vue component for triggering a function.

In the next chapter, we will start to develop our real-world enterprise Vue.js app.