Правильно ли я понимаю как работает webpack и NPM?
webpack позволяет делать препроцессинг js и других зависимостей, таких как стили, графика и т.п. Во сколько файлов компоновать - настраивается под конкретные нужды проекта.
Сам webpack работает на ноде, но его работа нужна только в режиме разработки. Результаты сборки в nodejs не нуждаются, вы получаете собранные файлы (js, css, html, ...) которые будете отдавать статикой.
Делать сборку руками однозначно моветон. Хотя, конечно вы все можете сделать руками, даже экзешник в hex-редакторе набрать, но так уже давно никто не делает :)
Запаковка всех зависимостей в один файл - оптимизация времени загрузки, экономится время на соединение с сервером, а передаваемый объем даже уменьшится т.к. большой файл в gzip-нутом виде занимает меньше чем 20-30 частей его составляющих сжатых по отдельности.
require вы сможете использовать если будете использовать webpack. Если без него, то смотрите common.js
Я использую requirejs, который подтягивает все js, html(text -  плагин для шаблонов) файлы по ajax и кэширует их. Есть еще requirejs optimizer, который умеет минифицировать, склеивать в один файл  все файлы зависимостей. 
Минус работа с css не очень понятная и придется вынести это в gulp.Пример: https://github.com/rishatsharafiev/crm/tree/api/pr...