IPFS Front-end application of the Melon portal.
-
Clone this repository
git clone git@github.com:melonproject/ipfs-frontend.git cd ipfs-frontend -
Install dependencies:
npm install
After installation is complete
Go to the above ipfs-frontend directory, open a terminal and launch the react application:
npm start
npm run-script build
Build the react application:
npm build
React-script will create automatically the /build directory with a /static folder containing the .js and .css files. Since ipfs cannot handle relative paths, we need to get rid of the static folder and move all the files in the subfolders to the build directory. Next, change all the references of the files in index.html.
With the ipfs daemon running, deploy the app:
ipfs add -r build
The whole source code can be found in /src. The main architectural patterns are coming from:
- Create React App
- Redux
- Redux Saga
- Semantic UI React (We will move away from this)
Here is a quick overview and description of the subfolders of /src:
The main entry point is here: index.js
Redux actions and creators. Each file exports { types, actions }.
As a rule of thumb, we write imperative actions for user interactions: E.g. SHOW_MESSAGE_BOX or SHOW_ERROR.
And reactive actions for blockchain observations: HAS_CONNECTED, NEW_BLOCK, ...
Stateless, functional components.
Store, router and other configuration.
Connected & composed components. See react-redux.