SimpleMVC.js
A highly opinionated MVC micro web-framework for Node.js
Examples
-
Shows the basic use of routing, views, static files, and the SimpleMVC.SMTP class.
-
Simple SaaS - Coming Soon
Utilizes all parts of the SimpleMVC library (routing, views, json responses, static files, SMTP, and Membership)
Quick Start
This quick start assumes atleast a base familiarity with Node.js, NPM, and how to build a website.
-
Initialize your NPM package
npm init
, and fill out the questions -
Include simplemvc.js in your project
- By downloading and including simplemvc.js manually in your project.
- Through npm by running
npm install simplemvcjs
-
Create and/or open app.js
-
Import/Require SimpleMVC
const SimpleMVC = require('simplemvcjs');
or if you downloaded the project
const SimpleMVC = require('/path/to/simplemvc.js');
-
Create your first SimpleMVC.Controller
const HomeController = new SimpleMVC.Controller("/", { "": function() { return this.content("Hello, World!"); } });
-
Create your your SimpleMVC.App
const app = new SimpleMVC.App(); app.addControlers(HomeController); app.listen();
-
Create your
dotenv
file#server HOST=localhost PORT=8080 SESSION_SECRET= #database MONGO_SCHEME= MONGO_USER= MONGO_PASSWORD= MONGO_SERVER= MONGO_DB= #smtp SMTP_USER= SMTP_PASS= SMTP_HOST= SMTP_PORT= SMTP_SECURE=
-
Run it via
node ./app.js
Project Structure
While SimpleMVC is highly opinionated, we have a relatively lax project structure requirement. There is a specific structure for the core files required.
/.env - this is the dotenv file the sets your application's global variables
/app.js - this can be any name, but throughout documentation it will be refered to as your app.js
/views/ - the root directory for your view templates
/static/ - the root directory for your static files
These directories would be relative to your app.js
file and are required for finding specific views and static content.
Routing
Routing in SimpleMVC is defined by the combination of a base path (the first constructor parameter) and a routes dictionary (the second constructor parameter), and can then be expanded after initialization through the Controller.addRoutes()
function.
const HomeController = new SimpleMVC.Controller("/", {
"": function() {
return this.view('index');
}
})
Individual routes are defined as such:
HomeController.addRoutes({
"route/path": function(req, res) {
const model = { someProperty: "some value" };
return this.view('viewName', model);
}
});
In the previous example, if the controller's base path was defined as "/"
, the route would be /route/path
and the view file would be located at ./src/views/viewName
.
Views
Views are Mustache(5) templates. And when you return a view with a model from your route, the model will be accessed as {{model}} inside the Mustache templates.
All views need a .html
file extension.
A Simple Example
const SimpleMVC = require('../libs/simplemvc.js');
const BlogService = require('./services/BlogService.js');
const HomeController = new SimpleMVC.Controller("/", {
"": async function () {
const latestPosts = await BlogService.getPostsDesc(0, 10);
let view = {
title: "My Website",
posts: latestPosts,
};
return this.view('index', view);
},
"post/:id": async function (req) {
const post = await BlogService.getPost(req.params.id);
return this.view('single', post);
},
"about": function () {
return this.view('about', { title: "About Me" });
}
});
const app = new SimpleMVC.App();
app.initDbConnection();
app.addControllers(HomeController);
app.listen();