В этой статье будет описано пошаговое создание фронтенда для прототипа SPA интернет магазина. Серверная часть которого написана на node.js с использованием express, шаблонизатора — twig, базы данных — NeDB, для обработки данных форм — модуль formidable, клиентская часть написана на htmlix.
Для тех кто не знаком с Htmlix, почитать основы построения приложений можно здесь.
Исходные данные для данного урока можно скачать здесь.
Это уже готовый пример, мы просто удалим из файла /static/js/front.js все что там есть и вставим вместо этого:
var State = { };
window.onload = function(){
///создаем экземпляр HTMLix
var HM = new HTMLixState(State);
console.log(HM);
}
Итак мы полностью удалили фронтенд из данного примера, и у нас остался сервер приложения, давайте разберемся как он работает:
- сперва нужно установить все модули которых сейчас нет, для этого введем в консоли: npm install
- далее ввести в командной строке node app
- затем перейти по адресу localhost:3000
Итак покликав по различным пунктам меню мы видим работающий сервер, без фронтенд части т.к. мы только что ее удалили.
Теперь заново поэтапно ее создадим, но для начала разберемся как работает сервер.
Читать полностью »
