Иван

Flex-basis задает начальный размер элемента относительно главной оси флекс-контейнера. В зависимости от направления оси может быть похожим и на width, и на height. Скорее даже на min-width и min-height. Меньше чем flex-basis элемент не будет, но может быть больше, в зависимости от размеров контейнера, окна...

Flex-basis дает гораздо больше возможностей для красивой адаптации макета на мобильные разрешения, например когда контейнер перестает быть row и становится column, или наоборот.

P.S. Как меня справедливо поправили ниже, flex-basis ведет себя не так как min-width/height в том случае, когда не помещается в контейнер, не "вылазит".

Так:

.hover:hover + .opacity0 {
  opacity: 0;
}

Демо: https://jsfiddle.net/rockon404/hwxfw8au/

Если в двух словах, то итератор - это такой объект, который каждый раз по запросу может выдать либо некоторый элемент, либо сообщение о том, что у него больше нет элементов.

Самый простой вариант - итератор по списку. Он каждый раз по запросу будет выдавать по одному элементу списка, начиная с первого, и заканчивая последним, после чего выдаст сообщение, что элементы закончились.

При этом итератор не обязательно выдаёт элементы из заранее существующей коллекции, он может их прямо в момент запроса создавать по определённому правилу. Такие итераторы могут быть и бесконечными, то есть сколько бы запросов они не получили, они всегда готовы выдать ещё и никогда не скажут, что элементы закончились.
Пример - итератор, который выдаёт 0 или 1, чередуя их.

Не стоит полагаться на эти события, они не всегда срабатывают.
В первую очередь надо избавиться от зазора между родительским и дочерним элементом. Меню dropdown по-хорошему должно иметь позицию top: 100%. Для имитации зазора можно использовать контейнер с padding.
А можно что-то вроде:

.user-logout {
  border-top: 5px solid transparent;
  background-clip: padding-box;
}

Путей много на самом деле.

Саму задачу проще решить через css, без лишнего пререндера компонента.

У вас ошибка тут:

export const getAccounts = (userID) => {
  fetch(`${BASE_URL}/users/${userID}/accounts/`).then(resp => {
    resp.json().then(accounts => accounts.Items[0].accounts);
  })
}

Ничего не возвращаете.

Исправить так:

export const getAccounts = userID =>
  fetch(`${BASE_URL}/users/${userID}/accounts/`).then(resp => {
    resp.json().then(accounts => accounts.Items[0].accounts);
  });

И лучше используйте axios, вместо fetch

Сущность Service бесполезна в данной архитектуре, импортируйте и используйте функцию напрямую:
response = yield call(getAccounts, userID);

Вы мутируете массив tasks который передаете в компонент. При получении новых свойств, после обновления стора, в компоненте в который вы предаете его происходит проверка:
this.props.tasks === nextProps.tasks; // true
Она возвращает true, так как это тот же самый массив и компонент не обновляется.

Исправьте так:

export default function addDelete(state = initialState, action){
  switch (action.type) {
    case "ADD_TASK":
      return {
        ...state,
        tasks: [...state.tasks, {{id: action.id, time : action.time, task: action.task}}],
      };
    case "DELETE_TASK":
      return {
        ...state,
        tasks: [...state.tasks.filter(task => task.id != action.id)],
      };
    case "SET_ACSSES":
      return {
        ...state,
        add: !state.add,
      };
    default:
      return state;
  }
}

Но будет еще лучше, если поправите свои actionCreators. Кладите полезную нагрузку в ключ payload:

export default function add(time, task, id){
  if(!task || !time){
    return {
      type: "SET_ERROR",
      payload: "Error, invalid data"
    };
  }

  return{
    type: "ADD_TASK",
    payload: {
      id: id,
      time: time,
      task: task,
    },
  }
}

export const deleteTask = id => ({
  type: 'DELETE_TASK',
  payload: id,
});

Тогда код редьюсера будет такой:

export default function addDelete(state = initialState, action) {
  const { type, payload } = action;

  switch (type) {
    case "ADD_TASK":
      return {
        ...state,
        tasks: [...state.tasks, payload],
      };
    case "DELETE_TASK":
      return {
        ...state,
        tasks: [...state.tasks.filter(task => task.id != payload)],
      };
    case "SET_ACSSES":
      return {
        ...state,
        add: !state.add,
      };
    default:
      return state;
  }
}

Тыц, тыц

Потому что в первом случае вы обращаетесь к аргументу функции, а во втором к полю класса. Все по канонам JavaScript.

UPDATE: реальные тестовые задания и разборы здесь, ответы на все вопросы из поста в моем блоге об обучении react.

не включая основы js

Извините, но стандартная задача, про "напишите функуцию add, которая при вызове add(1)(2) вернет 3" - многих положила на лопатки =) Поэтому будьте готовы..

React
0) Какую проблему решает react ?
1) Мгновенно ли срабатывает setState? Если нет, то как выполнить код, который 100% выполнится после того, как новый state будет установлен?
2) Зачем многие постоянно пишут в constructor: this.FUNCTION_NAME = this.FUNCTION_NAME.bind(this) и отсюда вопрос вытекает чему равно this в разных местах вашего компонента...
3) в каких методах жизненого цикла стоит выполнять xhr запросы? В каких стоит "обновлять state на основе props"?
4) Что будет если вызвать this.setState в render методе компонента?
5) зачем нужен componenWIllUnmount, приведите пример..
6) Контролируемые, не контролируемые компоненты
7) Как организовать роутинг в реакт приложении? (ответ: взять react-router - подходит, но было бы круто, если бы вы рассказали, как он примерно работает)*
8) Зачем нужны propTypes? Что происходит с ними в production сборке?
9) Как можно удобно "отлаживать" чужой код приложения, написанного на react (намек в сторону React devtools)
...

Redux
0) Какую проблему решает redux?
1) Зачем многие создают типы действий NAME_REQUEST / NAME_SUCCESS ? А заодно, что такое "действие", а что такое "создатель действия"...
2) Что такое редьюсер? Можете написать простой редьюсер без react/redux?*
3) Для чего нужен redux-thunk? Как он работает? Напишите (можно псевдокод) асинхронный создатель действия (либо, если надоело говорить "терминами" - асинхронный aciton)
4) Как компоненты приложения получают "пропсы" из "стора"?*
5) Можно ли (и считается ли это нормальным) использовать state, если используется Redux?
6) Почему в reducer'ax мы возвращаем новые объекты? Приведите пример, когда вы возвращаете новый объект, а когда тот же самый.
6.5) А так же, "как в js вообще это работает?". Например:

let obj1 { name: 'Test', age: 100 }
let obj2 = obj1
obj2.name = 'Test_new'

Что будет в obj1, почему? В каких случаях объекты могут быть равны?
7) Что возвращает функция connect (из react-redux)?
...

Общее:
0) package.json
1) Webpack, gulp, etc...
2) node.js
3) promise

Что-нибудь практическое:
1) Как бы вы валидировали форму, если ошибки валидации приходят после submit'a ее на сервер..
2) Почему не работает следующий код, сделайте чтобы работало
...
На истину не претендую, но такие вопросы имели место быть на собеседованиях. В беседе можно многое разузнать дополнительными вопросами и так далее. Так же, если часть вопросов вам неизвестна - не беда, многие и на половину ответить не могут.

p.s. возможно дополню...
p.p.s. звездочкой отметил, на мой взгляд не самые необходимые для junior-собеседования вопросы.