Where to logic?

Motivation

me: Did you know that you can return HTML from a method in a mongoose schema?
also me : I did not.
me : Sure. I just tried it out, now, you can use methods like item.getSummaryContainer() to get your summary container HTML.
also me : Cool.runs off to create a bunch of methods to return HTML, deletes if/then statements in views and replaces with method calls

minutes pass

also me: Wait, but why?
me: blinks

Discussion

So many times as a developer, I've come up with some new (to me) idea and then jumped in with two feet only to later wonder if perhaps the idea was not so good. Actually deciding is hard and requires experience that not all of us have.

My current rendition of a new and fun, but perhaps not good (or maybe it is) idea is as good as any to drive the conversation about how developers should approach these "Wait, but why?" decisions. I don't personally have the answers, but I hope that discussion in the comments will help suss it out.

Setup

I gave a bit of it away in the motivation - what if we return HTML from mongoose schema methods. For this example, we have a Mongo Express Node stack. I'll show two code approaches to one very simple display if/then. Assume in both cases that user.things are returned as part of the response from the server.

Logic in EJS

When the logic is in the EJS, the schema is just the variables (or other methods, but none shown here for simplicity), and the HTML is broken by if/then statements.

thing.js

const mongoose = require('mongoose');

const thingSchema = mongoose.Schema({
     name: { type: String },
     description: { type: String },
     cost: { type: Number }
 });

module.exports = mongoose.model('Thing', thingSchema);

userthings.ejs

<% include ./partials/header %>
<div class="container-fluid">
  <div class="col-12 col-md-8 mx-auto">
    <div id="upcoming">
      <h2>Things</h2>
      <div class="row">
        <% user.things.forEach(function(thing){ %> 
          <div><h1> <%= thing.name %> </h1>
            <% if (thing.sold) { %>
              <h5> was sold for <%= this.cost %> </h5>
            <% } else { %> 
              <h5><%= this.description %> for just <%= this.cost %></h5>
            <% } %>
            </div>
        <% }) %>
      </div>
  </div>
</div>
<% include ./partials/header %>

Logic in Mongoose Schema

When the logic is in the schema, the HTML is not clear from the EJS page, but the page is clean.

thing.js

const mongoose = require('mongoose');

const thingSchema = mongoose.Schema({
     name: { type: String },
     description: { type: String },
     cost: { type: Number },
     sold: { type: Boolean )}
 });

thingSchema.method({
    printinfo: function () {
      let theinfo = '<div><h1>'+this.name+'</h1><h5>'+this.description+' for just '+this.cost+'</h5></div>'
      if (this.sold) {
        theinfo = '<div><h1>'+this.name+'</h1><h5> was sold for '+this.cost+'</h5></div>'
      }
      return the_info
    }
});

module.exports = mongoose.model('Thing', thingSchema);

userthings.ejs

<% include ./partials/header %>
<div class="container-fluid">
  <div class="col-12 col-md-8 mx-auto">
    <div id="upcoming">
      <h2>Things</h2>
      <div class="row">
        <% user.things.forEach(function(thing){ thing.printinfo(); }) %>
      </div>
  </div>
</div>
<% include ./partials/header %>

Ultimately, both return the same HTML and present the same results. Which is better? Is one more correct? Why? I think it is possible that the answer may be "just do what feels right for you" but I don't actually know. I'd like to know how folks work this kind of stuff out.

Game Plan

My game plan at this point is to continue to try, fail, and try again with things. I will continue to read to learn about others' ideas and to share when new things come along to excite or surprise me. I love that the dev community can be so supportive and creative in this wild and free land of the interwebs.

I hope that you, fellow devs, will put your ideas on how devs, especially less experienced devs, can make choices like this, below.

Comments

[Abraham Brookes]

I really don't know the platform you're talking about or anything but I would like to chime in, because I think you're talking about the overarching concept of systems design, and the little choices we make.

I guess generally my main choice-guiding concepts when making "the little choices" are (in order):
User experience
Code maintainability
Optimization

The bottom dollar is 'will it make the user have a better time', closely followed by 'will I have any idea how this code works next time I look at it' loosely within the realms of 'does it run quick'. At the end of the day it's your system so it's your call (although maybe have a talk with your co-developers about it if possible).

Dunno what you're doing over here, but that's my two cents :)

[Jess Chandler]

Yes - I was looking at the overarching concept and just this one option as an example. For this particular example, I think it does not change the user experience. The page will be the same.

How do you determine what is more maintainable? I'm not sure.
On what do you optimize? I'm not sure.
:)