Владимир Проскурин

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

Ту, с которой вам удобнее работать. Сейчас почти любая из популярных систем отвечает требованиям для нормальной веб-разработки. Я вот сижу на винде, т.к. мне так удобнее, я знаю винду лучше чем линукс, и могу настроить ее также удобно, как человек с другой системой свою систему. Считаю, что холивары по поводу ОС остались в прошлом. На работе я использую MacOS, но не сказал бы, что она в каком-то плане лучше винды (для меня), даже в некоторых хуже (снова для меня). Выбирайте из личных предпочтений.

Ну, один из фреймворков вам точно нужен. Vue или React, не важно. WebGL, Three.js, GSAP нужны, если вы планируете работать с графикой, анимацией - этим владеют не все, по этому поводу париться пока не стоит (хотя это довольно интересная область). Посмотрите вакансии middle front-end разработчиков, там как правило все перечислено.

пробую создавать макеты в Figma

Это front-end'еру совсем необязательно учить, оставьте эту работу дизайнерам. Хотя, расширять кругозор всегда полезно, да и фронтендеру близка работа с дизайнерами, неплохо бы понимать специфику их работы.

Готовых сайтов на чистом vue/react + эти библиотеки пока не видел

Видели, просто не догадывались об этом.

ОпСоСы давно грешат встраиванием рекламы в сайты, которые без https. Судя по тому, что у вас на смартфоне оператор мегафон, и реклама тоже от мегафона, вероятно, это реклама вашего оператора.

Не думаю, что это возможно. т.к. devtools очень зависит от текущей страницы. Можно конечно пошаманить с devtools-protocol, и подключить дополнительный devtool в отдельном окне https://developers.google.com/web/updates/2017/10/...

Есть такая штука CSS Diff

Вам не нужно получать с элемента marginLeft, куда лучше, определить переменную positionX, и менять только ее, после каждого изменения назначать в элемент.
UPD: хотя на самом деле, вы делаете все правильно. Только для правой стороны, вы должны писать val--. Также, изменяйте val до назначения его в элемент, а не после, иначе будет придется два раза вправо нажимать, чтобы он сменил направление.
Вот работающий пример https://jsfiddle.net/v7odsf4q/

Вероятно, у вас в таблице пробел. https://jsfiddle.net/tjr72q53/ (пример без пробела и с пробелом).

Отформатируйте, и посмотрите почему

body {
    background: #f0f0f0;
}

@media screen and (max-width: 600px) {
    body {
        background: #fc0;
    }
}

.container {
    width: 600px;
}

.container {
    width: 1200px;
    margin-left: auto;
    margin-right: auto;

}

UPD: а, еще также, при одинаковом селекторе у двух стилей (в данном случае у обычного и в media), приоритетом будет тот, что ниже в css файле. Поэтому поместите ваш media запрос ниже.