indreklasn

const dogs = { 
  name: "Sam",
  age: 10,
 }

// Looping over objects

for (let prop in dogs) {
  console.log(prop); // "name", "age"
}

indreklasn

const dogs = { 
  name: "Sam",
  age: 10,
 }

// Looping over objects

for (let prop in dogs) {
  console.log(prop); // "name", "age"
}

indreklasn

const dogs = { 
  name: "Sam",
  age: 10,
}

// ERROR: "TypeError: dogs.map is not a function"
// Won't work since map can only called on arrays.
dogs.map(dog => console.log(dog))

indreklasn

const dogs = [
  { name: "Sam", age: 2, owner: "Jack"},
  { name: "Simon", age: 8, owner: "Trevor"}
]

// DO
dogs.map(dog => console.log(dog))

// DON'T
 for (let dog of dogs) {

indreklasn

const dogs = [
  { name: "Sam", age: 2, owner: "Jack"},
  { name: "Simon", age: 8, owner: "Trevor"}
]

// DO

dogs.map(dog => console.log(dog))

indreklasn

const numbers = [1, 2, 3, 4, 5, 6, 7, 8]

// DON'T
for (i = 0; i < numbers.length; i++) {
  console.log(i); // 1, 2, 3, 4, 5, 6, 7, 8
}

// DO

numbers.map(number => console.log(number)); // 1, 2, 3, 4, 5, 6, 7, 8

indreklasn

function handleRemove(e, id) {
  // stuff here
  toast.success('Removed successfully')
}

indreklasn

import { ToastContainer, toast } from 'react-toastify';
import 'react-toastify/dist/ReactToastify.css';

function App() {

 //stuff here
  return (
    <div className="App">
      <ToastContainer />
      <header className="App-container">

indreklasn

import React, { useEffect, useState  } from 'react';
import './App.css';
import { getAllNotes, deleteNote, editNote } from './api'
import { NoteList, NoteForm } from './components'

function App() {
  
  const [notes, setNotes] = useState([])

  useEffect(() => {

indreklasn

import React, { memo } from 'react'
import { Icon } from 'antd'

const NoteList = memo(({data, onRemove, onEdit}) => (
  <>
    {data && data.map(note => (
      <div key={note.ref.id} className="note-row">
        <p 
          contentEditable
          suppressContentEditableWarning