1  # Discover
  2  
  3  Discover new and useful DApps that are mobile-friendly and easy to use. Viewing curated information does not require any special tools, though effecting the way information is ranked will require a web3 wallet, whether that is Status, MetaMask, Trust, Brave or whichever one you prefer.
  4  
  5  You can learn more about bonded curves and how Discover works [here](https://our.status.im/discover-a-brave-new-curve/).
  6  
  7  
  8  ## Table of Contents
  9  
 10  - [Stack](#stack)
 11  - [Deployed Contracts](#deployed-contracts)
 12  - [Getting Started](#getting-started)
 13  - [Contributing](#contributing)
 14  <!-- - [License](#license) -->
 15  
 16  
 17  ### Stack
 18  * Smart contract compiler Framework: [Embark v4.0.1](https://github.com/embarklabs/embark)
 19  * JS Framework: [React](https://github.com/facebook/react) + [Typescript](https://github.com/microsoft/TypeScript)
 20  * SEO & Metadata: [Helmet.js](https://helmetjs.github.io/)
 21  * Blockchain components: [Ethers.js](https://github.com/ethers-io/ethers.js/) + [web3-react](https://github.com/NoahZinsmeister/web3-react)
 22  * Styling: [JSS](https://cssinjs.org/?v=v10.0.3) + [Material UI](https://material-ui.com/)
 23  * State management: [Redux](https://redux.js.org/) + [Redux-Saga](https://redux-saga.js.org/) + [Reselect](https://github.com/reduxjs/reselect)
 24  * Template generation: [Plop](https://plopjs.com/) + [Handlebars.js](https://handlebarsjs.com/)
 25  * Compiling: [Webpack](https://webpack.js.org/) + [Babel](https://babeljs.io/)
 26  * Forms & Validation: [Formik](https://jaredpalmer.com/formik) + [Yup](https://github.com/jquense/yup)
 27  * Notifications: [Toastify](https://fkhadra.github.io/react-toastify/)
 28  
 29  ### Structure
 30  
 31  The boiler is set up as a [Yarn](https://yarnpkg.com/) workspace/monorepo, this allows for adding additional workspaces like `Blockchain` or `Server` if required and executing parallel scripts across all spaces.
 32  
 33  ### Webapp
 34  
 35  The web app is structured as a standard React app, the important areas to note is the `/api`, `/domains`, `/containers` & `/components`.
 36  
 37  The api interactions have helpers to automatically format form field data, collect access token headers and allow for reducer-esque api calling functions.
 38  
 39  The domains folder acts as the apps main Daemon & singleton business logic management components, general app actions are managed here, reducers for the domain state, selectors etc can be found here. Domains are meant to be globally accessable services facilitated through Redux-Saga for async actions
 40  
 41  The containers folder allows for managing the business logic of constructing selectors, action dispatch functions, and any complex operations that should be managed seperately from the mark up.
 42  
 43  The components folder is for markup files & styling.
 44  
 45  ## Install
 46  
 47  The goal of our local build process is to abstract away the complexity with smart contracts so that you can focus on adding useful new functionality through React-based bounties that are easy to get started on.
 48  
 49  ### Prerequisites
 50  
 51  1. [Node v10](https://github.com/nvm-sh/nvm) or higher.
 52  2. [Yarn](https://yarnpkg.com/).
 53  3. [mongodb](https://www.mongodb.com/).
 54  
 55  First, run yarn to install the workspace dependancies:
 56  
 57  ```
 58  yarn install
 59  ```
 60  
 61  On Linux, setting up `mongodb` is as easy as `sudo apt install -y mongodb`, which will also start it automatically. You can stop/restart your local DB any time with `sudo systemctl stop mongodb`, or get its status with `sudo systemctl status mongodb`. I recommend using the simple [robo3t](https://robomongo.org/download) to view and edit your DB easily (you'll need to set DApps to `APPROVED` to see `Edit` and `Withdraw` options and to see them appear in Categories etc.)
 62  
 63  ### Mongo set up
 64  
 65  1. `export DB_CONNECTION=mongodb://localhost:27017/mydb`. Make sure you have `DB_CONNECTION` set as an ENV variable so the app knows where to find your local DB.
 66  2. TODO`yarn run build:localhost`. This will:
 67      1. Compile all your contracts using Embark, connecting to Ropsten and IPFS through an Infura gateway.
 68      2. Deploy a new instance of Discover onto the Ropsten test network for you to work from. It will only be deployed once, after that the address of your contract is stored in, and fetched from, `shared.development.chains.json`.
 69      3. Build the frontend, create a directory called `full-build`, move each directory from the `Backend` into it, and include the `frontend` as a directory of its own. It will make sure `node_modules` are installed, then you can serve everything in `full-build` by running:
 70  3. `yarn server-start`. Navigate to `http://localhost:4000` to get developing cool new things for the future of curated information.
 71  
 72  **Note:**
 73  
 74  1. Change this line in [Backend/config/index.js](https://github.com/dap-ps/discover/blob/master/Backend/config/index.js#L24) to your local Ropsten version of the contract, stored in `shared.development.chains.json`.
 75  2. You'll need to visit [simpledapp.eth using Status](https://status.im/get/) -> Assets Tab -> Request `STT`. This is the Status Test Token on Ropsten that needs to be used with your instance of Discover in order to submit/upvote/downvote in your local app. Using a proper test network even for local development allows us to better understand what the user experience is actually like in production more easily.
 76  
 77  ## Usage
 78  
 79  ### Development
 80  
 81  For running a local instance use the command:
 82  ```
 83  yarn start:dev
 84  ```
 85  
 86  ### Template generator
 87  
 88  To make use of the webapp template generator, first open a terminal and navigate to `./WebApp`, run the command `yarn generate` & follow the prompts.
 89  
 90  ### Build
 91  
 92  To build the project across workspaces, at the root of the directory, run the command `yarn build`.
 93  
 94  ### Production build
 95  1. Run `yarn` to install the relevant packages
 96  2. Set the environment files with the required values in `Backend`, `Contracts` & `WebApp`
 97  3. Run `yarn create:fullbuild`
 98  4. `app.zip` will be found in the root of the repo
 99  
100  ## Contributions
101  
102  Frontend boilerplate designed & crafted originally by [@panterazar](https://github.com/panterazar)
103  
104  General updates & modifications by [@RyRy79261](https://github.com/RyRy79261)
105  
106  ## Deployed Contracts
107  
108  Ropsten (the first is `STT`, the Status Test Token):
109  
110  ```
111  MiniMeToken: { address: '0xc55cf4b03948d7ebc8b9e8bad92643703811d162' },
112  Discover: { address: '0x008db8b84547982e8F6677D38e9b9ea64F3ccB8B' },
113  ```
114  
115  Mainnet:
116  
117  ```
118  MiniMeToken: { address: '0x744d70fdbe2ba4cf95131626614a1763df805b9e' },
119  Discover: { address: '0x5bCF2767F86f14eDd82053bfBfd5069F68C2C5F8' },
120  ```
121  
122  ## Getting Started
123  
124  The goal of our local build process is to abstract away the complexity with smart contracts so that you can focus on adding useful new functionality through React-based bounties that are easy to get started on.
125  
126  #### 3 Prerequisites
127  
128  1. [Node v10](https://github.com/nvm-sh/nvm) or higher.
129  2. [Yarn](https://yarnpkg.com/).
130  3. [mongodb](https://www.mongodb.com/).
131  
132  On Linux, setting up `mongodb` is as easy as `sudo apt install -y mongodb`, which will also start it automatically. You can stop/restart your local DB any time with `sudo systemctl stop mongodb`, or get its status with `sudo systemctl status mongodb`. I recommend using the simple [robo3t](https://robomongo.org/download) to view and edit your DB easily (you'll need to set DApps to `APPROVED` to see `Edit` and `Withdraw` options and to see them appear in Categories etc.)
133  
134  #### 4 Quick Steps
135  
136  1. `export DB_CONNECTION=mongodb://localhost:27017/mydb`. Make sure you have `DB_CONNECTION` set as an ENV variable so the app knows where to find your local DB.
137  2. `yarn start:dev`. This will: 
138      1. Compile all your contracts using Embark, connecting to Ropsten and IPFS through an Infura gateway.
139      2. Deploy a new instance of Discover onto the Ropsten test network for you to work from. It will only be deployed once, after that the address of your contract is stored in, and fetched from, `shared.development.chains.json`. 
140  
141  **Note:**
142  
143  1. Change this line in [Backend/config/index.js](https://github.com/dap-ps/discover/blob/master/Backend/config/index.js#L24) to your local Ropsten version of the contract, stored in `shared.development.chains.json`.
144  2. You'll need to visit [simpledapp.eth using Status](https://status.im/get/) -> Assets Tab -> Request `STT`. This is the Status Test Token on Ropsten that needs to be used with your instance of Discover in order to submit/upvote/downvote in your local app. Using a proper test network even for local development allows us to better understand what the user experience is actually like in production more easily.
145  
146  #### Work to be done
147  
148  1. Integrate Kyber functionality so that people can use (at least) SNT, ETH and DAI to participate in the store (it just gets exchanged in the background into SNT before being submitted to the contract).
149  2. Create a `downvote pool` for each DApp so that anyone can downvote by any amount, not just 1%. When the pool hits 1%, the downvote is sent to the contract. This will be important if people ever stake large amounts, 1% of which may be too expensive for individual users. It will potentially amplify "the community's" ability to respond to bad actors.
150  3. Integrate [embeddable whisper chats](https://github.com/status-im/status-chat-widget) into the site, so that it is easy to plug into the community chat directly "behind" each DApp (it's just the name of the DApp as a whisper topic, i.e. #cryptokitties).
151  4. Research a way to fetch information about popular DApps on Ethereum through non-economic metrics. Perhaps this means just plugging into an API from OpenSea/StateOfTheDApps for now and leveraging their work. Perhaps it means figuring out how to [gossip information about use of DApps via whisper](https://discuss.status.im/t/friend-to-friend-content-discovery-community-feeds/1212)?
152  
153  
154  #### Running unit tests
155  
156  Use `./node_modules/.bin/embark test`
157  
158  To test a specific smart contract you can use `./node_modules/.bin/embark test test/Discover_spec.js`.
159  
160  #### Running slither
161  
162  `slither . --exclude naming-convention --filter-paths token`
163  
164  Make sure you get TrailofBits' [latest static analysis tool](https://securityonline.info/slither/), and do your own static analysis on the relevant contracts that you are working on.
165  
166  ## Available Scripts
167  
168  This project is based on Embark v4.0.1, with a few things customised for React.
169  
170  ```
171  yarn run build:dev
172  ```
173  or
174  ```
175  yarn run build
176  ```
177  
178  Builds the app into the `full-build` directory and creates the `app.zip` ready for use with ElasticBeanstalk.