Mixed Messages: Surf Prediction

Hi everyone,
I created a message generator that tells you how your surf session will be today. :wink:
This is my first project trying putting HTML, CSS and Java together.
It took me 3 days, maybe a total of 10h.
I also tried using Git for the first time.
What I don’t quite understand is the connection between my local repository and the one on Github. After I finished the files on my computer, I created a new repository on Github and then pushed my local repository to Github from the command line. But what if I then need to do some more changes? Would I do the changes on my local repository and then somehow update from there the Github repository? How can I do that?
I hope my question makes sense and someone can help me with this.

I would also greatly appreciate any feedback to my files.

Here is the repo: GitHub - JuliaNena/Message-Generator

And here is the site: Go Surf!

Thank you,
Julia

Hi Julia,

If you pushed your repository to Github from your terminal then the connection should be established. All you have to do to update it when you make changes is this:

  1. git add . - This adds all the files to the staging area. If you want to just add one file it’s: git add filename.

  2. git commit -m “” - This is you commiting/saving the changes to your local repository. In-between the quotes you’ll want to add a short descriptive message of the changes you’ve made.

  3. git push - This is you updating the repository in Github.

All there is to it!

By the way, I had a look at your script file and nice work! I like that you added a frontend to it, rather than having the output just be in the terminal. I might implement something like that too.

1 Like

I really enjoyed that you expanded the project by actually building a one-page app that generates the message on the click of a button.

Not that it’s super necessary given the size of this project, but if you had wanted, you could have abstracted the generation of a random number into a separate function so that each function only accomplished one task. That way, if you had needed to use the random number generation for another function, it would be easy to call it anywhere.

Something like:

let generateRandomNumber = limit => Math.floor(Math.random()*limit)
1 Like

Thank you so much for taking time to respond!

I just tried “git push” out. I first got an error but was able to work through it. Apparently I did a change on the Github version and first needed to pull that to the local version. Then I could push the new changes to Github. Slowly making little progress in using git… Thank you again and let me know if you end up doing a similar project. I’d love to see it!
Greetings, Julia

Thank you so much for taking time to respond!
That is a good point! I didn’t even think of that. Would you recommend in general to write functions so that each function only accomplished one task? I guess I was maybe trying to write as few lines as possible. But it makes sense, especially if you need that task for a different function again. I will keep that in mind! Thank you again!
Greetings,
Julia

Hey Julia,

Sometimes it can be superfluous to abstract functions and have each perform single tasks, but other times it can help if you need to scale or change parts of your code, and sometimes, it can make for even “cleaner” and more readable code.

For example:

let arrList = [openerArr, punArr, closerArr]

let generateRandomNum = n => Math.floor(Math.random()*n)

let selectRandomMessageComponent = array => array[generateRandomNum(array.length)];

let createMessage = () => arrList.map(arr => selectRandomMessageComponent(arr)).join('\n');

By separating out functions, in 4 lines of code, I have the entire primary functionality of my code. As long as you’re familiar with array iterator methods like .map(), it’s super easy to read and understand what each line is doing.

1 Like