gil00pita

//Appending DOM is the most expensive operation, choose the right approach

// BAD
let container = document.querySelector('.container');
for (let i = 0; i < 1000; i++) {
    let a = document.createElement('a');
    a.text = `Row N° ${i}`;
    container.appendChild(a);
}

gil00pita

// For example, imagine a fetch from API result returns an array of JSON data:
const users = [
  { name: 'Nathan', age: 25 },
  { name: 'Jack', age: 30 },
  { name: 'Joe', age: 28 },
];

gil00pita

const developer = {
  firstName: 'Nathan',
  lastName: 'Sebhastian',
  developer: true,
  age: 25,
}

//destructure developer object
const { firstName, lastName } = developer;
console.log(firstName); // returns 'Nathan'

gil00pita

//Now that we understand ES6 class and inheritance, we can understand the React class defined in src/app.js. This is a React component, but it's actually just a normal ES6 class which inherits the definition of React Component class, which is imported from the React package.
//Everytime we need variables. Consider the following example:
import React, { Component } from 'react';

class App extends Component {
  // class content
  render(){
    const greeting = 'Welcome to React';
    return (
      <h1>{greeting}</h1>

gil00pita

@mixin isTouch {
  @media (pointer:coarse) {
    @content
  }
}

gil00pita

Asynchronous Iteration

Iterating over a collection of data is an important part of programming. Prior to ES2015, JavaScript provided statements such as for, for...in, and while, and methods such as map(), filter(), and forEach() for this purpose. To enable programmers to process the elements in a collection one at a time, ES2015 introduced the iterator interface.

An object is iterable if it has a Symbol.iterator property. In ES2015, strings and collections objects such as Set, Map, and Array come with a Symbol.iteratorproperty and thus are iterable. The following code gives an example of how to access the elements of an iterable one at a time:

const arr = [10, 20, 30];
const iterator = arr[Symbol.iterator]();
 

gil00pita

##############################################################
# Description: Boxstarter Script
# Author: Gil Alvaro
# Last Updated: 2020-01-08
#
# Install boxstarter:
# 	. { iwr -useb http://boxstarter.org/bootstrapper.ps1 } | iex; get-boxstarter -Force
#
# You might need to set: Set-ExecutionPolicy RemoteSigned
#

gil00pita

stylelint "**/*.scss" --syntax scss --fix

gil00pita

// ARROW FUNCTIONS

function sayHello() {
  console.log('Hello');
}

const sayHello = name => console.log(`Hello ${name}`);

const fruits = ['Apples', 'Oranges', 'Grapes'];

gil00pita

{"lastUpload":"2021-02-23T22:20:27.781Z","extensionVersion":"v3.4.3"}