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.

Sign up for GitHub

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

Jump to bottom

feat: add reusable navbar workshop to main #57344

Open
wants to merge 3 commits into
base: main
Choose a base branch
from
Open

feat: add reusable navbar workshop to main #57344

wants to merge 3 commits into from
+2,139 −1

Conversation

Ksound22
Copy link
Member

Checklist:

Closes freeCodeCamp/CurriculumExpansion#649

@Ksound22 Ksound22 requested a review from a team as a code owner November 27, 2024 08:25
@github-actions github-actions bot added scope: curriculum Lessons, Challenges, Projects and other Curricular Content in curriculum directory. platform: learn UI side of the client application that needs familiarity with React, Gatsby etc. scope: i18n language translation/internationalization. Often combined with language type label labels Nov 27, 2024
@Ksound22 Ksound22 force-pushed the feat/add-reusable-navbar-workshop branch from e1f2756 to e604b8e Compare November 27, 2024 15:53
jdwilkin4
jdwilkin4 reviewed Nov 27, 2024
View reviewed changes
Copy link
Contributor

@jdwilkin4 jdwilkin4 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Probably won't have time today to pull this down and test it.
But here are a few things I noticed through a first glance for the steps and tests

client/i18n/locales/english/intro.json Outdated Show resolved Hide resolved
...s/english/25-front-end-development/workshop-reusable-mega-navbar/6740495ba48aa94e5667b436.md Outdated Show resolved Hide resolved
...s/english/25-front-end-development/workshop-reusable-mega-navbar/6740495ba48aa94e5667b436.md Outdated Show resolved Hide resolved
...s/english/25-front-end-development/workshop-reusable-mega-navbar/6740495ba48aa94e5667b436.md Outdated Show resolved Hide resolved
...s/english/25-front-end-development/workshop-reusable-mega-navbar/6740495ba48aa94e5667b436.md Outdated Show resolved Hide resolved
...s/english/25-front-end-development/workshop-reusable-mega-navbar/6745d9df333efe2543a1f457.md Outdated Show resolved Hide resolved
...s/english/25-front-end-development/workshop-reusable-mega-navbar/6745dce846995b2a466594be.md Outdated Show resolved Hide resolved
...s/english/25-front-end-development/workshop-reusable-mega-navbar/6745dce846995b2a466594be.md Outdated Show resolved Hide resolved
...s/english/25-front-end-development/workshop-reusable-mega-navbar/6745de9ce925b92d72df713a.md Outdated Show resolved Hide resolved
...s/english/25-front-end-development/workshop-reusable-mega-navbar/6745e2aca895c935168e7d91.md Outdated Show resolved Hide resolved
@bbsmooth
Copy link
Contributor

@jdwilkin4 Sorry, I wish I would have seen this sooner, but there are some accessibility issues that need to be addressed with this. Do you want me to leave them here?

@jdwilkin4
Copy link
Contributor

@bbsmooth

Yes, that would be awesome 👍

Sembauke
Sembauke requested changes Dec 2, 2024
View reviewed changes
Copy link
Member

@Sembauke Sembauke left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

In summary, calendar is a noun and sometimes a verb related to the system of organizing days for various purposes, while calender is a noun specific to an industrial machine used for pressing materials like paper and fabric. Proper use of these terms is essential to communicate effectively and accurately. While calendar has a presence in everyday life and comes in both physical and digital forms, calender is a specialized term that holds significance mainly in manufacturing contexts.

...s/english/25-front-end-development/workshop-reusable-mega-navbar/6745e2aca895c935168e7d91.md Outdated Show resolved Hide resolved
...s/english/25-front-end-development/workshop-reusable-mega-navbar/6745e2aca895c935168e7d91.md Outdated Show resolved Hide resolved
...s/english/25-front-end-development/workshop-reusable-mega-navbar/6745e2aca895c935168e7d91.md Outdated Show resolved Hide resolved
@Ksound22 Ksound22 force-pushed the feat/add-reusable-navbar-workshop branch from fde2ea5 to dc6b469 Compare December 3, 2024 09:00
jdwilkin4
jdwilkin4 reviewed Dec 3, 2024
View reviewed changes
client/i18n/locales/english/intro.json
Comment on lines +3594 to +3600
},
"workshop-reusable-mega-navbar": {
"title": "Reusable Mega Navbar",
"intro": [
"In the previous lecture videos, you learned how to work with components in React.",
"In this workshop, you will build a reusable Navbar component using React."
]
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This needs to be moved to the correct spot.
But also, the title needs to match the naming convention laid out for the other workshops.

curriculum/challenges/_meta/workshop-reusable-mega-navbar/meta.json
@@ -0,0 +1,56 @@
{
"name": "Reusable Mega Navbar",
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

the name will need to change here too to match the convention already laid out in the other workshops.

...s/english/25-front-end-development/workshop-reusable-mega-navbar/6745c732dbeb7c04f346e6f7.md
```jsx
export const Navbar = () => {
return (
<nav class="navbar">
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This should be className, not class.
It needs to be changed in all files

...s/english/25-front-end-development/workshop-reusable-mega-navbar/6745dce846995b2a466594be.md

# --hints--

You should create three new list items inside your `ul` element with the class `sub-menu`.
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

this should be className

@jdwilkin4
Copy link
Contributor

Also, the meta.json file needs to be updated

Screenshot 2024-12-03 at 7 21 25 AM

@jdwilkin4 jdwilkin4 added status: waiting update To be applied to PR if a maintainer/reviewer has left a feedback and follow up is needed from OP full stack cert This label is for the new full stack certification labels Dec 3, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@jdwilkin4 jdwilkin4 jdwilkin4 left review comments

@moT01 moT01 Awaiting requested review from moT01

@naomi-lgbt naomi-lgbt Awaiting requested review from naomi-lgbt

@bbsmooth bbsmooth Awaiting requested review from bbsmooth

@Sembauke Sembauke Awaiting requested review from Sembauke

Requested changes must be addressed to merge this pull request.

Assignees
No one assigned
Labels
full stack cert This label is for the new full stack certification platform: learn UI side of the client application that needs familiarity with React, Gatsby etc. scope: curriculum Lessons, Challenges, Projects and other Curricular Content in curriculum directory. scope: i18n language translation/internationalization. Often combined with language type label status: waiting update To be applied to PR if a maintainer/reviewer has left a feedback and follow up is needed from OP
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.

Add navbar component react workshop to main with steps and tests
5 participants
@Ksound22 @bbsmooth @jdwilkin4 @Sembauke @ojeytonwilliams