New play - Keeper App

[Shivam-Katare]

Description

I have added the new play named Keeper. This is the clone of Google Keep where we can add and delete our notes. This "Keeper app" save your notes until you delete them.

How Has This Been Tested?

1. Install some martial UI dependencies for testing styling -
   emotion/react
   emotion/styled
   material-ui/core
   material-ui/icons
   mui/icons-material
   mui/material

2. Start the app by npm start or yarn start to see it.

Checklist:

• I have performed a self-review of my code
• I have commented on my code, particularly in hard-to-understand areas
• I have made corresponding changes to the documentation
• My changes generate no new warnings
• I have added tests that prove my fix is effective or that my feature works
• New and existing unit tests pass locally with my changes
• Any dependent changes have been merged and published in downstream modules

App Preview(ScreenShots)

[vercel]

This pull request is being automatically deployed with Vercel (learn more).
To see the status of your deployment, click below or on the icon next to each commit.

🔍 Inspect: https://vercel.com/atapas/react-play/3foi64pu7SEBFjtdF6u4wpEoH5cT
✅ Preview: https://react-play-git-fork-shivam-katare-main-atapas.vercel.app

[Deployment for 7bf26f0 failed]

[6km]

There's an issue with the navbar. It's outside the window.

The footer too has an absolute position.

and some paddings changed.

[atapas]

Hi @Shivam-Katare

First of all, this app idea is great. Keeper gonna be a helpful one to many to learn things from it.

Here are a few comments to take care:

1. The style of Header and Footer is conflicting the style of platform. So please scope your styling to your play. The side effect has been pointed by @6km in a comment already: New play - Keeper App #74 (comment)
2. As ReactPlay already has a footer, you can avoid adding another footer with date and copyright. So, IMO that component can be avoided.
3. I saw you included, Material. The Community is debating on what is the Style system we should go ahead with, Material, Bootstrap, Tailwind: Using Tailwind CSS as a CSS Framework #73. Until the decision is made, the reactplay platform is going to use raw CSS. So at this stage we will not include material package.
4. I have seen, you are using the icons from material, we are already packaged react-icons. Please search your equivalent icon in react-icons: https://react-icons.github.io/react-icons/ and replace then with material. So basically, no material. If you need additional icons, ask me. We will provide. If the app looks a bit different without material, it is fine. If you need styling help, please reach out to me.
5. Do not commit the package.lock file, yarn.lock enough
6. What is the thumbnail.png for? We are not using it. If it is for cover image, the name should be cover.png
7. Please drop a Readme.md file at the root of your play folder to explain what is he play about what it uses, etc. Here is an example: https://github.com/atapas/react-play/blob/main/src/plays/states/Readme.md
8. I have given other code level comments too.

At last, Please take your time to address the review comments. No hurry. We are here to assist you on anything needed to get it merged 😀 and I'm just a "Google meet/Zoom" away.

Happy Coding, Happy Learning!

[Shivam-Katare]

@atapas Thanks for pointing out these issues, I will remove that all, to make it all good.

[atapas]

Hello @Shivam-Katare

We have upgraded to React v18 as part of this issue: #87

We have tested the existing plays. All good. Please pull this change to your branch and keep it up-to-date. You have to do sanity of things to make sure everything works for your changes in your branch.

Happy Coding!

[atapas]

@Shivam-Katare Once you done, please remove the work-in-progress label and review-ready label so that we can start the review.

[atapas]

Hey, @atapas all conversations are resolved.

@Shivam-Katare Take care plz, build fails

Hey, @atapas I removed the duplicate "States" and other duplicate plays, is it still gives "build fails message"?

@Shivam-Katare Build is successful but 3 comments are pending.

[Shivam-Katare]

Hey, @atapas all conversations are resolved.

@Shivam-Katare Take care plz, build fails

Hey, @atapas I removed the duplicate "States" and other duplicate plays, is it still gives "build fails message"?

@Shivam-Katare Build is successful but 3 comments are pending.

@atapas all conversations resolved, you can check it now.

[atapas]

@Shivam-Katare All good..

Do you want to make the cover image a bit better? It looks steatched. Maybe do not make a transparent image, give it a background using Canva? Let me know if you need help?

[atapas]

Also in the responsive mode the note list can be aligned better

[Shivam-Katare]

@Shivam-Katare All good..

Do you want to make the cover image a bit better? It looks stretched. Maybe do not make a transparent image, give it a background using Canva? Let me know if you need help?

@atapas Cover image changed.

[Shivam-Katare]

Also in the responsive mode the note list can be aligned better

Responsiveness added for keeper play.

[atapas]

Bro, again package-lock.json file is back in the commit. Please remove that and commit.

[atapas]

Also in the responsive mode the note list can be aligned better

Responsiveness added for keeper play.

Looks good tested.

[atapas]

@Shivam-Katare This is good to merge. Tested. You just need to take care of removing package lock json file from commit.

[Shivam-Katare]

@Shivam-Katare This is good to merge. Tested. You just need to take care of removing package lock json file from commit.

@atapas Shall I put "package-lock.json" in git ignore?

[atapas]

@Shivam-Katare This is good to merge. Tested. You just need to take care of removing package lock json file from commit.

@atapas Shall I put "package-lock.json" in git ignore?

It is already in .gitignore

https://github.com/atapas/react-play/blob/main/.gitignore

[atapas]

@Shivam-Katare This is good to merge. Tested. You just need to take care of removing package lock json file from commit.

@atapas Shall I put "package-lock.json" in git ignore?

It is already in .gitignore

https://github.com/atapas/react-play/blob/main/.gitignore

You can do git rm and commit, push..

Btw, I have captured this case in the Merge Conflict video I published today 😂

[Shivam-Katare]

@Shivam-Katare This is good to merge. Tested. You just need to take care of removing package lock json file from commit.

@atapas Shall I put "package-lock.json" in git ignore?

It is already in .gitignore
https://github.com/atapas/react-play/blob/main/.gitignore

You can do git rm and commit, push..

Btw, I have captured this case in the Merge Conflict video I published today 😂

@atapas Yes, I have seen the video 😀and, removed package lock.json. You can now check it.

[atapas]

@Shivam-Katare looks good.

[atapas]

@all-contributors please add @Shivam-Katare for Code

[allcontributors]

@atapas

I've put up a pull request to add @Shivam-Katare! 🎉

[Shivam-Katare]

I am trying.

…

On Tue, May 3, 2022, 09:19 Tapas Adhikary ***@***.***> wrote: Hey, @atapas <https://github.com/atapas> all conversations are resolved. Please resolve merge conflicts. — Reply to this email directly, view it on GitHub <#74 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AV3VDYI3KZIOIJR2MARPNIDVICO43ANCNFSM5T3UTNAQ> . You are receiving this because you were mentioned.Message ID: ***@***.***>