Coder Social home page Coder Social logo

asp.net-core-2-and-vue.js's Introduction

ASP.NET Core 2 and Vue.js

This is the code repository for ASP.NET Core 2 and Vue.js, published by Packt.

Full Stack Web Development with Vue, Vuex, and ASP.NET Core 2.0

What is this book about?

This book will walk you through the process of developing an e-commerce application from start to finish, utilizing an ASP.NET Core web API and Vue.js Single-Page Application (SPA) frontend.

This book covers the following exciting features:

  • Set up a modern development environment for building both client-side and server-side code
  • Use Vue CLI to scaffold frontend applications
  • Build and compose a set of Vue.js components
  • Set up and configure client-side routing to introduce multiple pages into a SPA
  • Integrate popular CSS frameworks with Vue.js to build a product catalog
  • Build a functioning shopping cart that persists its contents across browser sessions
  • Build client-side forms with immediate validation feedback using an open-source library dedicated to Vue.js form validation
  • Refactor backend application to use the OpenIddict library

If you feel this book is for you, get your copy today!

https://www.packtpub.com/

Instructions and Navigations

All of the code is organized into folders. For example, Chapter02.

The code will look like the following:

<template>
  <div class="product">
    {{ name }}
  </div>
</template>

Following is what you need for this book: This book is aimed at ASP.NET developers who are looking for an entry point in learning how to build a modern client-side SPA with Vue.js, or those with a basic understanding of Vue.js who are looking to build on their knowledge and apply it to a real-world application. Knowledge of JavaScript is not necessary, but would be an advantage. With the following software and hardware list you can run all code files present in the book (Chapter 1-15).

Software and Hardware List

Chapter Software required OS required
All Node.js 8.9.3 or above Windows, Mac OS X, and Linux (Any)
.NET Core SDK v2.1 or above Windows, Mac OS X, and Linux (Any)
Visual Studio Code v1.25.1 or above Windows, Mac OS X, and Linux (Any)
PostgreSQL v10.1.3 or above Windows, Mac OS X, and Linux (Any)
Google Chrome v67.X or above Windows, Mac OS X, and Linux (Any)

Related products

Get to Know the Author

Stuart Ratcliffe is a professional software developer who lives and works in the East Midlands, UK. He has held positions at some of the largest IT companies in the world, working on high-profile projects for the UK government. Currently, he has been working on track-and-trace systems for medical instruments that undergo sterilization. He holds a Tech Lead position on the digital side of a healthcare company, building both web and mobile applications to support the clinical side of the business. He is a full-stack .NET developer who loves to learn new technologies.

Suggestions and Feedback

Click here if you have any feedback or suggestions.

Download a free PDF

If you have already purchased a print or Kindle version of this book, you can get a DRM-free PDF version at no cost.
Simply click on the link to claim your free PDF.

https://packt.link/free-ebook/9781788839464

asp.net-core-2-and-vue.js's People

Contributors

packt-itservice avatar packtutkarshr avatar praju89 avatar sturatcliffe avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

asp.net-core-2-and-vue.js's Issues

Chapter 12 (SSR) NodeInvocationException: self is not defined

Hi @sturatcliffe ,
Can you give me a clue why I ran into this exception? Btw great book and please add PWA to your book. Thanks.

Microsoft.AspNetCore.NodeServices.HostingModels.NodeInvocationException: self is not defined

