Skynet Workshops
Skynet Topics
Integrations
Developer Guides
WEBPORTAL MANAGEMENT
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.
1
import {
2
// BrowserRouter as Router,
3
HashRouter as Router,
4
Switch,
5
Route,
6
Link
7
} from "react-router-dom";
Copied!
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 Siasky.net 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.