All solutions

What are you most proud of, and what would you do differently next time?

This was an interesting one. First exercise on the site where I had to change layout depending on breakpoints. Moving the image from top to side.

I'm happy how this went, however the way I did it I'm still loading both images at same time and controlling with CSS. I would use some React magic to load one or the other based on breakpoint, instead of show/hiding in CSS.

What challenges did you encounter, and how did you overcome them?

The largest challenged I ran into was getting the image to be the full width of the mobile version, when the width was greater than the image width. Once I read the docs on React Image, I was able to understand what was going on with how images are loaded and specified.

What specific areas of your project would you like help with?

At this point, nothing.

What are you most proud of, and what would you do differently next time?

I started this a few weeks ago, and circled back to a few other exercises. I'm really happy how this came together and how I was able to rework the responsiveness after learning more about Tailwind.

What challenges did you encounter, and how did you overcome them?

I was a bit frustrated that to use the Tailwind card, I had to replicate the contents, so I did a little refactor of the components, to use a wrapper that was displayed larger sizes, but at smaller sizes only show the inner content, and not the wrapper, with block sm:hidden / sm:block hidden

What specific areas of your project would you like help with?

Nothing at this point.

What are you most proud of, and what would you do differently next time?

I like how this one came together. I'm not overly keen with the duplication when using Tailwind, so next time I would likely use variables (either Javascript), or some theming. However I'm trying to use a single repo for all of these, so themes might be a bit harder.

What challenges did you encounter, and how did you overcome them?

Responsive layout using Tailwind. I finally understood how it works. The default lower bounds is the smallest, and you specify the boundaries where the layout changes.

What specific areas of your project would you like help with?

At this point nothing.

What are you most proud of, and what would you do differently next time?

I like how this came together. I've been learning NextJS + React + CSS + Tailwind all at the same time (BE + Mobile Dev), so the way of thinking in CSS/Tailwind is a little different.

What challenges did you encounter, and how did you overcome them?

The main challenge I had was that in the design, the SVG as displayed was not the same as the asset provided. I never did figure out how to "crop" the SVG in HTML/CSS.

Also, the Tailwind Box Shadow API wasn't straightforward.