Create initial version of TerminalComponent

src/app/terminal/terminal.component.html

@@ -0,0 +1 @@
+<div #xterm class="tfw-xterm mt-3 mb-3" (window:resize)="fit()"></div>

src/app/terminal/terminal.component.ts

@@ -0,0 +1,29 @@
+import { AfterViewInit, Component, ElementRef, OnDestroy, OnInit, TemplateRef, ViewChild, ViewContainerRef } from '@angular/core';
+import { TerminadoService } from '../terminado.service';
+
+
+@Component({
+  selector: 'app-terminal',
+  templateUrl: './terminal.component.html',
+  styleUrls: ['./terminal.component.scss']
+})
+export class TerminalComponent implements OnInit, AfterViewInit, OnDestroy {
+  @ViewChild('xterm') target: ElementRef;
+
+  constructor(private terminadoService: TerminadoService) { }
+
+  ngOnInit() {
+  }
+
+  ngAfterViewInit() {
+    this.terminadoService.attach(this.target.nativeElement as HTMLElement);
+  }
+
+  ngOnDestroy() {
+    this.terminadoService.detach();
+  }
+
+  fit() {
+    this.terminadoService.fit();
+  }
+}

src/styles.scss

@@ -1,2 +1,3 @@
 /* You can add global styles to this file, and also import other style files */
 @import '../node_modules/bootstrap/scss/bootstrap';
+@import '../node_modules/xterm/dist/xterm.css';