Роман Макаров

Вы, вероятно, не так поняли статью. content-first предполагает минимально нагруженный интерфейс, но никак не использование одного html.
Оформление, пусть и минимальное, должно быть, а делать его на html - просто ужасная практика.

из очевидного? подставить начально значение, типа 0 или изменить регулярку.
Но лично на мой взгляд выносить логику в шаблон - занятие неблагодарное. Тем более валидации на js обладает большей гибкостью

В общем то просто, скрываете весь контент кроме экрана приветствия (который fixed 100vh/vw), потом по ивенту (клик, скрол) добавляете контент, а экран приветствия убираете.

Берете get параметр, и при нужном условии вызываете window.close()
p.s. но может работать не везде. в идеале нужно и открывать это окно через js

1) Math.floor()
2) Math.round()

Нужно если:
1) учебный проект, есть время на него
2) планируете масштабировать
Не нужно если:
1) срочно нужен прототип
2) плохо знаете js

alphaArr = [];
countries.forEach(function (country) {
    //any logic
    alphaArr.push(country[name]);
});

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

Если он отображается в браузерной строке, то window.location, если нет - то никак.

if (!$(parentSelector).find(target)[0]) //append
можно попробовать как то так

Возможно browserSync в таске styles вешает, попробуйте livereload.
Или попробуйте без него запустить

Почему у вас вся форма внутри label? А функцию лейбла выполняют span? А вопрос не понял, скрин что-ли покажите.

возможно preventDefault поможет