Udemy Angular 2 / .NET Core course

Section_2-1.md

Angular Setup

1. New project (make sure Node version is set to 8.9.1 (or most current):

$ ng new ProjectName

2. To create a component: ng g c componentName.

3. Import http modules in app.module.ts:

import { HttpModule } from '@angular/http';
[...]

imports: [
    BrowserModule,
    HttpModule
  ],

Section_2.md

Section 2: Walking Skeleton

1. Build api: $ dotnet new webapi -n DatingApp.api -o DatingApp.api

2. Add dotnet watch:

• in .csproj file, under DoteNetCliToolReference group add:

<DotNetCliToolReference Include="Microsoft.DotNet.Watcher.Tools" Version="2.0.0" />

(make suure it's version 2.0.0

• then, $ dotnet watch run will rebuild the app on every save.

3. Create Models directory and Model class:

$ mkdir Models && touch Models/Value.cs

In Value.cs:

public class Value
   {
       public int Id { get; set; }
       public string Name { get; set; }
   }

4. Create DataContext:

mkdir Data && touch Data/DataContext.cs

In DataContext.cs:

using DatingApp.api.Models;
using Microsoft.EntityFrameworkCore;

namespace DatingApp.api.Data
{
   public class DataContext : DbContext
   {
       public DataContext(DbContextOptions<DataContext> options) : base(options) {}
       public DbSet<Value> Values { get; set; }
   }
}

In Startup.cs:

using DatingApp.api.Data;
using Microsoft.EntityFrameworkCore;
[...]
services.AddDbContext<DataContext>(x => x.UseSqlite(Configuration.GetConnectionString("DefaultConnection")));

In appsettings.json, add the top add this object:

"ConnectionStrings": {
   "DefaultConnection": "Data Source=APPNAME.db"
 },

5. Create Migration: In .csproj, under DotNetCliToolReference group, add:

<DotNetCliToolReference Include="Microsoft.EntityFrameworkCore.Tools.DotNet" Version="2.0.0" />

In terminal, stop server and enter:

$ dotnet restore
$ dotnet ef

Create migration and database:

$ dotnet ef migrations add InitialCreate
$ dotnet ef database update

6. Retrieving Data Values Controller (Right now, just the GET and GET/ID endpoints are fleshed out:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Threading.Tasks;
using DatingApp.api.Data;
using Microsoft.AspNetCore.Mvc;
using Microsoft.EntityFrameworkCore;

namespace DatingApp.api.Controllers
{
   [Route("api/[controller]")]
   public class ValuesController : Controller
   {
       private readonly DataContext _context;
       public ValuesController(DataContext context) => _context = context;
   // GET api/values
       [HttpGet]
       public async Task<IActionResult> GetValues()
       {
           var values = await _context.Values.ToListAsync();
           return Ok(values);
       }

       // GET api/values/5
       [HttpGet("{id}")]
       public async Task<IActionResult> GetValue(int id)
       {
           var value = await _context.Values.FirstOrDefaultAsync(x => x.Id == id);
           return Ok(value);
       }

       // POST api/values
       [HttpPost]
       public void Post([FromBody]string value)
       {
       }

       // PUT api/values/5
       [HttpPut("{id}")]
       public void Put(int id, [FromBody]string value)
       {
       }

       // DELETE api/values/5
       [HttpDelete("{id}")]
       public void Delete(int id)
       {
       }
   }
}