J'ai fini le cours hier. Merci c'était super pour un débutant comme moi.
Cependant j'ai un soucis. Je croyais que ça venait de mon code mais j'ai téléchargé ta version de github et le soucis est le même.
Si l'appli est killée, la liste des films favoris remonte bien, par contre l'avatar lui est invisible (si on a choisi un avatar de la gallery android par exemple). La donnée est bien stockée via le reducer et même à l'air d'être réhydratée. Mais le visuel reste blanc.
Peux-tu me dire si le problème n'est que sur mon smartphone ? Ou tu as ce souci aussi ou quelqu'un da'autres peut être qui en est là ?
Super cours,merci. Je ne sais pas si c'est ici que l'on poste ce type de message, je n'ai pas trouvé d'autre discution sur react-native. Voici le problème sur lequel je bute depuis un moment j'ai cherché dans tous les sens ... je récupère un json via un fetch, tant que je suis dans un component(comme dans le cours) tout va bien. Pour éviter plusieurs accès j'aimerai récupérer les données dans un array et pouvoir l'utiliser dans un autre js. Tout ce que je récupère c'est le tableau de la response.
J'ai commencé le cours et je suis actuellement bloqué au niveau de l'ajout de Redux.
J'ai comme error un "Invariant violation" lorsque que je clique sur un film, pour obtenir le "filmDetail"
Ceci est causé par le connect() - je pense -
J'ai tenté de changer les versions des dépendances, rien n'y fait.. Je ne sais pas du tout comment résoudre ce problème.. Quelqu'un à t'il rencontré celui-ci ?
import React from 'react';
import { StyleSheet } from 'react-native';
import Search from './components/search/Search'
import Navigation from './navigation/Navigation'
import { Provider } from 'react-redux';
import Store from './store/configureStore';
export default class App extends React.Component {
render() {
return (
<Provider store={Store}>
<Navigation/>
</Provider>
);
}
}
const styles = StyleSheet.create({
container: {
},
});
favoriteReducers.js
// Store/Reducers/favoriteReducer.js
const initialState = { favoritesFilm: [] }
function toggleFavorite(state = initialState, action) {
let nextState
switch (action.type) {
case 'TOGGLE_FAVORITE':
const favoriteFilmIndex = state.favoritesFilm.findIndex(item => item.id === action.value.id)
if (favoriteFilmIndex !== -1) {
// Le film est déjà dans les favoris, on le supprime de la liste
nextState = {
...state,
favoritesFilm: state.favoritesFilm.filter( (item, index) => index !== favoriteFilmIndex)
}
}
else {
// Le film n'est pas dans les films favoris, on l'ajoute à la liste
nextState = {
...state,
favoritesFilm: [...state.favoritesFilm, action.value]
}
}
return nextState || state
default:
return state
}
}
export default toggleFavorite
configureStore.js
import { createStore } from 'redux';
import toggleFavorite from './reducers/favoriteReducers';
export default createStore(toggleFavorite);
Si quelqu'un peut me dépatouiller de ceci, je le remercierai beaucoup
Salut je veux créer une application qui nécessite le stockage et la récupération des données en bases de données avec react native. Du coup j'ai des connaissances en php et son fremwork symfony 4. Je veux savoir s'il est possible de le faire avec un langage back-end sans creer d'api ou si le back-end react native ne fonctionne qu'avec des apis.
Partons du principe qu'il n'y a pas de mauvaises questions... J'ai 2 soucis :
1. je n'arrive pas à disposer de Nuclide à partir d'Atom,
2. concernant le chapitre "Faites vos premiers pas avec les components React", je me suis aperçu que je ne pointais pas sur un fichier app.js, mais sur un fichier app.tsx. Pourquoi ?
Et donc je suis parti de ce app.tsx qui fonctionnait bien pour afficher "Hello !" sur mon iphone et j'ai fait un copier/coller de vos lignes, ainsi que pour le ficher search.js
Or, sur mon iphone apparaît le message d'erreur suivant :
"Unable to resolve module './Components/Search' from 'C:\Users\AG\Desktop\ReactNative\MoviesAndMe\App.tsx'. Indeed, none of these files exist:
je sollicite votre aide pour un erreur que j'ai lorsque j’essaye de me connecter a TMDB toute en sachant que j'ai tester ma clef et mes requêtes sur le site lui même et tout marche très bien.
Salut, je viens de finir le cours, c’était bien cool .
Par contre quelque chose me chagrine, lorsque l'on saisi par exemple "ster" au lieu de "star", la correction de l'iphone le change en star, mais la recherche porte bien sur ster, il y a t'il un moyen de récupérer cette correction plutôt que le mot saisi initialement ?
Salut ConstantG ! J'ai eu le même pb que toi avec "createStackNavigation" que je dois importer depuis "reac-navigation". Dans le cours c'est le moment ou tu est sensé avoir le titre "Recherche" en haut de ta page.
J'ai résolu le pb en écrivant dans mon fichier js : import { createStackNavigator } from 'react-navigation-stack';
Salut ConstantG ! J'ai eu le même pb que toi avec "createStackNavigation" que je dois importer depuis "reac-navigation". Dans le cours c'est le moment ou tu est sensé avoir le titre "Recherche" en haut de ta page.
J'ai résolu le pb en écrivant dans mon fichier js : import { createStackNavigator } from 'react-navigation-stack';
J'espère que ça a pu t'aider
Inco
- Edité par InconiosIncognito il y a environ 6 heures
Merci de ton aide :)
Mais j'ai exactement la même erreur mais avec stack :(, est-ce que tu as fait un npm install react-navigation stack N
Unable to resolve "react-navigation-stack" from "Navigation\Navigation.js"
Voici mon navigation.js
// Navigation/Navigation.js
import { createAppContainer } from 'react-navigation'
import Search from '../Components/Search'
import { createStackNavigator } from 'react-navigation-stack';
const SearchStackNavigator = createStackNavigator({
Search: { // Ici j'ai appelé la vue "Search" mais on peut mettre ce que l'on veut. C'est le nom qu'on utilisera pour appeler cette vue
screen: Search,
navigationOptions: {
title: 'Rechercher'
}
}
})
export default createAppContainer(SearchStackNavigator)
J'ai eu quelques soucis avec la navigation, comme le message précédent (J'ai ouvert et solutionné mon post).
En revanche, pour ma part, le :
this.props.navigation.navigate('FilmDetail')
ne fait absolument rien et le console.log de ceci me renvoie false. Il ne me semble avoir rien omis pourtant. Je n'ai pas d'erreurs, il ne se passe juste rien ... (Je rentre bien dans ma fonction :
_displayDetailForFilm = (idFilm) => {
console.log("Display film with id " + idFilm)
console.log(this.props.navigation.navigate('FilmDetail'))
this.props.navigation.navigate('FilmDetail')
}
Bonjour, merci pour ce super cours, c'est très clair, tu es un bon pédagogue !
Mille fois merci
J'aimerais modifier le type de l'application en listant des restaurant ou des maraichers à la place de films. Une liste que je gérerais moi-même et à laquelle j'ajouterais des nouvelles entrées au fur et à mesure. [J'aimerais pousser un peu plus loin en ajoutant un affichage map/liste, on verra plus tard...]
Pour ce faire, dois-je me munir du API contenant la liste des restaurants ? Si oui, dois-je la créer moi-même ?
info Running jetifier to migrate libraries to AndroidX. You can disable it using "--no-jetifier" flag.
Jetifier found 855 file(s) to forward-jetify. Using 4 workers...
info Starting JS server...
info Installing the app...
Exception in thread "main" java.lang.RuntimeException: Timeout of 120000 reached waiting for exclusive access to file: C:\Users\user\.gradle\wrapper\dists\gradle-5.4.1-all\3221gyojl5jsh0helicew7rwx\gradle-5.4.1-all.zip
at org.gradle.wrapper.ExclusiveFileAccessManager.access(ExclusiveFileAccessManager.java:65)
at org.gradle.wrapper.Install.createDist(Install.java:48)
at org.gradle.wrapper.WrapperExecutor.execute(WrapperExecutor.java:107)
at org.gradle.wrapper.GradleWrapperMain.main(GradleWrapperMain.java:63)
error Failed to install the app. Make sure you have the Android development environment set up: https://facebook.github.io/react-native/docs/getting-started.html#android-development-environment. Run CLI with --verbose flag for more details.
Error: Command failed: gradlew.bat app:installDebug -PreactNativeDevServerPort=8081
Exception in thread "main" java.lang.RuntimeException: Timeout of 120000 reached waiting for exclusive access to file: C:\Users\user\.gradle\wrapper\dists\gradle-5.4.1-all\3221gyojl5jsh0helicew7rwx\gradle-5.4.1-all.zip
at org.gradle.wrapper.ExclusiveFileAccessManager.access(ExclusiveFileAccessManager.java:65)
at org.gradle.wrapper.Install.createDist(Install.java:48)
at org.gradle.wrapper.WrapperExecutor.execute(WrapperExecutor.java:107)
at org.gradle.wrapper.GradleWrapperMain.main(GradleWrapperMain.java:63)
at checkExecSyncError (child_process.js:629:11)
at execFileSync (child_process.js:647:13)
at runOnAllDevices (C:\Users\user\Desktop\MyAwesomeProject\node_modules\@react-native-community\cli-platform-android\build\commands\runAndroid\runOnAllDevices.js:74:39)
at buildAndRun (C:\Users\user\Desktop\MyAwesomeProject\node_modules\@react-native-community\cli-platform-android\build\commands\runAndroid\index.js:158:41)
at then.result (C:\Users\user\Desktop\MyAwesomeProject\node_modules\@react-native-community\cli-platform-android\build\commands\runAndroid\index.js:125:12)
at process._tickCallback (internal/process/next_tick.js:68:7)
bonsoir, je n'arrive pas à créer une application avec du code native est ce qu'il y a une solution ?
- Edité par AnisZarrouk 20 septembre 2019 à 21:10:58
J'ai fini le cours hier. Merci c'était super pour un débutant comme moi.
Cependant j'ai un soucis. Je croyais que ça venait de mon code mais j'ai téléchargé ta version de github et le soucis est le même.
Si l'appli est killée, la liste des films favoris remonte bien, par contre l'avatar lui est invisible (si on a choisi un avatar de la gallery android par exemple). La donnée est bien stockée via le reducer et même à l'air d'être réhydratée. Mais le visuel reste blanc.
Peux-tu me dire si le problème n'est que sur mon smartphone ? Ou tu as ce souci aussi ou quelqu'un da'autres peut être qui en est là ?
Merci d'avance
Bonjour, j'ai le même soucis, l'avatar qui soit n'est pas persisté, soit qui n'est pas réhydraté, pour les films en favoris par contre aucun soucis.
Je débute dans la programmation, l'approche du cours est pas toujours évidente mais j'y arrive jusqu’à ce que j'ai ça:
Et je ne vois pas trop quoi faire, j'ai tenté les étapes d'installations du début mais ça ne fonctionne pas, une solution?
EDIT: J'ai trouvé la solution, en fait j'avais, via des lignes de commande, update le node en version 12.11.1 qui est la version "current" et qui n'est pas recommandé comme indiquer dans le cours, là ou l'auteur recommande la version LTS. D'ou ma surprise en voyant la version 12, a mon avis je l'avais update via une ligne de commande. (en installant chocolatey peut etre?)
J'ai donc désinstaller l'ancienne version et du tout réinstaller en faisant un backup de mes fichiers configurer au préalable bien entendu.
Tout fonctionne
- Edité par SpectralRenzukoken1 8 octobre 2019 à 10:27:52
je commence à peine le tutoriel, que je me retrouve face à une impasse.
Déjà dans le tutoriel il est écrit que l'on devrait se retrouver avec ce code-ci :
//App.js
import React from 'react';
import { StyleSheet, Text, View } from 'react-native';
export default class App extends React.Component {
render() {
return (
<View style={styles.container}>
<Text>Open up App.js to start working on your app!</Text>
</View>
);
}
}
const styles = StyleSheet.create({
container: {
flex: 1,
backgroundColor: '#fff',
alignItems: 'center',
justifyContent: 'center',
},
});
Sauf que moi, je me retrouve avec ce code-ci :
import React from 'react';
import { StyleSheet, Text, View } from 'react-native';
export default function App() {
return (
<View style={styles.container}>
<Text>Open up App.js to start working on your app!</Text>
</View>
);
}
const styles = StyleSheet.create({
container: {
flex: 1,
backgroundColor: '#fff',
alignItems: 'center',
justifyContent: 'center',
},
});
La différence est au niveau de "export default function App()..."
Et quand j'essais de mettre comme dans le cours, l'élément "Component" de "React.Component" est orange/rouge. Et j'ai des messages d'erreurs lorsque je regarde mon émulateur...
Je suis un peu perdu et j'ignore pourquoi je ne me retrouve pas avec le même texte.
je viens de commencer le cours de React Native, mais comme je suis novice en développement je pense que quelqu'un d'entre vous peut m'aider à comprendre ce bout de code:
En effet, quand j'ai checké un peu sur le net je vois fetch avec deux .then imbriqués et dans le code ci-dessous je vois un appel de fonction avec un then à la suite. je me sens un peu perdu, pouvez-vous s'il vous plait m'éclaircir. c'est surtout la syntaxe de ce bout de code qui me rend fou lol
j'ai un problème avec la mise en place de react native j'ai un message a chaque fois sur la ligne de commande m'invite a modifier un fichier app.json que je le trouve même pas a savoir que j'ai pas réussie a installer mon application merci pour votre aide
tout le monde a appris personne est née avec des connaissance
Dans la vie, soit on gagne... Soit on apprend!