diff --git a/.gitignore b/.gitignore index 0bbd81621c466dd6acf57b88eac0caf874e292cb..8d734eba7c4987246da342f2ad8f95bba4d79868 100644 --- a/.gitignore +++ b/.gitignore @@ -4,10 +4,9 @@ # VScode setting File .vscode/* -# -nodemodules/* -./package.json -./package-lock.json +node_modules/* +package-lock.json +package.json # Arduino File arduino/code/test/* \ No newline at end of file diff --git a/client/.gitignore b/client/.gitignore index 4d29575de80483b005c29bfcac5061cd2f45313e..c88bc54a5dcca25250188f24f0d9dcedeb81bcd2 100644 --- a/client/.gitignore +++ b/client/.gitignore @@ -18,6 +18,10 @@ .env.test.local .env.production.local +#DB +src/db +src/data + npm-debug.log* yarn-debug.log* yarn-error.log* diff --git a/client/package-lock.json b/client/package-lock.json index 47dbb9b38ae6d412741cedea386ff06e9413b99e..3076732deee774799bd55c83af9679984bb444a9 100644 --- a/client/package-lock.json +++ b/client/package-lock.json @@ -16,6 +16,9 @@ "moment": "^2.29.1", "ngx-spinner": "^12.0.0", "node-sass": "^6.0.1", + "nodemailer": "^6.6.2", + "pg": "^8.6.0", + "pg-hstore": "^2.3.4", "react": "^17.0.2", "react-bootstrap": "^1.6.1", "react-chartjs-2": "^3.0.3", @@ -30,6 +33,7 @@ "react-scripts": "4.0.3", "react-use": "^17.2.4", "sass": "^1.35.1", + "sequelize": "^6.6.5", "web-vitals": "^1.1.2" } }, @@ -4327,6 +4331,11 @@ "node": ">=4" } }, + "node_modules/any-promise": { + "version": "1.3.0", + "resolved": "https://registry.npmjs.org/any-promise/-/any-promise-1.3.0.tgz", + "integrity": "sha1-q8av7tzqUugJzcA3au0845Y10X8=" + }, "node_modules/anymatch": { "version": "3.1.2", "resolved": "https://registry.npmjs.org/anymatch/-/anymatch-3.1.2.tgz", @@ -5619,6 +5628,14 @@ "resolved": "https://registry.npmjs.org/buffer-indexof/-/buffer-indexof-1.1.1.tgz", "integrity": "sha512-4/rOEg86jivtPTeOUUT61jJO1Ya1TrR/OkqCSZDyq84WJh3LuuiphBYJN+fm5xufIk4XAFcEwte/8WzC8If/1g==" }, + "node_modules/buffer-writer": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/buffer-writer/-/buffer-writer-2.0.0.tgz", + "integrity": "sha512-a7ZpuTZU1TRtnwyCNW3I5dc0wWNC3VR9S++Ewyk2HHZdrO3CQJqSpd+95Us590V6AL7JqUAH2IwZ/398PmNFgw==", + "engines": { + "node": ">=4" + } + }, "node_modules/buffer-xor": { "version": "1.0.3", "resolved": "https://registry.npmjs.org/buffer-xor/-/buffer-xor-1.0.3.tgz", @@ -7553,6 +7570,11 @@ "resolved": "https://registry.npmjs.org/dotenv-expand/-/dotenv-expand-5.1.0.tgz", "integrity": "sha512-YXQl1DSa4/PQyRfgrv6aoNjhasp/p4qs9FjJ4q4cQk+8m4r6k4ZSiEyytKG8f8W9gi8WsQtIObNmKd+tMzNTmA==" }, + "node_modules/dottie": { + "version": "2.0.2", + "resolved": "https://registry.npmjs.org/dottie/-/dottie-2.0.2.tgz", + "integrity": "sha512-fmrwR04lsniq/uSr8yikThDTrM7epXHBAAjH9TbeH3rEA8tdCO7mRzB9hdmdGyJCxF8KERo9CITcm3kGuoyMhg==" + }, "node_modules/duplexer": { "version": "0.1.2", "resolved": "https://registry.npmjs.org/duplexer/-/duplexer-0.1.2.tgz", @@ -10769,6 +10791,14 @@ "resolved": "https://registry.npmjs.org/infer-owner/-/infer-owner-1.0.4.tgz", "integrity": "sha512-IClj+Xz94+d7irH5qRyfJonOdfTzuDaifE6ZPWfx0N0+/ATZCbuTPq2prFl526urkQd90WyUKIh1DfBQ2hMz9A==" }, + "node_modules/inflection": { + "version": "1.13.1", + "resolved": "https://registry.npmjs.org/inflection/-/inflection-1.13.1.tgz", + "integrity": "sha512-dldYtl2WlN0QDkIDtg8+xFwOS2Tbmp12t1cHa5/YClU6ZQjTFm7B66UcVbh9NQB+HvT5BAd2t5+yKsBkw5pcqA==", + "engines": [ + "node >= 0.4.0" + ] + }, "node_modules/inflight": { "version": "1.0.6", "resolved": "https://registry.npmjs.org/inflight/-/inflight-1.0.6.tgz", @@ -14355,7 +14385,6 @@ "version": "0.5.33", "resolved": "https://registry.npmjs.org/moment-timezone/-/moment-timezone-0.5.33.tgz", "integrity": "sha512-PTc2vcT8K9J5/9rDEPe5czSIKgLoGsH8UNpA4qZTVw0Vd/Uz19geE9abbIOQKaAQFcnQ3v5YEXrbSc5BpshH+w==", - "peer": true, "dependencies": { "moment": ">= 2.9.0" }, @@ -14724,6 +14753,14 @@ "node": ">=0.8.0" } }, + "node_modules/nodemailer": { + "version": "6.6.2", + "resolved": "https://registry.npmjs.org/nodemailer/-/nodemailer-6.6.2.tgz", + "integrity": "sha512-YSzu7TLbI+bsjCis/TZlAXBoM4y93HhlIgo0P5oiA2ua9Z4k+E2Fod//ybIzdJxOlXGRcHIh/WaeCBehvxZb/Q==", + "engines": { + "node": ">=6.0.0" + } + }, "node_modules/nopt": { "version": "5.0.0", "resolved": "https://registry.npmjs.org/nopt/-/nopt-5.0.0.tgz", @@ -15262,6 +15299,11 @@ "node": ">=6" } }, + "node_modules/packet-reader": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/packet-reader/-/packet-reader-1.0.0.tgz", + "integrity": "sha512-HAKu/fG3HpHFO0AA8WE8q2g+gBJaZ9MG7fcKk+IJPLTGAD6Psw4443l+9DGRbOIh3/aXr7Phy0TjilYivJo5XQ==" + }, "node_modules/pako": { "version": "1.0.11", "resolved": "https://registry.npmjs.org/pako/-/pako-1.0.11.tgz", @@ -15433,6 +15475,91 @@ "resolved": "https://registry.npmjs.org/performance-now/-/performance-now-2.1.0.tgz", "integrity": "sha1-Ywn04OX6kT7BxpMHrjZLSzd8nns=" }, + "node_modules/pg": { + "version": "8.6.0", + "resolved": "https://registry.npmjs.org/pg/-/pg-8.6.0.tgz", + "integrity": "sha512-qNS9u61lqljTDFvmk/N66EeGq3n6Ujzj0FFyNMGQr6XuEv4tgNTXvJQTfJdcvGit5p5/DWPu+wj920hAJFI+QQ==", + "dependencies": { + "buffer-writer": "2.0.0", + "packet-reader": "1.0.0", + "pg-connection-string": "^2.5.0", + "pg-pool": "^3.3.0", + "pg-protocol": "^1.5.0", + "pg-types": "^2.1.0", + "pgpass": "1.x" + }, + "engines": { + "node": ">= 8.0.0" + }, + "peerDependencies": { + "pg-native": ">=2.0.0" + }, + "peerDependenciesMeta": { + "pg-native": { + "optional": true + } + } + }, + "node_modules/pg-connection-string": { + "version": "2.5.0", + "resolved": "https://registry.npmjs.org/pg-connection-string/-/pg-connection-string-2.5.0.tgz", + "integrity": "sha512-r5o/V/ORTA6TmUnyWZR9nCj1klXCO2CEKNRlVuJptZe85QuhFayC7WeMic7ndayT5IRIR0S0xFxFi2ousartlQ==" + }, + "node_modules/pg-hstore": { + "version": "2.3.4", + "resolved": "https://registry.npmjs.org/pg-hstore/-/pg-hstore-2.3.4.tgz", + "integrity": "sha512-N3SGs/Rf+xA1M2/n0JBiXFDVMzdekwLZLAO0g7mpDY9ouX+fDI7jS6kTq3JujmYbtNSJ53TJ0q4G98KVZSM4EA==", + "dependencies": { + "underscore": "^1.13.1" + }, + "engines": { + "node": ">= 0.8.x" + } + }, + "node_modules/pg-int8": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/pg-int8/-/pg-int8-1.0.1.tgz", + "integrity": "sha512-WCtabS6t3c8SkpDBUlb1kjOs7l66xsGdKpIPZsg4wR+B3+u9UAum2odSsF9tnvxg80h4ZxLWMy4pRjOsFIqQpw==", + "engines": { + "node": ">=4.0.0" + } + }, + "node_modules/pg-pool": { + "version": "3.3.0", + "resolved": "https://registry.npmjs.org/pg-pool/-/pg-pool-3.3.0.tgz", + "integrity": "sha512-0O5huCql8/D6PIRFAlmccjphLYWC+JIzvUhSzXSpGaf+tjTZc4nn+Lr7mLXBbFJfvwbP0ywDv73EiaBsxn7zdg==", + "peerDependencies": { + "pg": ">=8.0" + } + }, + "node_modules/pg-protocol": { + "version": "1.5.0", + "resolved": "https://registry.npmjs.org/pg-protocol/-/pg-protocol-1.5.0.tgz", + "integrity": "sha512-muRttij7H8TqRNu/DxrAJQITO4Ac7RmX3Klyr/9mJEOBeIpgnF8f9jAfRz5d3XwQZl5qBjF9gLsUtMPJE0vezQ==" + }, + "node_modules/pg-types": { + "version": "2.2.0", + "resolved": "https://registry.npmjs.org/pg-types/-/pg-types-2.2.0.tgz", + "integrity": "sha512-qTAAlrEsl8s4OiEQY69wDvcMIdQN6wdz5ojQiOy6YRMuynxenON0O5oCpJI6lshc6scgAY8qvJ2On/p+CXY0GA==", + "dependencies": { + "pg-int8": "1.0.1", + "postgres-array": "~2.0.0", + "postgres-bytea": "~1.0.0", + "postgres-date": "~1.0.4", + "postgres-interval": "^1.1.0" + }, + "engines": { + "node": ">=4" + } + }, + "node_modules/pgpass": { + "version": "1.0.4", + "resolved": "https://registry.npmjs.org/pgpass/-/pgpass-1.0.4.tgz", + "integrity": "sha512-YmuA56alyBq7M59vxVBfPJrGSozru8QAdoNlWuW3cz8l+UX3cWge0vTvjKhsSHSJpo3Bom8/Mm6hf0TR5GY0+w==", + "dependencies": { + "split2": "^3.1.1" + } + }, "node_modules/picomatch": { "version": "2.3.0", "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.3.0.tgz", @@ -16878,6 +17005,41 @@ "node": ">=6" } }, + "node_modules/postgres-array": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/postgres-array/-/postgres-array-2.0.0.tgz", + "integrity": "sha512-VpZrUqU5A69eQyW2c5CA1jtLecCsN2U/bD6VilrFDWq5+5UIEVO7nazS3TEcHf1zuPYO/sqGvUvW62g86RXZuA==", + "engines": { + "node": ">=4" + } + }, + "node_modules/postgres-bytea": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/postgres-bytea/-/postgres-bytea-1.0.0.tgz", + "integrity": "sha1-AntTPAqokOJtFy1Hz5zOzFIazTU=", + "engines": { + "node": ">=0.10.0" + } + }, + "node_modules/postgres-date": { + "version": "1.0.7", + "resolved": "https://registry.npmjs.org/postgres-date/-/postgres-date-1.0.7.tgz", + "integrity": "sha512-suDmjLVQg78nMK2UZ454hAG+OAW+HQPZ6n++TNDUX+L0+uUlLywnoxJKDou51Zm+zTCjrCl0Nq6J9C5hP9vK/Q==", + "engines": { + "node": ">=0.10.0" + } + }, + "node_modules/postgres-interval": { + "version": "1.2.0", + "resolved": "https://registry.npmjs.org/postgres-interval/-/postgres-interval-1.2.0.tgz", + "integrity": "sha512-9ZhXKM/rw350N1ovuWHbGxnGh/SNJ4cnxHiM0rxE4VN41wsg8P8zWn9hv/buK00RP4WvlOyr/RBDiptyxVbkZQ==", + "dependencies": { + "xtend": "^4.0.0" + }, + "engines": { + "node": ">=0.10.0" + } + }, "node_modules/prelude-ls": { "version": "1.2.1", "resolved": "https://registry.npmjs.org/prelude-ls/-/prelude-ls-1.2.1.tgz", @@ -18427,6 +18589,14 @@ "node": ">= 4" } }, + "node_modules/retry-as-promised": { + "version": "3.2.0", + "resolved": "https://registry.npmjs.org/retry-as-promised/-/retry-as-promised-3.2.0.tgz", + "integrity": "sha512-CybGs60B7oYU/qSQ6kuaFmRd9sTZ6oXSc0toqePvV74Ac6/IFZSI1ReFQmtCN+uvW1Mtqdwpvt/LGOiCBAY2Mg==", + "dependencies": { + "any-promise": "^1.3.0" + } + }, "node_modules/reusify": { "version": "1.0.4", "resolved": "https://registry.npmjs.org/reusify/-/reusify-1.0.4.tgz", @@ -19296,6 +19466,57 @@ "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.1.tgz", "integrity": "sha512-tgp+dl5cGk28utYktBsrFqA7HKgrhgPsg6Z/EfhWI4gl1Hwq8B/GmY/0oXZ6nF8hDVesS/FpnYaD/kOWhYQvyg==" }, + "node_modules/sequelize": { + "version": "6.6.5", + "resolved": "https://registry.npmjs.org/sequelize/-/sequelize-6.6.5.tgz", + "integrity": "sha512-QyRrJrDRiwuiILqTMHUA1yWOPIL12KlfmgZ3hnzQwbMvp2vJ6fzu9bYJQB+qPMosck4mBUggY4Cjoc6Et8FBIQ==", + "dependencies": { + "debug": "^4.1.1", + "dottie": "^2.0.0", + "inflection": "1.13.1", + "lodash": "^4.17.20", + "moment": "^2.26.0", + "moment-timezone": "^0.5.31", + "retry-as-promised": "^3.2.0", + "semver": "^7.3.2", + "sequelize-pool": "^6.0.0", + "toposort-class": "^1.0.1", + "uuid": "^8.1.0", + "validator": "^13.6.0", + "wkx": "^0.5.0" + }, + "engines": { + "node": ">=10.0.0" + }, + "peerDependenciesMeta": { + "mariadb": { + "optional": true + }, + "mysql2": { + "optional": true + }, + "pg": { + "optional": true + }, + "pg-hstore": { + "optional": true + }, + "sqlite3": { + "optional": true + }, + "tedious": { + "optional": true + } + } + }, + "node_modules/sequelize-pool": { + "version": "6.1.0", + "resolved": "https://registry.npmjs.org/sequelize-pool/-/sequelize-pool-6.1.0.tgz", + "integrity": "sha512-4YwEw3ZgK/tY/so+GfnSgXkdwIJJ1I32uZJztIEgZeAO6HMgj64OzySbWLgxj+tXhZCJnzRfkY9gINw8Ft8ZMg==", + "engines": { + "node": ">= 10.0.0" + } + }, "node_modules/serialize-javascript": { "version": "5.0.1", "resolved": "https://registry.npmjs.org/serialize-javascript/-/serialize-javascript-5.0.1.tgz", @@ -19923,6 +20144,27 @@ "node": ">=0.10.0" } }, + "node_modules/split2": { + "version": "3.2.2", + "resolved": "https://registry.npmjs.org/split2/-/split2-3.2.2.tgz", + "integrity": "sha512-9NThjpgZnifTkJpzTZ7Eue85S49QwpNhZTq6GRJwObb6jnLFNGB7Qm73V5HewTROPyxD0C29xqmaI68bQtV+hg==", + "dependencies": { + "readable-stream": "^3.0.0" + } + }, + "node_modules/split2/node_modules/readable-stream": { + "version": "3.6.0", + "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-3.6.0.tgz", + "integrity": "sha512-BViHy7LKeTz4oNnkcLJ+lVSL6vpiFeX6/d3oSH8zCW7UxP2onchk+vTGB143xuFjHS3deTgkKoXXymXqymiIdA==", + "dependencies": { + "inherits": "^2.0.3", + "string_decoder": "^1.1.1", + "util-deprecate": "^1.0.1" + }, + "engines": { + "node": ">= 6" + } + }, "node_modules/sprintf-js": { "version": "1.0.3", "resolved": "https://registry.npmjs.org/sprintf-js/-/sprintf-js-1.0.3.tgz", @@ -20977,6 +21219,11 @@ "node": ">=0.6" } }, + "node_modules/toposort-class": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/toposort-class/-/toposort-class-1.0.1.tgz", + "integrity": "sha1-f/0feMi+KMO6Rc1OGj9e4ZO9mYg=" + }, "node_modules/tough-cookie": { "version": "4.0.0", "resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-4.0.0.tgz", @@ -21224,6 +21471,11 @@ "react": ">=15.0.0" } }, + "node_modules/underscore": { + "version": "1.13.1", + "resolved": "https://registry.npmjs.org/underscore/-/underscore-1.13.1.tgz", + "integrity": "sha512-hzSoAVtJF+3ZtiFX0VgfFPHEDRm7Y/QPjGyNo4TVdnDTdft3tr8hEkD25a1jC+TjTuE7tkHGKkhwCgs9dgBB2g==" + }, "node_modules/unicode-canonical-property-names-ecmascript": { "version": "1.0.4", "resolved": "https://registry.npmjs.org/unicode-canonical-property-names-ecmascript/-/unicode-canonical-property-names-ecmascript-1.0.4.tgz", @@ -21533,7 +21785,6 @@ "version": "8.3.2", "resolved": "https://registry.npmjs.org/uuid/-/uuid-8.3.2.tgz", "integrity": "sha512-+NYs2QeMWy+GWFOEm9xnn6HCDp0l7QBD7ml8zLUmJ+93Q5NF0NocErnwkTkXVFNiX3/fpC6afS8Dhb/gz7R7eg==", - "optional": true, "bin": { "uuid": "dist/bin/uuid" } @@ -21573,6 +21824,14 @@ "spdx-expression-parse": "^3.0.0" } }, + "node_modules/validator": { + "version": "13.6.0", + "resolved": "https://registry.npmjs.org/validator/-/validator-13.6.0.tgz", + "integrity": "sha512-gVgKbdbHgtxpRyR8K0O6oFZPhhB5tT1jeEHZR0Znr9Svg03U0+r9DXWMrnRAB+HtCStDQKlaIZm42tVsVjqtjg==", + "engines": { + "node": ">= 0.10" + } + }, "node_modules/value-equal": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/value-equal/-/value-equal-1.0.1.tgz", @@ -23110,6 +23369,14 @@ "node": ">=4" } }, + "node_modules/wkx": { + "version": "0.5.0", + "resolved": "https://registry.npmjs.org/wkx/-/wkx-0.5.0.tgz", + "integrity": "sha512-Xng/d4Ichh8uN4l0FToV/258EjMGU9MGcA0HV2d9B/ZpZB3lqQm7nkOdZdm5GhKtLLhAE7PiVQwN4eN+2YJJUg==", + "dependencies": { + "@types/node": "*" + } + }, "node_modules/word-wrap": { "version": "1.2.3", "resolved": "https://registry.npmjs.org/word-wrap/-/word-wrap-1.2.3.tgz", @@ -26620,6 +26887,11 @@ "color-convert": "^1.9.0" } }, + "any-promise": { + "version": "1.3.0", + "resolved": "https://registry.npmjs.org/any-promise/-/any-promise-1.3.0.tgz", + "integrity": "sha1-q8av7tzqUugJzcA3au0845Y10X8=" + }, "anymatch": { "version": "3.1.2", "resolved": "https://registry.npmjs.org/anymatch/-/anymatch-3.1.2.tgz", @@ -27664,6 +27936,11 @@ "resolved": "https://registry.npmjs.org/buffer-indexof/-/buffer-indexof-1.1.1.tgz", "integrity": "sha512-4/rOEg86jivtPTeOUUT61jJO1Ya1TrR/OkqCSZDyq84WJh3LuuiphBYJN+fm5xufIk4XAFcEwte/8WzC8If/1g==" }, + "buffer-writer": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/buffer-writer/-/buffer-writer-2.0.0.tgz", + "integrity": "sha512-a7ZpuTZU1TRtnwyCNW3I5dc0wWNC3VR9S++Ewyk2HHZdrO3CQJqSpd+95Us590V6AL7JqUAH2IwZ/398PmNFgw==" + }, "buffer-xor": { "version": "1.0.3", "resolved": "https://registry.npmjs.org/buffer-xor/-/buffer-xor-1.0.3.tgz", @@ -29196,6 +29473,11 @@ "resolved": "https://registry.npmjs.org/dotenv-expand/-/dotenv-expand-5.1.0.tgz", "integrity": "sha512-YXQl1DSa4/PQyRfgrv6aoNjhasp/p4qs9FjJ4q4cQk+8m4r6k4ZSiEyytKG8f8W9gi8WsQtIObNmKd+tMzNTmA==" }, + "dottie": { + "version": "2.0.2", + "resolved": "https://registry.npmjs.org/dottie/-/dottie-2.0.2.tgz", + "integrity": "sha512-fmrwR04lsniq/uSr8yikThDTrM7epXHBAAjH9TbeH3rEA8tdCO7mRzB9hdmdGyJCxF8KERo9CITcm3kGuoyMhg==" + }, "duplexer": { "version": "0.1.2", "resolved": "https://registry.npmjs.org/duplexer/-/duplexer-0.1.2.tgz", @@ -31646,6 +31928,11 @@ "resolved": "https://registry.npmjs.org/infer-owner/-/infer-owner-1.0.4.tgz", "integrity": "sha512-IClj+Xz94+d7irH5qRyfJonOdfTzuDaifE6ZPWfx0N0+/ATZCbuTPq2prFl526urkQd90WyUKIh1DfBQ2hMz9A==" }, + "inflection": { + "version": "1.13.1", + "resolved": "https://registry.npmjs.org/inflection/-/inflection-1.13.1.tgz", + "integrity": "sha512-dldYtl2WlN0QDkIDtg8+xFwOS2Tbmp12t1cHa5/YClU6ZQjTFm7B66UcVbh9NQB+HvT5BAd2t5+yKsBkw5pcqA==" + }, "inflight": { "version": "1.0.6", "resolved": "https://registry.npmjs.org/inflight/-/inflight-1.0.6.tgz", @@ -34310,7 +34597,6 @@ "version": "0.5.33", "resolved": "https://registry.npmjs.org/moment-timezone/-/moment-timezone-0.5.33.tgz", "integrity": "sha512-PTc2vcT8K9J5/9rDEPe5czSIKgLoGsH8UNpA4qZTVw0Vd/Uz19geE9abbIOQKaAQFcnQ3v5YEXrbSc5BpshH+w==", - "peer": true, "requires": { "moment": ">= 2.9.0" } @@ -34618,6 +34904,11 @@ } } }, + "nodemailer": { + "version": "6.6.2", + "resolved": "https://registry.npmjs.org/nodemailer/-/nodemailer-6.6.2.tgz", + "integrity": "sha512-YSzu7TLbI+bsjCis/TZlAXBoM4y93HhlIgo0P5oiA2ua9Z4k+E2Fod//ybIzdJxOlXGRcHIh/WaeCBehvxZb/Q==" + }, "nopt": { "version": "5.0.0", "resolved": "https://registry.npmjs.org/nopt/-/nopt-5.0.0.tgz", @@ -35005,6 +35296,11 @@ "resolved": "https://registry.npmjs.org/p-try/-/p-try-2.2.0.tgz", "integrity": "sha512-R4nPAVTAU0B9D35/Gk3uJf/7XYbQcyohSKdvAxIRSNghFl4e71hVoGnBNQz9cWaXxO2I10KTC+3jMdvvoKw6dQ==" }, + "packet-reader": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/packet-reader/-/packet-reader-1.0.0.tgz", + "integrity": "sha512-HAKu/fG3HpHFO0AA8WE8q2g+gBJaZ9MG7fcKk+IJPLTGAD6Psw4443l+9DGRbOIh3/aXr7Phy0TjilYivJo5XQ==" + }, "pako": { "version": "1.0.11", "resolved": "https://registry.npmjs.org/pako/-/pako-1.0.11.tgz", @@ -35146,6 +35442,69 @@ "resolved": "https://registry.npmjs.org/performance-now/-/performance-now-2.1.0.tgz", "integrity": "sha1-Ywn04OX6kT7BxpMHrjZLSzd8nns=" }, + "pg": { + "version": "8.6.0", + "resolved": "https://registry.npmjs.org/pg/-/pg-8.6.0.tgz", + "integrity": "sha512-qNS9u61lqljTDFvmk/N66EeGq3n6Ujzj0FFyNMGQr6XuEv4tgNTXvJQTfJdcvGit5p5/DWPu+wj920hAJFI+QQ==", + "requires": { + "buffer-writer": "2.0.0", + "packet-reader": "1.0.0", + "pg-connection-string": "^2.5.0", + "pg-pool": "^3.3.0", + "pg-protocol": "^1.5.0", + "pg-types": "^2.1.0", + "pgpass": "1.x" + } + }, + "pg-connection-string": { + "version": "2.5.0", + "resolved": "https://registry.npmjs.org/pg-connection-string/-/pg-connection-string-2.5.0.tgz", + "integrity": "sha512-r5o/V/ORTA6TmUnyWZR9nCj1klXCO2CEKNRlVuJptZe85QuhFayC7WeMic7ndayT5IRIR0S0xFxFi2ousartlQ==" + }, + "pg-hstore": { + "version": "2.3.4", + "resolved": "https://registry.npmjs.org/pg-hstore/-/pg-hstore-2.3.4.tgz", + "integrity": "sha512-N3SGs/Rf+xA1M2/n0JBiXFDVMzdekwLZLAO0g7mpDY9ouX+fDI7jS6kTq3JujmYbtNSJ53TJ0q4G98KVZSM4EA==", + "requires": { + "underscore": "^1.13.1" + } + }, + "pg-int8": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/pg-int8/-/pg-int8-1.0.1.tgz", + "integrity": "sha512-WCtabS6t3c8SkpDBUlb1kjOs7l66xsGdKpIPZsg4wR+B3+u9UAum2odSsF9tnvxg80h4ZxLWMy4pRjOsFIqQpw==" + }, + "pg-pool": { + "version": "3.3.0", + "resolved": "https://registry.npmjs.org/pg-pool/-/pg-pool-3.3.0.tgz", + "integrity": "sha512-0O5huCql8/D6PIRFAlmccjphLYWC+JIzvUhSzXSpGaf+tjTZc4nn+Lr7mLXBbFJfvwbP0ywDv73EiaBsxn7zdg==", + "requires": {} + }, + "pg-protocol": { + "version": "1.5.0", + "resolved": "https://registry.npmjs.org/pg-protocol/-/pg-protocol-1.5.0.tgz", + "integrity": "sha512-muRttij7H8TqRNu/DxrAJQITO4Ac7RmX3Klyr/9mJEOBeIpgnF8f9jAfRz5d3XwQZl5qBjF9gLsUtMPJE0vezQ==" + }, + "pg-types": { + "version": "2.2.0", + "resolved": "https://registry.npmjs.org/pg-types/-/pg-types-2.2.0.tgz", + "integrity": "sha512-qTAAlrEsl8s4OiEQY69wDvcMIdQN6wdz5ojQiOy6YRMuynxenON0O5oCpJI6lshc6scgAY8qvJ2On/p+CXY0GA==", + "requires": { + "pg-int8": "1.0.1", + "postgres-array": "~2.0.0", + "postgres-bytea": "~1.0.0", + "postgres-date": "~1.0.4", + "postgres-interval": "^1.1.0" + } + }, + "pgpass": { + "version": "1.0.4", + "resolved": "https://registry.npmjs.org/pgpass/-/pgpass-1.0.4.tgz", + "integrity": "sha512-YmuA56alyBq7M59vxVBfPJrGSozru8QAdoNlWuW3cz8l+UX3cWge0vTvjKhsSHSJpo3Bom8/Mm6hf0TR5GY0+w==", + "requires": { + "split2": "^3.1.1" + } + }, "picomatch": { "version": "2.3.0", "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.3.0.tgz", @@ -36310,6 +36669,29 @@ "uniq": "^1.0.1" } }, + "postgres-array": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/postgres-array/-/postgres-array-2.0.0.tgz", + "integrity": "sha512-VpZrUqU5A69eQyW2c5CA1jtLecCsN2U/bD6VilrFDWq5+5UIEVO7nazS3TEcHf1zuPYO/sqGvUvW62g86RXZuA==" + }, + "postgres-bytea": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/postgres-bytea/-/postgres-bytea-1.0.0.tgz", + "integrity": "sha1-AntTPAqokOJtFy1Hz5zOzFIazTU=" + }, + "postgres-date": { + "version": "1.0.7", + "resolved": "https://registry.npmjs.org/postgres-date/-/postgres-date-1.0.7.tgz", + "integrity": "sha512-suDmjLVQg78nMK2UZ454hAG+OAW+HQPZ6n++TNDUX+L0+uUlLywnoxJKDou51Zm+zTCjrCl0Nq6J9C5hP9vK/Q==" + }, + "postgres-interval": { + "version": "1.2.0", + "resolved": "https://registry.npmjs.org/postgres-interval/-/postgres-interval-1.2.0.tgz", + "integrity": "sha512-9ZhXKM/rw350N1ovuWHbGxnGh/SNJ4cnxHiM0rxE4VN41wsg8P8zWn9hv/buK00RP4WvlOyr/RBDiptyxVbkZQ==", + "requires": { + "xtend": "^4.0.0" + } + }, "prelude-ls": { "version": "1.2.1", "resolved": "https://registry.npmjs.org/prelude-ls/-/prelude-ls-1.2.1.tgz", @@ -37536,6 +37918,14 @@ "resolved": "https://registry.npmjs.org/retry/-/retry-0.12.0.tgz", "integrity": "sha1-G0KmJmoh8HQh0bC1S33BZ7AcATs=" }, + "retry-as-promised": { + "version": "3.2.0", + "resolved": "https://registry.npmjs.org/retry-as-promised/-/retry-as-promised-3.2.0.tgz", + "integrity": "sha512-CybGs60B7oYU/qSQ6kuaFmRd9sTZ6oXSc0toqePvV74Ac6/IFZSI1ReFQmtCN+uvW1Mtqdwpvt/LGOiCBAY2Mg==", + "requires": { + "any-promise": "^1.3.0" + } + }, "reusify": { "version": "1.0.4", "resolved": "https://registry.npmjs.org/reusify/-/reusify-1.0.4.tgz", @@ -38219,6 +38609,31 @@ } } }, + "sequelize": { + "version": "6.6.5", + "resolved": "https://registry.npmjs.org/sequelize/-/sequelize-6.6.5.tgz", + "integrity": "sha512-QyRrJrDRiwuiILqTMHUA1yWOPIL12KlfmgZ3hnzQwbMvp2vJ6fzu9bYJQB+qPMosck4mBUggY4Cjoc6Et8FBIQ==", + "requires": { + "debug": "^4.1.1", + "dottie": "^2.0.0", + "inflection": "1.13.1", + "lodash": "^4.17.20", + "moment": "^2.26.0", + "moment-timezone": "^0.5.31", + "retry-as-promised": "^3.2.0", + "semver": "^7.3.2", + "sequelize-pool": "^6.0.0", + "toposort-class": "^1.0.1", + "uuid": "^8.1.0", + "validator": "^13.6.0", + "wkx": "^0.5.0" + } + }, + "sequelize-pool": { + "version": "6.1.0", + "resolved": "https://registry.npmjs.org/sequelize-pool/-/sequelize-pool-6.1.0.tgz", + "integrity": "sha512-4YwEw3ZgK/tY/so+GfnSgXkdwIJJ1I32uZJztIEgZeAO6HMgj64OzySbWLgxj+tXhZCJnzRfkY9gINw8Ft8ZMg==" + }, "serialize-javascript": { "version": "5.0.1", "resolved": "https://registry.npmjs.org/serialize-javascript/-/serialize-javascript-5.0.1.tgz", @@ -38754,6 +39169,26 @@ "extend-shallow": "^3.0.0" } }, + "split2": { + "version": "3.2.2", + "resolved": "https://registry.npmjs.org/split2/-/split2-3.2.2.tgz", + "integrity": "sha512-9NThjpgZnifTkJpzTZ7Eue85S49QwpNhZTq6GRJwObb6jnLFNGB7Qm73V5HewTROPyxD0C29xqmaI68bQtV+hg==", + "requires": { + "readable-stream": "^3.0.0" + }, + "dependencies": { + "readable-stream": { + "version": "3.6.0", + "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-3.6.0.tgz", + "integrity": "sha512-BViHy7LKeTz4oNnkcLJ+lVSL6vpiFeX6/d3oSH8zCW7UxP2onchk+vTGB143xuFjHS3deTgkKoXXymXqymiIdA==", + "requires": { + "inherits": "^2.0.3", + "string_decoder": "^1.1.1", + "util-deprecate": "^1.0.1" + } + } + } + }, "sprintf-js": { "version": "1.0.3", "resolved": "https://registry.npmjs.org/sprintf-js/-/sprintf-js-1.0.3.tgz", @@ -39575,6 +40010,11 @@ "resolved": "https://registry.npmjs.org/toidentifier/-/toidentifier-1.0.0.tgz", "integrity": "sha512-yaOH/Pk/VEhBWWTlhI+qXxDFXlejDGcQipMlyxda9nthulaxLZUNcUqFxokp0vcYnvteJln5FNQDRrxj3YcbVw==" }, + "toposort-class": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/toposort-class/-/toposort-class-1.0.1.tgz", + "integrity": "sha1-f/0feMi+KMO6Rc1OGj9e4ZO9mYg=" + }, "tough-cookie": { "version": "4.0.0", "resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-4.0.0.tgz", @@ -39765,6 +40205,11 @@ "react-lifecycles-compat": "^3.0.4" } }, + "underscore": { + "version": "1.13.1", + "resolved": "https://registry.npmjs.org/underscore/-/underscore-1.13.1.tgz", + "integrity": "sha512-hzSoAVtJF+3ZtiFX0VgfFPHEDRm7Y/QPjGyNo4TVdnDTdft3tr8hEkD25a1jC+TjTuE7tkHGKkhwCgs9dgBB2g==" + }, "unicode-canonical-property-names-ecmascript": { "version": "1.0.4", "resolved": "https://registry.npmjs.org/unicode-canonical-property-names-ecmascript/-/unicode-canonical-property-names-ecmascript-1.0.4.tgz", @@ -40009,8 +40454,7 @@ "uuid": { "version": "8.3.2", "resolved": "https://registry.npmjs.org/uuid/-/uuid-8.3.2.tgz", - "integrity": "sha512-+NYs2QeMWy+GWFOEm9xnn6HCDp0l7QBD7ml8zLUmJ+93Q5NF0NocErnwkTkXVFNiX3/fpC6afS8Dhb/gz7R7eg==", - "optional": true + "integrity": "sha512-+NYs2QeMWy+GWFOEm9xnn6HCDp0l7QBD7ml8zLUmJ+93Q5NF0NocErnwkTkXVFNiX3/fpC6afS8Dhb/gz7R7eg==" }, "v8-compile-cache": { "version": "2.3.0", @@ -40043,6 +40487,11 @@ "spdx-expression-parse": "^3.0.0" } }, + "validator": { + "version": "13.6.0", + "resolved": "https://registry.npmjs.org/validator/-/validator-13.6.0.tgz", + "integrity": "sha512-gVgKbdbHgtxpRyR8K0O6oFZPhhB5tT1jeEHZR0Znr9Svg03U0+r9DXWMrnRAB+HtCStDQKlaIZm42tVsVjqtjg==" + }, "value-equal": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/value-equal/-/value-equal-1.0.1.tgz", @@ -41270,6 +41719,14 @@ } } }, + "wkx": { + "version": "0.5.0", + "resolved": "https://registry.npmjs.org/wkx/-/wkx-0.5.0.tgz", + "integrity": "sha512-Xng/d4Ichh8uN4l0FToV/258EjMGU9MGcA0HV2d9B/ZpZB3lqQm7nkOdZdm5GhKtLLhAE7PiVQwN4eN+2YJJUg==", + "requires": { + "@types/node": "*" + } + }, "word-wrap": { "version": "1.2.3", "resolved": "https://registry.npmjs.org/word-wrap/-/word-wrap-1.2.3.tgz", diff --git a/client/package.json b/client/package.json index 2378857d1cec94fe07519b8b35b54b7c8473dac0..4b054b3b027630d5ce9e8b1729dbb61428b7e6bf 100644 --- a/client/package.json +++ b/client/package.json @@ -12,6 +12,9 @@ "moment": "^2.29.1", "ngx-spinner": "^12.0.0", "node-sass": "^6.0.1", + "nodemailer": "^6.6.2", + "pg": "^8.6.0", + "pg-hstore": "^2.3.4", "react": "^17.0.2", "react-bootstrap": "^1.6.1", "react-chartjs-2": "^3.0.3", @@ -26,6 +29,7 @@ "react-scripts": "4.0.3", "react-use": "^17.2.4", "sass": "^1.35.1", + "sequelize": "^6.6.5", "web-vitals": "^1.1.2" }, "scripts": { diff --git a/client/public/index.html b/client/public/index.html index c712be6236a73a6c7f7bda3ff202b886bb93d198..ce04074b4946cab27f99caab4f649d18d80d1239 100644 --- a/client/public/index.html +++ b/client/public/index.html @@ -34,39 +34,8 @@ redirectUri: 'http://localhost:3000/oauth' }) } - // 아래는 데모를 위한 UI 코드입니다. - displayToken() - function displayToken() { - const token = getCookie('authorize-access-token') - if (token) { - Kakao.Auth.setAccessToken(token) - Kakao.Auth.getStatusInfo(({ status }) => { - if (status === 'connected') { - document.getElementById('token-result').innerText = 'login success. token: ' + Kakao.Auth.getAccessToken() - } else { - Kakao.Auth.setAccessToken(null) - } - }) - } - } - function getCookie(name) { - const value = "; " + document.cookie; - const parts = value.split("; " + name + "="); - if (parts.length === 2) return parts.pop().split(";").shift(); - } - - + + diff --git a/client/src/App.css b/client/src/App.css index efa848dadbf1a8e140ceb8027d814a4006ad3a50..75e98356dd30ee0b065ed93e5c8143899afed9a2 100644 --- a/client/src/App.css +++ b/client/src/App.css @@ -5,8 +5,12 @@ body { } -.a:hover { - color: white; +#btnlink { + color: white !important; + text-decoration: none !important; + min-width: 100%; + margin: auto; + height: 100%; } .btn-primary:active { @@ -15,8 +19,21 @@ body { } .card .card-title { - color: rgb(109, 110, 109); - /* background-color: ; */ + color: rgb(70, 70, 70); + font-size: 1.5em; +} + +#impactTitle { + margin: 1em; + font-size: 1.5em; +} + +.card .card-subtitle { + display: flex; + color: rgb(129, 129, 129); + align-items: center; + justify-content: center; + padding: 0.5em; } .form-group .form-control { @@ -31,24 +48,26 @@ body { } #logpng { - width: 25px; - height: auto; - margin-right: 1em; + width: 50%; + height: 6em; + object-fit: cover; } #socialLink { + display: flex; + justify-content: center; + align-items: center; + height: 50%; padding: 0.5em; - margin: 0.5em; - height: 2.5em; color: gray; - font-size: 10px; + font-size: 0.8em; width: fit-content; } @media (max-width: 767.98px) { body { - padding: 10px; + padding: 30px; padding-left: 20px; padding-right: 20px; margin: auto; @@ -59,7 +78,12 @@ body { } #stickyy { - max-width: 300px; + max-width: 400px; + } + + #contour { + padding: 10px; + color: rgba(195, 195, 195, 0.753); } } @@ -82,8 +106,12 @@ body { top: 40px; width: fit-content; height: fit-content; - max-width: 240px; + max-width: 300px; + + } + #contour { + display: none; } } \ No newline at end of file diff --git a/client/src/App.js b/client/src/App.js index 529ad22cd5c9dbb52664994fce36ecfa06b76866..2d9f29574b800e2e0dac2bec739dbf31cac9f8c7 100644 --- a/client/src/App.js +++ b/client/src/App.js @@ -2,19 +2,24 @@ import React from 'react'; import { BrowserRouter as Router, Route } from 'react-router-dom'; import './App.css'; import Home from './pages/Home'; -import Oauth from './components/Oauth'; +import SignupPage from './pages/SignupPage'; +import LoginPage from './pages/LoginPage'; +import LocalCodePage from './pages/LocalCodePage'; function App() { - + return ( <> - - + + + + + - + ); } diff --git a/client/src/Utils/Auth.js b/client/src/Utils/Auth.js new file mode 100644 index 0000000000000000000000000000000000000000..2f2ae85afaa4943e6e48b58b97172f8e9f2b69cc --- /dev/null +++ b/client/src/Utils/Auth.js @@ -0,0 +1,58 @@ +import axios from 'axios'; +import { useState } from 'react'; +import Oauth from './Oauth'; + +export function handleLogin({ userId, role, name, tel, email }) { + localStorage.setItem('id', userId) + localStorage.setItem('role', role) + localStorage.setItem('name', name) + localStorage.setItem('tel', tel) + localStorage.setItem('email', email) +} + +export async function handleLogout() { + localStorage.clear() + await axios.get('/api/auth/logout') + window.location.href = '/' +} + +export function isLogined() { + const userId = localStorage.getItem('id') + if (userId) { + return userId + } else { + return false + } +} + +export function isAdmin() { + const role = localStorage.getItem('role') + if (role === 'admin') { + return true + } else { + return false + } +} + + +export function isOauth(value) { + const TFoauth = value + return TFoauth; +} + +// export async function doeCode() { +// const response = await axios.get('http://175.125.254.72:8090/api/data/loccode') + +// // console.log('res::', response.data.locCodes) + +// const resData = response.data.locCodes +// const doe = resData.DOE +// // console.log('dd', doe) //object +// // console.log('dd::', doe[doe.length-1]) +// // console.log('values::', Object.values(doe)) +// const doeValue = Object.values(doe) +// // console.log('@@@11', doeValue[0]['code_doe'], typeof(doeValue[0]['code_doe'])) +// // console.log('@@@22', doeValue[0]['name_doe'], typeof(doeValue[0]['name_doe'])) + +// return doeValue +// } \ No newline at end of file diff --git a/client/src/Utils/CatchError.js b/client/src/Utils/CatchError.js new file mode 100644 index 0000000000000000000000000000000000000000..5d1e40d2ac2c4674db837764ce5e0ca9f052abe4 --- /dev/null +++ b/client/src/Utils/CatchError.js @@ -0,0 +1,17 @@ +function catchErrors(error, displayError) { + let errorMsg + + if (error.response) { + errorMsg = error.response.data + console.log(errorMsg) + } else if (error.request) { + errorMsg = error.request + console.log(errorMsg) + } else { + errorMsg = error.message + console.log(errorMsg) + } + displayError(errorMsg) +} + +export default catchErrors diff --git a/client/src/Utils/Oauth.js b/client/src/Utils/Oauth.js new file mode 100644 index 0000000000000000000000000000000000000000..be95a9ff126c70c399e62ae95e7c96ea4a219462 --- /dev/null +++ b/client/src/Utils/Oauth.js @@ -0,0 +1,75 @@ +import { Spinner, Button, Row } from 'react-bootstrap'; + + +// export const KAKAO_AUTH_URL = `https://kauth.kakao.com/oauth/authorize?client_id=${CLIENT_ID}&redirect_uri=${REDIRECT_URI}&response_type=code`; + +const { Kakao } = window; + +export function LoginWithKakao() { + //authObj : response.data에 들어가 있는 부분 object 형식 + Kakao.Auth.loginForm({ + // 팝업 + 다른 아이디 로그인시 + scope: 'account_email, profile_nickname', + // 추가 동의 받을 동의 항목 ID 목록, 하나의 문자열에 여러 개의 ID를 쉼표(,)로 구분하여 전달 + success: function (authObj) { + alert('로그인 되었습니다. @@@@@@@@@') + console.log(JSON.stringify(authObj)) + + console.log('accT ;;', authObj.access_token) + + Kakao.API.request({ + // 현재 로그인한 사용자의 카카오계정 정보 불러오기 + url: '/v2/user/me', + // 사용자 정보 요청 주소 + data: { + property_keys: ["kakao_account.profile", "kakao_account.email"] + // 파라미터를 통해 특정 사용자 정보만 지정해서 요청 + }, + success: function (response) { + console.log(response); + console.log(response.kakao_account.profile); + + const nickValue = Object.values(response.kakao_account.profile) + localStorage.setItem('nickname', nickValue) + const nickname = localStorage.getItem('nickname') + console.log(nickname) + window.location.replace('/' + '?nickname=' + `${nickname}`) + } + }); + }, + fail: function (err) { + alert(JSON.stringify(err)) + }, + }) +} + +export function kakaoLogout() { + // 토큰을 만료시켜 더 이상 해당 액세스 토큰으로 카카오 API를 호출할 수 없도록 + console.log('geAccesToken()', Kakao.Auth.getAccessToken()) + if (!Kakao.Auth.getAccessToken()) { + alert('Not logged in.') + localStorage.clear(); + return; + } + Kakao.Auth.logout(function () { + // 로그인 시 발급받은 토큰을 만료시키는 함수 + alert('logout ok\naccess token -> ' + Kakao.Auth.getAccessToken()) + localStorage.clear(); + window.location.replace('/') + }) +} + + +export function Loading() { + return ( + + + + ) +} \ No newline at end of file diff --git a/client/src/Utils/SendEmail.js b/client/src/Utils/SendEmail.js new file mode 100644 index 0000000000000000000000000000000000000000..76cd62756dabe61be9298083d1fc6c32a254d7cf --- /dev/null +++ b/client/src/Utils/SendEmail.js @@ -0,0 +1,84 @@ +// const { smtpTransport } = require('./config/email'); +// const nodemailer = require('nodemailer'); + +// /* min ~ max까지 랜덤으로 숫자를 생성하는 함수 */ +// var generateRandom = function (min, max) { +// var ranNum = Math.floor(Math.random() * (max - min + 1)) + min; +// return ranNum; +// } + +// // transporter 생성 +// let transporter = nodemailer.createTransport({ + +// // host: "mail.회사.계정.입력" *** mail. <-요게 핵심이었다! +// host: "mail.abc.co.kr", + +// // 보안 무시 +// port: 587, + +// // 회사 도메인 내 계정 및 비밀번호 +// auth: { +// user: "myid@abc.co.kr", +// pass: "mypassword", +// }, + +// // 서명받지 않은 사이트의 요청도 받겠다. +// tls: { +// rejectUnauthorized: false +// } +// }); + +// // 메일 관련 옵션 +// let mailOptions = { +// // 발송 메일 주소 (위에서 작성한 회사 계정 아이디) +// from: "myid@abc.co.kr", + +// // 수신 메일 주소 +// to: "receiverid@domain.com", + +// // 제목 +// subject: "인증 메일입니다.", + +// // 인증 URL +// html: `

