Роман

В вебшторме для этого в Settings есть раздел Editor -> File and Code Templates
Можно настроить под себя
Или найти готовый.
Вариант под реакт

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

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

При этом вам нужно будет:
1. Использовать vuex - чтобы хранить данные в стейте
2. Писать логику поиска/сортировки/фильтрации/пагинации на фронте

Есть замечательная статья на Хабре про архитектуру приложений. Пока это лучшее, что попадалось
Создание архитектуры программы или как проектирова...

Там есть и критерии хорошей архитектуры, и декомпозиция, и инверсия контроля и много чего другого.
А затем вам эти подходы нужно будет применить в js.

Одно дело, когда мы используем Redux для React'a, так как в последнем в руте у нас просто компонент, который свои состояния посылает в другие компоненты через props.

Вы не поверите, но Vue - это тоже просто рутовый компонент :)

"React навязывает хорошие практики, Vue дает слишком много свободы и новичку проще накодить с душком"

На самом деле, на реакте/редакс можно писать так же плохо, как и на всем остальном :)
Если вы хотите из верстальщика перейти в JS - то я бы смотрел на Vue. Вам будет проще. А параллельно будет учить сам JS, SOLID, ООП, т.е. то, что нужно разработчику вообще, как таковому, а не только JS.

И тогда уже вам легко будет разобраться и в реакт/редакс и в любом другом фреймворке.
Желаю успехов.

П.С. Хорошие практики вам может привить Тим Лид, который будет ревьювить ваш код и подсказывать как лучше писать.

Если вы на каждую строку вешаете someClass - то имеет смысл повесить его только на родительский элемент, а для
tr написать селектор, который будет их стилизовать
.someClass tr { .... }

Нужно дебажить ))
1. Убедиться, что вы этот токен получили от сервера: в хедере или в куках.
2. Если получили - тогда искать, в каком месте не отправляется

Зачем замыкания и такая вложенность функций в данном конкретном случае ?

function celebrityIDCreator (theCelebrities) {    
    return theCelebrities.map((celebrity, index) => {
        celebrity.id = 100 + index;
        return celebrity;
    })
}

не ?

Хорошим решением может быть использование Observable - а точнее BehaviorSubject.
Он в отличие от Observable всегда возвращает последнее сохраненное значение.

Вы инициализируете приложение, берете код из локалСторедж и помещаете его в BehaviorSubject.
Все остальные компоненты подписываются на него и получают последнее значение.
Если в какой-то момент, значение изменится (незнаю, пользователь выбрал другой язык) - вы опять помещаете его в BehaviorSubject и все подписанные на него компоненты (слушатели) будут уведомлены об изменении

// Behavior Subject

// инициализируем где-то в сервисе и помещаем первое значение 
bSubject = new BehaviorSubject("a"); 

// создаем метод который будет возвращать наш инстанс bSubject 
getSubject = () => return this.bSubject

// В компененте инжектим сервис, вызываем метод getSubject и подписываемся
bSubject.subscribe((value) => {
  console.log("Subscription got", value); 
// Тут выполняем действия при смене языка 
});

// Позже в другом месте пользователь меняет язык и мы сохраняем его опять в поток 
bSubject.next("c"); // Subscription got c

Используйте логический операнд "ИЛИ"

Если ( ( клик был не по нашему блоку и не по его дочерним элементам ) ИЛИ (клик был не по блоку, который его открывает ) ) {
// Делаем то, что делаем
}

Если у вас есть корневой роут - можно на его уровне зарезолвить данные (список статей) - и они будут доступны на всех вложенных роутах

Быстродействие приложения закладывается на этапе дизайна.
Конкретно в вашем случае UI выглядит жутко перегруженным. Технически можно добиться быстрой реализации, но, кажется это в целом не спасет ситуацию.

А что вас собственно интересует - Форма регистрации ?

Вроде, нашел вариант с thunk
Он может диспатчить вызовы функций. Получилось что-то типа:

fb.initCore().then(
      () => {
        dispatch({
          type: FB_LOADED_SUCCESS,
        });

        dispatch(getUserStatus());
      },
      () => {
        dispatch({
          type: FB_LOADED_FAIL,
        });
      },
    );

где getUserStatus импортируется из UserActions.
Наверное, стоит вынести всю эту кухню в middleware и комбинировать там, тогда экшены станут почище )

Если вам нужен всего один и единственный App - то используйте модуль.
А если у вас набор из разных App - то их как раз правильно будет создавать в виде экземпляров класса App.
Вас скорее всего смутило, что и в первом и втором примере - методы описаны одинаково ) Но паттерны, как таковые овершенно разные и служат разным целям

Если правильно понял ваш вопрос и речь идет об использовании внешних скриптов, расположенных, например, в CDN - то я подключал через $script.js - JS loader & dependency manager

Вот пример с подключением Facebook SDK (на 2016 г. правда, может уже что-то получше придумали)