All solutions

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

First time using typescript in a project

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

Took a time until a got the hand of typescript, also some styles from the figma file i could not reproduce with tailwind.

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

First time using typescript in a project

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

Took a time until a got the hand of typescript, also some styles from the figma file i could not reproduce with tailwind.

Had the opportunity in learning more and using the useContext hook for this project.

I have incorporated also Tailwind for the first time in a project, took me a while to get used it as you have to look up all classes the first few times.

First project after taking a break for some months.

So the challenge was nice, had a minor issue with disabling the reset btn if the value of the bill or the value of people were null, it was only disabling the btn if I were to refresh the page, but I put the disabled condition in a function and that function in a setInterval, and now every 300ms, the inputs are checked to see if the input is valid or not.

A fun little project to practice API's manipulation.

First time implementing a hidden navbar, I had a few little hiccups but managed to complete it in the end, although not perfectly. But with time and more practice, it will get easier.

Fun little project, i did not encounter any major hiccups while working on it, with the exception of iterating over both the json file and the block file, to get the amount values out in a nice DRY way. As a result of failing to do that, i violated the DRY principal and did some hardcoding.

Great challenge, learned a few more things while working on it, who knew that inputs with the type of number don't take into account the max length specified on it, but it was solved with some inline js. Also paying attention to scss specificity can save you a lot of frustration.

Interesting challenge, I have also added the option to individually turn off the message alerts that are being reflected in the notification number, also the possibility of opening and closing messages or comments from users when clicking on each section.

For this project i used for the first time bootstrap, although it made some things easier to build, it takes time to memorize all the classes and where to use which. But i will continue to use it so i can improve.

A fun little challenge, I have not encountered any major issues during productions, incorporated RegEx for validating the inputted email address.

A little thing that bugs me about the input fields, is when I apply a border radius, at the point of the border when it starts to bend, the border becomes pixelated and it also looks like the width of it is thicker than the rest.

Fun little challenge, in regards to the error message when the wrong value is entered, i tried to dynamicallyinsert the error message from JS, it worked alright, but if you started spamming the submit button you would get like 10 error messages one after the other, which i could not figure to stop it from doing that, so i went the other way with a display block/none on a hard coded p element in the html file.

Easy enough project, fitting that image gave me more troubles that i wanted, but came out looking allright.

This program went by smoothly, the only problem seemed to be with GitHub pages not displaying my images but I solved it by using Vercel instead.

For this project i have used for the first time the BEM methodology and also started getting familiar with Sass.

For the layout i used flexbox for the body to center the content, and gridbox for the main content to arrange the boxes as the design shows.

I really enjoyed making this project, i used gridbox for arranging the cards for the desktop size and i also used pseudo elementes for attaching the decorative images for every card.

Completed this challenge using grid, i have tried using pseudo elements for attaching the star imgs but could not space them out like it is in the design, so i resorted to using the img element in the html instead.

Fun challenge that had an interesting hover method containing reduced opacity on the main image to let the background color show thru, it took me a while documenting myself how to implement it but in the end i am satisfied with the result.

For this challenge i encounter a problem with the tow big background images, i applied them and positioned them to on the body, at 1440px they are in place but as soon as i resize the viewport towards mobile display they move out of bounds and are not present while in mobile display.

Nothing much to add here, i enjoyed completing this challenge. The only hiccup that i encounter was when trying to apply justify-content:center to align vertically the content in the page, in my mobile display half of the first first card was out of the display and unable to scroll up to it, hence i just applied margin-top to the whole section element.

Tried using the picture element and the img element with srcset to have the images switch at certain breakpoints but the browser was reading only the src image so it was not working, eventually i switched to background img with media query breakpoint, but the mobile img zoomes in as you increase the with of the viewport.

Any advice would be appreciated!