Merge pull request #49 from berty/meta/init-react-front

feat(front): Setup React

.dockerignore

@@ -0,0 +1 @@
+Dockerfile

Dockerfile

@@ -1,17 +1,29 @@
-# build
-FROM            golang:1.13-alpine as build
-RUN             apk add --update --no-cache git gcc musl-dev make
+# web build
+FROM            node:10 as web-build
+WORKDIR         /app
+COPY            ./web/package*.json ./web/yarn.* ./
+RUN             npm install
+COPY            ./web ./
+RUN             npm run build
+
+# go build
+FROM            golang:1.14-alpine as go-build
+RUN             apk add --update --no-cache git gcc musl-dev make perl-utils
 RUN             GO111MODULE=off go get github.com/gobuffalo/packr/v2/packr2
 WORKDIR         /go/src/berty.tech/yolo
-ENV             GO111MODULE=on
+ENV             GO111MODULE=on \
+                GOPROXY=proxy.golang.org
 COPY            go.* ./
 RUN             go mod download
 COPY            . ./
-RUN		packr2
+RUN             rm -rf web
+COPY            --from=web-build /app/dist web
+RUN		        make packr
 RUN             make install
 
 # minimalist runtime
 FROM alpine:3.11
 RUN             apk add --update --no-cache ca-certificates
-COPY            --from=build /go/bin/yolo /bin/
+COPY            --from=go-build /go/bin/yolo /bin/
 ENTRYPOINT      ["yolo"]
+EXPOSE          8000

Makefile

@@ -10,6 +10,10 @@ install: generate
 lint: generate
 	golangci-lint run
 
+.PHONY: packr
+packr:
+	cd pkg/yolosvc && packr2 && ls -la *-packr.go packrd/packed-packr.go
+
 ##
 ## generate
 ##

web/.babelrc

@@ -0,0 +1,63 @@
+{
+  "env": {
+    "development": {
+      "presets": [
+        "@babel/react",
+        ["@babel/env", {
+          "corejs": 3,
+          "targets": {
+            "node": "current",
+            "browsers": ["last 2 versions"]
+          },
+          "useBuiltIns": "usage"
+        }]
+      ],
+      "plugins": [
+        "@babel/plugin-transform-runtime",
+        "@babel/plugin-syntax-dynamic-import",
+        ["transform-react-remove-prop-types",{ "removeImport": true }],
+        "@babel/plugin-proposal-class-properties",
+        "react-hot-loader/babel"
+      ]
+    },
+    "production": {
+      "presets": [
+        "@babel/react",
+        ["@babel/env", {
+          "corejs": 3,
+          "targets": {
+            "node": "current",
+            "browsers": ["last 2 versions"]
+          },
+          "useBuiltIns": "usage"
+        }]
+      ],
+      "plugins": [
+        "@babel/plugin-transform-runtime",
+        "@babel/plugin-syntax-dynamic-import",
+        ["transform-react-remove-prop-types",{ "removeImport": true }],
+        "@babel/plugin-proposal-class-properties",
+        "@babel/plugin-transform-react-constant-elements",
+      ]
+    },
+    "test": {
+      "presets": [
+        "@babel/react",
+        ["@babel/env", {
+          "corejs": 3,
+          "targets": {
+            "node": "current",
+            "browsers": ["last 2 versions"]
+          },
+          "useBuiltIns": "usage"
+        }]
+      ],
+      "plugins": [
+        "@babel/plugin-transform-runtime",
+        "@babel/plugin-syntax-dynamic-import",
+        ["transform-react-remove-prop-types",{ "removeImport": true }],
+        "@babel/plugin-proposal-class-properties"
+      ]
+    }
+  }
+}

web/.env.dev

@@ -0,0 +1,3 @@
+NODE_ENV=development
+__DEV__=true
+API_URL=https://yolo.berty.io/api

web/.env.prod

@@ -0,0 +1,3 @@
+NODE_ENV=production
+__DEV__=false
+API_URL=/api

web/.eslintignore

@@ -0,0 +1,8 @@
+package.js  // Package, Cordova and Npm vars are set as global, so no need to ignore this file
+package.json  // You might want to keep this though, because config prefers single quotes
+node_modules/
+bower_components/
+.npm/
+build/
+packages/
+.git/

web/.eslintrc.json