at Microsoft.AspNetCore.NodeServices.HostingModels.HttpNodeInstance.InvokeExportAsync[T](NodeInvocationInfo invocationInfo, CancellationToken cancellationToken)
at Microsoft.AspNetCore.NodeServices.HostingModels.OutOfProcessNodeInstance.InvokeExportAsync[T](CancellationToken cancellationToken, String moduleName, String exportNameOrNull, Object[] args)
at Microsoft.AspNetCore.NodeServices.NodeServicesImpl.InvokeExportWithPossibleRetryAsync[T](String moduleName, String exportedFunctionName, Object[] args, Boolean allowRetry, CancellationToken cancellationToken)
at Microsoft.AspNetCore.NodeServices.NodeServicesImpl.InvokeExportWithPossibleRetryAsync[T](String moduleName, String exportedFunctionName, Object[] args, Boolean allowRetry, CancellationToken cancellationToken)
at Microsoft.AspNetCore.SpaServices.Prerendering.PrerenderTagHelper.ProcessAsync(TagHelperContext context, TagHelperOutput output)
at Microsoft.AspNetCore.Razor.Runtime.TagHelpers.TagHelperRunner.RunAsync(TagHelperExecutionContext executionContext)
at AspNetCore._Features_Home_Index_cshtml.ExecuteAsync() in C:\Users\Alex Wijoyo\Documents\DotNetVue\Features\Home\Index.cshtml:line 9
at Microsoft.AspNetCore.Mvc.Razor.RazorView.RenderPageCoreAsync(IRazorPage page, ViewContext context)
at Microsoft.AspNetCore.Mvc.Razor.RazorView.RenderPageAsync(IRazorPage page, ViewContext context, Boolean invokeViewStarts)
at Microsoft.AspNetCore.Mvc.Razor.RazorView.RenderAsync(ViewContext context)
at Microsoft.AspNetCore.Mvc.ViewFeatures.ViewExecutor.ExecuteAsync(ViewContext viewContext, String contentType, Nullable1 statusCode) at Microsoft.AspNetCore.Mvc.ViewFeatures.ViewExecutor.ExecuteAsync(ActionContext actionContext, IView view, ViewDataDictionary viewData, ITempDataDictionary tempData, String contentType, Nullable1 statusCode)
at Microsoft.AspNetCore.Mvc.ViewResult.ExecuteResultAsync(ActionContext context)
at Microsoft.AspNetCore.Mvc.Internal.ResourceInvoker.InvokeResultAsync(IActionResult result)
at Microsoft.AspNetCore.Mvc.Internal.ResourceInvoker.InvokeNextResultFilterAsync()
at Microsoft.AspNetCore.Mvc.Internal.ResourceInvoker.Rethrow(ResultExecutedContext context)
at Microsoft.AspNetCore.Mvc.Internal.ResourceInvoker.Next(State& next, Scope& scope, Object& state, Boolean& isCompleted)
at Microsoft.AspNetCore.Mvc.Internal.ResourceInvoker.InvokeNextResourceFilter()
at Microsoft.AspNetCore.Mvc.Internal.ResourceInvoker.Rethrow(ResourceExecutedContext context)
at Microsoft.AspNetCore.Mvc.Internal.ResourceInvoker.Next(State& next, Scope& scope, Object& state, Boolean& isCompleted)
at Microsoft.AspNetCore.Mvc.Internal.ResourceInvoker.InvokeFilterPipelineAsync()
at Microsoft.AspNetCore.Mvc.Internal.ResourceInvoker.InvokeAsync()
at Microsoft.AspNetCore.Builder.RouterMiddleware.Invoke(HttpContext httpContext)
at Microsoft.AspNetCore.Authentication.AuthenticationMiddleware.Invoke(HttpContext context)
at Microsoft.AspNetCore.SpaServices.Webpack.ConditionalProxyMiddleware.Invoke(HttpContext context)
at Microsoft.AspNetCore.SpaServices.Webpack.ConditionalProxyMiddleware.Invoke(HttpContext context)
at Microsoft.AspNetCore.Diagnostics.DeveloperExceptionPageMiddleware.Invoke(HttpContext context)

Chapter 5 - client side sorting does not work

Hi After, alot of research, following the book, and running its source from the packet publish site, the finding this github and running it up, I find, the client side sort does absolutely nothing.

Is it supposed to do something? I see nothing change in the UI, no reordering (sorting) or anything.

Am I missing something or was this section of the book completely overlooked?

Cheers

Webpack Error?

Finished Chapter 3 was working on Chapter 4 and I am tetting the following:

"/ClientApp/components/App.vue
Module parse failed: C:\Users\1801\ECommerce\ClientApp\components\App.vue Unexpected token (1:0)
You may need an appropriate loader to handle this file type."

Not sure what is causing this and my Googleing has failed to come up with a solutino that works.

-Thanks

Error in DbContextExtensions.cs

I am in Chapter 3 and I have worked most of my bugs out, however I am receving the following error:

Exception has occurred: CLR/System.NullReferenceException
An unhandled exception of type 'System.NullReferenceException' occurred in VueApp.dll: 'Object reference not set to an instance of an object.'
at VueApp.Data.DbContextExtensions.EnsureSeeded(VueAppContext context) in C:\Users\1801\VueApp\Data\DbContextExtensions.cs:line 12
at VueApp.Program.Main(String[] args) in C:\Users\1801\VueApp\Program.cs:line 29

Could use some assistance troubleshooting this.
new 6.txt

App errors if more than 2 of same product are added to cart

Hi! I noticed that the app errors out if there are 2 of a given product already in the cart and the user clicks "Add to cart" an additional time.

[Vue warn]: Error in v-on handler: "TypeError: cartItem is undefined"

found in

---> <ProductDetails> at /Users/<UserName>/Desktop/ASPDotNETCore2andVuejs_Code/chapter 9/ClientApp/components/product/Details.vue
       <Product> at /Users/<UserName>/Desktop/ASPDotNETCore2andVuejs_Code/chapter 9/ClientApp/pages/Product.vue
         <App> at /Users/<UserName>/Desktop/ASPDotNETCore2andVuejs_Code/chapter 9/ClientApp/components/App.vue
           <Root> vendor.js:4044:7
TypeError: "cartItem is undefined"
    updateProductQuantity mutations.js:9
    wrappedMutationHandler vendor.js:31096
    commitIterator vendor.js:30762
    commit vendor.js:30761
    _withCommit vendor.js:30892
    commit vendor.js:30760
    boundCommit vendor.js:30705
    addProductToCart actions.js:12
    wrappedActionHandler vendor.js:31103
    dispatch vendor.js:30808
    boundDispatch vendor.js:30702
    addProductToCart Details.vue:115
    invokeWithErrorHandling vendor.js:5277
    invoker vendor.js:5598
    _wrapper vendor.js:10334

This can be reproduced in the sample code (at least through Chapter 9.)

How can this be fixed?

I have Questions...

Not Working Hot Module Replacement in chaper 3 after Refactoring the frontend setup...
Do HMRs work if you follow the book? How does it work?

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.