Антон Спирин

Вы же уже задавали этот вопрос и вроде получили на него доходчивый ответ?

Ведь суть транспиляции и есть в добавлении недостающего функционала?

Нет. Суть транспиляции это конвертация кода на одном языке в код на другом или в код более раней версии языка. Полифиллы лишь добавляют функционал(методы, объекты) в стандартную библиотеку, который может отсутствовать в ранних реализациях.
Пресеты babel расширяют синтаксис транслируемого кода.

null - литерал, пустое значение, используйте его в коде для пустых значений.
undefined - свойство глобального объекта, с начальным значением одноименного типа.
Переменная не имеющая присвоенного значения обладает типом undefined. Функции без return возвращают undefined. Все использование undefined в коде должно сводиться к проверке на это значение и только, то есть:

// Так писать не надо
var x = undefined;
foo(undefined, someValue):

// Так можно
var x = null;
foo(null, someValue);
if (someValue === undefined) {
  doSomething()
}

Почему undefined является идентификатором а null литералом чем они отличаются ?

undefined не является идентификатором(именем переменной), но может использоваться в качестве него, так как не является зарезервированным словом.

console.log(typeof undefined === 'undefined'); // true
var undefined = 'new value';
console.log(typeof undefined === 'undefined'); // false

Подробней о null
Подробней о undefinded

ajcom.register('login', async (hCtx, email, pass) => {
  const foundUser = await User.findOne({ where: { email } });
  
  if (foundUser && foundUser.password === pass) {
    console.log("Авторизация прошла успешно!");
    isLoginIn = true;
  } else {
    console.log("Неверные данные, проверьте ваш email и пароль!");
  }
  return { authorized: isLoginIn };
});

const result = arr.filter(el => Number.isInteger(el)).map(el => Math.pow(el, 2));

1. вы используете селектор .test, а такого селектора у вас в HTML коде нет.
2. событие надо использовать input, так как change срабатывает только когда отпускаешь клавишу мыши.
3. значение input надо приводить к number, так как он возвращает строку. Самый простой способ использовать для этого оператор +:
var p = +$('input').val();
4. вместо классов в таких кейсах удобней использовать метод css
5. несколько условий if друг за другом, проверяющих одно и то же значение, использовать неправильно. Так как если сработало первое условие, следующие тоже будут проверены. Либо используйте в таких случаях связку else if, либо switch case.

if (p === 1) {
  // do something
} else if (p === 2) {
  // do something else        
}

switch(p) {
  case 1:
    // do something
    break;
  case 2:
    // do something else
    break;
}

Исправленный вариант.

Код написанный табами может отображаться по-разному в зависимости от настроек редактора. А пробелы остаются пробелами и с ними такой проблемы нет. Пробелы это стандарт в большинстве больших компаний и в open source сообществе.
Еще программисты использующие пробелы в среднем больше зарабатывают. Но это от того, что в хороших компаниях высокие стандарты к качеству кода.
Современные IDE(вроде Webstorm) по-умолчанию заменяют табы на пробелы.

Вы что-то путаете, либо не понимаете чем отличаются понятия синхронно и асинхронно. Функция итак выполняется асинхронно, поэтому выполнение продолжается до ее завершения, иначе бы вызов console.log(result) происходил в конце. Вызывайте console.log(result) в колбеке, это самый оптимальный вариант.
Если все-таки хотите вызывать по порядку, то используйте async/await.
Для этого сделайте обертку над своей функцией:

const calculateAndDisplayRoute = callback => new Promise((resolve, reject) => {
    var waypts = [];
    return this.directionsService.route({
      origin: "Аэропорт, Республика Башкортостан, Россия",
      destination: $('#address_to').val(),
      waypoints: waypts,
      optimizeWaypoints: true,
      travelMode: 'DRIVING'
    }, (response, status) => {
      if (status === 'OK') {
         resolve(callback(response, status));
      } 
      reject(status);
    });
});

