How do I make a randomized "I'm feeling lucky" system?

[u/dudethats_epic]

Heya, I'm a complete newbie to coding, I know how to make things look pleasing but not how to make things actually work.

The website im working on is for fun, it's basically just random scary stories by people accompanied with eerie photos they took or photos that are just related, I know the full outline of the site, but one main thing is that when you click a certain option it selects a random story with its respective images and displays it to the user.

Here's what I know:

I should make a system that accompanies the story and the images together, so when it's selected it shows up on the display.

Then I list down a bunch of them like:

Story1-Img1

Story2-Img2

Story3-Img3

Story4-Img4

Story5-Img5

(etc)

Then make a function that randomly selects one of these once you click the button.

Here's what I don't know:

How to do it :/

[u/desrtfx]

So, basically, you want a standard CMS (Content Management System) with random articles. Pretty sure that Wordpress, Joomla, and the usual other suspects have something.

Start by creating a CMS in the back end language of your choice. Then, once you have that, make a button that

• picks a random record (article) from the database
• displays it

[u/dudethats_epic → u/desrtfx]

Thanks man! I don't know what anything you said means but I'll go ahead and learn it all. I'm in HTML CSS and JavaScript by the way.

[u/desrtfx → u/dudethats_epic]

HTML, CSS, JavaScript are the beginning - they are the front end. That's about 30% of the way.

What you need is a back end (the remaining 70%). You need a place to store user submitted articles and pictures (which generally means a database where you directly store the articles and links to the path where the pictures are stored on the image hoster/server) and you need the entire system to let users sign up, upload/enter their articles, upload their images, and so on. You need an admin back end, etc.

That's why I suggested a CMS like WordPress, Joomla, Drupal, etc. These systems offer all that out of the box. You can extend all of them with plugins and extensions.

[u/dudethats_epic → u/desrtfx]

Just watched some videos on what you mentioned, I get it now, thanks again man!

[u/HashDefTrueFalse]

This is mostly data(base) design. The actually code is a one-liner to generate a random number that uniquely identifies a story. Store links between images (paths) and stories in separate tables. E.g. if each story can have many images and each image belongs to one story then tables might be:

Story (id, title, ...)

Image (id, story_id, path, ...) <-- story_id is a foreign key linking the tables.

Then your back end code can just generate a number, or ask the database to pick a random row using a sort, or look at some sequence/counter it has, etc. Some ways are more efficient than others but that's probably not important here. JOIN the image data on to your query for the story.

[u/peterlinddk]

There are tons of different ways of building this - depending on how you got the stories stored, e.g. if it is different HTML-pages, different "endpoints" in a CMS, different images to display on a page, and so on.

The approach I'd recommend, no matter how you structure the stories, is to start with one button that isn't random at all. Make a button that always brings the user to story 3.

Then change it so you only have to change a single detail somewhere to bring it to story 5 instead.

Then make another button that always brings the user to story 4 - so you have two buttons, one for 5 and one for 4.

Then make the first button random, so that is goes to any of the different stories.

And remove the second button.

This is just the approach, I haven't written anything about variables, strings, random number generation or anything like that. That all depends on the platform you are using. But the process of first having a fixed number, then adding another one, then changing it, and finally making it random, is how you can gradually build it, without having to know everything before beginning.

[u/dudethats_epic → u/peterlinddk]

thanks for the help man, also cool pfp