Skynet with React

In most instances, React and React-based frameworks work seamlessly with Skynet. Here are some tips to keep in mind when using Create React App.
We use Create React App in the Introduction Workshop, so you can refer to that codebase as well.

Use HashRouter when using React-Router and Drag-and-Drop Uploader

We fully support BrowserRouter and other routing techniques using Framework-Flexible Routing, but for getting started, sometimes it's nice to just drag-and-drop your build folder.
If you're using React Router for your page routing, you may want to use its HashRouter instead of BrowserRouter . This helps if you want your site to also deploy on IPFS or Arweave, which don't support Framework-Flexible Routing.
In many code examples, this replacement happens in the import statement.
import {
// BrowserRouter as Router,
HashRouter as Router,
} from "react-router-dom";
This will modify links to contain # before the route.

Build & Deploy

Run your normal build command, then upload the build folder containing an index.html file to Skynet. When using the homepage, be sure to select the folder tab.
Select the "Do you want to upload a web app or directory?" Tab before Uploading

Going Further

Next, consider automatically building and deploying your site using our copy-and-paste Github Action.
Or, consider hosting your website using a Handshake Name, ENS .eth name, or a traditional domain name using DNSLink.