раз ум мы говорим о взаимодействии gulp и webpack то речь идёт о написании spa.
const bs = require('browser-sync').get('ddd');
const gulp = require('gulp');
const header = require('gulp-header');
const filter = require('gulp-filter');
const changed = require('gulp-changed-in-place');
const webpack2 = require('webpack');
const webpackStream = require('webpack-stream');
const paths = {
src : path.join(config.root.src, config.webpack.src, `/main.js`),
dist: path.join(config.root.build, config.webpack.build)
};
let wpConfig = require('../webpack.config.js');
gulp.task('webpack', function () {
let f = filter(['*.js'], {restore: true});
return gulp.src(paths.src)
.pipe(webpackStream(wpConfig, webpack2))
.on('error', notify)
.pipe(changed({firstPass: true}))
.pipe(f)
.pipe(header(config.header.js, {updated: (new Date()).toUTCString()}))
.pipe(f.restore)
.pipe(gulp.dest(paths.dist))
.pipe(bs.stream())
});
$(function () { // выполнять после построения DOM (страница загружена)
// обрабатывать будем события отправки всех форм с атрибутом data-toggle="ajax"
// например
// <form action="form.php" method="post" data-toggle="ajax">
$('[data-toggle="ajax"]').on('submit', function (e) {
e.preventDefault(); // отменяем отправку браузером
let $form = $(this); // сохраняем форму в переменную
let $button = $('[type="submit"]', $form); // находим кнопку сабмит внутри этой формы
let data = $form.serialize(); // собираем данные из всех полей
let action = $form.data('action') || $form.attr('action'); // получаем URL куда будем отправлять (form.php из action формы)
let method = $form.attr('method'); // тут метод отправки GET/POST
let response = $form.data('response') || 'html'; // тип ожидаемого от сервера ответа, если не задано - простой html
$button.attr('disabled', true); // дизаблим кнопку сабмит
// генерим событие "щас будем отправлять форму".
// это опционально, я просто код дернул из проекта.
$form.trigger('beforeSend');
// ну тут вроде знакомый jQuery метод
// передаем туда все данные что только что насобирали и отправляется запрос.
$.ajax({
url : action,
type : method,
data : data,
dataType: response
}).then(function (data) { // успешно отправлено, получен ответ в data
$button.attr('disabled', false); // включаем кнопку отправки
$form.trigger('success', [data]); // генерим событие успеха на форме.
// тоже опционально, можно прямо здесь писать что нужно сделать при успехе.
}).fail(function () { // отправка не удалась, ошибка
$button.attr('disabled', false); // включаем кнопку отправки
$form.trigger('error'); // генерим событие ошибки на форме.
// тоже опционально, можно прямо здесь писать что нужно сделать при успехе.
});
});
});
Но вы правы, проект айтишный (как и bem.info), аудитория соответствующая. Им можно на гридах уже раскладку строить =)