и вызывайте все это дело в асинхронной функции:

async function run() {
  try {
    await calculateAndDisplayRoute((response, status) => {
      console.log(status);
      result = status;
      this.directionsDisplay.setDirections(response);
      return true;
    });
    console.log(result);
  } catch (e) {
    console.log(e);
  }
}

Вместо колбеков удобней использовать промисы.

Вы имеете ввиду create-react-app? Вам так и так придется изучать саму библиотеку Reaсt.
create-react-app это лишь утилита для создания приложений с базовой структурой, которая устанавливает все нужные зависимости и добавляет в package.json скрипты для запуска тестов и сборки приложения.
Если плохо понимаете документацию, ищите в интернете статьи с примерами.

Значение head вы меняете только кода список пуст. Вы должны понимать чем принципиально отличаются вызовы в строках 45 и 46:
this.tail.next = newNode;
Эта строка добавляет ссылку на новую ноду в свойство next последней ноды, на которую помимо свойства next предпоследней ссылается еще и свойство tail самого списка. Далее:
this.tail = newNode;
Наша новая нода пишется в свойство tail.
Само свойство next новой ноды ни на что пока не ссылается. Но при следующем вызове append, в строке 45 туда запишется(оно будет ссылаться) новая нода.

Предположим сейчас в списке такой tail:

{
  next: null,
  value: 'xxx',
}

Вызываем append:
list.append('yyy');
tail после выполнения строки 45:

{
  next: {
    next: null,
    value: 'yyy',
  },
  value: 'xxx',
}

tail после выполнения строки 46:

{
  next: null,
  value: 'yyy',
}

Это объект или функция передаваемая в connect вторым аргументом.
Если вы передаете в connect вторым аргументом объект с AC, то connect оборачивает ваши AC в функцию-обертку () => store.dispatch(AC) и передаёт в props компонента. Если передаете вторым аргументом функцию, connect выполняет ее, передавая на вход первым аргуменом store.dispatch, вторым props компонента, и передаёт в props компонента результат выполнения. Все.

Можно так:

var data = {
  fruits : [
    {
      src: 'http://.png',
      data : 'Apple'
    },
    {
      src : 'https://.png',
      data : 'Banana'
    }
  ],
  vegetables : [
    {
      src: 'http://.png',
      data : 'Carrot'
    },
    {
      src : 'https://.png',
      data : 'Potato'
    }
  ]
};

var groups = Object.keys(data);

console.log(groups); // ['fruits', 'vegetables']

Потянет. Стоит.
Со временем стоит купить монитор минимум 24" с разрешением от 1920 x 1080. А лучше 2. Сам на двух внешних 24" 1920 x 1080 работаю + третий штатный MBP 15" для Slack, терминалов и панели разработчика. Очень удобно.
Машину стоит брать с SSD, 16GB RAM, i7.
Пока работайте в простеньком редакторе вроде Sublime. Вам больше пока и не надо. Но чем раньше купите монитор, тем лучше.

Потому что вы передаете в this.setState тот же массив.
Обновляйте так:

addGroup = () => {
  this.setState(prevState => ({ items : [ ...prevState.items, undefined ] }));
};

И уберите bind из render. В моем примере class field arrow function, ее биндить не надо.

Метод shouldComponentUpdate можно изменить так:

shouldComponentUpdate( nextProps, nextState ) {
   return nextState.items !== this.state.Items;
}

Если такой проверки мало, можно изменить так:

shouldComponentUpdate( nextProps, nextState ) {
   return nextState.items !== this.state.Items &&
     JSON.stringify(nextState.items.sort()) !== JSON.stringify(this.state.items.sort());
}

Если массив заменен, то пройдет приведение к строке и сравнение строк и если массивы разные вернется true и компонент обновится. Можно для сравнения использовать _.isEqual().
Но в большинстве случаев достаточно первого варианта с неглубоким сравнением.

https://css-tricks.com/svg-sprites-use-better-icon...

Простой пример.