Алексей Дзюба

Поместите navbar в контейнер и установите класс justify-content-around

<ul class="nav justify-content-around">
  <li class="nav-item">
    <a class="nav-link active" href="#">Active</a>
  </li>
  <li class="nav-item">
    <a class="nav-link" href="#">Link</a>
  </li>
  <li class="nav-item">
    <a class="nav-link" href="#">Ваша картинка</a>
  </li>
  <li class="nav-item">
    <a class="nav-link" href="#">Link</a>
  </li>
  <li class="nav-item">
    <a class="nav-link href="#">Link</a>
  </li>
</ul>

Как вариант

var tahoe = {
  resorts: ["Kirkwood","Squaw","Alpine","Heavenly","Northstar"],
  print: function(delay=1000) {
    setTimeout(function(self) {
      console.log(self.resorts.join(","))
    }, delay, this);
  }
}
tahoe.print();

Можно использовать bind:

setTimeout(function() {
  console.log(this.resorts.join(', '));
}.bind(this), delay);

Или в переменную сохранить текущий контекст до вызова setTimeout и использовать её вместо this:

var that = this;
setTimeout(function() {
  console.log(that.resorts.join(', '));
}, delay);

Ну вот вам для затравки:
[pluralsight.com] React Fundamentals
[Tuts Plus] Getting Started With React.js Video Tu...
[Egghead.io] React Lessons
scotch.io
sitepoint.com
codementor

а дальше документация + поиск статей на английском

мы должны писать сначала function () {...}, а не сразу написать тело функции?

Именно так. Таким образом на действие onclick пользователя вы говорите браузеру:"Выполни-ка вот эту функцию". Мне интересно как вы хотите сразу писать тело функции? Если как-то так:

a.onclick = {
//do somethiong
}

В таком случае вы скажете браузеру:"Вот когда хомосаппиенс нажмет на кнопку, тогда объект". Не совсем понятно, не так ли?
Если вы хотите тело передавать вот так:
a.onclick = //do something
То вы по сути начнете просто перечислять инструкции для браузера. А вы хотите, чтобы эти инструкции были именно для обработчика событий.

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

a.onclick = func;
function func(){
//do somethong
}

Тут по факту вы тоже говорите браузеру, что надо сделать при событии. Тут главное написать вот так:
a.onlick = func
А не так
a.onlick = func()//Очень плохо, не пишите так
Во втором варианте вы передаете на обработчик уже результат выполненной функции.

И еще лучше использовать addEventListener, Например:

a.addEventListener('click',handler)
function handler(){
//do something
}

function Slider(images, prevBtn, nextBtn) {
      var self = this;
      this.images = images;
      this.i = 0;

      prevBtn.onclick = function () {
          hide(self.images[self.i], 19);
          self.i--;

          if (self.i < 0) {
              self.i = self.images.length - 1;
          }

          show(self.images[self.i], 19);
      };

      nextBtn.onclick = function () {
          hide(self.images[self.i], 19);
          self.i++;

          if (self.i > self.images.length - 1) {
              self.i = 0;
          }

          show(sliderImgs[self.i], 19);
      }
  }

Если прописать в обработчике console.log(this), то вы увидите, что там не ваш слайдер, а кнопка по которой кликнули.

Можно переписать так:

function Slider(images, prevBtn, nextBtn) {
      this.images = images;
      var self = this;
      // ...
      prevBtn.onclick = function () {
          hide(self.images[self.i], 19);
          self.i--;
          // ...
      };
  }

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

// ...
  nextBtn.onclick = () => {
    console.log(this.images)
  };
// ...

https://jsfiddle.net/06v3j7f3/

И вообще, лучше избегать onclick. Я понимаю, что в первых главах большинства учебников его упоминают, так как по сравнению с addEventListener он кажется милым и пушистым, но вообще это неудобный привет из девяностых, имхо. Достаточно того факта, что вы не можете сделать два разных onclick'а на одной кнопке.

Подкину вам еще пищу для размышлений: что будет, если на странице будет ДВА ваших слайдера? Или больше.

elem.style.opacity += 0.02;

Тип значения - строка. Поэтому += тут делать нельзя. Можно так:

elem.style.opacity = (+elem.style.opacity + 0.02).toFixed(2);

Ничего не понимаю. Ты передаешь в hide параметр t. Внутри hide ты параметр t используешь как аргумент функции setInterval.

почему я всё-таки таки могу вставить свой аргумент t

Потому что ты объявил, что у функции может быть параметр t и передал его.

Данным с клиента обычно не доверяют и проверяют на беке

К сожалению, поддержкой юзеров с отключенным жс мало кто занимается

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

Что делают в случаях, когда приложение или просто сайт не может нормально функционировать без джаваскрипта?

Закрывают вкладку и идут на другой сайт, например?

отправить невалидные данные на зло

Конечно же, на сервере проверки обязательны.

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

какие то вы глупости пишите
очевидно что из учебы пригождается примерно 5% знаний, а вы хотите 100% охватить просто так без нужды