본문 바로가기

전체 글119

[emotional] 현재 받은 피드백 정리 1. 회원가입 시 ID input에 email형식인지 아닌지 경고를 보기 전까지 확인하기 어려움2. 인증번호 발송 받은 후 입력한 뒤 따로 인증번호 체크를 할 수 없음. 회원가입 버튼을 눌러야지 확인 가능함. 따로 인증번호 확인 버튼이 있으면 좋겠음.3. 회원가입 하고 난 뒤에 바로 로그인을 했으면 좋겠음.4. ID input width사이즈 문제 (이메일이 길면 잘려서 보임.)유저 편의성 문제 피드백 위주로 받음. 2024. 10. 3.
[emotional] 회원가입 폼 기능 추가 기존 회원가입 폼은 단순하게 이메일 비밀번호만 입력하면 간단하게 회원가입이 되었다.불필요하게 가입되는 것을 막고자 현재는 이메일 인증을 통해서 가입을 가능하게 하였다.이메일을 입력하고 인증 버튼을 누르면 입력한 이메일로 인증 코드가 발송된다.발송된 인증 코드의 만료시간은 5분으로 설정하였고,회원가입 시에 필요한 req body 값은{ "email": "내가 쓸 이메일", "verificationCode": "이메일로 발송된 인증 코드 6자리", "password": "내가 사용할 비밀번호", "confirmPassword": "비밀번호 재확인"}이렇게 총 4개의 입력값을 받아야한다.추가적으로 비밀번호 재설정 기능도 추가할 셈. 2024. 10. 3.
[emotional] MVP단계 완성? 이모셔널 - 추천 플레이리스트로 하루를 채우세요.이모셔널에서 감정에 따른 음악 플레이리스트를 추천받으세요. 오늘 하루는 어땠나요?www.emotional.today  일단, 현재 회원가입은 아주 간단하게 이메일 형식과 패스워드 형식을 지키면 가입이 되도록 되어있다.(추후에 회원가입 시 비밀번호 재확인 추가 예정 및 이메일 인증 코드 발송 및 인증 추가 예정, 기타정보 입력 추가 예정, OAtuh 추가 예정)현재 이모셔널 루트 경로로 접근할 시에 로그인 상태를 체크인지 확인하고 유저 데이터가 없다면 /auth 경로로 리다이렉트 시킨다.(유저 데이터의 경우 로그인 했을 때 쿠키로 관리하고 있고, 이 쿠키를 체크하는 API를 구현하여 로그인 상태를 체크한다.)/auth 경로로 접근했을 경우 기본적으로 #sig.. 2024. 9. 29.
[면접복기 24.09.25] 까먹기 전에 복기하기2 (useState의 동작원리?) const MyReact = (function () { let _val; return { render(Component) { const Comp = Component(); Comp.render(); return Comp; }, useState(initialValue) { _val = _val || initialValue; function setState(newVal) { _val = newVal; } return [_val, setState]; }, };})();function Counter() { const [count, setCount] = MyReact.useState(0); const [tex.. 2024. 9. 25.
[면접복기 24.09.25] 까먹기 전에 복기하기 (feat. closure, useState, primitive type, deep copy, shallow copy) function useState(initialValue) { var _val = initialValue; function setState(newVal) { _val = newVal; } return [_val, setState];}const [foo, setFoo] = useState(0);console.log(foo);setFoo(1);console.log(foo);해당 코드는 useState hook을 구현한 것.해당 코드에서 foo라는 상태의 초기 값은 0이고 setFoo에 1의 값으로 상태를 변경하면?나는 1이 나올거라고 생각하고 답했다. 하지만 틀린 답이었고 추가적으로 위의 코드를 어떻게 수정해야할까라는 질문을 받았다.나는 var 키워드의 문제로 함수 레벨 스코프의 문제인거 같다고 .. 2024. 9. 25.
[emotional] 고도화 작업 중 기존 이모셔널은 회원가입 기능 없이  그냥 바로 사용 가능한 서비스였다.새 프로젝트를 하기 보단 고도화를 해보자는 생각에 간단한 서버를 만들었고,그걸 이용해서 고도화 작업에 들어갔다.회원가입과 로그인 폼을 만들었고, 하나의 라우터에서 해쉬를 사용해서 signin과 signup을 구분하고 있다.자세한 내용은 고도화 작업이 얼추 되는데로 기술하겠다. 2024. 9. 12.
[emotional server] 엔드포인트 변경, HTTPS 적용, CI/CD 확인 express + mysql + aws rds를 사용해서 서버를 만들었고,남은 과제로 elastic beanstalk에서 제공하는 임의의 엔드포인트가 아닌 도메인을 연결해서 엔드포인트를 만들었다. 그리고 Certificate Manager를 이용해서 SSL 인증을 통해 HTTPS 적용하고, Github Action을 사용해서 repository와 beanstalk CI/CD 파이프라인을 구축했다.  먼저 기존 emotional.today 도메인이 호스팅 되어있어서 엔드포인트 연결 자체는 route53에서 api로 사용할 도메인만  레코드 생성해서 진행했다.Elastic BeansTalk에서 로드밸런싱이 설정되어있지 않다면 사용할 애플리케이션 환경의 구성에 들어간다.구성을 클릭하면 위 스크린샷과 같은 탭을.. 2024. 9. 7.
[express + mysql + aws rds] 드디어 배포까지 완료 express mysql aws rds를 사용했고 배포는 aws elastic beanstalk로 완료.원래는 ec2로 배포하였으나, elastic beanstalk를 사용해보기로 하였음.ec2로 배포해도 테스트 해본 결과 아주 잘됨!아직 자동 배포가 안되긴 하지만 추후에 ci/cd도 업데이트 예정.포스트맨으로 로그인하면 로그인 성공했다고 나온다. 그리고 아래 스크린샷에도 로그인 관련 기록도 db에 남는데 정상적으로 기록이 된다.이걸로 emotional 프로젝트 고도화 작업 밑거름 세팅은 된거 같다.간단한 회원가입, 로그인, 로그아웃 기능만 있지만 조금씩 추가해나가면서 고도화는 계속 될 예정.elastic beanstalk를 쓰면서 겪은 에러 사항이나 사용법은 추후에 업로드 할 예정.추가 해야할 것들 C.. 2024. 9. 6.