Skip to content
OverviewSolutions
3
Comments
7

Naren-ReactDev

@Naren-ReactDev150 points

I’m a mysterious individual who has yet to fill out my bio. One thing’s for certain: I love writing front-end code!

Latest solutions

Latest comments

  • Naren-ReactDev•150
    @Naren-ReactDev

    Excellent design and state management.

    One thing I noticed is, filter drop down not holding the selected value, as you are using ul, li for that. you can use select and options instead so you can see the selected value.

    <select id="regionFiltorSelect" onChange={(e) => { handleClickRegion(e.target.value); }}>

    <option value="">Filter by region</option> <option >Afrca</option> <option>Asia</option> <option >Europe</option> <option >America</option> </select>

    Hope that is helpful. overall nice work. Thanks, Naren

  • Naren-ReactDev•150
    @Naren-ReactDev

    Good design and validations. Small thing I noticed, you may ignore those not significant ones.

    1. in the addons page $ symbol misplaced. should +$2/mo instead +2$/mo.

    2)In summary page Change link is missing.

    Thanks, Naren

  • Oleksandr•40
    @OKodovbetskyi
    What challenges did you encounter, and how did you overcome them?

    It wasn't very hard project.

    React checkout app

    #react
    1
    Naren-ReactDev•150
    @Naren-ReactDev

    Nice one,

    Few things I noticed. 1)Go to summary screen, Without selecting plan and addons. you see Nan and undefined. 2)On monthly/yearly toggle click adons prices are not reflecting in the summary page.

    Thanks, Naren

  • rajkishort596•310
    @rajkishort596
    What are you most proud of, and what would you do differently next time?

    I tried my best to make this working but i feel there is still some bugs in this project. Help me improve this project by suggestions on bugs. All Feedbacks are welcomed ❤️.

    multi-step-form-main

    #accessibility
    1
    Naren-ReactDev•150
    @Naren-ReactDev

    Hi, Congratulations on completing the challenge.

    I quickly notice few things.

    1)Name may not be required to be validated for empty space.

    2)email name can have special characters, add special chars as below. suggest to use below

    ^[A-Za-z0-9.-_]+@[A-Za-z]+.[A-Za-z]+$

    3)I feel we don't need to validate the spaces and country codes can be 2 digits also. suggest to use below

    ^+\d{10,11}$

    Marked as helpful
  • Naren-ReactDev•150
    @Naren-ReactDev

    Congratulatiosn on completing the challenge, Design looks good. Functionality wise you may need to implement below:

    1. On confirm button click, in the total amount you need to add only selected addons, it is keep on appending addons price when I go back and click confirm button(may be onclick you can reset exsting selected addons price to 0 and add newly selected addons price).

    if (!(arrayForm[3].className.includes('hidden'))) { nextStepBtn.innerHTML = 'confrim' nextStepBtn.classList.add('bg-purplishBlue') let regex = /\d+/ let userPlanePrice = regex.exec(planPrice.innerHTML)

            let userAddOns = $.querySelectorAll('#user-add-price')


        sum =0 // not tested but I feel setting sum=0 here should work
        userAddOns.forEach(add => {
            let x = regex.exec(add.innerHTML)
            sum = Number(x[0]) + sum
        })

    2) On toggle click monthly/yearly amount is not reflecting in the total amount. you may need to update plan price in the total amount on toggle click.

    Thanks, Naren

    Marked as helpful
  • Naren-ReactDev•150
    @Naren-ReactDev

    Excellent piece of work and perfect responsive design. Small thing I noticed is we may not require the select box for the filtering, we need to filter the list based on the onclick event of right hand side tags of the job listing.

View more comments