Find Your Hat Challenge Project (JavaScript)

Hello, this is my solution for the project, I know there are ways to improve my solution but I need to go further with the course so I’ll keep it simple for this time , with no extra tasks solved.

I’m really confused about this project. I’m 39% of the way through the full stack developer course and am genuinely unsure if there’s been some mistake in the course layout or something. This is billed as the final project for JS classes but they seem like the smallest aspect of the project, which seems to use several other coding techniques which I don’t remember being taught anywhere else on the course?

I have no idea whatsoever how I’m supposed to suddenly start incorporating user input. Also the sudden use of interacting with x & y axis on a drawn board feels like it’s come out of nowhere. Even looking at the solution code I’m struggling to see how I was supposed to know how to use syntax like:
’ field = []) ’
new Array(height).fill(0).map(el => new Array(width))
this.locationY -= 1;

Looking at this thread I can see there are people that have managed to complete this task but I’m gobsmacked as to how to be honest, not sure if it’s related to which course you’re doing, and where this project comes up in it? Maybe I’m just dense, or have somehow completely blanked on a previous lesson, but although there have been some challenging modules before I’ve never:
a) Had no idea where to even begin with a project, or
b) Had no idea how to do it even after seeing the solution code.

It would be one thing if I’d previously been walked through a simpler game first, or if maybe the user input/board stuff was filled out somewhere and it was a case of correctly incorporating them into the classes. But this exercise felt like being asked to jump off a 50ft diveboard in your 3rd swimming lesson; sure you might need to be able to get out the pool afterwards, but that’s hardly the biggest challenge of the lesson!

1 Like

There’s a few projects that are a bit of a jump, or seem to show up earlier than they should, and sometimes the walkthroughs use more advanced syntax than we’re ready for at that point.

If I recall, there was something about user input before this point (using event listeners) and there was something about using ‘while’ loops, which you can use in the game. But yeah, it is one of the tougher projects for these reasons. I think they mention it in terms of pair programming, to suggest you work with other people to try and get through it, and there’s a couple of projects where I think that may be a better approach.

Remember that the walkthrough isn’t the only way to do it. I don’t even think I ended up using an arrow function in my version.

I completely agree! I’m at the 39% point in the Full stack course too, and it just comes outta nowhere! I whole-heartedly agree with every single point you made. Especially your ‘never before have I …’ a/b scenario.

I’m looking at the solution now after a day and a half on this - only just managing to get to task 4 - - - And have no idea how i’m supposed to have done what they have. I understand each of these DIY projects can be done in many different ways, but if their solution doesn’t give you any further understanding, then there is little use in it.

Sure I can sit here for hours picking apart their solution, but it’s not necessarily the code I don’t understand (map, switch etc.) it’s why and when to use such things for this very particular type of game input.

If they decide to throw us in the deep end on a JS Class mission, I’d rather it be heavily involved in some back-end program, that allows user input/upload etc. rather than a node based game that feels a little more fitting for another course.

Personally, I cam going to skip this one and come back to it else I’ll be spending a lot of time not learning a great deal…


Same here! It would be useful to have one of the “Experienced developer walks you through the challenge” videos, but I can’t find one?


I agree as well. I was completely unprepared to even approach this. IMO the project ask was way above and beyond the previous lessons (back end engineering route) and did not cover much of the Classes aspects of js . My solution is mostly a re-write of the Codecademy solution.