About the Portfolio Project: Mixed Messages category

Hi there, the link to my repo is here Mixed Messages repo and is open to collaboration from others. Reply with your github username and ill add you as a collaborator.

Initially I found this difficult. I am okay with the basic concepts of JavaScript. ie. loops, objects, arrays, methods etc. However after reviewing the example from codecademy, I am lacking in creativity.

Also, I found it hard to get somebody to collaborate with me, so I ended up doing this solo.

Excellent implementation! I think codecademy need to review the formatting of Codebytes though. It’s a little hard to navigate the code.

1 Like

Nice work on this, and thanks for sharing. Definitely good for a laugh to see your prediction

Just a question: I’m curious why you didn’t use quotes [declared on line 20] rather than repeating your random generated quote (i.e. using ${quotes3[randomNo(quotes3)} ) when logging your result in the if/if-else/else statement.

I was able to do this relatively quickly with my own understanding of the project, but in reviewing the code, noticed I may have misunderstood the tasks a bit. So, I tried re-producing the code using arrays as a 2nd version, which I found tricky to wrap my head around, but eventually got there.

Thank you, i used VS code but for some reason the vertical guidelines are still there when i copied the code. May be that is why they are a little hard to read.

Thank you for your feedback :smiley:
When I did the if/else statement first I was doing like this:

if (quotes1[randomNo(quotes1)] > 28 && quotes2[randomNo(quotes2)] === ‘February’) {
console.log(On ${quotes1[randomNo(quotes1)]} of ${quotes2[randomNo(quotes2)]} ${year} you will ${quotes3[randomNo(quotes3)]}.)
}

So I realized that the condition inside the if (quotes1[randomNo(quotes1)] > 28) was generating a random number and if the condition was true the console.log(`On ${quotes1[randomNo(quotes1)]} was generating another number, and that was not good, because I needed the same number that was compared inside the if statement.
After I decided to store them into a variable to have the same value for the if condition and the console.log.
But the ${quotes3[randomNo(quotes3)} was not inside the if condition, and didn’t need to use the variable that was stored in, that’s why I didn’t used it.
I hope you understand what I’m trying to say. :sweat_smile:

Hi! The name’s Camille

Here’s my entry for the mixed message project:

The experience was generally fun. I created just a positive vibes fortune cookie program. It was overall fun problem solving. I ended up writing short concise code that’s content wise expandable. Took about 1 hour.

Added in some HTML so if you download it and refresh the browser it should change! Have fun!`

Appreciate any suggestions for improvements or if there’s any concerns!

Hi! This is my Mixed messages portfolio project. It was hard coming up with the messages but the programming itself was fairly easy.

I really liked your approach, and found it easy to follow. It also spurred a bit of a thought whether it could be even more concise (it already was quite concise!), with a need only for one object. I just played a bit with your code to eliminate your 3 functions within the object to pick words using functions (instead picking them using const variables), and then eliminate the 2nd object entirely by returning the sentence right away. With that, I could get your code down to 17 lines inclusive of the comments and white space. With a few quick tests it seems to work, so thought I’d share for interest, and in case you had any comments to share about why you chose your approach. I’m getting an appreciation that combining steps isn’t always the best way in coding, so would be keen to learn more.

// messages object
let mixedMessages = {

    // arrays to create a nonsensical sentence
    character: ['Sahith', 'Nikhil', 'Kashish', 'Shiva', 'Neo', 'Shay', 'Paviesh', 'Sheevam', 'Parth', 'Yuvan'],
    verbs: ['jumping at', 'a bug who gave a hug to', 'able to talk with', 'taking a walk to', 'playing pool with', 'at Halal Guys with'],
    connectors: ['a park', 'the bear', 'a computer', 'all the bees'],

    // Methods to get a random element from each array
    getSent() {
        const char = this.character[Math.floor(Math.random() * this.character.length)];
        const verb = this.verbs[Math.floor(Math.random() * this.verbs.length)];
        const connec = this.connectors[Math.floor(Math.random() * this.connectors.length)];
        return `${char} was ${verb} ${connec}`;
    }
}

// to log the random sentence
console.log(mixedMessages.getSent());

Hey! thanks for the input. I decided to make separate methods for each of the arrays for testing purposes. I am trying to build a solid foundation in step-by-step programming (to avoid logical errors that don’t show in the terminal). I like the conciseness of your corrections and will be implementing them soon. I am also looking to update the file with conditionals for messages that make more sense! Further, should I make one local/remote repository for all Codecademy projects or continue making them separate?

My solution on github: https://github.com/vargajozsi/mixedMessagesKanaban/blob/main/gogo.js
and the code:

const words = {
    first: ["Jingles", "Holly", "Kringle", "Buddy", "Snowflake", "Twinkle", "Ginger", "Trixie", "Noel", "Tinsel", "Winter", "Rudy"],
    middle: ["the merry", "the playful", "the frosty", "the festive", "the jolly", "the little", "the snowy", "the nice", "the glittery", "the sparkly", "the joyvial", "the lively"],
    end: ["Angel", "Evergreen", "Ornament", "Tinsel", "Cookie", "Snowman", "Gumdrop", "Sleigh bells", "Cupcake", "Reindeer", "Candy cane", "Garland"]
}


//Generate random word from element of words along the parameter
function randomWords(threeFrom) {
    const numFromWords = Math.floor((Math.random() * threeFrom.length));
    return threeFrom[numFromWords];
};

console.log(`What is your random ELF name ? You are: ${randomWords(words.first)} ${randomWords(words.middle)} ${randomWords(words.end)} `);

Here’s my personal attempt at the project: jlema/mixed-messages: Codecademy mixed-messages portfolio project (github.com)

It was fun to work on a program to randomly generate mixed-up philosophy quotes. It took about 2 days - one to research, plan, visualize and setup my dev environment and version control, and another to actually complete the coding.

Running the program

After cloning the repo locally, run:

node mixed-messages.js

Example run:

$ node mixed-messages.js
That which does not kill us makes us stronger.
Epictetus, scholar of Empiricism, 1738

Here is my mixed_messages project . Get an answer from a random Star Trek officer GitHub - EliMullan/mixed_messages

code here :

JS :

const messages1 = [

'Magnificent human,',

'You beautiful creature,',

'Amazing Earther,',

'Creature of fire and blood,',

'Leader of animal kingdom,'

];

const messages2 = [

'keep calm...',

'think about it...',

'listen to this echo...',

'there is wisdom all around you...',

'look up to the stars...',

'the stars are whispering...'

];

const messages3 = [‘Logic is the beginning of wisdom, not the end.’,

‘Live now; make now always the most precious time. Now will never come again.’,

‘Continue the petty bickering. I find it most intriguing.’,

‘You may find that having is not so pleasing a thing as wanting. This is not logical, but it is often true.’,

‘Insufficient facts always invite danger.’,

‘Make it so!’,

‘Perhaps man wasn\’t meant for paradise. Maybe he was meant to claw, to scratch all the way.’,

‘We can\’t avoid the future.’,

‘Respect is earned, not bestowed.’,

‘Flair is what marks the difference between artistry and mere competence.’,

‘The only person you\’re truly competing against is yourself.’,

‘Fear is the true enemy. The only enemy.’,

‘In critical moments, men sometimes see exactly what they wish to see.’,

‘Compassion: That\’s the one thing no machine ever had. Maybe it’s the one thing that keeps men ahead of them.’,

‘Sharing an orbit with God is no small experience.’,

‘I would gladly risk feeling bad at times if it also meant that I could taste my dessert.’,

‘Patience is sometimes a more effective weapon than the sword.’,

‘Change is the essential process of all existence.’,

‘Sometimes a feeling is all we humans have to go on’,

‘If we’re going to be damned, let’s be damned for what we really are.’,

‘Leave bigotry in your quarters; there’s no room for it on the bridge.’,

‘The prejudices people feel about each other disappear when they get to know each other.’,

‘Things are only impossible until they are not.’,

‘If we resist, we die. If we don\’t resist… we die.’,

‘Madness has no purpose. Or reason. But it may have a goal.’,

‘You mind your place, mister, or you\’ll be wearing concrete galoshes.’,

‘Confidence is faith in oneself. It can\’t easily be given by another.’,

‘Engage!’,

‘A lie is a very poor way to say hello.’,

‘A species that enslaves other beings is hardly superior, mentally or otherwise.’,

‘A man either lives life as it happens to him, meets it head-on and licks it, or he turns his back on it and starts to wither away.’,

‘Humans do have an amazing capacity for believing what they choose — and excluding that which is painful.’,

‘It\’s not safe out here. It\’s wondrous, with treasures to satiate desires both subtle and gross; but it’s not for the timid’,

‘You can use logic to justify almost anything. That\’s its power. And its flaw’,

‘Without followers, evil cannot spread.’,

‘They used to say that if man was meant to fly, he\’d have wings. But he did fly. He discovered he had to.’,

‘To all mankind: May we never find space so vast, planets so cold, heart and mind so empty, that we cannot fill them with love and warmth.’

];

const randomGenerator = arr => {

let randomIndex = Math.floor(Math.random() * arr.length);

return arr[randomIndex];

}

const starTrekAnswer = () => {

let question = document.getElementById('question').value;

let answer = document.getElementById('answer');

return question.length < 5 ?

answer.innerHTML = In order to get your answer, you must first ask your question.:

answer.innerHTML = ${randomGenerator(messages1)} ${randomGenerator(messages2)} <br> ${randomGenerator(messages3)};

}

HTML

<meta charset="UTF-8">

<meta http-equiv="X-UA-Compatible" content="IE=edge">

<meta name="viewport" content="width=device-width, initial-scale=1.0">

<title>Mixed messages - Fortune teller </title>

<link rel='stylesheet' href='style.css'>

<script src="app.js"></script>  
<div class="container">

    <img src="AdobeStock_264035229.jpeg" alt="starTrek" style="width:100%;">

    <div class="contentUp">

      <h1>Ask Star Trek Enterprise</h1>

      Ask your question here, and a Star Trek officer will answer <br>

      <input type='text' id='question' size='75'> <br><br>

      <input class="btn" type="button" value="Ask Star Trek" onclick='starTrekAnswer()'>

    </div>

    <div class="contentDown">

        <h3 class='text' id='answer'></h3>

    </div>



  </div>

CSS

  • {

    box-sizing: border-box;

}

body {

font-family: Arial;

font-size: 17px;

}

.container {

position: relative;

margin: 0 auto;

text-align: center;

}

.container img {vertical-align: middle;}

.container .contentUp {

position: absolute;

top: 0;

background: rgb(0, 0, 0); /* Fallback color */

background: rgba(0, 0, 0, 0.5); /* Black background with 0.5 opacity */

color: #f1f1f1;

width: 100%;

padding: 20px;

}

.container .contentDown {

position: absolute;

bottom: 30%;

background: rgb(0, 0, 0); /* Fallback color */

background: rgba(0, 0, 0, 0.5); /* Black background with 0.5 opacity */

color: #f1f1f1;

width: 100%;

padding: 20px;

margin: auto;

}

.btn {

border: 0;

line-height: 2.5;

padding: 0 20px;

font-size: 1rem;

text-align: center;

color: #fff;

text-shadow: 1px 1px 1px #000;

border-radius: 10px;

background-color: rgba(220, 0, 0, 1);

background-image: linear-gradient(to top left,

                                  rgba(0, 0, 0, .2),

                                  rgba(0, 0, 0, .2) 30%,

                                  rgba(0, 0, 0, 0));

box-shadow: inset 2px 2px 3px rgba(255, 255, 255, .6),

            inset -2px -2px 3px rgba(0, 0, 0, .6);

}

.btn:hover {

background-color: rgba(255, 0, 0, 1);

}

.btn:active {

box-shadow: inset -2px -2px 3px rgba(255, 255, 255, .6),

            inset 2px 2px 3px rgba(0, 0, 0, .6);

}

.text {

text-shadow: #FC0 1px 0 10px;

}

Hi everyone,

Here is my attempt at the “Mixed Messages” project:

I’ll be glad to get some feedback.

Cheers,
Barbs

Hello,
I just finished my simple message generator using an array of strings which are chosen at random using math random and math floor. I used bootstrap to make it look better and hosted it with github pages.

Repo: GitHub - Nathaniel-Dominguez/mixed-messages: Randomized message generator

Github Page: Galactic Transmissions!

Thanks for the feedback,
Nate

Wow not sure what Bootstap does but I wish I knew how to do that… Struggled for quite a while to make a simple alert button on my project.

Hey Friends, Just finished my Mixed Messages Project a random Haiku generator.

I went a bit overboard with the word database I think I have about 600 words to cycle through.

I spent about a full week, working out the logic to have each word randomly selected but to stay within rules of the poem.
Meaning 5,7,5 syllables.

  • I would appreciate some feedback on the math (i used a lot of stack overflow tutorials to calculate this).
  • I would love some feedback on my terrible HTML implementation that was a hack job. :slight_smile:

Thanks everyone this was super fun.

Github Repo

HTML not website website :smiley:

hi there
Just done with Mixed Message project you guys can take a look at it
happy coding link: GitHub - mooel/mixed-messages-project

:index_pointing_at_the_viewer: are amazing

I made a program who get you some excuse when you needed, the program works fine but the excuses … try your own risk .lol

I enjoyed make this project, was my first project who I put all html/css and js together, maybe my function can be more short and directly but this way I found easy and just works, I apreciatte if someone tell me if has a better way to do this.
It took me 2 days to complete the challenge and I’m happy with it, I thought it was going to be almost impossible for me and I kept avoiding it so as not to get frustrated, but here I am.

Here is the code, feel free to tell any feedback, I’ll love it!

repo : GitHub - ReginaGuermandi/MixedMessages
site on : Mixed Messages

Happy Coding!! :grinning:

Hi, all
Here’s a link to my project https://github.com/edemcudjoe/Mixed-Messages.git
I look forward to getting some feedback.