Всегда был сторонником работы с git в командной строке. Думаю, это помогает лучше понимать этот инструмент, а также позволяет не зависеть от GUI IDE. В статье я приведу набор команд, которыми приходится пользоваться при работе с git и кратко поясню их назначение.

Список дополняется...

Сегодня я хочу рассказать, как отправить файлы на сервер из html-формы. Обычно эта процедура не вызывает никаких затруднений: кодировка multipart/form-data у формы, input type="file" и все. Остается принять файлы на сервере и скопировать их в нужное место.

Но мы сделаем интереснее, отправим файлы с помощью ajax, без перезагрузки страницы. А также посмотрим, как валидировать файлы на клиенте и сервере, а именно проверять максимальный размер загружаемых файлов и допустимые расширения.

В этой небольшой заметке я расскажу о том, как склеивать (или сквошить) коммиты в git. Также совсем немного затрону тему работы в vim.

В предыдущих частях статьи про сборку фронтенда мы поговорили про основы сборки и написали простое тестовое приложение на backbone + require.js.

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

Внимание, это не статья по основам основ gulp! Предполагаю, что Вы знаете, что такое nodejs и npm. Если не знаете, то лучше предварительно погуглите, что это такое и как это все поставить. Установка nodejs, npm и gulp займет у Вас 5-10 минут. А теперь к самой статье.

В предыдущей статье мы договорились разобраться, как собирать фронтенд с помощью gulp. Но предварительно нужно сделать тестовое приложение для того, чтобы было что собирать. В качестве примера сделаем простенькую страничку на Backbone. Управлять модулями будем с помощью require.js. Работать с dom поможет добрая jQuery, а с данными - lodash. Подгружать html-шаблоны мы сможем с помощью requirejs-text.

Так как приложение тестовое, я не буду уделять внимание функциональности - все предельно просто. Обычная страничка с парой текстов и картинкой. Мы создадим одну модель, представление view к ней, загрузим html-шаблон и отрендерим все это добро. Предполагаю, что Вы уже знакомы с Backbone и Require.js, поэтому подробно каждую строчку расписывать не буду. Код очень простой, но все-таки без знания основ этих библиотек не все будет очевидно.

Если Вы не знакомы с Backbone, но интересуетесь созданием Single Page Application в целом и этой замечательной библиотекой в частности, оставляйте комментарии в статье, что-нибудь придумаем :-)

А теперь к делу.

Уже давно инструменты сборки фронтенда перешли из разряда экзотики в необходимую часть работы над проектом. Я хочу поделиться некоторыми наработками по части организации проекта, его структуры, рассказать, какие задачи я решаю с помощью сборки и какими инструментами. Мы напишем небольшое тестовое приложение в связке Backbone + Require.js. Настроим окружение для работы над проектом в режиме "девелопмента" и "продакшена", посмотрим на их отличия. И в конце напишем задачи для сборки проекта с помощью инструмента сборки gulp и его плагинов.

Будут рассмотрены такие вопросы: работа со стилями sass с использованием sourcemaps, склеивание и сжатие js-файлов, сборка requirejs с помощью rjs, препроцессинг html, очистка и копирование файлов, оптимизация изображений, поднятие локального веб-сервера и режим наблюдения - watch-таски.

Свершилось! Заключительный урок серии "Фильтры в интернет-магазине". В статье доработаем некоторые детали, чтобы придать каталогу завершенный вид. Мы узнаем, как обновлять список брендов и цены при смене категории, а также некоторые другие вещи. Начинаем.

Пятый урок серии будет очень невелик. Настолько, что сначала я хотел включить его в заключительный урок серии про фильтры. Но все-таки решил выделить отображение товаров в браузере в отдельную статью. Этот урок будет очень позитивным в том плане, что небольшие усилия позволят нам, скажем так, "вживую" увидеть результат своей работы: меняем настройки фильтров в браузере и сразу видим отфильтрованный каталог. В принципе это и есть цель всей нашей работы. В заключительном же, шестом уроке, я расскажу о нескольких специфических вещах, которые требуют не столько написания кода, сколько разъяснения, зачм этот код нужен. А пока быстро пройдем пятый урок и полюбуемся, что у нас получится.

В предыдущем уроке мы научились собирать данные на клиенте и отправлять их на сервер. А на сервере написали заглушку в том месте, где должны возвращаться товары, отфильтрованные по введенным параметрам. Сейчас мы избавимся от заглушки и напишем пару методов и запросов, которые вытаскивают из базы нужные товары и возвращают их клиенту. Урок достаточно короткий. Приступаем

Мы добрались до третьего урока серии, посвященной фильтрам в интернет-магазинах. Сейчас мы научимся собирать данные на клиенте и отправлять их на сервер. На сервере напишем небольшую заглушку, возвращающую нам какие-то сведения. Как и предыдущие уроки, этот представляет собой логически завершенную часть, по прохождении которого Вы увидите законченный результат.