Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

chore: convert football teams card to lab #589

Open
jdwilkin4 opened this issue Sep 13, 2024 · 2 comments · May be fixed by freeCodeCamp/freeCodeCamp#56129
Open

chore: convert football teams card to lab #589

jdwilkin4 opened this issue Sep 13, 2024 · 2 comments · May be fixed by freeCodeCamp/freeCodeCamp#56129
Assignees
Labels
Frontend Cert Labs Team This work is for the labs team only

Comments

@jdwilkin4
Copy link
Contributor

We currently have this workshop in the JS beta version
https://www.freecodecamp.org/learn/javascript-algorithms-and-data-structures-v8/learn-modern-javascript-methods-by-building-football-team-cards/step-45

As I was working on updating it and adding it to main, I found myself essentially recreating a lab. so it just makes sense to convert this to a lab.

I propose we keep the HTML and CSS as is except we will remove the <p>Sport: <span id="sport"></span></p>. The sport will always be football (or soccer as known to our american friends 😄 ) We will also remove the <option value="nickname">Nicknames</option>

For the JS, we wan test that they create their own footballTeam object with the following properties:

  • team, year, headCoach and players.
const footballTeam = {
   team: "team name goes here",
   year: year goes here (number type),
   headCoach: "coach name goes here"
   players: array of objects goes here
};

Players will be an array of objects and we can test that they create at least four objects with the following properties:

 {
      name: "Name goes here",
      position: "position goes here",
      isCaptain: boolean
    },

We should test that the position value should be either "forward", "midfielder", "defender", or "goalkeeper"

As for the rest, we should only care about testing for the existence of the object properties and for the correct data types for the values

Then we can test that the team name, year and head coach values that come from the object are displayed on the screen

Screenshot 2024-09-13 at 7 46 12 AM

Lastly, we will test that they build out a filter function to filter by position or all players.

Screenshot 2024-09-13 at 7 55 20 AM
@jdwilkin4 jdwilkin4 added Frontend Cert Labs Team This work is for the labs team only labels Sep 13, 2024
@ilenia-magoni ilenia-magoni self-assigned this Sep 16, 2024
@ilenia-magoni
Copy link
Contributor

We will also remove the <option value="nickname">Nicknames</option>

what about the number property/option? You list position, name and isCaptain only, but also do not mention removing number

@jdwilkin4
Copy link
Contributor Author

yeah, i just forgot to mention removing that.
removing all relevant HTML that isn't tied to the following

   {
      name: "Name goes here",
      position: "position goes here",
      isCaptain: boolean
    },

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Frontend Cert Labs Team This work is for the labs team only
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants