SofianeR / Carbur-Ou

0 stars 0 forks source link

Améliorations possibles #3

Open faridrehila opened 1 year ago

faridrehila commented 1 year ago

@SofianeR

Tu peux améliorer le code en créant plusieurs composants : Map, List, etc

Ligne 110 : renderItem devrait etre une fonction définie dans le composant qui retourne un composant (ListItem ou StationItemList, ...)


Ligne 23 : clean le code


Ligne 22 : data devrait etre initialisé à []


Ligne 35 : getData pourrait etre appelée : getListOfStations (je sais pas si stations c'est le bon mot en anglais)


Ligne 42 : C'est du copier-coller - ton app est en francais


Ligne 50 : camelCase - jamais de _ dans le nom des variables. C'est surement en php qu'on fait ca.

urlServer


Ligne 60

Ton setLoading(false) sera appelé avant la fin de ta requete.

Soit tu le mets dans try et dans catch, ou alors tu ajoutes

finally {
setLoading(false)
}

https://www.w3schools.com/jsref/jsref_try_catch.asp

try {
  tryCode - Code block to run
}
catch(err) {
  catchCode - Code block to handle errors
}
finally {
  finallyCode - Code block to be executed regardless of the try result
}

Tu peux juste retourner la page loading (pourquoi pas un composant que tu pourras utiliser sur les autres pages) dans ton composant :

if (isLoading) {
        return (<View style={styles.containerLoading}>
          <Text>En cours de chargement ....</Text>
        </View>
      ) ---------------------> composant loading
}

Tu peux ajouter un loader qui bouge juste au-dessus du texte :


Les URLs ne s'écrivent pas dans les composants. Dans ce cas, comme tu dois passer les coordonnées dans l'URLs, tu peux créer une fonction (par ex. const getStationsUrl = (lat, long) => { .... ) qui te renvoie l'URL.


Ligne 106

Pour une FlatList - tu dois définir keyExtractor https://reactnative.dev/docs/flatlist#keyextractor

C'est bien d'avoir pensé à la prop key dans renderItem mais c'est FlatList qui ajoute les keys avec la fonction keyExtractor

faridrehila commented 1 year ago

Le fameux effet "Papier crayon"

Pense à ton code comme un puzzle à travers lequel des données vont naviguer. Plus les composants sont petits, mieux c'est.