Михаил Р.

bindActionCreators получает на вход объект с AC, либо функцию и возвращает объект с AC, обернутыми в вызов dispatch или в случае с функцией функцию обернутую в dispatch.

Если вы передаете в connect вторым аргументом объект:

const mapDispatchToProps = {
  getProducts,
};

То ваш объект в процессе вызова connect будет передан в вызов bindActionCreators и каждый AC будет обернут в вызов dispatch.
Этот вариант записи, в вашем случае, является предпочтительным, так как он короче.

Ручное оборачивание AC в dispatch:

const mapDispatchToProps = (dispatch, ownProps) => ({
  getProducts: () => dispatch(getProducts()),
});

Тут можно использовать второй аргумент ownProps, ограничить количество принимаемых AC аргументов или поменять их порядок, а так же передать дополнительные функции, которые не надо оборачивать в dispatch.

Вызов bindActionCreators на объекте с AC:

cosnt mapDispatchToProps = dispatch => bindActionCreators(
  {
    getProducts,
  },
  dispatch,
);

В использовании такого варианта записи нет особого смысла, так как первый вариант записи короче.
Но можно ее видоизменить:

const mapDispatchToProps = (dispatch, ownProps) => ({
  ...bindActionCreators(
    {
      ...productsActions,
      ...usersActions,
      ...ordersActions,
    },
    dispatch,
  ),
  () => getSomeOther(ownProps.someProp),
  notNeedsToWrapInDispatch,
})

В таком виде можно передать в bindActionCreators много AC как есть и отдельно передать дополнительные AC обернутые в dispatch, которые будут использовать ownProps или функции которые не надо оборачивать в dispatch.

Вместо

values.forEach(value => {
    if(element.value === value) element.selected = true;
  });

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

if(values.includes(element.value)) element.selected = true;

https://developer.mozilla.org/ru/docs/Web/JavaScri...

forEach работает с массивом, а у вас коллекция узлов (NodeList ). И советую использовать не getElementsByClassName, а querySelector/querySelectorAll. Всё-таки кроссбраузерней, да и удобней, когда селектор сложный.

var dependent = document.querySelectorAll('.dep');
[].forEach.call(dependent, function(item, i, arr) {
    alert(i + ": " + item + " (массив:" + arr + ")");
});

Вариант второй - преобразуем NodeList в массив и работаем с ним уже соответственно:

var dependent = [].slice.call(document.querySelectorAll('.dep'));
dependent.forEach(function(item, i, arr) {
    alert(i + ": " + item + " (массив:" + arr + ")");
});

правильно ли я все понял?

нет

"Получить стандартное событие" - откуда вы это взяли? Испытываете проблемы с пониманием английского текста - можете попробовать русский вариант.

<h1 className={`class_${url}`}>Hello, world!</h1>

<h1 className={'class_' + url}>Hello, world!</h1>

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

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

А вот вопрос, как правильно подключаться в двух оставшихся вариантах, действительно важный, и ответ на него, как обычно, почти никто не знает, поскольку все друг у друга списывают статьи не 2-х, а 22-х летней давности. К счастью, есть сайты с актуальной информацией.

Теоретически, можно использовать mysqli. Но не нужно. Потому что это низкоуровневый драйвер и пользоваться им без подготовки очень неудобно. Но если вот прям так приспичило, то вот как правильно соединяться используя mysqli

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

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

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

Пароль в базе данных не шифруется а хэшируется. Делается это с посощью функции password_hash

Сделайте макеты на 1920, 960 и 600px.
320-600 - для мобил
600-900 - планшетов
все что больше для ПК

media и viewport в помощь ))

Не совсем удачное название аргумента callback-функции в вызове (последняя строчка).

Вместоf(true, 500, callback => console.log(callback));
может, лучше

const myCallback = arg => console.log(arg);
f(true, 500, myCallback);

Завсит от цели, для чего это спрашивается.

Если чтобы поприставать с нубскими вопросами - то нигде.
Если чтобы почитать умных мыслей - РНР дайджест на Хабре прекрасно суммирует все, что было написано за две недели. У меня например никогда не хватает времени, чтобы прочесть всё. Куда больше-то - я уж и не знаю.
Если чтобы поучаствовать в серьезном прокете - на гитхабе, выбирай любой.
Если чтобы послушать интересные доклады и пообщаться вживую - то конференции.
Если интересует внутренне устройство языка - то php internals.
Если интересует, что пишут пхп селебрити про что угодно, кроме программирования - то твиттер (Расмус показывает картинки из аэропортов и роботов, которых собирает его сын, Сара постит котиков - и так далее).

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

then ждет на вход коллбек, т.е. функцию.
А вы ему пихаете промис, да еще и стартуете все эти промисы одновременно.

Если сделать так
.then(() => animation(2, 1000, log))
то animation выполнится, когда резолвится промис -> будет выполнен коллбек, в котором запускается следующая animation

Вы не понимаете, как работают промисы и JS. Это самая главная ошибка.

Попробую чуть-чуть объяснить.
fn(a,b,c).then(fn(k,m,n))
Вот так вы пишете. Что здесь происходит.
fn срабатывает и сразу же возвращает объект типа промис, в котором вы вызываете метод then. Этот метод принимает две функции - для успеха и для фейла. В качестве функции успеха вы указываете выражение fn(k,m,n). Окей, далее JS вычисляет это выражение, то есть буквально выполняет эту функцию и в качестве результата получает новый промис, который используется в качестве callback функции успеха для первого промиса.

Внимательно перечитайте документацию.
https://learn.javascript.ru/promise

Исправлением ошибки будет что-то вроде этого:

animation(1, 500, log)
    .then(e=>animation(2, 1000, log))
    .then(e=>animation(3, 2000, log))
    .then(e=>animation(4, "500", log));

Что бы Вы изменили в коде?

Все.

const uid = () => Math.random().toString(36).slice(2);

class App extends React.Component {
  state = {
    tasks: [
      {
        id: uid(),
        title: 'title',
        description: 'description',
      }
    ]
  };

  handleCreateTaskClick = () => {
    this.setState(state => ({
      tasks: [
        ...state.tasks,
        {
          id: uid(),
          title: 'title',
          description: 'description',
        },
      ],
    }));
  };

  render() {
    const { tasks } = this.state;

    return (
      <div>
        <button onClick={this.handleCreateTaskClick}>Добавить задачу</button>
        <ul>
          {tasks.map(task => (
            <li key={task.id}>
              id: {task.id} | {task.title} | {task.description}
            </li>
          ))}
        </ul>
      </div>
    );
  }
}

class App extends React.Component {
  state = {
    tasks: [
      {
        id: 1,
        title: 'title',
        description: 'description',
      },
    ],
  }

  createTask = () => {
    this.setState(({ tasks }) => ({
      tasks: [
        ...tasks,
        {
          id: 1 + Math.max(0, ...tasks.map(n => n.id)),
          title: 'title',
          description: 'description',
        },
      ],
    }));
  }

  render() {
    return (
      <div>
        <button onClick={this.createTask}>Добавить задачу</button>
        <ul>
          {this.state.tasks.map(({ id, title, description }) => (
            <li key={id}>id: {id} | {title} | {description}</li>
          ))}
        </ul>
      </div>
    );
  }
}