Hacktoberfest 2026: the issues maintainers tagged for October, open and beginner-friendly. Browse Hacktoberfest issues

Build a todo-list app

Open
#8 0 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Assessment

Difficulty
2/5
Estimated time
Half a day
Newbie friendliness
55/100
Issue type
Feature
Clarity
Clearly specified
Activity status
Stale
Tech stack
javascript
Domain
frontend

Research direction

Open the linked Sprint-3/todo-list coursework first and identify the entry files and any existing tests or run instructions. Implement the listed todo creation, completion, deletion, bulk deletion, and deadline acceptance criteria; done means each behavior works in the browser.

Written by the indexing model from the issue text.

Description

🏕 Priority Mandatory 🐂 Size Medium 📅 Sprint 3 Core Module-Data-Groups Submit:PR
Link to the coursework

https://github.com/CodeYourFuture/Module-Data-Groups/tree/main/Sprint-3/todo-list

Learning Objectives
  • Develop a web app according to a specification
  • Update the DOM in response to input from the user
Why are we doing this?

These challenges are designed to develop your problem-solving skills.

In this exercise you will build a to-do list which meets the following criteria:

Acceptance criteria

  • Given a todo list web application
    When the page loads
    Then the populateTodoList() function should create todo list items for each hardcoded todo
    When a todo list item is created
    Then it should contain: ☑ 🗑 todo text
    When the checkbox icon is clicked
    Then the todo text should have strikethrough
    And the checkbox should be ticked ✅ 🗑 todo text

  • Given a todo list item on the page
    When the trash icon is clicked
    Then the todo list item should be deleted

  • Given a button to add new todos
    When the button is clicked
    Then a new todo should be added to the list with the checkbox and trash icons

  • Given a button to mass delete completed todos
    When the button is clicked
    Then any todos that have been checked off should be deleted

  • Given the ability to set a deadline when creating a todo
    When a deadline is set
    Then the deadline should be displayed next to the todo text

Maximum time in hours

4

How to get help

General advice on asking for help can be found on the curriculum pages.
You can always share your blockers in your class channel and get help from your colleagues.

How to submit
  1. Fork the coursework repo to your Github account.
  2. Make a branch for this project.
  3. Make regular small commits in this branch with clear messages.
  4. When you are ready, open a PR to the CYF repo, following the instructions in the PR template.

There are several projects in this repo. Make a new branch based on main for each project.

Dominant language
JavaScript
Stars
1
Forks
327
Avg merge
3d 7h
Merged PRs (30d)
3

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

More from CodeYourFuture/Module-Data-Groups

All issues in CodeYourFuture/Module-Data-Groups

Similar issues

More JavaScript issues

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.