@@ -0,0 +1,79 @@
+{
+  "parser": "babel-eslint",
+  "parserOptions": {
+    "allowImportExportEverywhere": true,
+    "ecmaFeatures": {
+      "jsx": true
+    }
+  },
+  "env": {
+    "browser": true,
+    "node": true
+  },
+  "plugins": [
+    "react",
+    "react-hooks",
+    "node",
+    "promise",
+    "jsx-a11y"
+  ],
+  "extends": [
+    "airbnb",
+    "eslint:recommended",
+    "plugin:jsx-a11y/recommended",
+    "plugin:react/recommended"
+  ],
+  "globals": {
+    "expect": false
+  },
+  "rules": {
+    "react-hooks/rules-of-hooks": "error",
+    "react-hooks/exhaustive-deps": "warn",
+    "react/prop-types": 0,
+    "react/display-name": 0,
+    "react/button-has-type": 0,
+    "import/no-unresolved": 0,
+    "import/no-extraneous-dependencies": 0,
+    "import/extensions": 0,
+    "import/no-absolute-path": 0,
+    "jsx-a11y/anchor-is-valid": [
+      "error",
+      {
+        "components": [
+          "Link"
+        ],
+        "specialLink": [
+          "to"
+        ]
+      }
+    ],
+    "semi": ["error", "never"],
+    "max-len": 0,
+    "no-alert": 0,
+    "no-console": 0,
+    "no-shadow": 0,
+    "no-restricted-globals": 0,
+    "no-return-assign": [
+      "error",
+      "except-parens"
+    ],
+    "no-underscore-dangle": [
+      "error",
+      {
+        "allow": [
+          "_id",
+          "_ensureIndex",
+          "_verifyEmailToken",
+          "_resetPasswordToken",
+          "_name"
+        ]
+      }
+    ],
+    "class-methods-use-this": 0,
+    "react/jsx-filename-extension": 0,
+    "react/forbid-prop-types": 0,
+    "react/no-array-index-key": 0,
+    "array-callback-return": 1,
+    "no-use-before-define": ["error", { "functions": false, "variables": false }]
+  }
+}

web/.gitignore

@@ -0,0 +1,77 @@
+.env.local
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+*.log*
+
+# Runtime data
+pids
+*.pid
+*.seed
+
+# Directory for instrumented libs generated by jscoverage/JSCover
+lib-cov
+
+# Coverage directory used by tools like istanbul
+coverage
+
+# Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files)
+.grunt
+
+# node-waf configuration
+.lock-wscript
+
+# Compiled binary addons (http://nodejs.org/api/addons.html)
+build/Release
+
+# Dependency directory
+# https://www.npmjs.org/doc/misc/npm-faq.html#should-i-check-my-node_modules-folder-into-git
+node_modules
+jspm_packages/
+
+#dist folder
+dist
+
+# IDEA/Webstorm project files
+.idea
+*.iml
+
+#VSCode metadata
+.vscode
+
+# Mac files
+.DS_Store
+
+# nyc test coverage
+.nyc_output
+
+# Bower dependency directory (https://bower.io/)
+bower_components
+
+# Typescript v1 declaration files
+typings/
+
+# Optional npm cache directory
+.npm
+
+# Optional eslint cache
+.eslintcache
+
+# Optional REPL history
+.node_repl_history
+
+# Output of 'npm pack'
+*.tgz
+
+# dotenv environment variables file
+.env
+
+# Yarn
+yarn-error.log
+.pnp/
+.pnp.js
+# Yarn Integrity file
+.yarn-integrity

web/.prettierrc

@@ -0,0 +1,8 @@
+---
+bracketSpacing: false
+printWidth: 80
+semi: true
+singleQuote: true
+tabWidth: 2
+useTabs: false
+arrowParens: always

web/README.md

@@ -0,0 +1,19 @@
+# Initializing React for Yolo ⚛
+
+Just a placeholder for now. You must launch it from this subdirectory.
+
+You will need to set `$YOLO_APP_PW` in your local environment before running these commands. (This is still not secure enough for production, but allows us to avoid committing a hardcoded password.)
+
+```shell
+npm install
+npm start
+```
+
+Build:
+
+```shell
+npm run build
+cd ./dist
+python -m SimpleHTTPServer
+open http://localhost:8080
+```