What are you most proud of, and what would you do differently next time?
I use JavaScript and it's work well.
What challenges did you encounter, and how did you overcome them?
In rating part, I implement the class When I clicked rating count and so that it shows in white color, but others can also select if you click them e.g. you can select 1 and 3 both so, to overcome this problem I, in foreach loop I write for loop inside the foreach for removing selected class then add selected class so Whenever user click on rating count in js first selected classes removed then which is to clicked which is to applied
What are you most proud of, and what would you do differently next time?
This Challenge is the 1st Challenge Which I tried 2-3 months ago When I am learning CSS That time, I was not able to center this card, and I am literarily think I am not made for the coding and in mind I am cry but I watch tutorial(how to think of structure of the html and how to implement what properties I leaned )of projects then write now, I able to made this project by myself in 15 min .
What are you most proud of, and what would you do differently next time?
My First Frontend Project Which I complete in 2-3 hours. In next time I try to check my code before googling problems.
What challenges did you encounter, and how did you overcome them?
In this project I did not face such challenges but by my mistake I gave the width to the bottom card icon div and inside div I give img tag and the h5 tag so I give icon img to 100% width it works fine but the name is not show in one line so half to 1hour I think I give flex to the parent may be that's why this is not work but after some time I figure out and for img tag I give img tag in another div and give width to it's then h5 text properly show in one line.
What specific areas of your project would you like help with?
What challenges did you encounter, and how did you overcome them?
When I declare gird-template-columns: repeat(4,1fr) and grid-template-rows: repeat(2,1fr) I don't know why Grid creates 3 rows if anyone know please comment.
Then I simply remove the grid-template-rows: repeat(2,1fr) then it will automatically calculate the rows then it works fine
What specific areas of your project would you like help with?
Design of Every project which available in frontend.
What are you most proud of, and what would you do differently next time?
I able to make it finally before that I had given 2 solutions, but both is not well structure
in one by default page open all questions answers and in second in mobile header is not show properly
What challenges did you encounter, and how did you overcome them?
What are you most proud of, and what would you do differently next time?
When I complete project, I feel good Learn When new project comes new learning
What challenges did you encounter, and how did you overcome them?
when I move to the making mobile design, I faced some issue Because, I used flex box to center the card so when I move to design mobile version, I faced margin issue, margin is bigger than What i see in design so then I applied flex-grow:1 in mobile design so it will solved.
What are you most proud of, and what would you do differently next time?
I proud that I make this website only looking at the design without watching any recipe-page (project name) tutorial Next time I will make some harder project then this and learn new thing That I had learned from this project like how to google problems which we faced while making projects
What challenges did you encounter, and how did you overcome them?
In Nutrition section I faced problem when we have to give same space in between all the nutrition facts When first time I looked this I think it will be solved by using flex or in changing layout of the html but after same time I open inspect option and then I know all nutrition fact widths are distinguished so then I set the all span tag width same and give display:inline-block , give margin-left in percentage according to design Then problem is solved and I feel very happy to solve this problem by my self
What specific areas of your project would you like help with?
When I completed the desktop design and moving to the mobile design, I faced one big
problem of omelet image width covers all the area of the mobile design 100% but I make project using 1 container in main tag in html according to the desktop design and give the padding to the container but When I jump to the mobile design I google this problem, and I try to apply not pseudo to the first-child of the container but I not able to do that So , I changed the html structure and make 2 divs in html in one I give omelet image and in second div I give other remaining html content and then give padding to it then this problem was solved
