/AspNetCoreSpa

Asp.Net Core 3.1 & Angular 8 SPA Fullstack application with plenty of examples. Live demo:

Primary LanguageC#MIT LicenseMIT

Actions Status Web Actions Status STS Build Status Build status MIT license

Features

Pre-requisites

  1. .Net core 3.1 SDK
  2. Visual studio 2019 OR VSCode with C# extension
  3. NodeJs (Latest LTS)
  4. Microsoft SQL Server (Optional: If MS SQL server required instead of Sqlite during development)
  5. Docker (Optional: If application will run inside docker container)

Installation

1. Clone the repo:
    git clone https://github.com/asadsahi/AspNetCoreSpa
2. Change directory:
    cd AspNetCoreSpa
3. Restore packages:
    dotnet restore AspNetCoreSpa.sln
4. Install npm packages:
    cd src/AspNetCoreSpa.Web/ClientApp:
    - npm install
5. Run .Net project:
    F5 from either [Visual Studio IDE](https://www.visualstudio.com/) OR [VScode] (https://code.visualstudio.com/):
    Note: If you are running using Visual Studio Code, install dev certificates using command:
    dotnet dev-certs https --trust
6. Target either Sqlite or Microsoft SQL Server

This project supports both databases OOTB.

* Run with Sqlite: (Already configured to quickly run the project)
    * Project is already setup with Sqlite specific database migrations

* Run with Microsoft SQL Server:
    * Delete `Migrations` folder from src/AspNetCoreSpa.Web
    * Change setting in appsettings.json called `useSqLite` from `true` to `false`
    * This will use `SqlServerConnectionString` connection string pointing to default instance of SQL server installed on local machine

7. Identity server for authentication:
    a. Open terminal
    b. cd AspNetCoreSpa.STS
    c. dotnet run

	2 Test users:
	Username: admin@admin.com
	Password: P@ssw0rd!
	OR
	Username: user@user.com
	Password: P@ssw0rd!

    Note: For production use Identity server hosted with appropriate configuration.

Other commands

Angular component scaffolding

Note: You need to run commands from src/AspNetCoreSpa.Web/ClientApp directory: More information here

Angular tests - Using Jest and Angular jest preset

cd src/AspNetCoreSpa.Web/ClientApp

npm test

Compodoc Angular documentation

  • Steps to generate:
    • npm i compodoc -g
    • cd src/AspNetCoreSpa.Web/ClientApp
    • npm run compodoc
    • cd documentation
    • http-server

Compodoc documentation: alt text

### run end-to-end tests
```bash
# make sure you have your server running in another terminal (i.e run "dotnet run" command)
npm run e2e

run Protractor's elementExplorer (for end-to-end)

npm run webdriver:start
# in another terminal
npm run e2e:live

Azure Deploy

  • You can set an environment variable for azure app deployment password Set-Item -path env:AzureAppPass -value passwordhere
From powershell:
./deploy-azure.ps1

Deploy to heroku using its container service

Replace your app name where it is aspnetcorespa

  • dotnet publish -c release
  • docker build -t aspnetcorespa ./bin/release/netcoreapp3.1/publish
  • heroku login
  • heroku container:login
  • docker tag aspnetcorespa registry.heroku.com/aspnetcorespa/web
  • docker push registry.heroku.com/aspnetcorespa/web Note: There is a deploy.heroku.ps1 script included with this project which automates above steps.

Deploy to Azure as App Service

Set-Item -path env:AzureAppPass -value passwordhere

From powershell:
./deploy-azure.ps1

paypal