Skip to content
OverviewSolutions
8
Comments
2
princemuel
@princemuel

All comments

  • Kamasah-Dickson•5,590
    @Kamasah-DicksonSubmitted almost 2 years ago

    Hello guys this is my second React app that I completed.... I think I should really focus on Async Js and focus more on refactoring and file structuring. One of the challenges I faced was that when I was using react-router....I wanted to use the <Outlet/> to maintain the header component but It wasn't working I got tired and I manually imported and rendered the header component in the /:countryID page and my theme and toggle all got broken 😂😂 because I cant send props. it wasn't a component that could receive props it was just a react-router element={} page which am not rendering anywhere u understand? so I copied the header and pasted it in the /:countryID page 😂 but It worked..how would you have fixed it ??.....Guys what do you think about this project. Kindly share your opinions please.

    Responsive All Countries Made with React + Vite

    2
    princemuel•135
    @princemuelPosted almost 2 years ago

    I checked the site on mobile and overall, the layout looks good.

    There are accessibility and code quality issues though. For example, the current tabindexes added on the drop-down menu messes with touch on mobile. Also, the routing in your app's entry point (index.js) is not setup properly but that can easily be fixed.

    I would love to help, but as I'm on my mobile, I can't really type out all what you need to do to fix the issues. If you're on discord, I'd be game to jump on a video chat and we can refactor the project together.

    Marked as helpful
    0
  • Hawawu Oladipo•90
    @bolanleolaSubmitted over 3 years ago

    Hello Everyone!

    I was able to complete the second challenge on HTML and CSS.

    Your reviews will be much appreciated.

    Gracias!!

    HTML, CSS

    3
    princemuel•135
    @princemuelPosted over 3 years ago

    Hello Dipo, pls avoid using tables and floats in your CSS except for extreme cases. modern CSS layouts use grid and flexbox.

    Also, * {box-sizing: border-box} sets all elements to have a box-sizing of border-box so there's no need to set it again.

    If you have to declare the same styles e.g 40px; again, use CSS variables.

    The order of your CSS should be:

    • Browser Default Styles Reset e.g box-sizing, padding, margins. You can use this to avoid the hassle
    • Basic Page Setup e.g body, container, headings, links, images etc.
    • Components' styles

    Also, do some research on the structure, accessibility and semantics of html.

    what code editor do you use?

    0