Hi rameshsyn,
Nice original design.
It’s nothing majorly important but I have a quick piece of feedback. I noticed a spelling error when adding ingredients. It says “gradients”.
Well done.
Thanks @willgriffiths 
for feedback ,
I thought , that was right , hahahaha
i am gonna change right now
Your Recipe box works fine ! well done
This was a slog, but I’ve finished it. The code doesn’t look great, but at least I have a neat modal animation. It’s all about the little things I guess. I didn’t use Bootstrap (because I’m terrible with it) or Jquery. Not sure if there are bugs with local storage, since it works fine for me despite not prefixing it as the project page recommends.
Link- https://codepen.io/imtoobose/full/zBPdPr
Man, this one made me wonder if I need to go back and re-cover a lot of my basics. Trying to use react properly is really pushing my limits. Anyone any feedback is appreciate
It looks real cool and you fulfilled the requirements. Without looking at your code (because I don’t trust myself to make responsible suggestions just yet) theirs a few things I think could be improved:
- Increase the font size in the new recipe and recipe editing menu
- Consider keeping the recipe tile size constant. While the resizing of the tiles is cool I’m not sure it serves any functions purpose and distracts from its function.
- The plus in the new recipe button is misaligned.
- When I open a recipe other recipes stay open.
- When I open a recipe other recipes in the same row expand but do not open.
- I’m not sure what the green line though the center of the recipes is.
I’d keep in mind this is just one person’s opinion.
Edit: It’s got great responsive design!
1 Like
The reason the tiles resize is because of flex box. Now I guess I could use something like Masonry, but this is a small project and it would’ve been overkill. I wanted a layout different from the one given in the example, and maybe it didn’t work out well but it’s not a deal breaker I believe. Flex box works well for a responsive design and i can add as many tiles as I want without writing a lengthy script to manage the layout.
As for the plus button being misaligned, it works fine for me on Chrome and Edge but it messes up in Firefox. Not really sure how to fix it. It might be an issue for Opera and Safari as well but I don’t have those browsers.
The green line is just an aesthetic component.
I will change the size of the font of the modal as it is pretty small.
Thank you for looking at my project and giving the feedback.
I also love the blur effect you’ve got in yours and that you can add instructions with the ingredients. Very cool.
Finally finished - https://jenovs.github.io/fcc-recipe_box/
After first two React projects I was looking for something similar, but this one was pretty challenging.
After first failed attempt I decided to look into Redux to help me manage state change. After learning Redux I got a better understanding about React state so I decided to try again with vanilla React.
The code of my finished project is ugly and fragile, styling is minimal. Spaghetti anyone?
So now instead of moving forward I’m going to rewrite this project using Redux. Looks like Game of life and Dungeon crawler would be too hard to implement using only React state.
Here is mine:
Project Link - http://codepen.io/Josh5231/full/RGwbrQ/
It ended up taking me longer than I thought it would to get through this one. Simply just had trouble staying focused on it. Please let me know what you guys think.
Project Link - https://codepen.io/FaizAhmadF/full/GjgAPL/
It has taken a lot of effort to build separate components and maintain states! Finallly completed…Thinking to learn redux!
Good looking and cool UI. Good work!
1 Like
Thanks bro , you have nice working functionality well done
Well, I thought I was finally finished with this, but I am now noticing a bug that I can’t pinpoint the source of. Sometimes the edit function duplicates the recipe instead of overwriting. And sometimes ‘delete’ isn’t available on an item directly after it’s posted. 
and I think it’s all because I tried to implement the ingredient fields, which are working. 
so I’m happy with that part.
Oh, and … I just checked Chrome and it’s not showing up there. Blargh. Any idea why? Been working in Firefox.
This project was sincerely challenging.
Project Link - http://codepen.io/tbushman/pen/yaYAVY/
Figured out that since I was using Object.values(keys) (experimental and not supported in Safari/Chrome), my recipe box won’t show on those browsers.
I think the button shade not good, but the working functionality perfect!
I have finished the first pass at this project. Please check it out and provide any feedback. Thanks! Project Link - http://codepen.io/exSQZme/pen/xEOrBj
I’ve finally finished this, after doing a few more React tutorials and rebuilding it a few times from scratch. Would love any feedback. https://codepen.io/ubershibs/full/wzAGdK/