Как работает контекст вызова функций? И почему так?

Кристина,

Но вот я же вызываю явно метод класса

Где?
btn.addEventListener('click', foo.bar); // тут?
Нет. Вы не вызываете метод, лишь предаете его с потерей контекста.

Как устроен роутинг в больших React.js проектах рунета?

Опрометчивое решение ориентироваться на гигантов, вместо того, чтобы подобрать оптимальное решение исходя из специфики собственного проекта.

Почему переменная не пробрасывается в функцию?

hckn, да, так и есть. Тут еще надо понимать, что примерно происходит под капотом.
Суть проблемы, если интересно.

Где находить идеи для веб проекта?

NibiruanChild, я таких деталей не спрашивал. Полагаю, что весь трафик идет из поисковика.

Как на все роуты повесить открытие одного файла?

Денис Букреев, обновил ответ. Пути только нужные вставьте вместо public, если по-другому называются.

Что нужно иметь и знать в фреймворке React джуну?

Объясняю. Пункт 7 это совсем базовые знания. Они как и 6, 8, 9 понадобятся хотя бы для того, чтобы выполнить тестовое задание на хорошем уровне. И всегда будут хорошим плюсом. Подобный сервер это, примерно, строк 15 кода.

Пункт 3, я считаю, важен для любого фронтендера, как и HTML/CSS. Фронтендер должен уметь, ну хотя бы вешать слушатели, получать узлы и коллекции, работать с document, window, селекторами, знать примерно возможности Web APIs и уметь быстро загуглить оптимальное решение. Если фронтендер не знает, скажем, можно ли вообще получить размер окна, как слушать скролл или если у него наступает ступор при вопросе "куда можно сохранить токен" или "предоставляет ли браузер какое-либо решение для локального хранения данных?", то это плохой фронтендер и по мне на Junior от не тянет.

Зачем знание xmlhttprequestов, если в любом сторонней библе эта функциональность скрыта за слоем абстракции написанной вендором.

Одно дело использовать библиотеку, другое знать, что есть XMLHttpRequest и что библиотеки используют именно его.

Мое мнение работать с DOM должен уметь каждый человек, называющий себя фронтенд разработчиком. И в той же React разработке в больших и сложных проектах, работать с нативными событиями, document, window и refs приходится очень часто. Базовые знания Web APIs тоже важны.

Согласен, мой список требований - это хороший Junior React Developer. Красный минимум знаний, конечно, будет пониже. Но люди с минимумом, зачастую, подолгу не могут найти работу, а на хорошие конкурентные вакансии им путь закрыт. Если интервьюер видит, что кандидат этот минимум еле осилил, что у него на всех фронтах пробелов больше чем знаний и кандидат вообще не подает никаких надежд, то он естественно предпочтет взять, кого-нибудь получше.

Уровень мидла перечисленные пункты не гарантируют. Хороший мидл имеет достаточно боевого опыта, он разбирается в вопросах оптимизации и ускорения загрузки, без проблем решает задачи архитектурного плана на уровне модулей, может внедрять, вести и развивать инструментарий разработчика(все эти hmr, dev, prod, server конфиги, story book, jest, прекоммиты, деплой, проксирование дев сервера на тестовые инстансы и прочее). Он без проблем решит задачу вроде реализации фида с автовоспроизведением и остановкой видео при скролле(при отсутствии готового компонента Video в проекте) и инъекцией рекламы, лишь по макету, документации API и списку требований. Поставит джуниору задачу, объяснив оптимальный путь решения и проведет code review.
Ни один пункт из моего ответа не гарантирует перечисленного.
Повторюсь, уже писал об этом в комментариях, что уровень мидла от джуна отделяет именно достаточный багаж опыта работы над реальными задачами. Это и разработка, и сопровождение, и рефакторинг.
А пункты 6, 7, 8, 11 - подразумевают базовые неглубокие знания, а 17 вообще рекомендация. Для уровня мидла базовых знаний этих пунктов недостаточно и он обязательно должен уметь без проблем реализовать UI компоненты любой сложности.

Как написать HTTP запрос который бы передавал переменную из React в Ruby?

Alex IdonKnow,

От чего зависит будет это объект или массив?

