dframework includes a built-in routing system for creating single-page applications with client-side navigation.
To enable single-page routing, simply run the command dstrn config and select "yes" when prompted with use the web history router?.
After this, a new router.js file will be created in the root directory of your project.
You can create template HTML files and load them, as well as reload page scripts, when navigating to a new route.
To define a new route, use the following structure:
// router.js
router.on('/xxx', function () {
render("views/xxx.html", ["public/js/xxx.js"]);
});
This code defines the /xxx route, renders the xxx.html template, and reloads the xxx.js script when the route is accessed.
When working with a single-page web application it is possible to customize the CSS transition that's played when switching pages.
To do so, you can simply create a custom render() function.
// router.js
const router = new dRouter('/');
router.controller = null;
const render = (template, scripts) => {
return new Promise((resolve, reject) => {
if(router.controller) { router.controller.abort(); router.controller = null };
router.controller = new AbortController();
const signal = controller.signal;
// your code to run at the start of the transition
fetch("../"+template, { signal })
.then(response => {
if (!response.ok) {
throw new Error(`failed to fetch ${template}: ${response.status}`);
}
return response.text();
})
.then(html => {
setTimeout(() => { // using fake delay for the animation (optional)
contentContainer.innerHTML = html;
const existingScripts = document.querySelectorAll("script[data-page-script]");
existingScripts.forEach(script => script.remove());
if (scripts && scripts.length > 0) {
let scriptsLoaded = 0;
scripts.forEach((url) => {
const script = document.createElement("script");
script.src = "../" + url + '?cachebuster=' + new Date().getTime();
script.dataset.pageScript = true;
script.onload = () => {
scriptsLoaded++;
if (scriptsLoaded === scripts.length) {
resolve();
}
};
document.body.appendChild(script);
});
} else {
resolve();
}
// your code to end the transition
}, 700);
})
.catch(error => {
reject(error);
});
});
};
// example route
router.on('/', function () {
render("views/index.html", ["public/js/index.js"]);
});
router.resolve();
This code defines the /xxx route, renders the xxx.html template, and reloads the xxx.js script when the route is accessed.
dframework provides a MongoDB API wrapper for easy integration with MongoDB databases.
To connect to your MongoDB servers simply open the file /functions/lib/MongoAPI.js and change the following files in the constructor:
// MongoAPI.js
this.servers = {
dev: "", // mongo server URL
prod: "", // mongo server URL
};
this.dbName = ""; // your database nameYou can also add more URLs if you own more servers and want to quickly be able to switch between them.
// import the MongoDB API
const { MongoAPI } = require('../functions/lib/MongoAPI');
// initialize the API
const mongo = new MongoAPI();
// example operations
async function saveUser(user) {
await mongo.connect();
const result = await mongo.insertOne('users', user);
await mongo.destroy();
return result;
}
async function getUsers(query = {}) {
await mongo.connect();
const users = await mongo.find('users', query);
await mongo.destroy();
return users;
}connect() - establish connection to MongoDBfind(collection, query, options) - find documents in collectionfindOne(collection, query, options) - find a single documentinsertOne(collection, document) - insert a documentinsertMany(collection, documents) - insert multiple documentsupdateOne(collection, filter, update, options) - update a documentupdateMany(collection, filter, update, options) - update multiple documentsdeleteOne(collection, filter, options) - delete a documentdeleteMany(collection, filter, options) - delete multiple documentsdestroy() - close connectionCopyright (c) 2025 dstrn
This work is licensed under the Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International License.
To view a copy of this license, visit https://creativecommons.org/licenses/by-nc-sa/4.0/.