Week 3 (completed)

Week 3 was our personal project week, so no new concepts were introduced but it did require us to utilize all the previous concepts that we have learned. At first, I thought it was kind of uneventful and mellow but come to think of it, it was actually a critical week. It not only reaffirmed the choice that I made in attending a bootcamp. It also reaffirmed that I am heading in the right career/life direction. I was sleep deprived but happy. I stayed up every night until 1 AM just to code. I keep making excuses like “after I finish this part I’ll definitely go to sleep” or “just 15-30 more minutes” It was such a good feeling, I was obsessed with my project. I know it wasn’t the best or the most complex but it was extremely fun to work on. Here is a screen shot of it down below:

I got the idea for the game after looking up a tutorial for a simple Rock, Paper, Scissors game. I thought to myself “Pokemon is just a fancier Rock, Paper, Scissors. Why don’t I just add some sprites from my previous lab projects and make it pretty with some CSS”. It turned out better than I expected, and I have to thank the amazing super smash bros background for that. The functions in the project was half from tutorial and half mine. The user input (the elemental buttons) codes were mine, with the assistance from my camp’s TA as well.

Concepts that I have learned from week 3:
I didn’t learn any new concepts from week 3 but working on the project really solidifies my understanding of HTML, CSS and Javascript. I learned that you can just create one function that can select a different indexes from an array and use the value in that index. Here is the code snippet:
setUserChoice = (idx) => { this.setState({ playerAsh: this.state.pokemons[idx] }) }
This is the code that helped me understand how to create a user input for player Ash (the actual user on the right) to select one of the three pokemon inside the array to battle.
I also learned a cool CSS trick that can help me move and position things around the page. Here’s the code for that! objectYouWantToPosition {
position: absolute (or relative);
right (or left): XXpx; top (or bottom: XXpx;
}

Another cool JS function that I’ve learned this week from practicing is
array.map(x=>x * 2)
To be fair I did learned this before but it didn’t stick but now it did (go figured lol). With that code, we can essentially turn the index to any other number without changing the original array! WOWWOWOW! What an age to be alive!??!? Ok I’m done. Good night!