Роман Якимчук

const index = users.findIndex(item => item.id === <ID>);

if (index === -1) { 
  // Не найден пользователь 
} else { 
  console.log(index + 1); 
}

...правда ощущение что я не понял вопроса, и вам надо просто отсортировать массив по "xp" и найти позиции в этом массиве.

Это работа с часовыми поясами.
Если в 17:30 это уже другой день, значит, насколько я понимаю, вы работаете с другим часовым поясом.

Ищете временную зону, ставите moment.js + его плагин под временные зоны, затем создаете экземпляр, устанавливаете временную зону, и форматируете вывод (moment.js сам выведет всё правильно).

Если нужны русские даты, для moment.js есть локализации.

Не понял до конца вопроса, но есть два момента:

1. Не совмещайте top и bottom с margin (top & bottom) для абсолютных элементов, потому что это решение одной задачи разными способами, и, честно говоря, даже не знаю как себя поведет браузер

2. margin: auto берет контейнер в котором размещается элемент, и "центрует" его путем добавления margin по разные стороны элемента в равной доле, поэтому для ваших 27% margin вышел больше, чем для большей высоты самого элемента. Но опять же, странное дело, потому что для абсолюта + top & bottom он должен был по идее растянуть его во весь экран, а не делать margin.

Это мысли вслух, может быть чем-нибудь поможет.

Анализируйте ответ сервера
Скопируйте, загоните в JSON.parse, и увидите на какой позиции невалидный символ.

Это изображение, его нельзя адаптировать без доп. решений, например:

1. Растягивать / сжимать при изменении размера страницы, но это неудобно на небольших девайсах
2. Работать с навигацией, т.е. сделать возможность навигации по изображению если оно не помещается на экране (наподобие карт)
3. Изменить логику под небольшие размеры экранов, написать отдельное решение

И в целом верно сказали, надо map, или svg.

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

Поэтому делаются цепочки вызовов, т.е. ожидаете ответ, вызываете другую функцию с этим ответом, и эта функция, в свою очередь, может вызвать другие функции, включая саму себя чтобы получить рекурсию (цикл).

Посмотрите chunk у lodash
К слову, он так и работает, через slice: https://github.com/lodash/lodash/blob/4.17.15/loda...

Не понятно что значит не идет клик.
У вас передается селектор, которого нет в разметке.

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

Это не нативный компонент, его нужно разработать или использовать готовое решение
Ищите Predictive Search. Если нужно с дропдауном, не знаю как оно называется, но обычно в UI kit'ах они есть.

Простые правила:

• Текст должен быть обычного размера
  
• Для экономии пространства не делаем огромных отступов (если нужно)
  
• Скролл по горизонтали и вертикали
  
• Sticky-заголовки или колонки для удобства
  
• Если нужно вывести доп. данные, то можно сделать через подсказки при наведении, например
  

Задача чтобы выводились все критические данные и было удобно читать, а всё остальное через интерактив.
У нас есть таблицы с 10-20+ колонок, и тысячи строк, плюс фильтры, сортировки, но показать не могу, NDA.

Если есть время, можно прикрутить управление колонками (скрытие/отображение, изменение размера, и прочее), это значительно упростит пользование таблицей.

Но, но не всё так плохо. Когда один раз соберете проект (запуск dev-сервера, например), дальнейшая сборка проекта на каждый "чих" занимает считанные секунды, поэтому особых сложностей не доставляет.

По теме:

1:

Зависит от проекта, но в 99% случаев вебпаком собирают сложные веб-приложения, а там просто запустить файл и посмотреть результат не получится.

Поэтому если это нужно, то можно спроектировать приложение таким образом, чтобы оно работало и БЕЗ сборки. Например, чистый JS (а не TypeScript), только относительные пути, подключение через System (например), полное отсутствие транспиляторов (только чистый JS/CSS). Правда, это будет мощный выстрел в ногу проекта, и соберете другие грабли, поэтому крайне не рекомендую это делать.

2:

Можно, но зависит от задач. Сборка проекта это просто команда, грубо, `webpack` в терминале. Запустить это можно на любом ПК, и так как это команда, то её можно запустить удаленно. Системы непрерывной интеграции работают именно таким образом, и сами собирают проект, тестируют, и так далее.

Другой вопрос, что вы хотите npm от проекта, а одно без другого не живет (webpack это тоже модуль, без npm проект не собрать так как получится зависимости установить), т.е. нет, нельзя. В нормальном режиме.

На самом деле, в теории, можно попробовать и даже это обойти, но я крайне не рекомендую это делать.

Анимация в JavaScript это набор техник по изменению CSS элементов, не более того. Основное это animation, transition, и transform.

Поэтому не ищите гайды по анимации, а найдите документации по этим свойствам CSS, и когда вы изучите их, станет понятно как сделаю любую нужную вам анимацию.

Это минимум.

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

Для этого нужно разбираться со вкладкой Performance в Chrome DevTools. Профайлите свои анимации, причем, делайте их похардовее, чтобы браузер офигел и подвисал, и смотрите почему он лагает. Чтобы понять причины тормозов придется копать в дерево DOM, как рисуются элементы, как они аффектятся при изменении DOM, и прочее. Так и поймете как делаются анимации, что хорошо и что плохо для браузера.

Всё описанное выше есть в документациях, можно найти при необходимости, например:

https://developers.google.com/web/fundamentals/per... (читать весь раздел)
https://developer.mozilla.org/en-US/docs/Web/CSS/a...

Вообще информации нужно море, ссылок будет намного больше.

Собственно по вопросу – я не искал, но не уверен что найдется нормальный курс по анимациям, разве что поверхностные. Если хотите реально научиться работать с анимациями, то практика, вероятно, лучший вариант.

Ищете разницу №1 через Math.abs(a - c)
Ищете разницу №2 через Math.abs(b - c)

Через сравнение разницы сможете понять к какому числу заданное число ближе.
Получится всего одно сравнение больше/меньше вместо четырех.