아래의 링크를 클릭하시면 인증이 완료됩니다.

+// 인증하기`, +// }; + +// // 메일 보내기 +// transporter.sendMail(mailOptions, function (err, info) { +// if (err) { +// // 메일 보내기 에러 발생 시, 콘솔 찍어보기 +// console.log("메일보내기 에러쓰"); +// console.log(err); +// } else { +// // 성공했다! +// console.log("Email sent: " + info.response); +// } +// }); + +// // export const auth = { +// // SendEmail: async (req, res) => { +// // const number = generateRandom(111111, 999999) + +// // const { sendEmail } = req.body; + +// // const mailOptions = { +// // from: "정욱이네러버덕", +// // to: sendEmail, +// // subject: "[러버덕]인증 관련 이메일 입니다", +// // text: "오른쪽 숫자 6자리를 입력해주세요 : " + number +// // }; + +// // const result = await smtpTransport.sendMail(mailOptions, (error, responses) => { +// // if (error) { +// // return res.status(statusCode.OK).send(util.fail(statusCode.BAD_REQUEST, responseMsg.AUTH_EMAIL_FAIL)) +// // } else { +// // /* 클라이언트에게 인증 번호를 보내서 사용자가 맞게 입력하는지 확인! */ +// // return res.status(statusCode.OK).send(util.success(statusCode.OK, responseMsg.AUTH_EMAIL_SUCCESS, { +// // number: number +// // })) +// // } +// // smtpTransport.close(); +// // }); +// // } +// // } \ No newline at end of file diff --git a/client/src/components/ChartDoughnut.js b/client/src/components/ChartDoughnut.js index 489646d12dd6b607f9e5d29aca26bd6ea33c2f80..0f6c2ff62b93c899e2ff1b201e4689d1e09fa6b4 100644 --- a/client/src/components/ChartDoughnut.js +++ b/client/src/components/ChartDoughnut.js @@ -1,28 +1,18 @@ import React from 'react' -import { Container, Row, Card, Table, Button } from 'react-bootstrap'; +import { Row, Card } from 'react-bootstrap'; import { Doughnut } from 'react-chartjs-2' function ChartDoughnut() { const cardstyled = { - fontSize: '0.5em', margin: 'auto', padding: '1em', display: 'flex', justifyContent: 'center', width: '100%', - borderWidth: '1.5px', - borderRadius: '20px', - borderColor: '#04AB70', - color: 'rgb(110, 189, 142)' - } - const btnstyled = { - background: 'rgb(110, 189, 142)', - margin: '1px', - maxWidth: '100%', - borderWidth: '2px', - fontSize: '10px', - borderColor: 'rgba(195, 195, 195, 0.753)', + borderWidth: '3px', borderRadius: '20px', + borderColor: 'rgb(110, 189, 142)', + color: '#04AB70' } const options = { diff --git a/client/src/components/ChartLine.js b/client/src/components/ChartLine.js index a1c30f5a3f1c126ddfa015a05e29d515b4e227a2..ebbef4c7b0ce95046b17059483c9362c3724f874 100644 --- a/client/src/components/ChartLine.js +++ b/client/src/components/ChartLine.js @@ -1,29 +1,20 @@ import React from 'react' -import { Container, Row, Card, Table, Button } from 'react-bootstrap'; +import { Row, Card } from 'react-bootstrap'; import { Line } from 'react-chartjs-2' function ChartLine() { const cardstyled = { - fontSize: '0.5em', margin: 'auto', padding: '1em', display: 'flex', justifyContent: 'center', width: '100%', - borderWidth: '1.5px', - borderRadius: '20px', - borderColor: '#04AB70', - color: 'rgb(110, 189, 142)' - } - const btnstyled = { - background: 'rgb(110, 189, 142)', - margin: '1px', - maxWidth: '100%', - borderWidth: '2px', - fontSize: '10px', - borderColor: 'rgba(195, 195, 195, 0.753)', + borderWidth: '3px', borderRadius: '20px', + borderColor: 'rgb(110, 189, 142)', + color: '#04AB70' } + const options = { legend: { display: true, // label 보이기 여부 diff --git a/client/src/components/EueSuggest.js b/client/src/components/EueSuggest.js index 1406fe3efdb00b14a8fb234432ed7e0d966cc635..08e6eaf77592e73ec1019636f21c92ce07a65d8e 100644 --- a/client/src/components/EueSuggest.js +++ b/client/src/components/EueSuggest.js @@ -1,27 +1,17 @@ import React from 'react' -import { Container, Row, Card, Table, Button } from 'react-bootstrap'; +import { Row, Card } from 'react-bootstrap'; function EueSuggest() { const cardstyled = { - fontSize: '0.5em', margin: 'auto', padding: '1em', display: 'flex', justifyContent: 'center', width: '100%', - borderWidth: '1.5px', - borderRadius: '20px', - borderColor: '#04AB70', - color: 'rgb(110, 189, 142)' - } - const btnstyled = { - background: 'rgb(110, 189, 142)', - margin: '1px', - maxWidth: '100%', - borderWidth: '2px', - fontSize: '10px', - borderColor: 'rgba(195, 195, 195, 0.753)', + borderWidth: '3px', borderRadius: '20px', + borderColor: 'rgb(110, 189, 142)', + color: '#04AB70' } return ( diff --git a/client/src/components/Footer.js b/client/src/components/Footer.js index 5189c2cc4eb8d1c2a0ef32efc828d30d04c8c341..8bec1e25dae6ad3e78ca6c63c1867ed1d7e3eeb8 100644 --- a/client/src/components/Footer.js +++ b/client/src/components/Footer.js @@ -1,111 +1,113 @@ -import React, { useEffect, useRef, useState } from 'react' -import { Container, Row, Card, Table, Button, Col, Modal, ModalTitle, Overlay, Tooltip } from 'react-bootstrap'; +import React, { useEffect, useState } from 'react' +import { Row, Card, Button, Col, Modal, } from 'react-bootstrap'; import { CopyToClipboard } from 'react-copy-to-clipboard'; import '../App.css' function Footer() { const cardstyled = { - fontSize: '0.5em', margin: 'auto', padding: '1em', display: 'flex', justifyContent: 'center', width: '100%', - borderWidth: '1.5px', + borderWidth: '3px', borderRadius: '20px', - borderColor: '#04AB70', - color: 'rgb(110, 189, 142)' + borderColor: 'rgb(110, 189, 142)', + color: '#04AB70' } - const btnstyled = { + const btnstyled2 = { background: 'white', margin: '1px', maxWidth: 'fit-content', borderWidth: '2px', - fontSize: '10px', color: 'rgb(110, 189, 142)', borderColor: 'rgba(195, 195, 195, 0.753)', borderRadius: '20px', - } const [donateShow, setDonateShow] = useState(false); + const [isCopyshow, setCopyShow] = useState(false); + const HandleClose = () => setDonateShow(false); - function clickAndCopy() { + function clickAndTwoSec() { return new Promise((resolve) => setTimeout(resolve, 2000)) } - // function CopyShow() { - const [isCopyshow, setCopyShow] = useState(false); - useEffect(() => { if (isCopyshow) { - clickAndCopy().then(() => { + clickAndTwoSec().then(() => { setCopyShow(false); }); } }, [isCopyshow]); + // isCopyshow 가 바뀔 때만 effect를 재실행한다. - // } const handleClick = () => setCopyShow(true); return ( - + 서버비용 후원하기 - - + + 이용하시는데 불편함이 없도록 광고 없이 운영하고 있습니다.
서버비용 충당 후 후원금이 남을시 UNICEF 에 기부하겠습니다. - - - setDonateShow(false)} + onHide={HandleClose} style={{ top: '80px', left: '1vw' }} > - - Thank you for your Donation + + ♥ Thank you for Donation ♥ -

