Cat Photo App Workshop

I was able to add the “See more” wording before the image and the “in our gallery” wording after the image, but my efforts didn’t pass the test.

I’ve used html for years and can generally accomplish what I need; so I’m going to suggest that the instructions for this workshop challenge are inadaquate. For example, where - exactly - do you want the wording placed? Do you want it in paragraph tags?

This lack of clarity in expressing the expectation and constant negative reinforcement by saying that the code is in error without suggesting what’s wrong with it frustrate your students.

FWIW, I’m 83 years old and wrote both interpreted code (FORTRAN) and compiled code (COBOL/PL1/BAL) more than 50 years ago. My career progressed from programmer, to project leader, to manager, to analyst, to IT director to CIO/CTO before I retired. I taught scores of people many different subjects and learned a great deal about teaching and programmed instruction. If whoever created this lesson module had worked for me, I’d make him redo it to give far better feedback to the student. The lack of positive feedback and corrective guidance encourages the student to abandon the course.

While it’s true that the course if free - a highly laudable offering and inspired undertaking - that does not exonerate poor practices, IMO.

The reason that your code is failing this particular challenge is because you added paragraphs when you were only told to add the words. If you insert only the provided text, the tests will pass.

It looks like you are trying out the Beta curriculum. Our beta testers are an invaluable part of our community. Not only do they help find and fix bugs, but their early experience with the lessons allows the team to make adjustments before the curriculum replaces the older version. If you would like to suggest an improvement in the lesson’s wording you can open up a GitHub Issue. Whenever opening an issue, please check first that there isn’t already an issue for it and provide as much detail as possible. If you have a clear idea of how to improve the wording, you can even make the code change yourself and open an PR and proudly call yourself a freeCodeCamp contributor.

1 Like

Thank you for a timely and meaningful response.

Your response makes my point about using PI (programmed instruction) - it requires effective, positive feedback to cause learning.

The module at question should include checking for tags that were not asked for and responding with something like “Try making changes without markup tags” Even better would be for the module to recognize the tags used and reference them, as in, “Try making changes without the

tags.” Better still would be to congratulate the student on using tags. FWIW, I tried responses in the module both with and without tags and still could not get past the error.

As for choosing how to respond and make suggestions for impovement, where are the guidelines in the module? Wouldn’t it make sense to have a popup telling the student to use the GitHub Issue link after repeated negative response?

I hope you can appreciate that I’m not engaging in keyboard rants but am trying to offer constructive criticism.

The testing that is done on the individual lessons (especially the html lessons) are a complex beast. If you’ve ever worked heavily with regular expressions and building grammar parsers, you can probably imagine. The tests do offer some hints or tips for common mistakes, but it’s not exhaustive. There are thousands of individual lessons, each with their own tests. The lessons and test results are also then translated into several languages.

After tests fail three times, an option appears to ask for help. This will help you create a topic on the forum that includes your code solution and prompts you to describe the problem and what you’ve tried. Then, human peers can do a much better job than a rules engine of helping you find the issue or help confirm that there’s actually a bug in the tests and help show you the ropes on reporting that bug. Often someone here already knows if the bug has been reported. The freeCodeCamp pedagogy is designed for community involvement to be part of the learning process. We’ve chosen not to invest the time and energy to create comprehensive and centralized documentation, but instead focus on making it easy to ask questions.

2 Likes

no, the wording will have to go exactly before the anchor tag, and exactly after.

Do you think it needs specifying that it has to be on the same line?

If you have a better way to explain that you need to add two words right before the anchor element, and the three words right after, please suggest so. You are not asked to add an element, you are asked to add only text

1 Like

Makes sense. Doesn’t mean that the module can’t be improved.

sure, what would you suggest? what way would have let you understand what you needed to write?

" You are not asked to add an element, you are asked to add only text"

You provided the answer yourself. If those instructions had been in the module, instructions would have been clearer.

Those instructions are in the module though? Are you asking that the instructions explicitly tell you not to do anything that you aren’t asked to do?

2 Likes

I’ve slept more than twice since starting this thread. I don’t recall the exact text in the module and don’t wish to waste the time to go back, begin the module again and capture the exact wording. I DO recall that I tried various ways of doing what the instructions asked including using and not using the tags and placing the text requested in various lines. No matter what I did - remember I’m and old programmer and have tested many lines of code - I could not get past the message that my changes weren’t correct.

