File Directory

The skeleton of Truman actually comes from the outline of another Node.js project (https://github.com/sahat/hackathon-starter).

That repository has a lot of helpful and relevant information on the libraries, organization, setup, and FAQs on web development. Feel free to read through their README.md as well for a more expansive understanding of the project structure.

The Truman Platform (Truman) is a web application that uses a Node.js, MongoDB, Express.js and Pug templating engine webstack.

The Model View Controller (MVC) framework

The project follows a basic MVC (Model View Controller) framework. The Model-View-Controller (MVC) framework is an architectural/design pattern that separates an application into three main logical components: Model, View, and Controller. Each architectural component is built to handle specific development aspects of an application.

• The View components handles all the user interface logic for the application. It generates the user interface for the user.

• The Model components handles all the database schemas, i.e. it defines what the database "structure" looks like and defines what information is stored.

• The Controller components handles the interaction between the views and the models (i.e. between what appears to a user of an application and the database). The controller components act as intermediaries.

  • The controller receives input from the view, uses logic to translate the input to a demand for the model, the model grabs the data, then the controller passes data from the model back to view for the user to see in a nice display.

More information about the MVC framework can be found online if you are interested.

Project Structure

The main node application (that defines the express server, connects to the MongoDB, and defines all the routes) is in app.js.

Below is a breakdown of the project files, with the name of each file and a brief description of each file's purpose.

Name	Description
config/passport.js	Passport Local and OAuth strategies, plus login middleware. Handles login authentication of email and passwords.
controllers/actors.js	Controller for actors.
controllers/helpers.js	Helper Controller methods.
controllers/notification.js	Controller for platform notifications.
controllers/script.js	Controller for feed and user behavior.
controllers/user.js	Controller for user.
models/Actor.js	Mongoose schema and model for Actor.
models/Notification.js	Mongoose schema and model for Notification.
models/Script.js	Mongoose schema and model for Script.
models/User.js	Mongoose schema and model for User.
input/actors.csv	csv file defining the simulation actors (see here)
input/notification (read, like).csv	csv file defining the simulation notifications (see here)
input/notification (reply).csv	csv file defining the simulation notifications (see here)
input/posts.csv	csv file defining the simulation posts (see here)
input/replies.csv	csv file defining the simulation comments on the posts (see here)
post_pictures	Directory containing all the files of the post photos
profile_pictures	Directory containing all the files of the actor profile photos
public/	Static assets (fonts, css, js, img).
public/css/notification.css	Main stylesheet for notifications.
public/css/script.css	Main stylesheet for the social media timeline / feed (ex:posts).
public/css/ui_layout.css	Main stylesheet for the app.
public/js/actor.js	Client-side JavaScript for actor profile pages.
public/js/main.js	Client-side JavaScript for the app.
public/js/notification.js	Client-side JavaScript specific to the notification components and functionalities.
public/js/postFunctionalities.js	Client-side JavaScript specific to post interactions (ex: liking/disliking and flagging posts and comments, adding comments).
public/js/profile.js	Client-side JavaScript for profile forms (on Sign Up and Update Your Profile pages)
public/js/script.js	Client-side JavaScript for feed/timeline
views/account	Folder containing the templates to pages related to a user's/participant's account
views/account/forgot.pug	Template for Forgot your Password page
views/account/login.pug	Template for Login page
views/account/profile.pug	Template for user's Update My Profile page
views/account/signup_info.pug	Template for Tell Us a Little More About Yourself page, shown initially upon user's sign up
views/account/signup.pug	Template for Sign Up page
views/partials	Folder containing the templates of partial components. These components are not complete pages, but rather components of the interface that appear in multiple places or repeatedly. Defining the components in one file and then including it with the code "include <filename>" when needed reduces code redundancy and maintains consistency across components.
views/partials/actorPost.pug	Partial template for an actor post
views/partials/ui_flash.pug	Partial template for error, info and success flash notifications.
views/partials/ui_header.pug	Partial template for header (navigation bar)
views/partials/userCard.pug	Partial template for user card (displayed on timeline and displayed on user's Profile page)
views/partials/userPost.pug	Partial template for a user's post
views/actor.pug	Template for an actor's Profile
views/actors.pug	Template for the Actor Directory page. Only accessible to admin users.
views/com.pug	Template for the Community Rules page.
views/completed.pug	Template for the Completed page.
views/error.pug	Template for the Error page.
views/info.pug	Template for the Welcome to EatSnap.Love! page
views/me.pug	Template for the Welcome to EatSnap.Love! page
views/notification.pug	Template for the Notifications page
views/script.pug	Template for the Timeline/Feed page
views/test.pug	Template for the Test Timeline/Feed page (same as above). Can be used for testing purposes.
views/tos.pug	Template for the Terms of Services page
views/ui_layout.pug	Base template. All templates extends (or are based off of) this template.
.dockerignore	Folder and files ignored by docker usage.
.env.example	Example template of .env file (to be copied and Your API keys, tokens, passwords and database URI.
.env	Environment variables file, where database URI, and other simulation components are defined.
.gitignore	Folder and files ignored by git.
app.js	The main application file.
data-export.js	JavaScript file that exports basic user information for each user on the site, into a readable csv file.
docker-compose.yml	Docker compose configuration file.
Dockerfile	Docker configuration file.
package.json	NPM dependencies.
package-lock.json	Contains exact versions of NPM dependencies in package.json.
populate.js	JavaScript file that populates the database with the csv files in the /input folder.

Below are libraries that Truman uses and references to each library’s documentation.

Pug.js: https://pugjs.org/api/getting-started.html

• Why do we use Pug?

  • Pug.js is a templating language rather than raw HTML. Most sites use some kind of templating language rather than raw HTML.

  • Using a templating language decreases the likelihood of bugs and security risks. It also is easier to write code in this templating language than in raw HTML.

Semantic UI: https://semantic-ui.com/

• Semantic UI is a front-end development framework that helps create beautiful, responsive layouts using human-friendly HTML. Almost all of our components are borrowed and customized from Semantic UI.