diff --git a/db/auth/db.json b/db/auth/db.json index be37e54..68abb3d 100644 --- a/db/auth/db.json +++ b/db/auth/db.json @@ -1 +1 @@ -[{"id":"aaa","password":"111"},{"id":"bbb","password":"222"},{"id":"ccc","password":"333"},{"id":"ddd","password":"444"},{"id":"asasas@gmail.com","password":"123123"},{"id":"asasas@gmail.com","password":"123123"},{"id":"qwerqw@gmail.com","password":"123123"},{"id":"12313123@gmail.com","password":"123123"},{"id":"aaaa@gmail.com","password":"123123"},{"id":"codeisneverodd@gmail.com","password":"123123"}] \ No newline at end of file +[{"id":"aaa","password":"111"},{"id":"qkrdbsgk00@gmail.com","password":"aaaaaa"},{"id":"dunkin@dunkin.com","password":"donuts"}] \ No newline at end of file diff --git a/db/user/crud.js b/db/user/crud.js index 9acf868..cb379ec 100644 --- a/db/user/crud.js +++ b/db/user/crud.js @@ -14,13 +14,14 @@ const setData = newData => { }; module.exports = { - create(id) { + create(id, nickname) { const date = new Date(); setData([ ...data, { lastVisit: date, id, + nickname, setting: { day: DEFAULT_DAY, number: DEFAULT_NUMBER, diff --git a/db/user/db.json b/db/user/db.json index 509dfeb..c1ee0a1 100644 --- a/db/user/db.json +++ b/db/user/db.json @@ -1 +1,240 @@ -[{"lastVisit":"2022-10-10T05:25:19.506Z","id":"aaa","setting":{"day":3,"number":2,"platform":["boj","programmers","leetcode"],"nickname":"undefined"},"removedIds":["boj17140","boj2750","boj1092","boj3184","boj1707","boj2747","boj1202","boj1167","boj16954","boj2210","boj11400","boj10825","boj2108","boj1939","boj10808","boj1374","boj16435","boj10872","boj2523","boj1449","boj2693","boj10989","boj20924","boj3187","boj1012","boj1251","boj16953","boj2557","boj22864","boj10816","boj2636","boj2812","boj11651","boj11654","boj11501","boj1052","boj13459"],"problemList":[{"link":"https://www.acmicpc.net/problem/2490","title":"윷놀이","id":"boj2490","platform":"boj","category":"구현","solved":false,"givenDate":"2022-10-17T13:33:48.370Z"},{"link":"https://www.acmicpc.net/problem/2438","title":"별 찍기 - 1","id":"boj2438","platform":"boj","category":"구현","solved":false,"givenDate":"2022-10-17T13:33:48.370Z"},{"link":"https://www.acmicpc.net/problem/9237","title":"이장님 초대","id":"boj9237","platform":"boj","category":"그리디 알고리즘","solved":false,"givenDate":"2022-10-17T13:33:48.370Z"},{"link":"https://www.acmicpc.net/problem/17471","title":"게리맨더링","id":"boj17471","platform":"boj","category":"너비 우선 탐색","solved":false,"givenDate":"2022-10-17T13:33:51.754Z"}]},{"lastVisit":"2022-10-19T05:36:19.717Z","id":"guest@guest.com","setting":{"day":3,"number":3,"platform":["boj"],"lastUpdate":"2022-10-17T05:36:19.717Z"},"problemList":[{"link":"https://www.acmicpc.net/problem/22864","title":"피로도","id":"boj22864","platform":"boj","category":"그리디 알고리즘","solved":false,"givenDate":"2022-10-17T05:36:45.921Z"},{"link":"https://www.acmicpc.net/problem/9237","title":"이장님 초대","id":"boj9237","platform":"boj","category":"그리디 알고리즘","solved":false,"givenDate":"2022-10-17T13:33:48.370Z"},{"link":"https://www.acmicpc.net/problem/17471","title":"게리맨더링","id":"boj17471","platform":"boj","category":"너비 우선 탐색","solved":false,"givenDate":"2022-10-17T13:33:51.754Z"}],"removedIds":["boj4677","boj1931"]},{"lastVisit":"2022-10-17T05:36:19.717Z","id":"asasas@gmail.com","setting":{"day":1,"number":3,"platform":["boj"],"lastUpdate":"2022-10-17T05:36:19.717Z"},"problemList":[{"link":"https://www.acmicpc.net/problem/22864","title":"피로도","id":"boj22864","platform":"boj","category":"그리디 알고리즘","solved":false,"givenDate":"2022-10-17T05:36:45.921Z"}],"removedIds":["boj4677","boj1931"]},{"lastVisit":"2022-10-17T05:36:19.719Z","id":"asasas@gmail.com","setting":{"day":1,"number":3,"platform":["boj"],"lastUpdate":"2022-10-17T05:36:19.719Z"},"problemList":[{"link":"https://www.acmicpc.net/problem/22864","title":"피로도","id":"boj22864","platform":"boj","category":"그리디 알고리즘","solved":false,"givenDate":"2022-10-17T05:36:45.921Z"}],"removedIds":[]},{"lastVisit":"2022-10-17T13:07:58.950Z","id":"qwerqw@gmail.com","setting":{"day":1,"number":3,"platform":["boj"],"lastUpdate":"2022-10-17T13:07:58.950Z"},"problemList":[],"removedIds":[]},{"lastVisit":"2022-10-17T13:13:23.137Z","id":"12313123@gmail.com","setting":{"day":1,"number":3,"platform":["boj"],"lastUpdate":"2022-10-17T13:13:23.137Z"},"problemList":[],"removedIds":[]},{"lastVisit":"2022-10-17T13:13:40.016Z","id":"aaaa@gmail.com","setting":{"day":4,"number":6,"platform":["boj","programmers"],"lastUpdate":"2022-10-17T13:13:40.016Z","nickname":"한조"},"problemList":[{"link":"https://www.acmicpc.net/problem/2583","title":"영역 구하기","id":"boj2583","platform":"boj","category":"깊이 우선 탐색","solved":false,"givenDate":"2022-10-17T13:26:53.808Z"},{"link":"https://www.acmicpc.net/problem/1246","title":"온라인 판매","id":"boj1246","platform":"boj","category":"그리디 알고리즘","solved":false,"givenDate":"2022-10-17T13:26:55.459Z"},{"link":"https://www.acmicpc.net/problem/1052","title":"물병","id":"boj1052","platform":"boj","category":"그리디 알고리즘","solved":false,"givenDate":"2022-10-17T13:26:56.975Z"}],"removedIds":["boj1920","boj14659","boj1059","boj5214"]},{"lastVisit":"2022-10-18T05:36:23.868Z","id":"codeisneverodd@gmail.com","setting":{"day":2,"number":6,"platform":["boj"],"lastUpdate":"2022-10-18T05:36:23.868Z"},"problemList":[{"link":"https://www.acmicpc.net/problem/1707","title":"이분 그래프","id":"boj1707","platform":"boj","category":"깊이 우선 탐색","solved":false,"givenDate":"2022-10-18T13:37:40.143Z"},{"link":"https://www.acmicpc.net/problem/2573","title":"빙산","id":"boj2573","platform":"boj","category":"깊이 우선 탐색","solved":false,"givenDate":"2022-10-18T13:37:40.143Z"},{"link":"https://www.acmicpc.net/problem/5430","title":"AC","id":"boj5430","platform":"boj","category":"구현","solved":false,"givenDate":"2022-10-18T13:37:40.143Z"},{"link":"https://www.acmicpc.net/problem/24445","title":"알고리즘 수업 - 너비 우선 탐색 2","id":"boj24445","platform":"boj","category":"너비 우선 탐색","solved":false,"givenDate":"2022-10-18T13:38:20.691Z"},{"link":"https://www.acmicpc.net/problem/3135","title":"라디오","id":"boj3135","platform":"boj","category":"그리디 알고리즘","solved":false,"givenDate":"2022-10-18T13:38:49.169Z"},{"link":"https://www.acmicpc.net/problem/1213","title":"팰린드롬 만들기","id":"boj1213","platform":"boj","category":"그리디 알고리즘","solved":false,"givenDate":"2022-10-18T13:38:49.169Z"}],"removedIds":["boj2617","boj2617","boj13565","boj13565","boj2908","boj20044","boj1431","boj2638","boj2490","boj2490","boj2250"]}] \ No newline at end of file +[ + { + "lastVisit": "2022-10-10T05:25:19.506Z", + "id": "aaa", + "nickname": "트리플A", + "setting": { "day": 1, "number": 3, "platform": ["boj", "programmers", "leetcode"], "nickname": "undefined" }, + "removedIds": [ + "boj17140", + "boj2750", + "boj1092", + "boj3184", + "boj1707", + "boj2747", + "boj1202", + "boj1167", + "boj16954", + "boj2210", + "boj11400", + "boj10825", + "boj2108", + "boj1939", + "boj10808", + "boj1374", + "boj16435", + "boj10872", + "boj2523", + "boj1449", + "boj2693", + "boj10989", + "boj20924", + "boj3187", + "boj1012", + "boj1251", + "boj16953", + "boj2557", + "boj22864", + "boj10816", + "boj2636", + "boj2812", + "boj11651", + "boj11654", + "boj11501", + "boj1052", + "boj13459", + "boj11724", + "boj14466", + "boj21609", + "boj11399", + "boj13913", + "boj10026", + "boj8872", + "boj1448", + "boj2665", + "boj14469", + "boj1260" + ], + "problemList": [ + { + "link": "https://www.acmicpc.net/problem/13023", + "title": "ABCDE", + "id": "boj13023", + "platform": "boj", + "category": "깊이 우선 탐색", + "solved": false, + "givenDate": "2022-10-18T19:38:39.390Z" + }, + { + "link": "https://www.acmicpc.net/problem/1755", + "title": "숫자놀이", + "id": "boj1755", + "platform": "boj", + "category": "정렬", + "solved": false, + "givenDate": "2022-10-18T19:38:45.708Z" + }, + { + "link": "https://www.acmicpc.net/problem/16724", + "title": "피리 부는 사나이", + "id": "boj16724", + "platform": "boj", + "category": "깊이 우선 탐색", + "solved": false, + "givenDate": "2022-10-18T19:38:39.390Z" + }, + { + "link": "https://www.acmicpc.net/problem/11022", + "title": "A+B - 8", + "id": "boj11022", + "platform": "boj", + "category": "구현", + "solved": false, + "givenDate": "2022-10-18T19:38:39.390Z" + }, + { + "link": "https://www.acmicpc.net/problem/12851", + "title": "숨바꼭질 2", + "id": "boj12851", + "platform": "boj", + "category": "너비 우선 탐색", + "solved": false, + "givenDate": "2022-10-18T19:38:39.390Z" + }, + { + "link": "https://www.acmicpc.net/problem/1931", + "title": "회의실 배정", + "id": "boj1931", + "platform": "boj", + "category": "정렬", + "solved": false, + "givenDate": "2022-10-19T01:23:06.850Z" + }, + { + "link": "https://www.acmicpc.net/problem/9328", + "title": "열쇠", + "id": "boj9328", + "platform": "boj", + "category": "너비 우선 탐색", + "solved": false, + "givenDate": "2022-10-19T01:23:06.850Z" + }, + { + "link": "https://www.acmicpc.net/problem/1924", + "title": "2007년", + "id": "boj1924", + "platform": "boj", + "category": "구현", + "solved": false, + "givenDate": "2022-10-19T01:23:06.850Z" + } + ] + }, + { + "lastVisit": "2022-10-19T05:36:19.717Z", + "id": "guest@guest.com", + "nickname": "게스트", + "setting": { "day": 3, "number": 3, "platform": ["boj"], "lastUpdate": "2022-10-17T05:36:19.717Z" }, + "problemList": [ + { + "link": "https://www.acmicpc.net/problem/22864", + "title": "피로도", + "id": "boj22864", + "platform": "boj", + "category": "그리디 알고리즘", + "solved": false, + "givenDate": "2022-10-17T05:36:45.921Z" + }, + { + "link": "https://www.acmicpc.net/problem/9237", + "title": "이장님 초대", + "id": "boj9237", + "platform": "boj", + "category": "그리디 알고리즘", + "solved": false, + "givenDate": "2022-10-17T13:33:48.370Z" + }, + { + "link": "https://www.acmicpc.net/problem/17471", + "title": "게리맨더링", + "id": "boj17471", + "platform": "boj", + "category": "너비 우선 탐색", + "solved": false, + "givenDate": "2022-10-17T13:33:51.754Z" + } + ], + "removedIds": ["boj4677", "boj1931"] + }, + { + "lastVisit": "2022-10-18T18:36:13.715Z", + "id": "qkrdbsgk00@gmail.com", + "nickname": "방구나", + "setting": { "day": 1, "number": 3, "platform": ["boj"], "lastUpdate": "2022-10-18T18:36:13.715Z" }, + "problemList": [ + { + "link": "https://www.acmicpc.net/problem/5052", + "title": "전화번호 목록", + "id": "boj5052", + "platform": "boj", + "category": "정렬", + "solved": false, + "givenDate": "2022-10-18T18:41:43.892Z" + }, + { + "link": "https://www.acmicpc.net/problem/10825", + "title": "국영수", + "id": "boj10825", + "platform": "boj", + "category": "정렬", + "solved": false, + "givenDate": "2022-10-18T18:41:43.892Z" + }, + { + "link": "https://www.acmicpc.net/problem/1758", + "title": "알바생 강호", + "id": "boj1758", + "platform": "boj", + "category": "그리디 알고리즘", + "solved": false, + "givenDate": "2022-10-18T18:41:43.892Z" + } + ], + "removedIds": [] + }, + { + "lastVisit": "2022-10-19T01:24:24.347Z", + "id": "dunkin@dunkin.com", + "nickname": "던킨먹는날", + "setting": { "day": 1, "number": 3, "platform": ["boj"], "lastUpdate": "2022-10-19T01:24:24.347Z" }, + "problemList": [ + { + "link": "https://www.acmicpc.net/problem/13305", + "title": "주유소", + "id": "boj13305", + "platform": "boj", + "category": "그리디 알고리즘", + "solved": false, + "givenDate": "2022-10-19T01:24:37.864Z" + }, + { + "link": "https://www.acmicpc.net/problem/3135", + "title": "라디오", + "id": "boj3135", + "platform": "boj", + "category": "그리디 알고리즘", + "solved": false, + "givenDate": "2022-10-19T01:24:37.864Z" + }, + { + "link": "https://www.acmicpc.net/problem/1009", + "title": "분산처리", + "id": "boj1009", + "platform": "boj", + "category": "구현", + "solved": false, + "givenDate": "2022-10-19T01:24:37.864Z" + } + ], + "removedIds": [] + } +] diff --git a/server.js b/server.js index 6d476ae..f0be504 100644 --- a/server.js +++ b/server.js @@ -69,10 +69,10 @@ app.post('/signin', (req, res) => { }); app.post('/signup', (req, res) => { - const { id, password } = req.body; + const { id, password, nickname } = req.body; if (!auth.exist(id)) { auth.create(id, password); - user.create(id); + user.create(id, nickname); } res.json(user.getInfo(id)); diff --git a/src/pages/SignIn/components/SigninForm.js b/src/pages/SignIn/components/SigninForm.js index 2ad1a8d..3a31ec1 100644 --- a/src/pages/SignIn/components/SigninForm.js +++ b/src/pages/SignIn/components/SigninForm.js @@ -4,6 +4,7 @@ import { SigninScheme } from '../../../shared/scheme/scheme.js'; import styled from '../../../library/styled.js'; import { requestSignIn } from '../../../shared/store/userInfo.js'; import { router } from '../../../shared/router/index.js'; +import theme from '../../../shared/styles/theme.js'; const styles = { submitBtn: { @@ -17,6 +18,12 @@ const styles = { color: 'grey', }), }, + errorMsg: styled({ + height: '20px', + font: theme['font-kr-regular'], + color: theme['orange-color'], + 'font-size': '14px', + }), }; class SigninForm extends Component { @@ -28,17 +35,16 @@ class SigninForm extends Component { domStr() { const { userid, password, errorMsg } = this.state; - const { isValid } = this.signinScheme; - this.signinScheme.userid.value = userid; this.signinScheme.password.value = password; + const { isValid } = this.signinScheme; return `
${Object.values(this.signinScheme) .map(scheme => new SchemeInput({ scheme, onInput: this.onInput.bind(this) }).render()) .join('')} -
${errorMsg ?? ''}
+
${errorMsg ?? ''}
`; } @@ -46,7 +52,6 @@ class SigninForm extends Component { onInput(e) { const newState = {}; newState[e.target.name] = e.target.value; - newState.idChanged = e.target.name === 'userid' ? true : null; this.setState.call(this, newState); } diff --git a/src/pages/SignIn/index.js b/src/pages/SignIn/index.js index d189718..c817315 100644 --- a/src/pages/SignIn/index.js +++ b/src/pages/SignIn/index.js @@ -2,17 +2,30 @@ import Component from '../../library/Component.js'; import { Header } from '../../shared/components/index.js'; import { router } from '../../shared/router/index.js'; import { SigninForm } from './components/index.js'; +import styled from '../../library/styled.js'; +import theme from '../../shared/styles/theme.js'; +const styles = { + title: styled({ + 'text-align': 'center', + width: '100%', + font: theme['font-en-bold'], + 'font-size': '47px', + }), + link: styled({ + color: theme['orange-color'], + }), +}; class SignIn extends Component { domStr() { return `
${new Header().render()} -

AllSol

+

AllSol

${new SigninForm().render()}
Don't have an account? - +
`; diff --git a/src/pages/SignUp/components/SignupForm.js b/src/pages/SignUp/components/SignupForm.js index 448443f..3da411f 100644 --- a/src/pages/SignUp/components/SignupForm.js +++ b/src/pages/SignUp/components/SignupForm.js @@ -23,17 +23,24 @@ class SignupForm extends Component { constructor() { super(); this.signupScheme = new SignupScheme(); - this.state = { userid: '', password: '', 'confirm-password': '', isDuplicated: null, isIdDirty: null }; + this.state = { + userid: '', + nickname: '', + password: '', + 'confirm-password': '', + isDuplicated: null, + isIdDirty: null, + }; } domStr() { - const { userid, password, 'confirm-password': confirmPassword, isDuplicated, isIdDirty } = this.state; + const { userid, nickname, password, 'confirm-password': confirmPassword, isDuplicated, isIdDirty } = this.state; this.signupScheme.userid.value = userid; + this.signupScheme.nickname.value = nickname; this.signupScheme.password.value = password; this.signupScheme['confirm-password'].value = confirmPassword; - const { userid: _userid, isEmpty, isValid } = this.signupScheme; - const canSubmit = !isEmpty && isValid && isDuplicated === false; - + const { userid: _userid, isValid } = this.signupScheme; + const canSubmit = isValid && isDuplicated === false; // prettier-ignore return `
@@ -45,7 +52,7 @@ class SignupForm extends Component {
${ isDuplicated === null || isDuplicated || isIdDirty ? ``: - ``} + ``}
${isDuplicated ? '중복된 아이디입니다.':'' }
`; + const { nickname } = userInfo; + return ` +
+
${nickname}님 어서옵쇼!
+ +
+ `; } addEventListener() { diff --git a/src/shared/components/SchemeInput.js b/src/shared/components/SchemeInput.js index 7571190..1c57808 100644 --- a/src/shared/components/SchemeInput.js +++ b/src/shared/components/SchemeInput.js @@ -1,5 +1,6 @@ import Component from '../../library/Component.js'; import styled from '../../library/styled.js'; +import theme from '../styles/theme.js'; const styles = { container: styled({ @@ -7,30 +8,55 @@ const styles = { 'flex-direction': 'column', 'align-items': 'flex-start', gap: '0.5rem', - margin: '3rem 4rem', + margin: '1rem 4rem', }), - - input: styled({ - width: '100%', + label: styled({ + font: theme['font-en-bold'], + 'font-size': '15px', + }), + input: { + valid: styled({ + width: '100%', + height: '43px', + border: `solid 1px ${theme['lightgray-color']}`, + 'border-radius': '6px', + 'padding-left': '8px', + font: theme['font-kr-regular'], + 'font-size': '16px', + }), + invalid: styled({ + width: '100%', + height: '43px', + border: `solid 1px ${theme['orange-color']}`, + 'border-radius': '6px', + 'padding-left': '8px', + font: theme['font-kr-regular'], + 'font-size': '16px', + }), + }, + errorMsg: styled({ + height: '20px', + font: theme['font-kr-regular'], + color: theme['orange-color'], + 'font-size': '14px', }), }; class SchemeInput extends Component { domStr() { - const { type, id, required, label, name, value, errorMsg, valid, accept } = this.props.scheme; + const { type, id, required, label, name, value, errorMsg, isValid, accept } = this.props.scheme; // prettier-ignore return `
- - ${label} + -
${valid ? '' : errorMsg ?? ''}
+
${!!value && isValid===false ? errorMsg : ''}
`; } diff --git a/src/shared/scheme/scheme.js b/src/shared/scheme/scheme.js index be4adf2..c493263 100644 --- a/src/shared/scheme/scheme.js +++ b/src/shared/scheme/scheme.js @@ -42,6 +42,17 @@ class SignupScheme extends SigninScheme { return /^[0-9a-zA-Z]{6,12}$/.test(this.value); }, }; + this.nickname = { + type: 'text', + value: '', + label: 'Nickname', + id: 'signup-nickname', + name: 'nickname', + errorMsg: '8자 이하로 입력해주세요.', + get isValid() { + return /^.{1,8}$/.test(this.value); + }, + }; this['confirm-password'] = { type: 'text', value: '', @@ -56,7 +67,7 @@ class SignupScheme extends SigninScheme { } get isValid() { - return this.userid.isValid && this.password.isValid && this['confirm-password'].isValid; + return this.userid.isValid && this.password.isValid && this['confirm-password'].isValid && this.nickname.isValid; } get isEmpty() { diff --git a/src/shared/store/userInfo.js b/src/shared/store/userInfo.js index 44b233b..290ac9a 100644 --- a/src/shared/store/userInfo.js +++ b/src/shared/store/userInfo.js @@ -129,7 +129,7 @@ const requestSignIn = async ({ id, password }) => { } }; -const requestSignUp = async ({ id, password }) => { +const requestSignUp = async ({ id, password, nickname }) => { try { const res = await axios({ method: 'post', @@ -137,6 +137,7 @@ const requestSignUp = async ({ id, password }) => { data: { id, password, + nickname, }, }); return true;