I know that computers respond literally; I tried to respond literally to the instructions but received no hints about what was wrong. It seems to me that if the string entered were parsed and revealed any gt or lt characters, it would have been appropriate to give a response that no tags were asked for. If the requested text was positioned incorrectly, or spelled incorrectly, a response to ‘check placement of words’ or to ‘check spelling’ would have been appropriate.

My biggest issue is that encountering an impassable block so early in the course creates frustration and disincentive to continue; therefore extraordinary effort should be put into the module by its creator to avoid it. Again, I have created a number of PI courses in my career, many years ago. I understand both the practices and the principles of using it and a bit about lesson construction. I offer these suggestions based on that experience, not just to ‘dump’ on the module. I hope the critique is useful and not just an annoyance.

Ok… so can you say exactly what you personally would change in the instructions?

1 Like

As I said before, I think if words like those cited above had been included I would have twigged to the solution.

I have another idea for the lessons:
Why not count the number of incorrect responses; and, when it reaches 5, display display the correct solution with the incorrect version beneath it. This is a technique I learned in a lesson construction class about 30 years ago: don’t frustrate the student by demanding responses when he continues to give incorrect one.

Positive reinforcement (displaying the correct and incorrect side by side) is a far better teaching technique than is raising frustration by demanding too many attempts. Another part of that same old lesson was to give another similar test on the same matter after allowing him to study the good/bad response. This should lead to success and reinforce learning the lesson. After passing the alternative test, let the student move to the next module; otherwise you risk driving him away from the tutorial completely.

Such changes would, IMO, improve the overall quality of your courses without negatively affecting the course or certification upon its completion.

Just giving the answer that the student doesn’t understand is pretty useless. I’m dubious that telling students not to do things that aren’t in the instructions will help much?

1 Like

you don’t need to, you can go to step 12 at any time to see what’s in there https://www.freecodecamp.org/learn/full-stack-developer/workshop-cat-photo-app/step-12
It says “add the words”, that doesn’t include any tags in that

how would you write the regex for that? It’s not as trivial as you try to make it to be

that’s probably never going to be implement, but once you reach 3 wrong answers the help button appear and that allows to open a forum post where people can help you

so we should create an alternate lesson for each step? it seems a lot of work, when we have already lots of work to do. This is an interactive course, not one where you have a teacher handing out problem sheets.

I agree that the step should be improved, but until now you have not provided anything that is actionable

1 Like

So, suggestions are a futile process.

It’s your opinion that the suggestions warrant no action, not a fact, just as my opinion that you can improve is an opinion. I’ll bet that mine is based on a lot more experience.

I’m baling on this course. There are others, perhaps better ones, even. I don’t wish to spend time with closed minds. I have too little time left to waste it.

I know each of those steps, lectures, workshops, quizzes, can be improved, we are working on it right now. I just have no idea how to improve that step given your vague suggestions. It should be improved, I see people asking for help on it every day. If you have any idea on how to detect the addition of unwanted tags you have all my attention. If you can suggest a better wording that you think would not have tripped you up, you have all my attention.
Contributions from the people that are learning through the curriculum are extremely important, because once you already know one thing it’s difficult to know if something explain it well.

2 Likes

I owe you an apology. As you stated, it is my opinion, as you have yours, and the forum is meant for exactly as you are doing, sir! Keep your head up and do make it better.
All the best in 2025.

I believe the point Mr. or Mrs. ahraitch is pointing out, is this: more context is needed for programmers. While going through the course, it is understood that adding words in HTML is by using “<p.>” or “<h#>”. Someone seeing “add the words” can assume the prompt is asking to “add these words by using the HTML text functions”, even if it’s not emphasized or described in that way.

I believe the best way to improve this, is to have it where after 3-5 attempts, a disclaimer or a hint saying “you are not required to use

or any <h#> when typing out the words” is shown, allowing someone to know that you are not asking them to include them when typing these words out. This could help clear the confusion, as I myself was typing out “<p.> See More</p.>” and was getting confused as to why my answer was wrong.

Thanks for hearing me out!

1 Like

I found something at the W3Schools webpage that I think would improve the lesson modules in tutorials here. They show a button that when clicked shows the correct solution to the problem posed. I think this should be adopted here. Perhaps each lesson module (test) could produce a ‘show answer’ button after the respondent failed a number of times (perhaps 5 or 6). This would prevent the frustration I experienced when I tried multiple answers adjusting for syntax and none worked.

I really don’t think just handing users an answer they don’t understand is very useful