Need help creating something in JavaScript


#1

So I am trying to create a roster type app in JavaScript, but I’m kinda lost at the moment. I’ve attached a mock-up to kind of give an idea of what I am trying to achieve. The app would have categories on the right, Actors & Actresses in my example, which would populate from a database, and on the left would be an image of the people, and their info would update as you clicked through them. I’m kinda lost on this though. Any help is greatly appreciated, even a link to a tutorial that does something similar would be appreciated. Thanks!

I used Burt Reynolds just because I thought it was least likely to offend anyone.


#2

Have you looked at something like Sails if you want pure JS?


#3

So my recommendation is that you prototype this whole thing in HTML, including how you click from one thing to another and what it looks like. Your best bet is to use NodeJS and Express (a simple javascript webframework) to do nothing more than server up the pages from a directory. You could even just put it on a web host of some kind as pure HTML.

https://expressjs.com/

Once you have this front-end worked out very well it’ll be a lot easier to then do the work of making each page and action actually do something. You’ll then expand expressjs for each page and make it do what you want until you’re done.


#4

So I was talking to some people I work with, developers much better with stuff than myself, and apparently all the data is in JSON, and so now I just have to get the JSON objects to populate the image and text fields, then have them update as people click through them. If there is more than one in a category it’ll show the left and right arrows under the image, and it not it won’t. Not 100% confident I got it, but between that, and the above suggestions, I at least have a place to start.


#5

That’d be easiest if they are doing it in JSON already. You can do your prototype a little easier then by getting a few samples of the JSON data, and setting it as a variable in your HTML prototypes. I’d make a file called “samples.js” or “tests.js”, and load that in the html. That file sets a variable and then you just pretend you are already working with the JSON API live, but prototype your UI.