Junior Bee

Если требуется во всех почтовых клиентах (допустим Outlook 2011+), то офк онли таблички с инлайн стилями. Респонсив поддерживается адекватно только в эпл почте + имеется гибридный подход для gmail, но он геморойный.
Вообще норм люди делают подобные вещи с помощью вот таких штук foundation.zurb.com/emails.html
Руками только наркоманы все верстают, ибо повесится можно.

Вот тут вот что и чем поддерживается: https://www.campaignmonitor.com/css/
Я верстаю таблицами. Где можно css заменить атрибутами html - лучше это делать. Ну и пару постоянных проблем - адаптивность требуют постоянно, но никого не волнует, что она поддерживается только Яблуком, а также никто не понимает, как верстать под windowsphone, так как он работает по настроению.

https://habrahabr.ru/company/pechkin/blog/255819/
https://habrahabr.ru/post/252279/
Таблицами по моему верстают не мастхэв, а вроде из-за удобства. Этот стиль верстки был популярен во времена веб 1.0. Сейчас это моветон уж не знаю чего ради он опять стал модным.
Две страницы это скорее всего два стиля под разные экраны (широкий десктоп и мобильный) которые вы должны будете подсовывать в зависимости от разрешения оного.
И еще вроде как стили верстаются инлайново т.е. прямо в тегах без использования стилевых файлов. Это конечно неудобно.
Но я могу ошибаться так что не обессудьте.

function eqObj(obj1, obj2) {
  if(obj1 === obj2) return true;
  if(!obj1 || !obj2) return false;
  var keys1 = Object.getOwnPropertyNames(obj1);
  var keys2 = Object.getOwnPropertyNames(obj2);
  var len = keys1.length;
  if(len !== keys2.length) return false;
  while(len--) {
    var key = keys1[len];
    if(!Object.prototype.hasOwnProperty.call(obj2, key)) return false;
    if(typeof obj1[key] === 'object' && typeof obj2[key] === 'object' && !eqObj(obj1[key], obj2[key])) return false;
    if(obj1[key] !== obj2[key]) return false;
  }
  return true;
}

var objects = [
    {it1: "Pro1", desc: "desc1", id: '17'},
{it1: "Pro2",  desc: "desc2",  id: '85'},
{it1: "Pro3", desc: "desc3",   id: '87'},
{it1: "Pro4",  desc: "desc4",  id: '41'},
];
var result = objects.filter(function(obj) {
  return !eqObj(obj, {it1: "Pro4",  desc: "desc4",  id: '41'});
});

Вас спросили о всплытии переменных
www.w3schools.com/js/js_hoisting.asp
https://habrahabr.ru/post/127482/

Если вы новичек в React, и этими данными пользуется только один компнонент, то redux и прочие я думаю лишним. Советую сделать так: родитель, который является хранилищем для данных, и записывает/читает localStorage. И в нем компонент, которому даются данные, а он уже разбирается с фильтрацией.

<ChildComponent notes={ this.state.notes } onAddNote={ this.addNote } />

componentWillUpdate(props) {
  this.filterNotes(props.notes);
}

(кратко про себя)
Все лежит в папках: компонент + стиль. Собирается webpack'ом. Но у меня react-проекты.

(длинно, но вроде бы по делу)
Если относительно долго занимаетесь - у вас скорее всего уже выработались части, которые похожи - их выносите. Так же скорее всего у вас есть одинаковая структура (обычно это js/css/images и html, либо как вы пишите компонентами (отдельными папками) внутри котороых html + стили и может js ). Делайте шаблон для будущих проектов, в первую очередь удобным для себя - ведь вам с ним работать, а в нем реализуйте то что умеете по-максимуму (жмите картинки, оптимизируйте js и т.д)

Плагины, которые используете для Gulp, просто проверьте в блэклисте, а так же можете посмотреть новые версии. Вообще, хорошо если вы знаете все свои плагины, в таком случае - вам и этот пункт можно не выполнять.

кажется, что не использовал это все на 100%

Всем так кажется, поэтому когда не хочется заниматься работой, идем в гугл и смотрим опен-сорс проекты других людей: gulp, wepback, затем если нашли что-то любопытное идем в npm/github читаем доку. Пытаемся применить в работе.

Что имеем в итоге?
1) если все работает и вас устраивает (скорость сборки, удобство проверки в разных браузерах ...) - "работу работать";
2) если есть время и желание - гуглите опен-сорс решения, читайте твиттер интересных людей / новостную подписку;
3) если хочется услышать мнение коллег, но при этом коллег рядом нет - пишите статью на хабр. Просто статья: я использую такие-то плагины в своем "шаблоне" - вряд ли получит лестные отзывы, но возможно кто-то напишет: вот в этом месте у вас плохо, сделайте иначе. Возможно, вы придумаете, как написать статью интересно - тогда честь и хвала. И критика. А обоснованная критика всегда хорошо.

P.S. если используете Jade и следуете BEM-методологии, то я бы порекомендовал посмотреть на этот проект

Использовать bem, ну хотя бы именование классов по БЭМу.
Адаптивность.
seo+meta теги.
Валидность верстки + если есть товары, то тоже разметка для ПС и seo(item-price и т.д.)

+ лучше всего набирать максимум https://developers.google.com/speed/pagespeed/insi...

используйте jade/pugjs для сборки html.

Теперь про то, что написали Вы:
sass, gulp, bootstrap, flex, es6, jquery.
bootstrap и flex?
Серьезно? Зачем? Это как-бы из разных миров. Если используете flex - возьмите просто секту, https://github.com/kristoferjoseph/flexboxgrid, например

>es6, jquery
Тоже выглядит забавно.
Либо уж используйте просто jquery+его плагины.
Либо полностью пишите свои свистелки и перделки на ES6.
Но тут стоит задуматься, что вашему соискателю важнее - умение быстро в продакшн(jquery) или умение писать js код(es6).

Удивить можно:
1) скоростью загрузки
2) знание css - многие анимации сделать в css да и оформление "графики" максимально в css
2б) flex, SVG и пр…
3) микроразметка сайта
4а) минимальный вес сайта
4б) подключение уже готовых скриптов не из файла на сервере, а с https://cdnjs.com/ https://maxcdn.bootstrapcdn.com/bootstrap/…/bootst...
5) максимально использовать знание htaccess
Хотел уже закончить, но вернулся:
САМЫЙ ПЕРВЫЙ) используйте иконки!!! для каждого блока информации своя иконка и в меню тоже должны быть иконки
Сейчас заказчик требовательный пошел, ему важно, чтобы информация была максимально визуализирована, а иконки позволяют надолго записать суть информации в сознание ))
Вам простят единицы измерений, но не простят отсутствие иконок