Search code examples
reactjsreact-router-domnetlify

Can I host my react app for free making use of react-router-dom with Netlify?


My project:

  • React (I use create-react-app library)
    • Use react-router-dom using BrowserRouter, Route & Switch imports. This allows me to go to different urls: for example, when I run my app on localhost, localhost3000 is home. Part of my app's functionality is to randomly generate urls - for instance: localhost3000/123456 or localhost3000/654321.
  • Make changes to a database in Firebase's Realtime Database & uses Firebase's Auth.

What I need:

  • Free: since this app is a portfolio piece, I'm thinking all I need is any domain name that allows me to make use of react-router-dom. For instance, www.anyname.com is home & www.anyname/123456.com is one of my routes.

  • Not-free: If there's no ability to achieve what I want for free, then I'm happy to buy a domain-name and would appreciate suggestions of how I can go about this.

What I've researched:

  • Netlify was suggested to me. I know it gives the ability to alter part of the domain name but I don't know if it'll display my 'routes' e.g. (nameofmychoosing.netlify.app is home & nameofmychoosing/123456.netlify.app is one of my routes - would this work?).

P.S. if this is not the right place to post this question, directing me to the right kind of forum'd be much appreciated.


EDIT: just discovered this and this which say I need to make a slight modification to get netlify to work with react-router-dom.


Solution

  • I am able to, with Netlify, host my react app for free and make use of react-router-dom by i) creating a file called _redirects in the folder where .html lives and ii) inserting in _redirects: /* /index.html 200.

    There is already a similar SO question & answer here that I'd like to link my question to. I don't know how to do that so if anyone could show me that'd be appreciated.