Михаил Р.

Для миддла надо подтянуть только п. 3. У Светы Смирновой есть несколько отличных презентаций по работе с explain, они легко находятся гуглом.

Еще желательно различать транзакции и блокировки, когда что использовать.

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

Вообще, по моему опыту, не стоит переоценивать результаты интервью. Когда я 5 лет назад ходил по собеседованиям, то после двух из них, которые я сам посчитал проваленными, мне прислали предложения о работе.

@mixin test($arg) {
  @if(not $arg) {
    @error $arg;
   }
}

Является ли желтая квадратная форма в конце анимации видоизмененной кнопкой или же это совершенно другой элемент разметки?

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


С такими анимациями можно долго играться, самое главное - проверить в конечном итоге кроссбраузерность. А то в хроме и FF работает, а в каком-нибудь IE всякое может случиться.

P.S.: Но в целом - я голосую за реализацию таких вещей целиком на JS. Практика показывает, что в проектах с такими анимациями очень быстро собирается большое количество одновременно анимирующихся значений у большого количества элементов, которые нужно синхронизировать между собой. На CSS голова лопнет все это делать. И да, чем больше всего меняется в CSS-анимациях в единицу времени, тем выше шанс найти какой-нибудь редкий баг и долго ломать себе голову в поисках проблемы. Лучше уж взять какую-нибудь библиотеку вроде anime.js или любимый многими GSAP и использовать их.

Скорее что-то вылезает за пределы body. Напишите селектор

* {
   outline: 1px solid rebeccapurple;
}

и по рамкам сможете понять, какой элемент выпирает.

>1) Видит ли фрилансер мое имя и фамилию, когда я создал предложение о работе, опубликовал и оно висит в объявлениях?

Нет. Показывается название компании.

>2) Видит ли фрилансер мое имя и фамилию, когда я обратился к выбранному мною фрилансеру напрямую с предложение о работе?

В чате видно имя и фамилию, да :)

>3) Можно ли мне как заказчику указывать не настоящую фамилию? Знаю что фрилансерам необходимо указывать реальные данные. А вот что насчет заказчиков?

Официально конечно нет. Но по факту, вас ничто не ограничивает. У меня есть заказчики под полностью вымышленными именами и это им абсолютно не мешает работать. Фрилансер в случае бана теряет деньги. А заказчик особо ничего не теряет.

БП - ноунейм какой-то на 500 ватт.

Поздравляю, вы выиграли в лотерею!

Smart-grid.
Отличная поддержка и невероятно удобное использование.
Минус: нет документации, нужно самому разбираться, но оно того стоит. Автор проводит платные курсы, потому и нет документации.

Меткой-пресетом - никак.
Придется либо CSS-спрайтом, либо вообще собственным изображением (bad practice).
Пример с док-ии:

var myPlacemark3 = new ymaps.Placemark([55.85, 1.0], {}, {
    iconLayout: 'default#image',
    iconImageClipRect: [[69,0], [97, 46]],
    iconImageHref: 'images/sprite.png',
    iconImageSize: [35, 63],
    iconImageOffset: [-35, -63]
});

мне кажется вызывать рекурсивно checkUserAge и checkUserPass, до тех пор пока юзер не введет подходящий возраст и пароль - не очень хорошая идея, но возможно автор так и задумывал. Ну и конечно, в таком варианте check-методы должны возвращать true/false, иначе проверка this.checkUserAge() в this.start всегда undefined

Что означает эта строка?
if(this.checkUserAge) {
она означает, что вы делаете проверку, существует ли свойство checkUserAge, а оно является у вас методом, значит условие будет выполняться всегда. Скорее всего, вы хотели написать так
if(this.userAge) {

Вместо console.log возвращать return true/false?

Для функций, которые что-то проверяют в if() - нужно обязательно возвращать return что-то (true/false или в более развёрнутом виде )
console.log просто выводит запись в консоль - её можно оставить.

this.checkUserAge = function() {
    if(this.userAge) {
      if(this.userAge >= 18) {
        console.log('Проверка возраста > успех, возраст подходит...')
        return true;
      } else {
        console.log('Проверка возраста > ошибка, возраст не подходит...')
        return false;
      }
    } else {
      console.log('Проверка возраста > ошибка, возраст не указан...')
      this.getUserAge()
      this.checkUserAge()
    }
  }

По улучшению скрипта - можно вызвать this.getUserAge() в начале функции, перед if(this.userAge) {

Диалоги запроса – операции асинхронные, поэтому можно наобещать Promise'ами:

const maker = message => new Promise((res, rej) => {
  const v = window.prompt(message);
  if (v.length) res(v);
  else rej(["Пустой ответ", message, v]);
});

const pAge = maker("Введите ваш возраст");

const pPwd = pAge.then(age => {
  if (parseInt(age) > 18) return maker("Введите пароль");
  else return Promise.reject("Возраст не подходит");
});

Promise.all([pAge, pPwd])
.then((age, pwd) => {
  console.log("Получили и норм. возраст и пароль:", age, pwd);
  // пляшем дальше
})
.catch(err => console.error("Что могло пойти не так?", err))
;

Изображения пихаете в svg, в виде спрайта dreamhelg.ru/2017/02/symbol-svg-sprite-detail-guide
Для каждого контейнера с иконкой пишите свойства

position: absolute;
left: 50%;
margin-left: -100px; /* или другое число. Система координат начинается с центра. Минус это влево. */
pointer-events: none; /* чтобы не перекрывало контент, мешая кликать*/

Чтобы эти иконки не создавали скролл, можете поместить их в отдельный блок, задайте ему размеры (видимой области иконок), сделайте position: absolute и опять же pointer-events: none