dcyoung-dev

<div id="map">
  <h4>From map</h4>
</div>

<div id="loc_details">
  <h4>Current Location</h4>
  <p>
    Lat : {{geoLoc.lat }}
  </p>
  <p>

dcyoung-dev

`npx -p <package-name> <command>`

eg.

Create new Angular project
`npx -p @angular/cli ng new new-project-name`

Create new NextJS project
`npx -p @nextjs/cli next new new-project-name`

dcyoung-dev

const routes: Routes = [
  {
    path: 'old-lazy',
    loadChildren: './old-lazy/old-lazy.module#OldLazyModule'
  },
  {
    path: 'new-lazy',
    loadChildren: () => import('./new-lazy/new-lazy.module')
      .then(m => m.NewLazyModule)
  }

dcyoung-dev

<h1>Product Records</h1>

<div *ngFor="let record of productRecords | async">
  {{record.itemNumber}}
</div>

dcyoung-dev

Switching from bash to zsh

0. Install zsh using brew brew install zsh
1. Set ZSH as default shell chsh -s /bin/zsh
2. Copy bash profile cat ~/.bash_profile >> ~/.zshrc

dcyoung-dev

#!/bin/bash
pbpaste |  sort | uniq

dcyoung-dev

CSS Rules for Harmonious Living

Sizing

• Prefer to use em/rem rather than px
  • rem is the browser's default size - usually equal to 16px
  • em is relative to it's parent's sizing
• Consider which sizing makes most sense - should the sizing increase if the parent's increases (em) or should it remain constant (rem).

Colours

• Always move colours into a separate file and reference through CSS variables var()

dcyoung-dev

# FizzBuzz

def add_trigger_word(number, factor, output_array, word)
  output_array << word if number % factor == 0
  output_array
end

word_map = {
  3 => "Fizz",
  5 => "Buzz",

dcyoung-dev

<script>
  // Declaring a new jQuery function
  (function ($) {
    $.fn.newSuperCoolFunction = function () {
      return this.each(function (_, selector) {
        var elements = $(selector)

        elements.each(function (_, elementSelector) {
          var element = $(elementSelector);
          element.addClass('super-cool')

dcyoung-dev

# Stop Google's FLoc https://andycroll.com/ruby/opt-out-of-google-floc-tracking-on-netlify
[[headers]]
  for = "/*"
  [headers.values]
    Permissions-Policy = "interest-cohort=()"