Email:   Password:
Blog :: Technical Learning by Thomas Riemer
RSS 2.0   RSS 1.0   Atom
TypeScript   (PDF)
Posted February 9th, 2024

TypeScript is typed javascript that compiles to javascript It reduces errors in javascript.
These are basic takeaways from reading about typescript
So typescript is compiled javascript with strict typing.

1) Install typescript
npm i -g typescript
2) Check version
tsc -v
3) Compile stuff in .ts files to .js files
tsc -w

4) Defining variables
     let varname: type = default_value;
   types can be string, number, bigint, bool, null, undefined, symbol
   wrappers String,Number,BigInt, Boolean, Symbol
   union type: example : let foo: string|number=5;

   "any" type - not recommended - reverts to straight javascript
   const foo = document.querySelector('a')!;
   ! - indicates - non-null assertion to inform compiler
   type casting:
   const foo = document.getElementById('foobar') as HTMLFormElement;
   let flavors: 'chocolate'|'strawberry'|'blueberry';
   
5) reference types - arrays, objects, functions
  a) arrays
      let myarray: number[] = [1,2,4,5];
      let myarray: (number|boolean)[] = [1,true,2];
  b) tuples
      let mytuple: [string,number,boolean] = ['Danny,1,true];
  c) objects
     let person: {
          name: string;
     alive: boolean;
     };
     person = { name:"Tom"; alive:true};
     person.name = "Mike";
  3) interfaces
     interface Person
     {
        name: string;
    alive:true;
    sayHi(name:string):string;
    sayBye(name:string) => string;
     }

     let something:Person {
        sayHi: function (name:string)
    {
        return 'Hi ${name}';
    }
     }
     usage:
       let person1:Person { name:"mike",alive:true};
  d) functions
     
     function funcname(arg1:type,arg2?:type):return_type
     {
     }
     or with es6
          const funcname = (arg1:type,arg2?:type):return_type =>
      {
      }
     ? means optional argument.   
     signature:
     let funcname: (arg1:type):null;
  e) types
      type PersonObject= {
         name:string;
     age: number;
      }

  f) classes
 
        class classname {
       private name: string;
        protected age: number;
        constructor(n:string,a:number) {
          this.name = n;
          this.age = a;
          }
        display() {
            return "Name: ${this.name} age:${this.age}";
        }

     let people: Person[] = [person1,person2];

    definition of scope of variables:
     readonly name: string; // This property is immutable - it can only be read
     private isCool: boolean; // Can only access or modify from methods within this class
     protected email: string; // Can access or modify from this class and subclasses
      public pets: number; // Can access or modify from anywhere - including outside the class

   g) generics
      const addID = (obj: T) => {
      let id = Math.floor(Math.random() * 1000);

      return { ...obj, id };
     };
   
     interface hasLength {
      length: number;
     }    

     function logLength(a: T) {
        console.log(a.length);
       return a;
     }

  h) enums
      enum states { AL="AL",

                   AK="AK"};


6. typescript interacts with multiple react platforms:

  •     create-react-app (TS setup)
  •     Gatsby (TS setup) Next.js
  •     Next.js (TS setup)
  • Concise tutorial:


    https://www.freecodecamp.org/news/learn-typescript-beginners-guide/

    Comments
    Add
    StarLink   (PDF)
    Posted January 10th, 2024

    A satellite internet service.

    I recently upgraded to StarLink.   I purchased the hardware through Amazon.

    It took 2-3 weeks from when I ordered it before I received the hardware.

    StarLink is an internet service run via satellites.    

    It has matured in the last several years to the point where it is usable for a developer.

    Before ordering you should check to see if its available in your area.

    Go to http://starlink.com


    Some technical notes:

    1) I have android, and you want to set up your account on the starlink website first.

        The android setup of accounts is slightly broken... essentially when you begin

       to identify locations, the android app ends up with a blank screen.

       If you have an existing account, you can skip the blank screen issue.


    2) Once you have activated your dish, http://dishy.starlink.com is actually

        the router on your local net.  Its useful because you can test the speed

        of the dish from the router.   In my case 83 Mbs down, 14 mbs up.


    Comments
    Add
    Docker   (PDF)
    Posted December 17th, 2023

    Docker is a tool used to manage the development/QA/release process

    The term docker is often thrown around.   It turns out to be fairly complex as a it crosses

    across the developer, qa, release, and system admin roles.

    Its supposed to make all these easier and more consistent.


    So

    1. Docker is a unix/linux/macos command line utility

        It provides utilies to push, pull images, start up the image, stop the image , remove the image. 


    2. Dockerfile is a file that specifies how to create an image for distribution.

        This is used at the point of release. 


    3. docker-compose is a command line utility that processes the file docker-compose.y[a]ml

        docker-compose.yml defines a development environment that  developer can use

        to edit/add/manage code.


    Comments
    Add


    Copyright © 2024 Mind Contract, Inc.   All Rights Reserved
    For more information call thomasriemer49@gmail.com or email 720-883-1866
    Powered By: Build a Member