Ninja Space Content Blog

I decided to start learning Angular and TypeScript this week. I looked at a 2 hour YouTube video by Programming with Mosh to get a good glimpse at it before I started practicing along. After looking at the video in normal speed for 2 hours (I would speed it up if I am going over it again), without getting my hands in code on VSC, I was really intimidated by my first tutorial on Angular. However, it also reminded me of Java, using interfaces, classes and constructors. Besides for looking at a couple Java YouTube tutorial videos last month, I haven't started a project with Java yet because I had a really intense month of trying to go over computer science materials for a series of interviews that I had to prepare for. I really need to get back to Java again when I have a chance but for now, I am going to continue with my learning in Angular.

Many local companies in my area are looking for developers who are knowledgeable in Angular, not React, so I'm going to build a couple of projects in Angular this summer for my portfolio. As I'm studying and learning, I'm going to document some notes week-by-week here on my Ninja Space Content blog.

Do I like Angular or React better after 1 week of Learning?
Even though I've only been learning Angular and TypeScript for a week, I can already see how powerful Angular is as it catches my errors and mistakes right away as I'm typing. It catches errors at compile time and doesn't have to wait until run time.

A data type that I need to get more familiar with is enum and it's a pretty useful tool to use as a data type. An example of how to use enum is the following: 

enum Name { Ninja = 0, Space = 1, Content = 2 };
let blogName = Name.Ninja;


Here's a Helpful List of Commands for a Mac 
I'm going to use this list as a reference and hope you'll find it helpful too.

• If you already have Node, to install Angular on your Mac for the first time, use command: sudo npm install -g @angular/cli
• type: ng --version in your terminal to see that version of your angular that you've just downloaded
• Create a new Angular project by typing: ng new project-name in your terminal. Replace project-name with whatever name you'd like to name your file.
• ng serve in terminal to open Development Server. Default is localhost:4200.
• To install TypeScript onto your Mac computer, use command: sudo npm install -g typescript and to check your version, type: tsc --version
• To compile, type: tsc main.ts or whatever your file name is and this will compile to ES5 main.js (js file) of your original file
• Type: ng serve to transpile the code.
• To run code, type: node main.js or whatever your file name is. This will let you see the console.log of your code.
• Type: tsc *.ts --target ES5 && node main.js when getting an error that says "Accessors are only available when targeting ECMAScript 5 and higher.

Type Assertion
Something new for me that I learned is using Type Assertions to see my intellisense. There are two ways to do this. Here are the 2 examples.

let message;
message = 'ohayou';
let endsWithU = (<string>message).endsWith('u');
let anotherWay = (message as string).endsWith('u');

Interfaces vs. Classes
Interfaces are only used for declaration and not implementation. Classes are used for both variable declarations and implementations like functions.

Access Modifiers
Fields, properties and methods can be labeled with access modifiers like public, private or protected.

Properties
Properties split the methods like so in a class:
get X() {
return this.x;
}

Click here to read my Week Two of Learning Angular