TCCC 2019 Notes

README.md

Repos:

• https://github.com/dahlsailrunner/tccc2019-api-starter
• https://github.com/dahlsailrunner/tccc2019-angular-starter
• https://github.com/dahlsailrunner/tccc2019-api-booster
• https://knowyourtoolset.visualstudio.com/TCCC-2019

Notes from code are below.

Slides are here: https://github.com/dahlsailrunner/tccc2019-api-starter/blob/master/Tccc2019-EmpowerDevs.pptx

Demo notes

---------------- Sample model --------------------------
public class Sample
{
	public int Id { get; set; }
	public string Name { get; set; }
}

----------  SampleController ----------------------------
[HttpGet]
public List Get()
{
	return new List
	{
		new Models.Sample {Id = 1, Name = "Erik"},
		new Models.Sample {Id = 2, Name = "Dahl"},
	};
}
---------------------------------------------------
-- Angular ----------------------------------------
ng g c sample
ng g s sample/sample -f

---------- sample.service.ts  ------------
  apiRoot = environment.backendApiRoot;

  constructor(private http: HttpClient) { }  

  public getSamples(): any {
    let  apiUrl = `${this.apiRoot}/sample`;
    return this.http.get(apiUrl);
  }
---------- sample.component.ts ------------
sampleResponse: string;

constructor(private pageSvc: NewPageService, private alertSvc: AlertService, private smplApi: SampleService) { }

ngOnInit() {
	this.pageSvc.setNewPage("Sample Page - Here We Are!");

	this.alertSvc.createAlert({
	  alertClass :"alert-info",
	  alertMessage: "Wowzers!",
	  alertLink :"",
	  alertLinkText : ""
	})

	this.smplApi.getSamples().subscribe((results) => 
	{
	  this.sampleResponse = JSON.stringify(results);
	});
}  

-------- sample.component.html -------------

  sample works!


{{sampleResponse}}
 
------- app-routing.module.ts ---------------
{
	path: 'sample',
	component: SampleComponent,
},
------ app.component.html -------------------

	Sample