Name: ASP.NET Core 2 and Vue.js
Author: Stuart Ratcliffe
ISBN: 9781788834414

微信读书书城ASP.NET Core 2 and Vue.js

首页我的书架登录

ASP.NET Core 2 and Vue.jsStuart Ratcliffe

微信读书推荐值

待评分

推荐

一般

不行

推荐

一般

不行

推荐

一般

不行

推荐

一般

不行

ASP.NET Core 2 and Vue.js

Stuart Ratcliffe

扉页
Title Page
+书签
Copyright and Credits
ASP.NET Core 2 and Vue.js
Dedication
Packt Upsell
Why subscribe?
PacktPub.com
Contributors
About the author
About the reviewer
Packt is searching for authors like you
Preface
Who this book is for
What this book covers
To get the most out of this book
Download the example code files
Conventions used
Get in touch
Reviews
Understanding the Fundamentals
Thinking in components
What is a component?
UI composition
Introduction to Vue
The Vue instance
Attaching to the DOM
Defining data properties
Rendering data into the DOM using expressions
Building component trees
Reactivity
Component behavior
State
Props
Methods
Computed properties
Watchers
Lifecycle hooks
Component presentation
Directives
Attribute binding with v-bind
Conditional display with v-show
Control flow with v-if and v-else
Rendering lists with v-for
Event handling with v-on
Form input binding with v-model
Parent-child component communication
ASP.NET Core – what s new?
Middleware pipeline
Application startup
DI is a first-class citizen
EF Core – what s new?
Configuring relationships
Global query filters
Compiled queries
In-memory provider for testing
Summary
Setting Up the Development Environment
Choosing a web browser
Installing frontend tools and dependencies
Installing Node and npm
Installing Vue
npm or Yarn?
Installing backend tools and dependencies
Installing ASP.NET Core
Installing PostgreSQL
Choosing and installing an IDE
Productivity tools
Installing VS Code extensions
Installing the Vue.js Chrome devtools extension
Installing a Terminal Emulator on Windows (optional)
Summary
Getting Started with the Project
ASP.NET Core SPA templates versus CLI tools
An introduction to webpack
What is webpack?
How does it work?
Basic webpack configuration
Bundle splitting
Production bundles
Scaffolding a project with the dotnet CLI
Refactoring the frontend setup
Removing TypeScript
Replacing the default components
Refactoring the backend setup
Refactoring to a feature folder structure
Setting up the database
Creating a database context
Registering the database context for DI
Creating the database
Creating an initial migration
Creating and seeding the database on start-up
Testing the completed setup
Summary
Building Our First Vue.js Components
Displaying a list of products
Conditional rendering
Component composition
Client-side routing
Fetching data from an API
Summary
Building a Product Catalog
Improving the existing UX
Choosing a UX framework
What is Bootstrap-Vue?
Installing additional required dependencies
Modifying the webpack configuration to support SASS
Updating the webpack vendor configuration
Rebuilding the vendor bundle
Adding application-wide layout elements
Adding application-wide styles
Styling the product list and product details components
Fetching data before navigation
Adding a page loading indicator
Adding a transition on page change
Extending the existing data model
Dropping the existing database
Adding new/updating existing entities
Updating the DbContext class
Creating a migration to reflect the model changes
Updating the application s seed data
Filtering on the server
Updating controller actions to support filtering
Testing our filtering logic
Filtering on the client
Installing additional dependencies
Installing Font Awesome
Installing additional npm packages
Building an accordion component
Defining the accordion template structure
Defining the accordion behavior
Styling the accordion component
Building the filters component
Scaffolding the filters component template
Adding a brand filter
Adding a price filter
Adding a screen size filter
Adding the remaining color, OS, and feature filters
Scaffolding the filters component behavior
Defining the filters component computed properties
Defining the filters component methods
Styling the filters component
Adding the filters component to the catalog page
Updating the catalog page template
Adding the catalog page filter behavior
Tidying up our existing components
Testing the completed filtering logic
Refactoring the filters component
Highlighting duplication in our existing implementation
Extracting a common multi-select filter component
Extracting a common range filter component
Rendering the new multi-select and range filter components
Testing that everything still works
Client-side sorting
Building a sort component
Adding the sort component to the catalog page
Creating a search bar component
Triggering API requests using watchers
Debouncing API requests to limit how often they fire
Summary
Building a Shopping Cart
Evaluating our options
Persisting to the database
Persisting to session state
Persisting to local storage
Finishing the product details page
Creating the gallery component
Adding variants to the product details component
Introduction to Vuex
What is Vuex?
How does Vuex work?
Mutations
Actions
Getters
Putting it all together
Installing and configuring Vuex
Adding products to the cart
Creating the mutations
Creating an action
Creating a shopping cart page
Creating a CartItem component
Displaying the list of cart items
Creating a currency filter
Removing products from the cart
Updating cart items
Adding a getter to display the cart total
Creating a cart summary component
Persisting the cart to local storage
Improving the UX with add to cart feedback
Summary
User Registration and Authentication
Adding JWT authentication to the API
Why JWTs?
Configuring JWT authentication
Issuing JWTs
Adding user role support
Testing JWT authentication
User registration
Authentication and user registration in the client app
Vuex state properties for authentication
Vuex mutations for managing authentication state
Vuex authentication getters
Vuex login, register, and logout actions
Authentication modal component
Login form component
Register form component
Auth navigation item component
Wiring up the new components in App.vue
Protecting pages with navigation guards
Setting the authentication state on app startup
Summary
Processing Payments
Why use Stripe?
Simple PCI compliance
Easy integration
Excellent dashboard
Getting started with Stripe and client-side validation
Registering for a Stripe account
Including the Stripe checkout JavaScript library
Installing VeeValidate for client-side validation
Building the checkout components
Building a cart summary component
Building a checkout form component
First look at client-side validation
Finishing the delivery address form fields
Capturing payment information
Initializing Stripe elements
Validating form input state
Verifying payment details with Stripe
Submitting the order to the API
Adding basic Bootstrap styling to Stripe elements
Building a checkout success component
Building a my account page
Building the OrderList component
Formatting dates with a reusable date filter
Linking to the my account page
Fixing the register form component
Server-side payment processing
Adding orders to the data model
Owned entity types in EF Core 2.0
Why use owned entity types?
Defining an owned type
Configuring owned types
Creating the orders migration
Installing and configuring the Stripe.net NuGet package
Configuring Stripe
Processing orders and payments
Persisting the order object
Calculating the total order price
Processing the payment with Stripe
Adding an order list API endpoint
Summary
Building an Admin Panel
Extending the authentication endpoint with user roles
Client-side role-based authorization
Adding role checks to client-side routes
Server-side role-based authorization
Hiding UI elements based on role
Building the admin panel components
Configuring nested route definitions
Refactoring components for reuse
Product list component
Creating a product form component
Creating an add variant modal component
Vue component inheritance
Defining a form input base component
Inheriting from a base component
Building custom input controls
Building a custom typeahead control
Building a multi-select control
Persisting new products to the database
Creating a slug generator
Creating the API endpoint
Remote validation with Vee-Validate
Making our app aware of the new custom validation rule
Creating the validation API endpoint
Tidying things up
Linking to the admin panel
Fixing a logout bug
Fixing a bug by selecting a product variant
Summary
Deployment
Registering for an Azure account
Setting up an Azure environment
Understanding Azure subscriptions and resources
Creating a subscription and resource group
Creating a database
Creating an app service
Configuring environment variables
Preparing the application for deployment
Configuring multiple database providers
Tweaking the post-publish build steps
Configuring Git deployments
Finalizing the apps configuration
Enabling logging in Azure
Forcing HTTPS connections only
Summary
Authentication and Refresh Token Flow
Understanding refresh tokens
What are refresh tokens used for?
What are refresh tokens?
Why use refresh tokens?
Adding refresh token support to the backend
Extending the AppUser model
Generating refresh tokens
Refreshing JWT access tokens
Finishing up
Adding refresh token support to the frontend
Extracting router configuration into separate files
Refreshing access tokens with axios interceptors
Finishing up
Summary
Server-Side Rendering
Why use SSR in the first place?
Search engine optimization
Performance
How does SSR work?
The easy way – Nuxt.js
Preparing the application for SSR
Installing npm packages required for SSR
Adding Vuex actions and mutations for all API requests
Defining additional Vuex actions
Defining the additional Vuex mutations
Defining the additional store state properties
Updating existing pages to use Vuex
Refactoring the catalog page
Refactoring the product details page
Refactoring the account page
Refactoring the orders admin page
Refactoring the products admin page
Refactoring the create product admin page
Changing the way we persist user authentication state
Changing our approach of persisting state to local storage
Storing authentication state in cookies
Setting up and configuring SSR
Defining the shared boot logic
Defining the client-specific boot logic
Hydrating the client-side store
Loading shopping cart data from local storage
Pre-fetching component data
Remembering our promises
Defining the server-specific boot logic
Deleting the old boot file
Making webpack aware of the client/server boot files
Defining a shared webpack configuration object
Defining client- and server-specific webpack configuration objects
Updating the vendor webpack configuration to include SSR libraries
Enabling SSR
Conditionally rendering elements that rely on the browser
Fixing the range filter component
Fixing the checkout form component
Fixing page transition animations in the router
Fixing the store subscription to persist cart items to local storage
Testing our server-rendered application
Summary
Continuous Integration and Continuous Deployment
CI/CD – why bother?
Continuous integration
Continuous deployment
Disabling Azure app service Git deployments
Getting started with VSTS
Creating a VSTS account
Setting up a team services project
Building a CI/CD pipeline
Setting up a VSTS build
Enabling CI
Setting up a VSTS release
Enabling CD
Summary
Other Books You May Enjoy
Leave a review - let other readers know what you think

简介

版权

ASP.NET Core 2 and Vue.js