Yêu cầu của bài toán

https://github.com/stssoftware/Monkey

https://github.com/stssoftware/Puppy

Frontend

• Angular 2+
• Webpack
• Gulp & Koala
• SASS
• Bootstrap 4+
• Font Awesome
• Responsive Web Design

Backend

• ASP.NET Core Web API
• Cross-Origin Resource Sharing (CORS)
• Token-based Authentication: Bearer Token Authentication, implement use JSON Web Token (JWT)
• REpresentational State Transfer (REST)
• ASP.NET Core Web API Help Pages using Swagger
• Hangfire
• Redis
• RESTful API with ASP.NET Core Web API
  
  • GET
  • PUT
  • POST
  • DELETE
  • HEAD

What's Hangfire?

Hangfire is an open-source framework that helps you to create, process and manage your background jobs

What's Redis?

Redis is an open source (BSD licensed), in-memory data structure store, used as a database, cache and message broker. It supports data structures such as strings, hashes, lists, sets, sorted sets with range queries, bitmaps, hyperloglogs and geospatial indexes with radius queries. Redis has built-in replication, Lua scripting, LRU eviction, transactions and different levels of on-disk persistence, and provides high availability via Redis Sentinel and automatic partitioning with Redis Cluster...

What's ElasticSearch?

Elasticsearch is a highly scalable open-source full-text search and analytics engine. It allows you to store, search, and analyze big volumes of data quickly and in near real time. It is generally used as the underlying engine/technology that powers applications that have complex search features and requirements.

Elasticsearch is a distributed, RESTful search and analytics engine capable of solving a growing number of use cases. As the heart of the Elastic Stack, it centrally stores your data so you can discover the expected and uncover the unexpected.

What's modular programming?

Asynchronous Module Definition (AMD)

What's SystemJS?

Universal dynamic module loader - loads ES6 modules, AMD, CommonJS and global scripts in the browser and NodeJS.

What's RequireJS?

https://appendto.com/2016/06/the-short-history-of-javascript-module-loaders/ 

What's Webpack?

Webpack is a module bundler. Its main purpose is to bundle JavaScript files for usage in a browser, yet it is also capable of transforming, bundling, or packaging just about any resource or asset.

Angular Webpack

https://github.com/preboot/angular-webpack

http://bashooka.com/coding/22-excellent-responsive-navigation-menu-examples/

https://codingthesmartway.com/getting-started-with-css-grid/

http://www.creativebloq.com/features/10-website-navigation-trends-for-2017

https://www.pluralsight.com/courses/asp-dot-net-core-restful-api-building

https://stackify.com/asp-net-core-web-api-guide/

https://docs.microsoft.com/en-us/aspnet/core/tutorials/web-api-help-pages-using-swagger

Quick start

git clone https://github.com/preboot/angular-webpack.git my-app

cd my-app

npm install

npm install sass

npm install -save-dev webpack

npm install node-sass

npm install sass-watch

npm run build-css

npm run watch-css

npm install gulp-sass --save-dev

npm install bootstrap@next --save

in vendor.ts add the following:

import 'bootstrap/dist/css/bootstrap.css';

npm start

code .

http://localhost:8080/