@manhnguyenv

Welcome to my blog!

Migrate ASPNETWebAPI - ASPNETCore

January 16, 2018 09:42

ASP.NET Core: A Multi-Layer Data Service Application Migrated from ASP.NET Web API

https://www.codeproject.com/Articles/1224226/ASP-NET-Core-A-Multi-Layer-Data-Service-Applicatio

Comprehensive CRUD Operations with AngularJS and Web API

https://www.codeproject.com/Articles/1031858/Comprehensive-CRUD-Operations-with-AngularJS-and-W

Important features presented in the article and sample application include:

  • Adding and updating data items using modal dialogs.
  • Inline adding and updating multiple data rows in tables.
  • Deleting multiple data records in tables.
  • Dynamically refreshing displays after submitting data changes.
  • Input data validations in custom, inline, and on-blur styles.
  • Active pattern for executing commands.
  • Dirty warning when leaving the current page for Angular SPA internal and external redirections.
  • Full Web API application and code to facilitate the CRUD workflow although the details of the Web API are not described in the article.

These major libraries and tools are used in the sample appliction:

  • AngularJS 1.2.6
  • Bootstrap 3.1
  • ngTable
  • ngExDialog
  • Web API 2.2
  • .NET Framwork 4.5
  • Entity Framework 6.1
  • SQL Server 2012 or 2014 LocalDB
  • Visual Studio 2013 or 2015 with IIS Express

ASP.NET Core,Angular2 CRUD with Animation using Template Pack, WEB API and EF 1.0.1

https://www.codeproject.com/Articles/1173779/ASP-NET-Core-Angular-CRUD-with-Animation-using-Tem

Kindly read my previous articles which explain in-depth about getting started with ASP.NET Core Template Pack.

In this article, we will see the following:

Creating CRUD web Application ASP.NET Core and Angular2

  • C: (Create): Insert New Student Details into the database using ASP.NET Core, EF and Web API.
  • R: (Read): Select Student Details from the database using ASP.NET Core, EF and Web API.
  • U: (Update): Update Student Details to the database using ASP.NET Core, EF and Web API
  • D: (Delete): Delete Student Details from the database using ASP.NET Core, EF and Web API.

We will be using WEB API to perform our CRUD operations. Web API has the following four methods as Get/Post/Put and Delete where:

  • Get is to request for the data. (Select)
  • Post is to create a data. (Insert)
  • Put is to update the data(Update).
  • Delete is to delete data(Delete).

Presenting our CRUD Application more rich with simple Angular2 Animations like.

  • Angilar2 Animation for Fade-in Elements and controls.
  • Angilar2 Animation for Move Elements and controls from Left.
  • Angilar2 Animation for Move Elements and controls from Right.
  • Angilar2 Animation for Move Elements and controls from Top.
  • Angilar2 Animation for Move Elements and controls from Bottom.

For creating our ASP.NET Core, Angular2 CRUD with Animation we will be

  • Creating sample Database and Table in SQL Server to display in our web application.
  • Creating ASP.NET Core Angular 2 Starter Application (.NET Core) using Template pack.
  • Creating EF, DBContext Class and Model Class.
  • Creating WEB API for Get/Post/Put and Delete method.
  • Creating First Component TypeScript file to get WEB API JSON result using Http Module for Get/Post/Put and Delete method.
  • Creating our first Component HTML file for our Animation and CRUD web Application.

Categories

Recent posts