JsonApiDotNetCore Todo List Example

Demo application for JsonApiDotNetCore using Ember.js.

Back in 2017, Jared Nance did an excellent video series in which he built this demo:

• Part 1: Server Setup
• Part 2: Client Setup
• Part 3: Server Authentication and Authorization
• Part 4: Client Sessions
• Part 5: Persisting Data

Usage

Start the database

The app requires running postgres instance with credentials specified in appsettings.json. One way to do this is run the database in a Docker container:

docker run --name TodoListSampleDb \
    -e POSTGRES_USER=postgres \
    -e POSTGRES_PASSWORD=postgres \
    -e POSTGRES_DB=TodoList \
    -p 5432:5432 \
    -d postgres

Starting the API

• Switch directory
  • cd TodoListAPI
• Set the environment to development (mac)
  • export ASPNETCORE_ENVIRONMENT=development
• Start the server
  • dotnet run

Starting the Client

• Switch directory

  • cd TodoListClient

• Install ember-cli

  • npm install -g ember-cli

• Restore packages

  • npm install -g yarn
  • yarn install

• Start the client

  • yarn start or
  • ember s

• Open http://localhost:4200/ in your browser

In case you haven't watched the videos: the default username/password is guest/Guest1!.

Running Client Tests

• ember test
• ember test --server

Updating to the latest version of Ember

Usually the following commands are sufficient

• npm install -g ember-cli-update
• ember-cli-update
• ember-cli-update --run-codemods
• yarn install

Testing if everything still works

• application starts and displays login link
• login with invalid username/password shows popup
• login with correct username/password shows single todo-item "owned-by-guest"
• input validation: adding a todo-item with less than 4 characters is not possible
• after adding a todo-item, you're taken back to the list, which includes the new item
• clicking logout takes you back to the login page
• navigating to http://localhost:4200/s/todo-items when logged out takes you to the login page