henrik1

import React from "react";
import GlobalContext from "./GlobalContext";
import { CounterExample, CryptoExample, LetterExample } from "./components";

export default () => (
  <div>
    <GlobalContext>
      <CounterExample />
      <CryptoExample />
      <LetterExample />

henrik1

import { useState, useEffect } from 'react';

type Book = { title: string, synopsis: string, authorId: string }
type Author = { name: string, portrait: string, bio: string };
type BookWithAuthor = Book & { author: Author };

const useBooks = () => {
  const [books, setBooks] = useState<BookWithAuthor[]>([]);

  useEffect(() => {

henrik1

import { useState, useEffect } from 'react';

type Book = { title: string, synopsis: string, authorId: string }

const useBooks = () => {
  const [books, setBooks] = useState<Book[]>([]);

  useEffect(() => {
    fetch('/books').then(response => response.json()).then(setBooks);
  }, [])

henrik1

import { gql, useQuery } from '@apollo/client';

const Books = () => {
  const { loading, error, data: books } = useQuery(gql`
    query {
      books {
        title
        synopsis
        author {
          portrait

henrik1

// consider the following function to process bank transaction
const transaction = (fee, balance, amount) => (
  balance + amout - fee;
);

// Simple curry implementation
const curry = (fn, ...args) => (
  (..._arg) => (
    fn(...args, ..._arg)
  )

henrik1

// Compose function
const compose = (...fns) => x => fns.reduce((y, f) => f(y), x); 

// Functions
const addFee = amount => amount + 2;
const addDiscount = amount => amount - 5;

// function composition
const composition = compose(addFee, addDiscount)(100);

henrik1

function counter() {
  let count = 0;

  function increment() {
    return count += 1;
  };

  return increment;
}

henrik1

// Falsy values
const value = 0 ?? 100; // = 0
const value = false ?? true; // = false


// Default values
const value = null ?? 100; // = 100
const value = undefined ?? 100 // = 100;

henrik1

const person = { 
  name: 'Bob', 
  [Symbol('email')]: '[email protected]' 
};

Reflect.get(person, 'name'); // = Bob
Reflect.has(person, 'email'); // = true
Reflect.has(person, 'phone'); // = false
Reflect.getPrototypeOf(person); // = { constructor ... }
Reflect.getOwnPropertyDescriptor( person, 'name'); // = { value: 'Bob', writable: true, enumerable: true, configurable: true }

henrik1

import { useEffect, useState } from "react";
import {
  Card,
  Header,
  Title,
  Subtitle,
  Avatar,
  Actions,
  Image,
  Button