Построение переднего плана Assemble.io в сборке ExpressJS

Question

Принесите меня, в настоящее время изучая следующие технологии.

Я создал базовое приложение, состоящее из сборки NodeJS + ExpressJS + MongoDB + Monk + Jade. Я намерен заменить Jade Handlebars, другим шаблоном. Чтобы помочь с этим, я думал о внедрении Assemble.io, так как это статический генератор сайтов, который использует Handlebars, и он создает хорошую основу для начала работы с фреймворком Bootstrap. Мне также нравится, что Assemble прекрасно разделяет файлы на макеты, шаблоны и частичные.

Целью этого приложения/сайта является извлечение данных из MongoDB и отображение их на интерфейсе. Интерфейс будет состоять из 100 различных страниц контента, поэтому их нужно будет легко поддерживать. Разумеется, мне также нужны четкие отличия от интерфейсного и внутреннего кода.

Что может быть самым логичным способом создания чего-то подобного? Можно ли реализовать сборку с помощью ExpressJS? И если да, то как мне настроить свои представления в app.js для отображения файлов сборки? Или было бы лучше установить view engine на руль и вытащить ссылки CDN в Bootstrap? (Но если бы я сделал это, как мне настроить макеты, шаблоны и частичные?)

Answer 1

Существует несколько различных подходов, которые вы можете предпринять.

1. Предпроектные структуры страниц с сборкой при сборке. Затем используйте front-end javascript для загрузки данных и отображения динамического содержимого.
2. Используйте сборку api на серверных контроллерах для загрузки шаблонов и данных и отображения содержимого во время выполнения.
3. Как и в случае с (2), переопределите встроенный класс View в экспресс и выполняйте загрузку и рендеринг с их сборкой.

Я бы пошел с # 2 прямо сейчас, поэтому вы можете использовать сборку api непосредственно для загрузки шаблонов, данных, помощников, промежуточного программного обеспечения и т. Д. В ваш app.js. Затем создайте render функцию, которую можно использовать в маршрутах, чтобы взять страницу и сделать ее ...

var express = require('express'); 
var Assemble = require('assemble'); 

var app = express(); 
var assemble = new Assemble(); 

// setup middleware 
assemble.onLoad(/\.hbs/, function(file, next) { 
    // so something if needed 
    next(); 
}); 

// load helpers 
assemble.helpers(['path/to/helpers/*.js']); 
// load async helpers 
assemble.asyncHelpers(['path/to/async-helpers/*.js']); 

// load templates 
assemble.layouts(['path/to/layouts/*.hbs']); 
assemble.partials(['path/to/partials/*.hbs']); 
assemble.pages(['path/to/pages/*.hbs']); 

// load global site data 
assemble.data(['path/to/site.json']); 

// render function to make looking up and rendering pages easier 
function render(name, locals, cb) { 
    var view = assemble.getView(name); 
    if (!view) return cb(new Error('Unable to find "' + name + '"')); 
    view.render(locals, function(err, result) { 
    if (err) return cb(err); 
    cb(null, result.content); 
    }); 
} 

// setup some express routes 
app.get('/', function(req, res, next) { 
    render('index', {title: 'Home Page'}, function(err, content) { 
    if (err) return next(err); 
    res.status(200); // I don't remember this api off the top of my head 
    res.send(content); 
    }); 
}); 

Надеются, что это помогает.