Scribd Logo
Upload

Welcome to Scribd!

  • 146 views

    AlgoBulls - Frontend Developer - Coding Assignment 1

    Uploaded by

    kd ansari
    The document describes a coding assignment to design a simple To-Do list application using React. The requirements include: 1. Displaying tasks in a table using Ant Design Pro table with columns like title, description, due date, tags, and status. 2. Allowing users to add, modify, delete tasks, sort and filter the table. 3. Adding a search bar to search tasks based on column data. 4. Using mock APIs and not requiring any database. 5. Submitting the project by deploying the code, sharing the GitHub repo, and requesting a review by email.

    Copyright:

    © All Rights Reserved
    Download as PDF, TXT or read online from Scribd

    AlgoBulls - Frontend Developer - Coding Assignment 1

    Uploaded by

    kd ansari
    146 views3 pages
    The document describes a coding assignment to design a simple To-Do list application using React. The requirements include: 1. Displaying tasks in a table using Ant Design Pro table with columns like title, description, due date, tags, and status. 2. Allowing users to add, modify, delete tasks, sort and filter the table. 3. Adding a search bar to search tasks based on column data. 4. Using mock APIs and not requiring any database. 5. Submitting the project by deploying the code, sharing the GitHub repo, and requesting a review by email.

    Original Description:

    assignment

    Original Title

    AlgoBulls - Frontend Developer_ Coding Assignment 1

    Copyright

    © © All Rights Reserved

    Available Formats

    PDF, TXT or read online from Scribd

    Did you find this document useful?

    Is this content inappropriate?

    The document describes a coding assignment to design a simple To-Do list application using React. The requirements include: 1. Displaying tasks in a table using Ant Design Pro table with columns like title, description, due date, tags, and status. 2. Allowing users to add, modify, delete tasks, sort and filter the table. 3. Adding a search bar to search tasks based on column data. 4. Using mock APIs and not requiring any database. 5. Submitting the project by deploying the code, sharing the GitHub repo, and requesting a review by email.

    Copyright:

    © All Rights Reserved
    Download as PDF, TXT or read online from Scribd
    Download as pdf or txt
    146 views3 pages

    AlgoBulls - Frontend Developer - Coding Assignment 1

    Uploaded by

    kd ansari
    The document describes a coding assignment to design a simple To-Do list application using React. The requirements include: 1. Displaying tasks in a table using Ant Design Pro table with columns like title, description, due date, tags, and status. 2. Allowing users to add, modify, delete tasks, sort and filter the table. 3. Adding a search bar to search tasks based on column data. 4. Using mock APIs and not requiring any database. 5. Submitting the project by deploying the code, sharing the GitHub repo, and requesting a review by email.

    Copyright:

    © All Rights Reserved
    Download as PDF, TXT or read online from Scribd
    Download as pdf or txt
    of 3

    AlgoBulls Frontend Developer

    Coding Assignment
    November 2022

    Project: Design a simple To-Do List App using React

    Description:

    You need to design a web-based to-do list application, as per the given requirements:

    1. Tasks should be displayed in a Tabular format, using the Ant Pro table component.
    2. The table should have the following columns:
    a. Timestamp created: Timestamp at which a task was created.
    Should be auto set when creating a new entry. A user should not be able to
    edit this.
    b. Title: Title of the task to be done.
    i. A user can set this while creating a new entry. A user can also change
    this updating existing entry.
    ii. Max length: 100 characters.
    iii. Mandatory field
    c. Description: Description of the task to be done.
    i. A user can add details about this task.
    ii. Max length: 1000 characters
    iii. Mandatory field
    d. Due Date: Expected due date to finish the task
    i. A user can set this while creating a new entry. A user can also change
    this updating existing entry.
    ii. Optional field
    e. Tag: One or more tags which user can add to the entry
    i. A user can set this while creating a new entry. A user can also change
    this updating existing entry. Multiple tags can be added to the same
    entry
    ii. Optional field
    iii. Multiple tags with the same value should be saved only once.
    f. Status: Shows status of a task
    i. Should be one of these values.
    1. OPEN (Default value)
    2. WORKING
    3. DONE
    4. OVERDUE
    ii. Mandatory field
    3. The table should support pagination.
    4. User should be able to perform the following operations:
    a. ADD a new to-do entry
    b. MODIFY an existing to-do entry
    c. DELETE an existing to-do entry
    d. SORT the table using columns a., b., c. and d. given above in both ascending
    and descending formats
    e. FILTER the table using e. and f. Columns.
    5. Provide a search bar on the top where a user can perform a case-insensitive search
    for any task based on the data in any of the above-mentioned columns.
    6. Make use of mock APIs to ensure that the app is fully functional.
    [No database or backend coding required.]

    Technology to be used for creating this application:

    Frontend:
    1. Ant Design Pro v4+
    https://github.com/ant-design/ant-design
    https://github.com/ant-design/ant-design-pro
    Ant Pro Table: https://github.com/ant-design/pro-table
    2. [BONUS] DVA

    Note:
    1. You can assume things that are not defined with a reasonable value. For example,
    we have not defined the pagination size. You can assume it as 15 or 20 or any other
    number which is generally acceptable.
    2. Add validation checks anywhere there is a possibility of an obvious violation of
    general logic. Example: ‘Due Date’ field value cannot be before ‘Timestamp created’
    field value
    3. Implement necessary design principles wherever possible. For example, when a user
    tries to DELETE an existing to-do entry, it is good to ask first for a confirmation from
    the user before firing the DELETE api. The design should look complete.
    4. Explore Ant Design sufficiently so you can use the available features from the
    existing widgets smartly. This will be preferred over creating completely new
    components. Feel free to take design inspiration from https://app.algobulls.com.

    Objective:
    1. Please come up with a sleek frontend that can accommodate all the requirements.

    Duration:
    The ideal time is 3 days. If you need extra time, please request the same with appropriate
    reasoning.

    How to submit:
    1. Deploy your application on any cloud service provider like AWS, GCP, Azure, etc.
    and send us a link to your working application.
    2. Please upload your code on a private GitHub repo and share it with the following
    GitHub user-ids - algobulls-dev, hruturaj-nikam-algobulls
    3. Make sure your code is cleaned up as per standards, before you do the final
    submission. It is ok to keep pushing any number of intermediate code commits.
    4. Add sufficient comments for complex logic, before you do the final submission.
    5. Include a README that includes basic documentation on how to run the code.
    6. Once done, please send a mail to both [email protected] &
    [email protected], mentioning your name and GitHub ID, requesting a
    review. Attach this coding assignment pdf to the mail as well.
    7. If selected for an interview, we may request you to set up a screen-sharing session
    for discussion purposes.

    Asking for clarification/hints:


    Please send an email to [email protected] & [email protected] with
    your query and we will get back to you.

    You might also like