All solutions

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

I'm proud of my typescript code.

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

My main issue was to make the tooltip accessible which is not a easy task. I overcome this issue by copying the ARIA Authoring Practices Guide: Menu button pattern and adapting it to typescript.

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

Accessibility

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

I'm not proud of this project yet. i will improve it as soon as i can.

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

The paddings and margings for the faq elements.

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

Accessibility

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

I'm not really proud of this one.

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

The biggest challenge was the hero image. I ended up creating the illustration myself to have better control of the positionning.

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

Accessibility

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

I'm proud of my classes naming but i think it could be better.

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

The naming of the classes using BEM

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

Accessibility and BEM

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

I'm proud of the grid layout

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

The naming of my classes using BEM.

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

Accessibility

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

I'm proud of the grid i used for the cards.

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

The grid

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

Accessibility

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

I'm proud of the responsive design.

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

none

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

Accessibility

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

I'm not happy of my dark theme. I will change it when i have time.

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

The lists bullets and numbers. I ended up using custom bullets and numbers for the lists.

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

Dark theme design and accessibility

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

I'm proud of the themes.

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

none

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

Accessibility

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

What are you most proud of ?

• The themes

what would you do differently next time ?

• Accessibility
• HTML tags

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

My biggest challenge was the dark theme.

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

Accessibility and HTML tags

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

I am proud of:

• Dark and light theme depending of the user operating system preference
• Print rules to remove colors and add contrast to the text
• Accessibility, The project has been tested with NVDA.

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

The challenge for me was the accessibility because a QR code is great unless you cannot see it.

My solution was to use NVDA and create an alternate version of the website removing the QR code for people who cannot see the image.

People who can see the image are invited to scan the code.

If the image fail to load, a link is placed on top of the image so people can go to the website.

The image has been placed at the last position so the screen reader experience is better.

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

HTML tags.

I used a tag for the card, there is no main header or footer and i don't know if this is ok. I wanted to use a tag for the card but again i don't know if this is ok or not.

The purpose of this project for me was to test the new figma developer mode in vscode.

What did you find difficult while building the project?

The layout

Bonus

Reviews and testimonials are generated by data.

What did you find difficult while building the project?

Background images and the mobile navigation

Which areas of your code are you unsure of?

The accessibility has not been made for the mobile navigation (no focus trap).

What did you find difficult while building the project?

The bmi calculator form.

Which areas of your code are you unsure of?

The bmi calculator form react logic

What did you find difficult while building the project?

Email validation regex

Which areas of your code are you unsure of?

Yup (validation library) accept the following email format "test@test" which is odd to me. The author say that they follow the specification of the browsers. So it's should be valid.

What did you find difficult while building the project ?

Form validation ux

Which areas of your code are you unsure of ?

Form validation

Do you have any questions about best practices?

I'm not used to React so feel free to tell me if i'm off in term of best practices.

Experimental web component