Fetch, classes and modules on javascript, and responsive layout.

Community feedback

• 

  Simon Davis•505

  @SkidragonPosted over 3 years ago

  Hi @Romario-Negreiros, for organizing, I would recommend using PascalCase for your classes to be able to distinguish them faster since that is common practice. Also for your item which I guess is a Country Card? The methods need to tell me more about what the code is doing, not how it is doing it. For example: insertClass in the Item class doesn't tell me much and I would have to search for the class name to understand what it is doing which is very problematic in huge projects.

  Here is an example of how I would structure the project:
  CountriesList.js
  CountryCard.js
  home.js //where we can import our classes to interact with each other
  

  CountriesList can have the methods
  add(CountryCard)
  remove(CountryCard) //We can do this instead of an index because we are pointing to the same object in memory  
  addMultiple(countryCardsData)
  

  CountryCard (name, population, region, capital, link)
  

  in home.js
  const data = await fetch()
  const countryCardsArr = [];
  loop through data and use it to create the CountryCards and push them into the array
  CountriesList.addMultiple(countryCardsArr);
  

  I haven't looked into the session storage of your code but you can also use query params to fetch data in the next page if you need to store an id to get more detailed information about a country.

  1

  ---

  

  Romario Negreiros•210

  @Romario-NegreirosPosted over 3 years ago

  Hi @Skidragon, thanks for the feedback, you really clarified how to organize my code a way better, which is something that I have problems since I started coding. I'll refactor the code soon with the hints you gave me, and also sorry for being late on the response, I wasn't home last 3 days. Thanks again ❤

  0