Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community!

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript

Ryan Bucci
Ryan Bucci
7,553 Points

Need Advice On MERN Web App

So I have this idea (one of many) but I don't know how best to implement it, either using a MongoDB or Objects.

I'm going to create a web app where individuals can select one item from a dropdown list, and depending on their selection, it will auto-populate various fields on the web app. For instance, if a person selects a Bicycle, they'd then auto populate the color: red, wheel size: 17 inches, etc.

How should I best go about creating all the data for the drop-down selections? Should I just use objects, and then fill in the auto-populated fields in the web app based on dot notation within the object using key-value selections, or should I do this with a Mongo Database somehow?

Ideally, upon the completion of the web app, I will then allow those users to create a profile and save the information on their profile.

It'll be the first time I come up with MY OWN full stack web app using MERN, so any advice is much appreciated, thank you!

2 Answers

Ken Alger
STAFF
Ken Alger
Treehouse Teacher

I see this as a great use case for MongoDB. You could store each item in the "catalog" as a single document with lots of different attributes. Your application would then only have to make one call to the database to get the item. Having to "look up" the attributes based on the base item could result in some performance issues.

Post back if you're still stuck.

Ken

Ryan Bucci
Ryan Bucci
7,553 Points

Hey Ken, thanks for responding to my question and that makes sense! When you say performance issues, I take it you mean it'd be a slightly slower response time to auto-fill the rest of the web app, instead of just using the front-end JS objects with key-value pairs in the browser-client. Is that what you mean? In that case, I'd imagine I'd rather just use the front-end JS key-value object pairs to speed up performance. Is that a correct assumption?

Ken Alger
STAFF
Ken Alger
Treehouse Teacher

There are multiple ways this can be done, right?

With a MongoDB data store, you could structure a document as follows:

{
   "_id": <ObjectID>,
   "type": "bicycle",
   "product_name": "Super Bicycle",
   "color_options": ["red", "blue", "black"],
   "size_options": ["17in", "19in", "26in"],
   "price": { "value": NumberDecimal("199.95"), "currency": "USD"},
   "description": "The world's best bicycle for under $200.00 (USD).",
   ...
}

Then your application could handle pulling all of the data for the product at once. No joins, just a single trip to the database and it would have "all" the information about "Super Bicycle" and parse through that on the front end.

I'm not sure what you mean by:

Should I just use objects, and then fill in the auto-populated fields in the web app based on dot notation within the object

That seems like a lot of hard coding of the objects somewhere and a reduction in flexibility. Pull info from the database and parse it. Then if something needs to change in "Super Bicycle" it's easier to do.

Ken

Ryan Bucci
Ryan Bucci
7,553 Points

Alright that makes way more sense. Thank you!!