0%

A guide to building enterprise, cloud-ready full-stack web applications using TypeScript, Vue.js 3, and ASP.NET Core 5 for busy developers

Key Features

  • Learn how to implement clean architecture in the latest ASP.NET Core 5 Web API
  • Develop Vue.js 3 single-page applications (SPAs) using TypeScript or JavaScript programming and Vuex state management
  • Secure, test, and deploy your full-stack web application to Azure Cloud

Book Description

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.

What you will learn

  • Discover CQRS and mediator pattern in the ASP.NET Core 5 Web API
  • Use Serilog, MediatR, FluentValidation, and Redis in ASP.NET
  • Explore common Vue.js packages such as Vuelidate, Vuetify, and Vuex
  • Manage complex app states using the Vuex state management library
  • Write integration tests in ASP.NET Core using xUnit and FluentAssertions
  • Deploy your app to Microsoft Azure using the new GitHub Actions for continuous integration and continuous deployment (CI/CD)

Who this book is for

This app development book is for .NET developers who want to get started with Vue.js and build full-stack real-world enterprise web applications. Developers looking to build a proof-of-concept application quickly and pragmatically using their existing knowledge of ASP.NET Core as well as developers who want to write readable and maintainable code using TypeScript and the C# programming language will also find this book useful. The book assumes intermediate-level .NET knowledge along with an understanding of C# programming, JavaScript, and ECMAScript.

