Puis-je héberger mon application React gratuitement en utilisant react-router-dom avec Netlify?
Mon projet:
- React (j'utilise la create-react-appbibliothèque)
- Utilisez
react-router-dom
usingBrowserRouter
,Route
&Switch
importations. Cela me permet d'accéder à différentes URL: par exemple, lorsque j'exécute mon application sur localhost,localhost3000
c'est chez moi. Une partie des fonctionnalités de mon application consiste à générer des URL de manière aléatoire - par exemple:localhost3000/123456
oulocalhost3000/654321
.
- Utilisez
- Apportez des modifications à une base de données dans la base de données en temps réel de Firebase et utilise l'authentification de Firebase.
Ce dont j'ai besoin:
Gratuit: puisque cette application est un élément de portfolio, je pense que tout ce dont j'ai besoin est un nom de domaine qui me permet de l' utiliser
react-router-dom
. Par exemple,www.anyname.com
est à la maison etwww.anyname/123456.com
est l'un de mes itinéraires.Non gratuit: s'il n'est pas possible d'obtenir gratuitement ce que je veux, je suis heureux d'acheter un nom de domaine et j'apprécierais des suggestions sur la façon dont je peux y parvenir.
Ce que j'ai recherché:
- Netlify m'a été suggéré. Je sais que cela donne la possibilité de modifier une partie du nom de domaine, mais je ne sais pas si cela affichera mes «routes», par exemple (
nameofmychoosing.netlify.app
est à la maison etnameofmychoosing/123456.netlify.app
est l'une de mes routes - cela fonctionnerait-il?).
PS si ce n'est pas le bon endroit pour poster cette question, me diriger vers le bon type de forum serait très apprécié.
EDIT: je viens de découvrir ceci et cela qui dit que je dois faire une légère modification pour que netlify fonctionne react-router-dom
.
Réponses
Vous pouvez modifier librement l'URL de n'importe quelle page Web sur laquelle vous exécutez du code. La seule conséquence est le comportement des URL relatives et ce qui se passe lorsque la page est rechargée. Dans la plupart des environnements auto-hébergés, vous devriez vous sentir libre de changer tout ce qui vient après le domaine. Exhttps://www.example.com/yourrouteshere ou également utilisé https://www.example.com/page#Yourrouteshere. Il faut garder à l'esprit que si l'utilisateur actualise la page, votre backend a encore besoin de fournir une réponse appropriée. Cela peut signifier que le backend renvoie toujours la même chose quel que soit le chemin de l'URL ou cela peut signifier servir quelque chose de différent en fonction de votre cas d'utilisation.
Vous ne devriez pas modifier le domaine lui-même à moins d'avoir une configuration étrange qui repose sur plusieurs noms d'hôte pour un cas d'utilisation étrange.
Une fois que vous avez une application en cours d'exécution, vous pouvez envisager de configurer un enregistrement DNS avec un attribut CNAME à transmettre à l'hôte existant.
Je suis capable, avec Netlify, héberger mon application réagir pour une utilisation libre et faire de react-router-dom
par i) la création d' un fichier appelé _redirects
dans le dossier où la .html
vie et ii) l' insertion dans _redirects
: /* /index.html 200
.
Il y a déjà une question et réponse SO similaire ici à laquelle j'aimerais relier ma question. Je ne sais pas comment faire cela, donc si quelqu'un pouvait me montrer que cela serait apprécié.