[69~73일차] 20210621~25 apple clone 팀 프로젝트

 할 작업  

 

2. login할 때 session에 넣는것 골라서 넣기 (pw 같은 개인정보 빼기) 

 

3. 쿠키 값에 시간 찾아보기 

 

12. 구글 크롤링  

 

 

 

주말에 할 일 

1. google accesstoken 받기 ! 

2. 아이디, 비밀번호, 핸드폰번호 미니멈길이 설정 - 정규식 써서 해보기 ! 

3. 다른 페이지에서 chat창 나오도록 ! 

 

 

 

공부해볼 것 

css - before, after

REST API -> 다시 공부 

 

 

 

 

 

 

이전 작업

1. 기본 server.js

틀 구성 

2. sequelize models

틀 구성 

users, items, buy tables + 외래키 설정 완료 & JS 에 tables 가져오기 완료 / 사용도 가능 ! 

3. JWT

(token, userpw sha256으로 암호화해서 return하는거  완료 ) & JWT sebsite verified done 

* 수정 db 생년월일 추가 /id 를 email로 수정 완료 

3. 회원가입

- 비밀번호 암호화 / db 연결  

4. 로그인

- db 연결 

- JWT PW / Token DB 확인 ok 

login 아이디, 비번 틀렸을 때 / redirect 수정 ok 

login 아이디,비번 맞을 떄 res.redirect 안됨 -:> ok 

5. 쿠키 / session / expiary time설정 

token 시간 2시간  체크 

로그인 시 AccessToken cookie 저장 완료 

5. auth.js ->

user가 userinfo 볼 때 middleware로 사용 / 그 외에는 ? 채팅  

auth res.redirect -> json으로 바꾸는거 

6. 채팅1

socket - client 부분 

popup -> html or http ....

auth.js 연결 json 

채팅 시간 나오도록 / 채팅 개수 표현 

시간 표시 00 

같은 시간에는 시간표시 x 

7. 채팅 2

chat, chatHelp, chatRoom, chatBtn.html - html, css 

상대방 메세지 시간 위치 조정

8. 회원가입

- 아이디(이메일 ) db에 있으면 가입안되게 설정 

- 비밀번호 영문, 숫자, 기호 사용 여부 확인 

9. alert local표시 안되게 만들기 ok 

10. 채팅3

채팅 길어지면 스크롤 이벤트 ! 

채팅value 없으면 alert - 질문 

안읽음 표시 

엔터치면 채팅이 보내지게 

 

11. API 카카오 로그인 추가 / 

12. local 로그 아웃 , 카카오 로그아웃 

로그인 / 로그아웃 시 nav 에 '로그인 ' ---> '로그아웃' 변경 + 이름 추가 

13. 로그인 쿠키에 로그인값 저장 ---> session에다가 함 ---> naver, kakao, local 별로 Object name 다름 

14. 로컬 / 카카오  회원 탈퇴

- local 로그인 시 로그아웃에 이름 안뜸 

15. 구글 API ok  로그 아웃 / 탈퇴 수정 完 

구글 로그아웃 / 쿠키 삭제 등등 끝 !-> server가아닌 브라우저 쪽 function 으로 요청했었어야해서 지금까지 배운 것과 반대 (?) 방향이라 어렵고 오래걸렸다 ,,, 어쨌뜬 끝낫다 ! 

main page HTML & CSS  / scroll observer 처음 써봄 !!! 굳 

16. 구글 지도 API 

17. 임시 비밀번호 발급 수정 

18.  local 회원가입후 alert 뜨게 -> 지금은 바로 로그인 페이지로 넘어감 

-> sweetalert swal 인 경우 바로 넘어가고 alert는 먼저 뜨고 그 다음에 redirect 

19. join 메일 주소 유효한지 확인하는거  

- join 후 메일 인증 메일 보내고 받고 로그인 되도록 ! 

20. DB 구조 다시 파악하기 ! (수-금 -> DB & sequelize) 

검색 기능 확인 ! 

 

21. 계정 비밀번호, 아이디 등 수정 가능하게 -> db 연결 

22. join - 이메일 유효성 검사 & verification email check 

23. 검색 필터 db말고 다른거 

24. login alert 두번뜨는거 수정 

25. main page chat popup size 조절 / css 

배운 점 : function 같은 것은 모듈 js 파일로 따로 만들고 (functions 모음) 그리고 html 의 아래에 script 에 elements 들 변수에 담아서 addEventLinstener 실행, 함수(모듈안에있는) 불러오기 가능 ! 

26. 채팅 1:1 (관리자 - 고객 ) 따로따로 뜨도록 설정하기 ! 서영님과 힘겹게 성공했다 !!!!! 감격 

27. 11. 반응형 로그인, 회원가입 

28. main page - 채팅 아이콘 추가 

29. sweetalert모두 확인 -> 적용안된 곳 수정 ! 

30. 아이디, 비밀번호, 핸드폰번호 미니멈길이 설정 - 정규식 써서 해보기 ! 

 

 

사용한 확장 프로그램 

Fatkun AI Downloader(Video,Image,Music)

 

파이썬으로 서버만들어보기 - 디장부 / 플라스크 

프레임워크 - 

 

스텍 - ex) 브라우저 뒤로가기 / 큐 

 

node.js non-blocking io 가 가능하다. 

 

무료 배포 - 파이어베이스? / url 사야함. / 

웹앱... 

 

i / O - 파일의 접근 이 안된다...js는 ! ex) C 폴더에 못들어감. 

JS는 iO가 없다 ! 라고 했는데 백엔드는 어떻게 돌아가냐. 0> 언어를 해석하는 부분만 가져온게 Node.js 로 만들음 + JS 가 원래 없었던 기능인 버퍼,io를 만들어서 이제 백엔드 도 컴퓨터 환경에서 코드가 실행될수 잇게 됨. 

Node.js에서 Js를 실행하면 파일 접근이 가능... -> server 를 만들 수 있음/

node.js는 서버용이 아니라 파일 접근이 가능해서 그래서 server구현이 가능한것 

모든걸 다 코드로 치기 어려우니 까   express라는게 나옴. - text를 알아서 객체화 시켜주는 애 

 

http package -> 서버로 만들어보면 불편함. 장점: 배울 내용이 많음. 로그인이라도 만들어보면 좋음. 

 

userid를 세션에 담는거 vs 쿠키 담는거 (여러개의 같은 브라우저 띄워서 확인하기 어려움) 

 

질문

1. chat.dataset.value를 변수에 담아서 하면 +=1이 안되는 이유 

2. 채팅value 없으면 alert 

3. 팝업창에서 다시 redirect to login page 

4. join.js DB 첫줄 

5. session 에다가 고객의 정보를 다 넣어도 되는지 ? 

6. 회원 탈퇴 시 cookies 모두 delete 했지만 client쪽 브라우저의 cookies 는 뭐가 많이 남아있음 -> 요건 상관이 없눈건지 ? ? 

7. google logout 에서 url 두번 거쳐야 하는 이유? 

8. auth.js   -> json 어디로 가는지?    => 해당 url 로 이동 바로 전 html 과 js 를 찾아봐 !! 

module.exports=(req,res,next)=>{

    let {AccessToken} = req.cookies;

    

    if(AccessToken == undefined) {

        console.log('AccessToken이 undefined입니다.');

        res.json({result:false, msg:'로그인이 필요합니다. 로그인 하시겠습니까?'})

        return;

    }