dmz9

есть концептуальные, есть инструментальные (утилитарные).

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

инструментальные или утилитарные фреймворки - это скорее набор отверток, пассатиж и напильников. не нужно "как то по-особому" ими пользоваться. единственная цель их существования - обеспечить однообразное выполнение определенных простых действий либо сделать "шорткаты" (сокращения) длинно-кодов в короткие понятные команды. самый простой пример - jquery. просто набор полезных утилитарных функций, хорошо делающих своё дело, и предоставляющих однообразный интерфейс.

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

за файлами должен кто то смотреть, watcher. вотчер обычно это часть сборщика.
например сборщик gulp.
поэтому чтобы он стал смотреть за файлами и выполнять конвертацию в .js после изменения файлов (т.е. после сохранения) надо его запустить из консоли в той папке где лежит файл gulpfile.js (если используется gulp).
бывает так что среда разработки (IDE) сама умеет запускать сборщик после изменений файлов, но для этого надо в нее интегрировать gulp, указать его исполняемый файл. в каждой по своему.
так что никакой магии нет - если сборщик не запустился то он и файлы не перекомпилировал.

было дело, приходилось такое мутить.
есть какой то плагин но можно на js накидать своё, не найду свои сорсы.
далее с джиквери
вобщем, по document.ready берем каждую такую таблицу, оборачиваем в обёртку от конфеты.
обёртка должна быть с прокруткой горизонтальной (overflow-x).
после того как конфетка завёрнута append после обёртки кнопку. либо, если кнопка уже должна существовать - надо каждый раз проверять - а находится ли обёртка рядом с кнопкой, чтобы, при клике на кнопку прокручивалась именно ближайшая обёртка а не все подряд. если же кнопку создаем под каждую таблицу - просто вешаем хендлер .click(function(){}) а внутри каждый раз меняем прокрутку обёртки.
по сути, прокрутка вбок - это всего лишь scrollLeft у контейнера-обёртки. сама таблица как была так и есть.
этот скролл может иметь фиксированый размер в пикселях либо можно снимать ширину с родителя и типа скролить "на всю ширшину родительского контейнера". это достаточно универсально, можно еще чуть меньше сделать, чтобы следующий "слайд" всегда "продолжался" на 15-20 пикселей и было ощущение реальной прокрутки.
также, через джиквери этот самый scrollLeft можно еще и анимировать, добавляя например эффект "swing". тогда всё будет работать еще более badass!
плюс, так как это ж майфун, можно навешать на обёртку touch - ивенты, чтобы на лапание пальцами экрана прокрутка тоже отрабатывала.
---------------------
карусель (слайдер) тут не поможет - таблицу на слайды нельзя разбить.
---------------------
если таблицы совсем простые - без смердженых ячеек - есть плагин responsiveTables или типа того. тупо делает из широкой таблицу более узкую но меняет местами вертикальные-горизонтальные строки. читабельно. но если есть ячейки с colspan/rowspan - косячит

попробуй указывать в путях "текущую папку" где лежит файл
"./my-icons.html"
точка - это текущая папка.
./my-icons.html эквивалентный my-icons.html но может сработать