본문 바로가기

전체 글148

[항해99 29일차] 2022.04.04 TIL /포스트 작성페이지, 포스트 상세페이지 1. 3주차 4주차 강의듣기 어우 어제 드라마보다 늦게잤더니 9시에 일어나서 지각이당. 😞 지각 하고 싶지 않았는데.. 몸이 말을 듣지 않네 ㅠㅠ export const emailCheck =(email) =>{ let _reg= /^[0-9a-zA-Z]([-_.0-9a-zA-Z])*@[0-9a-zA-Z]([-_.0-9a-zA-z])*.([a-zA-Z])*/; //이메일 정규식 표현 return _reg.test(email); }; 👉 이메일 정규식 표현 일단 포스트 목록은 뷰에 전부 다 그려놨다.ㅠㅠ 컴포넌트 쪼개기 넘 어려워ㅠㅠ 일단 강의 듣는데에 바빠서 정리를 못했는데ㅠㅠ... 갑자기 난이도가 너무 어려워졌다. 포기하고싶은마음이 굴뚝같지만, 포기하지 않을거다 ㅠ.ㅠ 할 수 있다는 마음으로...해야지.. 2022. 4. 5.
[항해99] 4주차 WIL [라이프사이클(클래스형 vs 함수형), react hooks] 이번 4주차 WIL 키워드 ! 👉라이프사이클(클래스형 vs 함수형) 👉 react hooks 1. 라이프사이클(클래스형 vs 함수형) 리액트는 클래스형과 함수형으로 컴포넌트를 생성할 수 있는데, 주로 함수형 컴포넌트가 많이 사용된다. 이제 클래스형은 사용하지 않는다고 리액트에서 공식 발표를 했다고 한다. 함수형 컴포넌트의 가장 큰 장점으로는 간단하게 함축적인 프로그래밍이 가능하다는 것 클래스형 라이프사이클 render() 메소드와 Component 상속 필수 state, props 사용이 불편하고, 많은 메모리 사용한다는 단점이 있다. 함수형 라이프사이클 간편한 컴포넌트 선언 및 프로그래밍 가능 React Hook을 사용 state와 생명주기(Life Cycle) 메소드를 별도로 구현해야 함 => use.. 2022. 4. 3.
[항해99 27일차] 2022.04.02 TIL /로그인, 회원가입 기능 1. 2-3 강의 듣기 2. 아침에 청소하기 3. 책 좀 읽기. (모던 자바스크립트) 4. 로그인 회원가입 기능 구현완료하기 ! (이해도 하기!!) 강의부터 들으러..고고 ! 토큰 기반 인증 [ OAuth2.0 / JWT / 웹 저장소 ] 👈토큰기반인증에 관한 내용과 웹저장소에 대한 내용을 이렇게 정리를 해두었당. 날짜를 담당하는 객체 date let date = new Date(); //Sat Apr 02 2022 09:58:17 GMT+0900 (한국 표준시) {} date.getTime() 1648861097466 date.setTime(date.getTime()+10000); 1648861107466 하루는 1000밀리초 * 60분 * 24시간 shared 폴더에 Cookie.js파일을 만들어서 .. 2022. 4. 2.
파이어베이스 이용해서 로그인 기능 구현하기 로그인 적용 순서 firebase.js에 만들어둔 auth 가져오기 리덕스에서 loginFB 함수 만들기 auth.signInWithEmailAndPassword()로 로그인 Login 컴포넌트에서 loginFB를 호출! 리덕스의 user 정보 업데이트 후에 메인 페이지로 이동하기 파이어베이스 로그인처리 가이드링크 후..로그인 구현할 차례 덕스구조 const loginFB=(id,pwd)=>{ return function (dispatch,getState,{history}){ auth .signInWithEmailAndPassword(id, pwd) .then((user) => { console.log(user); dispatch( setUser({ user_name:user.user.displayNam.. 2022. 4. 2.
파이어베이스 이용해서 회원가입 기능 구현하기 회원가입은 일단 어떻게 쓰는지 순서를 아는 것이 중요하다. 적용 순서 firebase.js에 만들어둔 auth 가져오기 리덕스에서 signupFB 함수 만들기 auth.createUserWithEmailAndPassword()로 가입 시키기 Signup 컴포넌트에서 signupFB를 호출! 가입한 후, display_name 바로 업데이트하기 사용자 정보 업데이트 후에 메인 페이지로 이동하기 가입을 시키는 것 => 비동기작업 음 강의 보면서 따라했더니 에러가 나서.. 파이어스토어 임포트를 아래와 같이 바꿔줬더니 에러가 사라졌다 ! import firebase from 'firebase/compat/app'; import 'firebase/compat/auth'; import 'firebase/compat.. 2022. 4. 2.
토큰 기반 인증 [ OAuth2.0 / JWT / 웹 저장소 ] 🧸 토큰 기반 인증 [옛날 - 세션기반인증] 예전에는 사용자의 로그인 상태를 서버가 전부 가지고 있었다. 서버의 세션에 사용자 정보를 넣고 이 사람이 로그인 했다 안했다를 전부 기록하고 기억 -> 로그인한 사용자가 많아지면 서버에 부하가 옴 그렇다고 서버 여러개 놓자니 관리가 까다로움 그래서 최근에는 토큰 기반 인증 방법을 많이 사용한다. 유저의 인증 정보를 세션에 담지 않는 인증방식이 토큰 기반 인증 방법이다. 클라이언트가 토큰을 가지고 있다. 🧸 OAuth2.0 외부서비스의 인증 및 권한부여를 관리하는 프레임워크 → Open Authentication, Open Authorization 동작 방식 클라이언트와 서버 사이에 인증(로그인)을 하면 서버가 access_token 을 줌. 클라이언트는 acc.. 2022. 4. 2.

티스토리툴바