Quick Look – A Console on the Web
I love console applications.
For some reason, the simplicity of the interaction appeals to me. But today we do a lot of web development where many of our solutions end up with some web portal. Couldn’t we have a console/terminal on the web?
Yes, we can!
There is an awesome project to get Xterm support into a web environment. You can find out more about the project here.
Why would anyone want a console/terminal in a web application? One of the users of the Xterm framework is VS Code. Having terminal support in a rich editor like VS Code is almost essential. Having the ability to do things like run git commands from within your IDE is a pretty standard feature at this point.
How can we use this control? Let’s start by creating a new Angular application.
ng new ConsoleTest
After we have our Angular application, we need to add an npm module to our project. Now we are going to add ng-terminal, which is an Angular module for the Xterm.js control.
npm install ng-terminal --save
Now we need to make two changes to our code. In a real project, we probably wouldn’t put the terminal in our root Angular AppComponent, but for this demo we will.
This makes me happy.