Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript Express Basics Serving Static Files in Express Merging the Design Files

Will Albertsen
Will Albertsen
13,155 Points
Posted by Will Albertsen
Will Albertsen
13,155 Points

I don't get the button hiding the hint

I'm wondering what part of the code renders the button that you can click to show the hint. I'm not able to find it.

2 Answers

Seokhyun Wie
seal-mask
.a{fill-rule:evenodd;}techdegree seal-36
Seokhyun Wie
Full Stack JavaScript Techdegree Graduate 21,606 Points
Seokhyun Wie
.a{fill-rule:evenodd;}techdegree seal-36
Seokhyun Wie
Full Stack JavaScript Techdegree Graduate 21,606 Points

You can find the part in /public/js/app.js from the last folder named S6V3_Challenge_Complete inside the project folder flashcards, which you've downloaded. Also for the people who have an error message on VS code regarding the CSS file given, check the .card-flip-wrap section. There's a colon instead of a semicolon.

===== added answer ===== For some others who may have a problem, which you cannot click the 'hint' button, it happens because of the CSS file. If you inspect with the Google Dev-Tool .card-flip-wrap(the flip icon) is literally covering the large amount area where the button is located. Add the z-index property as below so that you push down the flip icon and you'll be able to click the button.

.card-flip-wrap {
  position: absolute;
  bottom: 10px;
  left: 20px;
  padding-left: 500px;
  z-index: -999;
}

Check my git repo for more information. It works perfect for me.

I hope Treehouse resolve these minor errors in this part and ensure that the downloaded project works after we set up with npm install.

Hope you guys who have been struggling with it find these answers helpful.

Mike Straw
Mike Straw
7,100 Points
Mike Straw
Mike Straw
7,100 Points

Where does that /public/js/app.js file come from? My understanding was that all those came from the design files, but the design files I downloaded in the "Adding Static Assets to the App" video has no JS files at all.

Did this get removed somewhere along the way, or was there a task to add it that I missed?

Henry Blandon
seal-mask
.a{fill-rule:evenodd;}techdegree seal-36
Henry Blandon
Full Stack JavaScript Techdegree Graduate 21,521 Points
Henry Blandon
.a{fill-rule:evenodd;}techdegree seal-36
Henry Blandon
Full Stack JavaScript Techdegree Graduate 21,521 Points

Mike Straw If you look at the teacher's note section. The last tab on the right is the Download tab. Click that tab and then you can download the projects files. That mean all files, the complete working project. He dint covered that portion in the video. is a bonus challenge. Below are the instructor comments.

Bonus Challenge "You may have noticed the finished app in the video has a feature we did not create in this course. In the video, the hints are hidden until the user clicks a button to show them. The challenge described below will be to implement this feature!"