+ 카카오뱅크 -

- -

- 박상호 3333-16-7299769 - -

- + +

+ 박상호 3333-16-7299769 + +

+ + + + + - + TEAM EUE : 안강민, 박상호, 박예은 diff --git a/client/src/components/LocCodeChange.js b/client/src/components/LocCodeChange.js new file mode 100644 index 0000000000000000000000000000000000000000..43ed9db688049ab4a34517654d88e09cf370499c --- /dev/null +++ b/client/src/components/LocCodeChange.js @@ -0,0 +1,128 @@ +import React from 'react' +import '../App.css' +import { Form, Button, Row, Col, Card, DropdownButton, Dropdown, ButtonGroup } from 'react-bootstrap'; +import { useState } from 'react'; +import axios from 'axios'; +// import { doeCode } from '../utils/Auth'; + +function LocCodeChange() { + + const cardstyled = { + margin: 'auto', + padding: '1em', + display: 'flex', + justifyContent: 'center', + width: '100%', + borderWidth: '3px', + borderRadius: '20px', + borderColor: 'rgb(110, 189, 142)', + color: '#04AB70' + } + + const inboxstyled = { + display: 'flex', + flexDirection: 'column', + maxWidth: '80%', + justifyContent: 'center', + margin: 'auto', + padding: '10px' + } + + + const btnstyled2 = { + background: 'white', + margin: '1px', + maxWidth: 'fit-content', + borderWidth: '2px', + color: 'rgb(110, 189, 142)', + borderColor: 'rgba(195, 195, 195, 0.753)', + borderRadius: '20px' + } + + const [locCodeShow, setLocCodeShow] = useState(false) + + function handleClickLoc() { + setLocCodeShow(true); + const auth = document.getElementById('loc-code') + auth.style.visibility = 'visible' + } + + // console.log(typeof (locCode())) + // console.log(locCode()) + // const [ddoe, setDdoe] = useState([]) + + // async function DoeCode() { + // await doeCode().then((res) => { + // // // // for (let i = 0; i < res.length; i++) { + // // // console.log(res[0]['code_doe']) + // // // console.log(0, res[0]['name_doe']) + // ddoe.push(res[0]['name_doe']) + // ddoe.push(res[1]['name_doe']) + // console.log(ddoe) + // console.log(typeof(ddoe)) + // // // } + // }) + // } + + const res = axios.get("localhost:4500/d/loccode"); + // const does = res.data["locCodes"]["DOE"] // object + + + return ( + + {/* {DoeCode()} */} + {/* {data} */} + + asd + + + + Local Code + + + Please select a your region + +
+ +
+ + + {['도', '시군구', '읍면동'].map((localname) => ( + + + + Another action + Something else here + + ))} + + + + 지역코드 + + + +
+ + + + + + ) +} + +export default LocCodeChange; \ No newline at end of file diff --git a/client/src/components/LocalCode.js b/client/src/components/LocalCode.js new file mode 100644 index 0000000000000000000000000000000000000000..55e08a30ecf45a074811691ca9c75c9fa10a2618 --- /dev/null +++ b/client/src/components/LocalCode.js @@ -0,0 +1,80 @@ +import React, { useState } from 'react' +import { Row, Card, Button, Col, Modal } from 'react-bootstrap'; +// import db from "../db/index" +import '../App.css' +import { Link } from 'react-router-dom'; + + +function LocalCode() { + + const logined = localStorage.getItem('nickname') + + const cardstyled = { + margin: 'auto', + padding: '1em', + display: 'flex', + justifyContent: 'center', + width: '100%', + borderWidth: '3px', + borderRadius: '20px', + borderColor: 'rgba(195, 195, 195, 0.753)', + color: 'rgb(110, 189, 142)' + } + const btnstyled2 = { + background: 'white', + margin: 'auto', + borderWidth: '2px', + fontSize: '0.5em', + color: 'rgb(110, 189, 142)', + borderColor: 'rgba(195, 195, 195, 0.753)', + borderRadius: '20px', + } + const [localChange, setLocalChange] = useState(false) + const nickname = localStorage.getItem('nickname') + return ( + <> + + + + {logined ? + `${nickname}` + : + <> + GUEST + + }, 환영합니다. + + + + 지역코드 + + {logined && + + } + + setLocalChange(false)} + > + + + 마이페이지 + + + + 지역이름 (지역코드) + + + + 환경을 향한 노력
+ OOO 일 째 + + + + ) +} +export default LocalCode; \ No newline at end of file diff --git a/client/src/components/LoginComp.js b/client/src/components/LoginComp.js new file mode 100644 index 0000000000000000000000000000000000000000..da73f079af2523ec678354a8b239302c682fa274 --- /dev/null +++ b/client/src/components/LoginComp.js @@ -0,0 +1,102 @@ +import React, { useState } from 'react'; +import '../App.css' +import { Form, Button, Row, Col, Card, Alert } from 'react-bootstrap'; +import { LoginWithKakao } from '../utils/Oauth'; + +function LoginComp() { + + const cardstyled = { + margin: 'auto', + padding: '1em', + display: 'flex', + justifyContent: 'center', + width: '100%', + borderWidth: '3px', + borderRadius: '20px', + borderColor: 'rgb(110, 189, 142)', + color: '#04AB70' + } + + const inboxstyled = { + display: 'flex', + flexDirection: 'column', + maxWidth: '80%', + justifyContent: 'center', + margin: 'auto', + padding: '10px' + } + + const [emailSent, setEmailSent] = useState(false) + const [alertShow, setAlertShow] = useState(true) + + function CheckEmailSend() { + setEmailSent(!emailSent) + } + + return ( + + + + LOGIN + + + Log in with your social media account or email address + +
+ + + {!emailSent ? + + + 😍 이메일 전송이 완료 되었습니다. + + + 이메일 확인 하러가기 ➞ + + + : + + + 😭 이메일을 정확하게 적어주세요. + + + } + + + +
+ + + + + + +
+ + + +
+ + OR + +
+ + + + + + {/* 세미콜론이 붙으면 최상단 이동 x */} + KAKAO + + + + + + + + ) +} + +export default LoginComp; \ No newline at end of file diff --git a/client/src/components/MainLayer.js b/client/src/components/MainLayer.js index fc40edb423d8d08c4cbad6c55a9d98a282fdb439..6ec0da236bf44acbf0be64ab85cd5f901678dc9b 100644 --- a/client/src/components/MainLayer.js +++ b/client/src/components/MainLayer.js @@ -1,10 +1,10 @@ import React from 'react' -import { useState } from 'react'; -import { Button, Form, Image, Row, ButtonGroup, Modal, Dropdown, Col } from 'react-bootstrap'; +import { Button, Image, Row, ButtonGroup, } from 'react-bootstrap'; import { Link } from 'react-router-dom'; import '../App.css' -import SignUp from '../pages/SignUp' -import LoginwithSocial from '../pages/LoginwithSocial'; +import LocalCode from '../components/LocalCode'; +import { kakaoLogout } from '../utils/Oauth'; + function MainLayer() { @@ -12,6 +12,7 @@ function MainLayer() { border: 'solid', color: 'rgba(195, 195, 195, 0.753)', borderRadius: '20px', + borderWidth: '3px', marginBottom: '1em', width: '100%', backgroundSize: 'contain', @@ -21,108 +22,59 @@ function MainLayer() { const btnstyled = { background: 'rgb(110, 189, 142)', - margin: '1px', + margin: 'auto', + marginBottom: '0.5em', display: 'flex', justifyContent: 'center', - maxWidth: '100%', + width: '100%', borderWidth: '2px', - fontSize: '10px', borderColor: 'rgba(195, 195, 195, 0.753)', borderRadius: '20px', textDecorationColor: 'none', color: 'white' } - const loginstyled = { - margin: 'auto', - padding: '2px', - diplay: 'flex', - justifyContent: 'center', - borderRadius: '20px' - } - - const titlesty = { - display: 'flex', - justifyContent: 'center', - background: 'rgb(110, 189, 142)', - text: 'center' - } - - const [logshow, setLogshow] = useState(false); - const [signshow, setSignshow] = useState(false); - const [isLogin, setIsLogin] = useState(false) - + const logined = localStorage.getItem('nickname') return ( <> - - - EUE - - - - - - - - - setLogshow(false)} - aria-labelledby="example-modal-sizes-title-sm" - > - - - - - - - setSignshow(false)} - aria-labelledby="example-modal-sizes-title-sm" - > - - - - - + + EUE + - - - - setLogshow(false)} - aria-labelledby="example-modal-sizes-title-sm" - > - - - - - - setSignshow(false)} - aria-labelledby="example-modal-sizes-title-sm" - > - - - + + + + + + {logined ? + //true + + : + //false + + } + {!logined && + + } + + | + ); } diff --git a/client/src/components/OAuth.js b/client/src/components/OAuth.js deleted file mode 100644 index 561d563401953daaf565ee787b48742df6ea513b..0000000000000000000000000000000000000000 --- a/client/src/components/OAuth.js +++ /dev/null @@ -1,55 +0,0 @@ -import axios from 'axios'; -import { Spinner, Button, Col, Row } from 'react-bootstrap'; -import { KAKAO_AUTH_URL } from './Oauth'; -import { Link, Redirect } from 'react-router-dom'; - -// export const KAKAO_AUTH_URL = `https://kauth.kakao.com/oauth/authorize?client_id=${CLIENT_ID}&redirect_uri=${REDIRECT_URI}&response_type=code`; - -function Oauth() { - const REST_API_KEY = 'a564b730d6339b084ecf7775a9a09284'; - const REDIRECT_URI = 'http://localhost:3000/oauth'; - - const url = new URL(window.location.href) - const authorizationCode = url.searchParams.get('code') - console.log('인가 코드', authorizationCode); - - - const kakaoAuthURl = `https://kauth.kakao.com/oauth/token` - // const KAKAO_AUTH_URL = `https://kauth.kakao.com/oauth/authorize?client_id=${REST_API_KEY}&redirect_uri=${REDIRECT_URI}&response_type=code` - - const payload = { - grant_type: "authorization_code", - client_id: `${REST_API_KEY}`, - redirect_uri: `${REDIRECT_URI}`, - code: `${authorizationCode}` - } - const params = new URLSearchParams(); - params.append('grant_type', 'authorization_code') - params.append('client_id', `${REST_API_KEY}`) - params.append('redirect_uri', `${REDIRECT_URI}`) - params.append('code', `${authorizationCode}`) - axios.post(kakaoAuthURl, params).then(response => console.log(response)) - - function locateHome() { - window.location.replace('/') - }; - setTimeout(locateHome, 3000) - - return ( - - - 인가코드 : {authorizationCode} -
- Params : {params} - - - - ) -} -export default Oauth; \ No newline at end of file diff --git a/client/src/components/SignupComp.js b/client/src/components/SignupComp.js new file mode 100644 index 0000000000000000000000000000000000000000..ca954007ce189e9aee1ad5d1ae7141a72454d3d7 --- /dev/null +++ b/client/src/components/SignupComp.js @@ -0,0 +1,167 @@ +import React, { useState } from 'react' +import '../App.css' +import { Form, Button, Row, Col, Card, Alert } from 'react-bootstrap'; +import { LoginWithKakao } from '../utils/Oauth'; + +function SignupComp() { + + const cardstyled = { + margin: 'auto', + padding: '1em', + display: 'flex', + justifyContent: 'center', + width: '100%', + borderWidth: '3px', + borderRadius: '20px', + borderColor: 'rgb(110, 189, 142)', + color: '#04AB70' + } + + const inboxstyled = { + display: 'flex', + flexDirection: 'column', + maxWidth: '80%', + justifyContent: 'center', + margin: 'auto', + padding: '1rem' + } + + const initValues = { + email: '', + name: '' + } + + const [formValues, setFormValues] = useState(initValues) + const [validated, setValidated] = useState(false) + + function handleChange(event) { + const { name, value } = event.target + setFormValues({ ...formValues, [name]: value }) + } + + function handleSubmit(event) { + const form = event.currentTarget; + console.log('formValues', formValues); + console.log('formValues.values', Object.values(formValues)[0].length); + + // console.log(form) + // if (Object.values(formValues)[0].length !== 0) { //form.checkValidity() === false + // event.preventDefault(); + // event.stopPropagation(); + // } + console.log(validated) + setValidated(true); + // const form = event.current + // setFormError(validate(formValues)) + // setIsSubmit(true) + } + const [emailSubm, setEmailSubm] = useState(false) + + function handleClickSubm() { + // setEmailSubm(true); + const subm = document.getElementById("subm-mailSent"); + subm.style.visibility = 'visible' + // const aftermail = document.getElementById('AftermailSent'); + // aftermail.style.display = '' + } + + + const [userExist, setUserExist] = useState(false) + const [alertShow, setAlertShow] = useState(true) + + function CheckUserExist() { + setUserExist(!userExist) + } + + + return ( + + + + + Create an Account + + + Sign up with your social media account or email address + +
+ + + {!userExist ? + + + 😊 계정 생성이 완료 되었습니다. + + + 로그인 하러가기 ➞ + + + : + + + 🤔 이미 존재하는 계정입니다. + + + 로그인 하러가기 ➞ + + + } + + + + +
+ + + + + +

+ + + + + + + +
+ + + +
+ + OR + +
+ + + + + + KAKAO + + + + + + ) +} + +export default SignupComp; \ No newline at end of file diff --git a/client/src/components/TimeNow.js b/client/src/components/TimeNow.js index fe559171de2b52363032ff22712b7b847e44f0bf..f4aeedd813fbc41de9b33e2a95568927826b76a2 100644 --- a/client/src/components/TimeNow.js +++ b/client/src/components/TimeNow.js @@ -1,12 +1,11 @@ -import React, { Component } from 'react'; -import { Jumbotron, Container, Row, Card } from 'react-bootstrap'; +import React from 'react'; +import { Row, Card } from 'react-bootstrap'; import Clock from 'react-live-clock' import '../App.css' function TimeNow() { const cardstyled = { - fontSize: '0.5em', margin: 'auto', padding: '1em', display: 'flex', diff --git a/client/src/components/Trydays.js b/client/src/components/Trydays.js deleted file mode 100644 index bcd2a682d77dc19cf22b3ae61f6366efc4cdb181..0000000000000000000000000000000000000000 --- a/client/src/components/Trydays.js +++ /dev/null @@ -1,54 +0,0 @@ -import React from 'react' -import { Container, Row, Card, Table, Button } from 'react-bootstrap'; -import '../App.css' - - -function Trydays() { - const cardstyled = { - fontSize: '0.5em', - margin: 'auto', - padding: '1em', - display: 'flex', - justifyContent: 'center', - width: '100%', - borderWidth: '1.5px', - borderRadius: '20px', - borderColor: '#04AB70', - color: 'rgb(110, 189, 142)' - } - const btnstyled = { - background: 'rgb(110, 189, 142)', - margin: '1px', - maxWidth: '100%', - borderWidth: '2px', - fontSize: '10px', - borderColor: 'rgba(195, 195, 195, 0.712)', - borderRadius: '20px', - color: 'white' - } - - return ( - - - - 유저아이디 - - - 지역 - 울릉면 - 지역코드 - - - - - - 환경을 향한 노력 ㅁㅁㅁ일 째 입니다. - - - - ) -} - -export default Trydays; \ No newline at end of file diff --git a/client/src/pages/Home.js b/client/src/pages/Home.js index 285efb2fc007c2bbed7d76b4cdf69db95782277f..36c1e4155dbc26dbb791c02ac5be80f536b95188 100644 --- a/client/src/pages/Home.js +++ b/client/src/pages/Home.js @@ -3,12 +3,11 @@ import { Container, Row, Col } from 'react-bootstrap'; import MainLayer from '../components/MainLayer'; import TimeNow from './../components/TimeNow'; import '../App.css' -import Trydays from './../components/Trydays'; import EueSuggest from '../components/EueSuggest'; import ChartLine from '../components/ChartLine'; import ChartDoughnut from '../components/ChartDoughnut'; import Footer from './../components/Footer'; -import { useEffect } from 'react'; +import axios from 'axios'; function Home() { @@ -32,24 +31,29 @@ function Home() { flexDirection: 'column', padding: '0' } - useEffect(() => { - console.log('마운트 될때마다 실행'); - }, []); + + axios({ + method: 'get', + url: 'localhost:4500/loccode/doe' + }).then((res) => { + console.log(res) + }) + return ( - - - + + + - + + - {/* */} + {/* */} - diff --git a/client/src/pages/LocalCodePage.js b/client/src/pages/LocalCodePage.js new file mode 100644 index 0000000000000000000000000000000000000000..076b5d58e4dd4e2bfabbc2e711b3423ff7cb1d56 --- /dev/null +++ b/client/src/pages/LocalCodePage.js @@ -0,0 +1,51 @@ +import React from 'react' +import { Container, Row, Col } from 'react-bootstrap'; +import MainLayer from '../components/MainLayer'; +import '../App.css' +import LocCodeChange from '../components/LocCodeChange'; + +function SignupPage() { + const constyled = { + display: 'flex', + justifyContent: 'space-evenly', + width: '100%', + position: 'relative' + } + + const col1sty = { + display: 'flex', + justifyContent: 'start', + alignItems: 'center' + } + + const col2sty = { + display: 'flex', + justifyContent: 'center', + alignItems: 'center', + flexDirection: 'column', + padding: '0' + } + + + return ( + + + + + + + + + + + + + + + + + + ); +} + +export default SignupPage; \ No newline at end of file diff --git a/client/src/pages/LoginPage.js b/client/src/pages/LoginPage.js new file mode 100644 index 0000000000000000000000000000000000000000..2cb5b701068ff27f2d8697e1d0dc1dff2aff73c3 --- /dev/null +++ b/client/src/pages/LoginPage.js @@ -0,0 +1,51 @@ +import React from 'react' +import { Container, Row, Col } from 'react-bootstrap'; +import MainLayer from '../components/MainLayer'; +import '../App.css' +import LoginComp from '../components/LoginComp'; + +function SignupPage() { + const constyled = { + display: 'flex', + justifyContent: 'space-evenly', + width: '100%', + position: 'relative' + } + + const col1sty = { + display: 'flex', + justifyContent: 'start', + alignItems: 'center' + } + + const col2sty = { + display: 'flex', + justifyContent: 'center', + alignItems: 'center', + flexDirection: 'column', + padding: '0' + } + + + return ( + + + + + + + + + + + + + + + + + + ); +} + +export default SignupPage; \ No newline at end of file diff --git a/client/src/pages/LoginwithSocial.js b/client/src/pages/LoginwithSocial.js deleted file mode 100644 index 8b48c65d7ddc6fbc6c86bc04fd6d152777a8bc32..0000000000000000000000000000000000000000 --- a/client/src/pages/LoginwithSocial.js +++ /dev/null @@ -1,76 +0,0 @@ -import React from 'react' -import '../App.css' -import { Form, Modal, Button, Row, Col, Image, Alert } from 'react-bootstrap'; -import Oauth from '../components/Oauth'; -import { useEffect } from 'react'; -import axios from 'axios'; -import { useState } from 'react'; - -function LoginwithSocial() { - - const inboxstyled = { - display: 'flex', - flexDirection: 'column', - maxWidth: '100%', - justifyContent: 'center', - margin: 'auto', - padding: '10px' - - } - - function loginWithKakao() { - window.Kakao.Auth.authorize({ - redirectUri: 'http://localhost:3000/oauth' - }) - } - const [isLogin, setIsLogin] = useState(false) - - return ( - - - - LOGIN - - - -
- - - - - - - - -
-
- - - - KAKAO - - - - KAKAOHTML - - - - KAKAOPOP - - - - GOOGLE - - - - FACEBOOK - - - - - ) -} - -export default LoginwithSocial; \ No newline at end of file diff --git a/client/src/pages/SignUp.js b/client/src/pages/SignUp.js deleted file mode 100644 index 18ad88dc51799f1a61be8e1a1fd33021799b98bb..0000000000000000000000000000000000000000 --- a/client/src/pages/SignUp.js +++ /dev/null @@ -1,72 +0,0 @@ -import React from 'react' -import '../App.css' -import { Form, Modal, Button, Row, Col, Image } from 'react-bootstrap'; -// import { KAKAO_AUTH_URL } from '../components/Oauth'; - - -function SignUp() { - - const inboxstyled = { - display: 'flex', - flexDirection: 'column', - maxWidth: '80%', - justifyContent: 'center', - margin: 'auto', - padding: '1rem' - - } - - return ( - <> - - - Create an Account - -

- Sign up with your social media account or email address -

- - - - -
- - - - - - - - - - - - - - -
- -
- - {/* - - KAKAO - */} - - - GOOGLE - - - - FACEBOOK - - - - - - ) -} - -export default SignUp; \ No newline at end of file diff --git a/client/src/pages/SignupPage.js b/client/src/pages/SignupPage.js new file mode 100644 index 0000000000000000000000000000000000000000..d2bd7bb3fceab6ad809f827e9b16062936cf7cfd --- /dev/null +++ b/client/src/pages/SignupPage.js @@ -0,0 +1,51 @@ +import React from 'react' +import { Container, Row, Col } from 'react-bootstrap'; +import MainLayer from '../components/MainLayer'; +import '../App.css' +import SignupComp from '../components/SignupComp'; + +function SignupPage() { + const constyled = { + display: 'flex', + justifyContent: 'space-evenly', + width: '100%', + position: 'relative' + } + + const col1sty = { + display: 'flex', + justifyContent: 'start', + alignItems: 'center' + } + + const col2sty = { + display: 'flex', + justifyContent: 'center', + alignItems: 'center', + flexDirection: 'column', + padding: '0' + } + + + return ( + + + + + + + + + + + + + + + + + + ); +} + +export default SignupPage; \ No newline at end of file