Table of Contents

  1. ASP.NET Core and Vue.js
  2. Contributors
  3. About the author
  4. About the reviewer
  5. Preface
    1. Who this book is for
    2. What this book covers
    3. To get the most out of this book
    4. Download the example code files
    5. Download the color images
    6. Conventions used
    7. Get in touch
    8. Reviews
  6. Section 1: Getting Started
  7. Chapter 1: Getting Started with ASP.NET Core and Vue.js
    1. Technical requirements
    2. Introducing ASP.NET Core
    3. What's new in .NET?
    4. What's new in ASP.NET Core?
    5. Breaking changes in migration from ASP.NET Core 3.1 to ASP.NET Core 5.0
    6. When to use ASP.NET Core
    7. Why should you learn ASP.NET Core?
    8. Introducing Vue.js
    9. What's new in Vue.js?
    10. Why is learning Vue.js the right choice?
    11. Summary
  8. Chapter 2: Setting Up a Development Environment
    1. Technical requirements
    2. Installing and configuring VS Code, Visual Studio 2019, VS for Mac, and Rider
    3. VS Code
    4. Visual Studio 2019
    5. Visual Studio for Mac
    6. Rider
    7. Installing .NET SDK, Node.js, and npm
    8. .NET SDK
    9. Node and npm
    10. Setting up the .NET Core CLI and Vue CLI
    11. Installing Postman and Vue DevTool
    12. Installing Entity Framework Core tools
    13. Installing a database provider
    14. Installing Git version control
    15. Summary
  9. Section 2: Backend Development
  10. Chapter 3: Starting Your First ASP.NET Core Project
    1. Technical requirements
    2. Creating an ASP.NET Core project
    3. First command – dotnet new sln
    4. Second command – dotnet new webapi --name Web
    5. Third command – dotnet sln add [csproj-file-location]
    6. The last command to run – dotnet run Web.csproj
    7. Understanding the Program.cs file
    8. Demystifying the Startup.cs file
    9. Getting started with Swashbuckle
    10. Introducing OpenAPI and Swagger
    11. Built-in Swagger integration
    12. Swagger documentation and Swagger UI in action
    13. Summary
  11. Chapter 4: Applying Clean Architecture to an ASP.NET Core Solution
    1. Technical requirements
    2. Introducing clean architecture
    3. The core layer – directory
    4. Domain – project
    5. Application – project
    6. Shared Kernel – NuGet project
    7. The infrastructure layer – directory
    8. Data – project
    9. Shared – project
    10. The presentation layer – directory
    11. WebApi – project
    12. client-app – non-project web application
    13. Managing tests – directories
    14. Unit test – project
    15. Integration test – project
    16. Structuring a clean architecture solution
    17. Visual Studio 2019
    18. Visual Studio for Mac
    19. Rider
    20. Summary
  12. Chapter 5: Setting Up DbContext and Controllers
    1. Technical requirements
    2. Writing entities and enums
    3. Creating entities and enums for the Travel Tour application
    4. Setting up a database, EF Core, and DbContext
    5. EF Core
    6. DbContext
    7. Setup
    8. Writing controllers and routes
    9. TourPackagesController
    10. TourListsController
    11. Testing controllers with Swagger UI
    12. Summary
  13. Chapter 6: Diving into CQRS
    1. Technical requirements
    2. What is CQRS?
    3. What is the mediator pattern?
    4. What is the MediatR package?
    5. Why learn CQRS?
    6. When to use CQRS
    7. Drawbacks of CQRS
    8. Summary
  14. Chapter 7: CQRS in Action
    1. Technical requirements
    2. Implementing CQRS
    3. Adding the MediatR package
    4. Creating MediatR pipeline behaviors
    5. Using FluentValidation
    6. Using AutoMapper
    7. Writing queries
    8. Writing commands
    9. Writing IServiceCollection
    10. Summary
  15. Chapter 8: API Versioning and Logging in ASP.NET Core
    1. Technical requirements
    2. API versioning
    3. What is API versioning?
    4. API versioning strategies
    5. Deprecating an API
    6. API versioning integration with OpenAPI
    7. Logging in ASP.NET Core
    8. Logging in ASP.NET Core
    9. What is structured logging?
    10. Serilog versus NLog
    11. Configuring Serilog
    12. Summary
  16. Chapter 9: Securing ASP.NET Core
    1. Technical requirements
    2. Understanding ASP.NET Core Identity
    3. ASP.NET Core Identity features
    4. Introducing IdentityServer4
    5. Customer identity and access management (CIAM)
    6. Authentication implementation using JWT
    7. Implementing token-based authentication
    8. Checking Swagger UI
    9. Summary
  17. Chapter 10: Performance Enhancement with Redis
    1. Technical requirements
    2. In-memory caching in ASP.NET Core
    3. Enabling in-memory caching in ASP.NET Core
    4. Distributed caching
    5. Setting up and running Redis
    6. For Windows users
    7. For macOS users
    8. For Linux or Ubuntu users
    9. Implementing Redis in ASP.NET Core
    10. Code update
    11. Summary
  18. Section 3: Frontend Development
  19. Chapter 11: Vue.js Fundamentals in a Todo App
    1. Technical requirements
    2. Starting a project using the Vue CLI
    3. Files and folders generated by the Vue CLI
    4. Getting started with a Vue component
    5. Writing a Vue component
    6. Common features in a Vue component
    7. Writing local states in a Vue component
    8. Adding a function in a Vue component
    9. Looping in an array in a Vue component
    10. If-else conditions in a Vue component
    11. Creating and passing props
    12. Life cycle hooks in a Vue component
    13. Summary
    14. Further reading
  20. Chapter 12: Using a UI Component Library and Creating Routes and Navigations
    1. Technical requirements
    2. Using a third-party UI component library
    3. Setting up a Vue.js project and installing a UI component library
    4. Other third-party UI libraries
    5. Adding navigation bars
    6. Writing page components
    7. Setting up Vue Router with lazy loading and eager loading
    8. Summary
  21. Chapter 13: Integrating a Vue.js Application with ASP.NET Core
    1. Technical requirements
    2. Putting ASP.NET Core Web API and a Vue.js app together as a single unit
    3. Introducing Cross-Origin Resource Sharing or CORS
    4. Enabling a CORS policy in ASP.NET Core
    5. Summary
  22. Chapter 14: Simplifying State Management with Vuex and Sending GET HTTP Requests
    1. Technical requirements
    2. Understanding complex state management
    3. Understanding global state
    4. Sending an HTTP request in Vue.js
    5. Setting up state management using Vuex
    6. Step 1 – Writing a store
    7. Step 2 – Writing a module
    8. Step 3 – Writing a module if we are using TypeScript
    9. Step 4 – Writing an API service
    10. Step 5 – Writing an action type
    11. Step 6 – Writing an action
    12. Step 7 – Writing a state
    13. Step 8 – Writing a mutation
    14. Step 9 – Writing a getter
    15. Step 10 – Updating the store by inserting the module
    16. Step 11 – Updating components with mapGetters and mapActions
    17. Summary
  23. Chapter 15: Sending POST, DELETE, and PUT HTTP Requests in Vue.js with Vuex
    1. Technical requirements
    2. Removing a tour list using Axios and Vuex
    3. Adding a tour list using Axios and Vuex
    4. Using a non-async action in Vuex
    5. Removing a tour package using Axios and Vuex
    6. Adding a tour package using Axios and Vuex
    7. Updating a tour package using Axios and Vuex
    8. Summary
  24. Chapter 16: Adding Authentication in Vue.js
    1. Technical requirements
    2. Setting up Vuex for authentication
    3. Writing an auth guard
    4. HTTP interceptor
    5. Auto login
    6. Summary
  25. Section 4: Testing and Deployment
  26. Chapter 17: Input Validations in Forms
    1. Technical requirements
    2. Installing an input validation library
    3. Using validators in forms
    4. Summary
  27. Chapter 18: Writing Integration Tests Using xUnit
    1. Technical requirements
    2. Getting started with automated testing
    3. Benefits of automated testing
    4. Installing MS SQL Server in a Docker container
    5. Understanding xUnit
    6. Features of xUnit
    7. Using xUnit in ASP.NET Core
    8. Understanding unit testing
    9. Writing unit tests
    10. Understanding integration testing
    11. Writing integration tests
    12. Summary
  28. Chapter 19: Automatic Deployment Using GitHub Actions and Azure
    1. Technical requirements
    2. Introducing GitHub Actions – a CI/CD tool
    3. Understanding GitHub Actions
    4. GitHub Actions for .NET apps
    5. Understanding where to deploy
    6. When to deploy to Azure App Service?
    7. When to deploy to Azure Functions?
    8. When to deploy to Azure Static Web Apps?
    9. When to deploy to Azure Kubernetes Service?
    10. Automated deployment to Azure App Service using GitHub Actions
    11. Syntax of the workflow file
    12. Creating an Azure App Service instance in the Azure portal
    13. Summary
    14. Why subscribe?
  29. Other Books You May Enjoy
    1. Packt is searching for authors like you
    2. Leave a review - let other readers know what you think
3.145.111.183