Reorganization with Learning Course page#70
Conversation
|
🌐 Preview URL: https://pr-70.frcsoftware.pages.dev |
820e3df to
e82a407
Compare
I see the reasoning, but I'm a little concerned about how clustered the header would get. We can certainly try it and see how it looks. |
|
I get that concern and I do think the frcdesign header is slightly too crowded, however we likely won't have as many items as they will. I mostly just don't think that the website feature guide makes sense in the learning course, compared to the other content that is there. I also don't want to make it seem like it's part of the mandatory path when its content is mostly things that can be figured out naturally, or that can get 90% of the way intuitively. Removing a boring step to getting learners engaged and doing things is a worthy reason to separate it, imo. |
Daniel1464
left a comment
There was a problem hiding this comment.
The implementation is pretty much good. Quick question though - do we still need a "Getting-Started" page on the topbar from the Home Screen considering that it's now just a worse version of the learning course page?
There was a problem hiding this comment.
Should these image files be in the public directory?
I think renaming it to "Learning Course" in the header would be appropriate |
There was a problem hiding this comment.
Should be webp format per styleguide https://frcsoftware.org/contribution/styleguide/#file-formats
| - The website has a [glossary](/resources/glossary/) of terms related to the content. | ||
| Whenever a word in that glossary is mentioned in the website, it will be underlined. | ||
| You can hover over these underlined words to get a quick definition (e.g. COTS, OTB). | ||
| You can hover over these underlined words to get a quick definition (e.g. PDH, SparkMAX). |
There was a problem hiding this comment.
| You can hover over these underlined words to get a quick definition (e.g. PDH, SparkMAX). | |
| You can hover over these underlined words to get a quick definition (e.g. PDH, Spark MAX). |
(note glossary currently has SparkMAX, but this is incorrect and will be fixed)
| </li> | ||
| <li> | ||
| <a href="/learning-course/getting-started/vscode-overview/"> | ||
| VSCode Overview:{' '} |
There was a problem hiding this comment.
| VSCode Overview:{' '} | |
| VS Code Overview:{' '} |
| <a href="/learning-course/getting-started/vscode-overview/"> | ||
| VSCode Overview:{' '} | ||
| </a> | ||
| Learn more about VSCode, the code editor used for this course. |
There was a problem hiding this comment.
| Learn more about VSCode, the code editor used for this course. | |
| Learn more about VS Code, the code editor used for this course. |
| slug: 'learning-course/getting-started/required-tools', | ||
| }, | ||
| { | ||
| label: 'VSCode Overview', |
There was a problem hiding this comment.
| label: 'VSCode Overview', | |
| label: 'VS Code Overview', |
| title="Course Setup" | ||
| href="/learning-course/getting-started/required-tools" | ||
| image="./img/VSCode.png" | ||
| imageAlt="A screenshot of VSCode" |
There was a problem hiding this comment.
| imageAlt="A screenshot of VSCode" | |
| imageAlt="A screenshot of VS Code" |
| image="./img/Kitbot.png" | ||
| imageAlt="Course Setup" | ||
| > | ||
| <p> |
There was a problem hiding this comment.
The style of this and the above stage 0 description should be made to match
| <p> | ||
| Stage 1 is where students start to program Kitbot. In the first half, | ||
| students learn the basics of the FRC coding structure through using just | ||
| the Robot class. During the second half, students implement Command |
There was a problem hiding this comment.
Command-Based should have that hyphen in there
| const navLinks = [ | ||
| { href: '/', label: 'Home' }, | ||
| { href: '/feature-guide/', label: 'Website Feature Guide' }, | ||
| { href: '/getting-started/intro-to-prog/', label: 'Getting Started' }, |
There was a problem hiding this comment.
| { href: '/getting-started/intro-to-prog/', label: 'Getting Started' }, | |
| { href: '/getting-started/intro-to-prog/', label: 'Learning Course' }, |

Website feature guide was only accessible from the header, even though it includes information that the readers should know before they start going into learning (notes, tips, slides, dropdowns etc). After a conversation in the discord, I moved the "website feature guide" page to be the first page in "getting started" section. After clicking on the home page's "start learning", the pages are in this order:
Now readers learn important parts of the website first.
Also updated the Website feature guide to include FRCSoftware features, images and such. Fixed a typo on "intro to programmming" there were 3 m's