От того, что пошлет в ответ сервер.

если в ответ получать ничего не нужно нужно ли в // do something with data что-то прописывать?

Если даже данные ответа не нужны, то показать что-либо пользователю надо. Например оповещение, что данные успешно сохранены или что произведен вход, или переадресацию куда-нибудь сделать это делается в этой функции колбеке, так будет без обработки полученных данных:

.then(res => res.json())
      .then(() => {
        // do something when response received
    });

Как написать HTTP запрос который бы передавал переменную из React в Ruby?

ак я понимаю он преобразует мою переменную в JSON файл.

В JSON-строку.

А что делает вот эта строка then(res => res.json

Преобразует JSON-строку ответа в объект или массив.

какие к примеру манипуляции мне может понадобиться делать с этой переменной?

Смотря зачем данные посылаете и хотите ли что-либо получить в ответ от сервера.

Codewars, при загрузке этой страницы возникли неполадки, что делать?

Звонить провайдеру и спрашивать.

Как написать HTTP запрос который бы передавал переменную из React в Ruby?

Alex IdonKnow, нет. Вы должны отправлять запрос по определенному пути, который обрабатывает ваш сервер. Полагаю, что сейчас он ничего не обрабатывает.
Почитать.

Как написать HTTP запрос который бы передавал переменную из React в Ruby?

Alex IdonKnow, тоесть вы и Rails не особо знаете? Тогда все очень плохо. У меня был опыт Ruby только написания REST API и сервиса оповещений по websocket на Sinatra.

Вы должны понимать, что код клиента ничего не знает про код сервера. Они взаимодействуют по протоколу http. Вам надо написать эндпоинт который по определенному URL будет принимать POST запрос и обрабатывать. Этот адрес вам и надо вписать в вызов fetch. Больше не скажу, так как Rails для меня темный лес, хоть и знаю немного Ruby.

Как учитывать время скрам-митингов?

Куда устраивались, там и спрашивайте, как у них принято учитывать время отводимое на совещания..

Как проверить в JS-коде, есть ли на элементе обработчик onclick?

Ну как вам сказать. Сами посмотрите на суть проблемы.

Как заменить полностью слово из строки, а не только его часть?

hckn, и массив слов правильней так подставлять:

const words = ['real', 'super'];
const regexp = new RegExp(`(${words.join('|')})\\w*`, 'ig');
const string = 'really, reality, super, universe';

alert(string.replace(regexp, 'BOOM'));  // BOOM, BOOM, BOOM, universe

Демо.

Как заменить полностью слово из строки, а не только его часть?

hckn, ошибся по невнимательности. Вместо плюса должна быть звездочка.

string = string.replace(new RegExp(`${word}\\w*`, 'ig'), 'BOOM')

Как заменить полностью слово из строки, а не только его часть?

hckn, потому что значение строки не обновляете:

words.forEach(word => {
  const regexp = new RegExp(`${word}\\w*`, 'ig')
  string = string.replace(regexp, 'BOOM')
})

Как написать форму(select) на react?

Stergy, да:

handleChange = e => {
  this.setState({account_id: e.target.value });
}

Ну и начальное состояние у вас должно совпадать с value одной из опций.


Пример

Как написать форму(select) на react?

Stergy,

<select
  value={this.state.acountId}
  ...
>
  ...
</select>

Что нужно иметь и знать в фреймворке React джуну?

sim3x, Спасибо! Добавил примеры.

Что нужно иметь и знать в фреймворке React джуну?

sunblossom,

человек, который имеет в копилке каждый из ваших пунктов, по определению не может не иметь опыта.

какой из приведенных пунктов по-вашему невозможно иметь без опыта работы?

ИМХО, теория без практики - хуже, чем практика без углубленной теории. теория без практики - хуже

Ничто не запрещает человеку учиться и совмещать теорию с практикой. Более того, процесс изучения ЯП и сопутствующих технологий, по-хорошему, должен вмещать больше практики, чем теории. Для получения практического опыта программирования не обязательно работать программистом, достаточно писать код.
Совсем другое дело продолжительный опыт работы в реальных проектах. Именно его наличие и знания полученные из этого опыта и отделяют программиста уровня Middle от Junior.