Skip to content

JS Foundations exercises: Group exercises by lessons #665

Description

@zunaid-hassan

Prerequisites

  • I have thoroughly read and understand The Odin Project Contributing Guide
  • I have searched the existing issues to ensure this improvement hasn't been suggested before (please have a look through our open issues list to make sure)
  • The title of this issue follows the <Location of the improvement>: <Brief description of the improvement> format, e.g. Exercises: Add exercise on XYZ
  • (Optional) I am interested in working on this issue and would like to be assigned to it

Improvement Description

I would like to re-propose an improvement that builds upon previous discussions in #333 and #533.

While #533/#597 grouped the JS Foundation exercises into a foundations directory to make room for advanced topics, the foundations folder itself contains a flat list of 16 exercise directories. In the main curriculum, these exercises are assigned in chunks across different lessons. For example, the "Data Types and Conditionals" lesson assigns exercises 1 through 5.

Because all exercises are in the same directory, learners often finish the assigned batch and intuitively move on to the next one (e.g., opening 06_repeatString after finishing 05_joinStrings), not realizing it covers concepts they haven't been taught yet. As initially discussed in #333 back in 2023, this remains a common stumbling block for learners, leading to unnecessary confusion and frustration. I have linked some relatively recent Discord discussions of this below.

While I understand the current layout encourages learners to read the instructions carefully, I feel the recurring Discord confusion suggests it creates unnecessary friction rather than serving as a helpful learning boundary.

To address this, I would like to re-propose grouping the javascript-exercises/foundations/ exercises into sub-folders that correspond directly to the curriculum lessons. Notably, #597 already updated plopFile.js and the generators to support nested directories, so the infrastructure for this change should already be in place.

The exercises can be divided as per their lessons:

  1. Data Types and Conditionals: Exercises 1-5
  2. Loops and Arrays: Exercises 6-11
  3. Object Basics: Exercises 12-16

Based on the current curriculum, the new JavaScript Foundations Exercise structure would look like this:

javascript-exercises/
└── foundations/
    ├── 01_data_types_and_conditionals/
    │   ├── 01_helloWorld/
    │   ├── 02_addNumbers/
    │   ├── 03_numberChecker/
    │   ├── 04_mathEquations/
    │   └── 05_joinStrings/
    ├── 02_loops_and_arrays/
    │   ├── 06_repeatString/
    │   ├── 07_reverseString/
    │   ├── 08_removeFromArray/
    │   ├── 09_sumAll/
    │   ├── 10_leapYears/
    │   └── 11_tempConversion/
    └── 03_object_basics/
        ├── 12_calculator/
        ├── 13_palindromes/
        ├── 14_fibonacci/
        ├── 15_getTheTitles/
        └── 16_findTheOldest/

This change will create a more consistent experience across TOP's exercise repositories, as the css-exercises/foundations/ repository already successfully uses this exact approach:

css-exercises/
└── foundations/
    ├── block-and-inline/
    │   ├── 01-margin-and-padding-1/
    │   └── 02-margin-and-padding-2/
    ├── cascade/
    │   └── 01-cascade-fix/
    ├── flex/
    │   ├── 01-flex-center/
    │   ├── 02-flex-header/
    │   ├── 03-flex-header-2/
    │   ├── 04-flex-information/
    │   ├── 05-flex-modal/
    │   ├── 06-flex-layout/
    │   └── 07-flex-layout-2/
    └── intro-to-css/
        ├── 01-css-methods/
        ├── 02-class-id-selectors/
        ├── 03-grouping-selectors/
        ├── 04-chaining-selectors/
        └── 05-descendant-combinator/

Adopting a similar structure for the JavaScript Foundations exercises will align the two repositories and reduce the number of learners asking for help on advanced concepts they haven't reached yet.

Note

I added numerical prefixes (e.g., 01_, 02_) to the proposed JavaScript lesson folders to keep them in the chronological order of the curriculum. This is a slight improvement over the CSS structure, where the lesson folders are currently sorted alphabetically.

As a final note, implementing this change would also require minor tweaks to the assignment instructions on the curriculum repo to ensure they reflect the updated folder paths. I can do that PR alongside this.

Acceptance Criteria

  • The foundations exercises in the javascript-exercises repository are moved into their respective lesson-based sub-directories.

  • All Jest test suites still run successfully (npm test) without any broken paths.

  • The assignment instructions in the curriculum repository are updated to reflect the new directory paths.

(Optional) Additional Comments

Discord discussions

  1. https://discord.com/channels/505093832157691914/505093832157691916/1537640118297305098
  2. https://discord.com/channels/505093832157691914/1179952911548174346/1538835069005860905
  3. https://discord.com/channels/505093832157691914/505093832157691916/1528095128173019376
  4. https://discord.com/channels/505093832157691914/505093832157691916/1519035371290230955
  5. https://discord.com/channels/505093832157691914/690590001486102589/1479139561861812297
  6. https://discord.com/channels/505093832157691914/690590001486102589/1464716271785345036

Metadata

Metadata

Assignees

No one assigned

    Labels

    Status: Needs ReviewThis issue/PR needs an initial or additional review

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions