Thursday, February 23, 2023

Angular Question

  • Type of Data Binding
    • One Way Binding
      • Interpolation Bnding
        • data move in one direction from components (typescript) to HTML
        • <p>{{ message }}</p> 
      • Property Binding
        • set properites to HTML elements.
        • [value]="user.email" or <img [src]="imageUrl"> 
    • Two Way Binding 
      • component and view are always in sync
      • Changes in user interface to model state.
      • Changes in model state reflect to user interface
      • <input [(ngModel)]="name">
  • Event Binding
    • One Way Binding
    • for event trigger
    • <button (click)="doSomething()">Click me</button> 


  • How does one share data between components in Angular? 
    • Parent to child using @Input decorator 

    • Child to parent using @ViewChild decorator 
    • Child to parent using @Output and EventEmitter 
  • Decorators
    • Design Pattern & function
    • modification to a class, service or filter
    • 4 Types
      • Class Decorators
      • Property Decorators
      • Method Decorators
      • Parameter Decorators
  • Advantages
    • MVC architecture
    • Modules
      • componentes
      • directives
      • pipe
      • services
    • Dependency Injection
      • component dependent on other components can easily worked around
    • Others
      • clean and maintainable code
      • reusable components
      • data binding
      • unit testing
  • Directives
    • attributes allow user write new HTML syntax
    • 3 Types
      • Component Directives
      • Structural Directives
      • Attribute Directives

    • myHighlist is Directives
  • Template
    • HTML View
    • seperate template file such **.html
  • Template Statements
    • properties or methods
    • (click)='addUser()"
    • addUser is template
  • Promises and Observables
    • Promises
      • emit single value at a time
      • Execute immediately after creation and not cancellable
      • Push Errors to child Promises
    • Observables
      • execute when subscribe()
      • emit Mutiple value over a period of time
      • perform forEach, filter and retry
      • Deliver errors to subscribers.
      • When unsubsribe() is called, listener stop receive further values.
  • ObservablePromise
    Declarative: Computation does not start until subscription so that they can be run whenever you need the resultExecute immediately on creation
    Provide multiple values over timeProvide only one
    Subscribe method is used for error handling which makes centralized and predictable error handlingPush errors to the child promises
    Provides chaining and subscription to handle complex applicationsUses only .then() clause
  • Difference AngularJS and Angular
  • AngularJSAngular
    It is based on MVC architectureThis is based on Service/Controller
    It uses JavaScript to build the applicationUses TypeScript to build the application
    Based on controllers conceptThis is a component based UI approach
    No support for mobile platformsFully supports mobile platforms
    Difficult to build SEO friendly applicationEase to build SEO friendly

Sunday, February 19, 2023

Dependency Injection 2

What is Dependency Injection

  • Produce a loosely coupled code
  • Any change in the class without affecting other object.
  • Type of DI
    • Constructor Injection
      • parameter to inject dependencies in a class
      • One parameterized constructor but no default constructor and you need to pass specified values to the constructor


    • Setter Injection
      • through properties of a class


    • Interface-based injection
      • through method


  • Advantage
    • Maintainability
      • maintain code structure, single principle
    • Flexibility
      • loosely coupled code, flexible to use different ways.
    • Testability
      • easy to do unit testing
    • Readability
      • Logic in constructor.













Friday, August 19, 2022

Back to previous commit

 # Resets index to former commit; replace '56e05fced' with your commit code

git reset 56e05fced 

# Moves pointer back to previous HEAD
git reset --soft HEAD@{1}

git commit -m "Revert to 56e05fced"

# Updates working copy to reflect the new commit
git reset --hard

Monday, June 20, 2022

bootstrap footer always bottom

<div class="d-flex flex-column min-vh-100">
<footer class="mt-auto earth">
</footer>
</div>

Thursday, June 9, 2022

Git Change Repo

both are Same (Set new origin)

git remote set-url origin https://github.com/123123.git

git branch -M main

git push -u origin main

-----------------


git remote rm origin

git remote add origin https://github.com/123123.git

git branch -M main

git push -u origin main


------------------


after git push

git tag v1.0.1

git checkout v1.0.1


firebase login:use <email>



Tuesday, May 31, 2022

Change Firebase Project

  1.  firebasesrc change to correct firebase project
  2. Enable Firestore (set region asiasoutheast1)
  3. Try to Deploy First (must blaze project)

firebase login:add
firebase login:list
firebase login:use


change another login and deploy

Wednesday, May 25, 2022

Git Replace without MR


 https://www.nickang.com/2017-09-30-replace-git-branch-code/