README.md

   1 # Chain Core Dashboard
   2
   3 ## Development
   4
   5 #### Setup
   6
   7 Install Node.js:
   8
   9 ```
  10 brew install node
  11 ```
  12
  13 Install dependencies:
  14
  15 ```
  16 npm install
  17 ```
  18
  19 Start the development server with
  20
  21 ```
  22 npm start
  23 ```
  24
  25 By default, the development server uses the following environment variables
  26 with default values to connect to a local Chain Core instance:
  27
  28 ```
  29 API_URL=http://localhost:3000/api
  30 PROXY_API_HOST=http://localhost:1999
  31 ```
  32
  33 #### Style Guide
  34
  35 We use `eslint` to maintain a consistent code style. To check the source
  36 directory with `eslint`, run:
  37
  38 ```
  39 npm run lint src
  40 ```
  41
  42 #### Tests
  43
  44 The Chain Core Dashboard has a series of integration tests that can be run
  45 against a running core. First, start Chain Core and Dashboard on their default
  46 ports of 1999 and 3000 respective. Then, start tests with the command:
  47
  48 ```
  49 npm test
  50 ```
  51
  52 There an extended test suite that can be run with:
  53
  54 ```
  55 npm run testExtended
  56 ```
  57
  58 (Note: The extended test suite can take significantly longer to run, as test
  59   files cannot be run in parallel).
  60
  61 ### React + Redux
  62
  63 #### ES6
  64
  65 Babel is used to transpile the latest ES6 syntax into a format understood by
  66 both Node.js and browsers. To get an ES6-compatible REPL (or run a one-off script)
  67 you can use the `babel-node` command:
  68
  69 `$(npm bin)/babel-node`
  70
  71 #### Redux Actions
  72
  73 To inspect and debug Redux actions, we recommend the "Redux DevTools" Chrome
  74 extension:
  75
  76 https://chrome.google.com/webstore/detail/redux-devtools/lmhkpmbekcpmknklioeibfkpmmfibljd
  77
  78
  79 #### Creating new components
  80
  81 To generate a new component with a connected stylesheet, use the following
  82 command:
  83
  84 ```
  85 npm run generate-component Common/MyComponent
  86 ```
  87
  88 The above command will create two new files in the `src/components` directory:
  89
  90 ```
  91 src/components/Common/MyComponent/MyComponent.jsx
  92 src/components/Common/MyComponent/MyComponent.scss
  93 ```
  94
  95 with `MyComponent.scss` imported as a stylesheet into `MyComponent.jsx`.
  96
  97 Additionally, if there is an `index.js` file in `src/components/Common`, it
  98 will appropriately add the newly created component to the index exports.
  99
 100
 101 ## Production
 102
 103 In production environments, Chain Core Dashboard is served from within `cored`. The contents
 104 of the application are packaged into a single Go source file that maps generated
 105 filenames to file contents.
 106
 107 To deploy an updated dashboard to production:
 108
 109 1. Package the dashboard in production mode using `webpack` with:
 110
 111     ```sh
 112     $ npm run build
 113     ```
 114
 115 2. Bundle the packaged output into an updated `dashboard.go`:
 116
 117     ```sh
 118     $ go install ./cmd/gobundle
 119     $ gobundle -package dashboard dashboard/public > generated/dashboard/dashboard.go
 120     $ gofmt -w generated/dashboard/dashboard.go
 121     ```
 122
 123 3. Commit the resulting `dashboard.go`, then rebuild and start `cored`
 124
 125     ```sh
 126     $ go install ./cmd/cored
 127     $ cored
 128     ```
 129
 130     Dashboard will be served at the root path from the `cored` server.