All comments

• 

  Aguluka Ngozi celestina• 80

  @Melissacinta

  Submitted 10 months ago

  Getting react-slick to work on the crew and technology pages while keeping to the page design was a huge pain biut thankfully that was resolved and apart from that every other part of of the project was preety easy to craft out.

  Although I do realize that my site might not be fully responsive it breaks when you switch between view ports and you have refresh to get it looking normal. what might be the issue?

  Also, on the crew page, I seem to be loosing some text on the last two slides bio and I have tried everything I know but theissue still persits, In sights are very much appreciated

  

  Responsive Space Tourism website using react, react-slick & tailwind

  #react#tailwind-css#typescript#vite

  2

  4

  0

  

  Pedro Chaparro• 260

  @PChaparro

  Posted 10 months ago

  Hi, the solution is awesome. It seems that the library you used for the sliders is adding a fixed height to a <div> with the class .slick-list, in the case of the biography texts the fixed height is 247px in a desktop screen and that's the reason why you're loosing some text. I hope that can be useful.

  1
• 

  Saswat Samal• 80

  @saswat10

  Submitted 10 months ago

  problems

  • naming classes in css
  • dividing the react components into smaller chunks, like which would make the code more reusable

  unsure areas

  • displaying the currencies and native names in international format

  questions

  • how can I make use of useMemo and useCallback for making fetch reqeusts?
  • what are the best practices for optimizing the search component (it is in the CountryList.jsx file)?
  • how to break down components and make code DRY?

  GENERAL QUESTION How do you start your project - like do you first start writing the logic and add design or do you study the design first and make classes and then add logic?

  Any other suggestions are open, please free to answer, It would help me a lot

  

  REST API Countries

  #axios#react#sass/scss#react-router

  2

  4

  0

  

  Pedro Chaparro• 260

  @PChaparro

  Posted 10 months ago

  Hi, you did it well. About the naming problem in the CSS classes, I suggest you to use the BEM methodology, it allows you organize your classes based on Blocks, Elements and Modifiers, for instance, in your .dropdown component, you could have classes like .dropdown__option, .dropdown--hide, .dropdown--show, etc.

  To optimize the search component and provide a "better" user experience you could update the results in real time and use a "Debouncer" to prevent unnecessary re-renders of the countries cards by adding a timeout between each UI update or API call.

  Marked as helpful

  2