profile
Frontend
post-thumbnail

팀플회고1

회고

2022년 7월 28일
·
0개의 댓글
·
post-thumbnail

6월 30일

CDN, SSL인증서는 디폴트값으로 버지니아 북부 지역으로 설치했다.CloudFront 제외 나머지 (LB, EC2, storage 등은 모두 서울 지역으로!)LB옆에 Health Checker가 존재/ 인스턴스 그룹 / 5초마다 몇번씩 인스턴스 그룹 내의 인스턴스에

2022년 6월 30일
·
0개의 댓글
·
post-thumbnail

6월 28일

정적파일은 storage동적파일은 프론트엔드 서버로 분리배포는 yarn start 명령어로 함!=>소스코드를 수정해도 refresh 되지 않음=>배포 전에 최적화 과정이 선행되어야 함=>순서 1️⃣yarn build / 3️⃣yarn start(24시간동안 서버를 실행

2022년 6월 28일
·
0개의 댓글
·
post-thumbnail

6월 27일

배포

2022년 6월 27일
·
0개의 댓글
·
post-thumbnail

6월 23일

좋아요를 눌렀으면 백엔드로 가서, DB의 엑셀에 저장하고 받아와서 브라우저에 띄우는게 정상인데"어차피 받아올것"임을 전제로 거의 딜레이 없이 바로 화면에 좋아요를 띄우게 된다.인터넷이 느린곳에서 특히 효과적임실제로 빠른게 아니라 "빠르게 보이는" 눈속임남용하지 말기!!

2022년 6월 23일
·
0개의 댓글
·

Promise all

비동기 처리란 순서가 보장되지 않아도 되는 상황을 말한다. "유저를 조회하고 거기서 얻은 유저 아이디를 통해 찜하기 상품을 가져온다"와 같은 경우이다! (순서와 무관한) 그렇다면 이런 순서와 무관한 비동기 작업을 병렬로 진행하려면 어떻게 해야할까...... 일단 asy

2022년 6월 22일
·
0개의 댓글
·

Callback

콜백함수란...다른 함수의 인자로 이용되는 함수어떤 이벤트에 의해 호출되어지는 함수

2022년 6월 22일
·
0개의 댓글
·

재귀함수

자기 자신을 호출하는것을 의미한다. 재귀함수는 종결조건이 필수임..! 종결조건이 없으면 무한루프에 빠지게 된다.재귀함수의 장점코드가 짧기 때문에 유지보수가 용이해진다재귀함수의 단점재귀함수를 실행할 때마다 실행컨텍스트에 저장되기 때문에 메모리에 부담이 간다.

2022년 6월 22일
·
0개의 댓글
·

React HoC & HoF

HoC...?High Order Component 상위컴포넌트 라는 뜻이다. 로그인을 하지 않은 유저가 로그인을 해야만 볼 수 있는 페이지 (예를 들면 마이페이지)에 접근하려면 "로그인을 해주세요"라고 알림이 떠야 한다. 그러한 페이지가 수백 페이지라면...? 각 페이

2022년 6월 22일
·
0개의 댓글
·

JS Closure

클로저란 어떤 함수가 자신의 내부가 아닌 외부에서 선언된 변수에 접근하는것을 뜻한다.자바스크립트에서는 매개변수와 로컬변수 뿐만 아니라 함수 외부에서 선언된 변수도 자유롭게 접근할 수 있다!!!!! 함수가 자신의 밖에서 선언된 변수에 접근하는 것을 클로저라고 한다.

2022년 6월 22일
·
0개의 댓글
·
post-thumbnail

6월 22일

rerender 시, 변수가 새로 만들어지는 상황함수가 새로 만들어지는 상황부모가 리렌더 시, 자식도 리렌더 되는 상황state가 변경될때마다 처음부터 다시 렌더링 되어서 처음에 써놓은 "컨테이너가 렌더링 됩니다"가 계속 찍히고 있음또한 state가 변경될때 다시 렌더

2022년 6월 22일
·
0개의 댓글
·
post-thumbnail

6월21일

이미지나 동영상은 구글 클라우드 스토리지에 따로 저장했었음파일은 여전히 스토리지에 남아있게됨!!!!!=> 스토리지 저장 비용 등 각종 비용이 발생하게됨!!!!브라우저에서 자체적으로 이미지로 변환할 수 있는 fileUrl을 만든다. (아직 스토리지 저장되지 않았음, 백엔

2022년 6월 21일
·
0개의 댓글
·
post-thumbnail

6월 20일

(난이도 있는 부분)accessToken 복습인증:토큰얻는과정인가:게시글 등록, 상품등록 등 내가 철수임을 인정받는 과정로그인을 하면 id/pw 넘김 => 그 데이터가 DB에 있는지 찾고 => DB에 있으면 백엔드 컴퓨터의 세션에 "철수:로그인함"과 같이 메모리세션에

2022년 6월 20일
·
0개의 댓글
·
post-thumbnail

6월 17일

🚀 오늘 배울 내용 - 구글지도 - 네이버 지도 - 카카오 지도 (수업에서 사용할것) ># 🚀 카카오맵이 있는 페이지로 이동하기 위해 router.push를 사용하면 오류가 뜨는 현상!!!! (a태그,href를 이용해야 오류가 사라진다...?) 💡 구버전)

2022년 6월 17일
·
0개의 댓글
·
post-thumbnail

6월 16일

html, css는 프론트엔드로부터 브라우저가 받아오는모습DB 엑셀로부터 정보를 백엔드가 받아오는 모습 PG(Payment Gateway)사가 카드회사를 대신해서 결제업무를 대행한다ex)NHN에 맞게 시스템을 만들어놓았다면 다른 PG사로 바꾸는게 쉽지 않다!!!그래서

2022년 6월 16일
·
0개의 댓글
·
post-thumbnail

6월 15일

💡 여러 웹사이트들을 보면 굵기, 밑줄, 기울임 등을 적용하는 글쓰기(웹 에디터) 경험을 할 수 있다!!!웹에디터(라이브러리)를 적용해보자!하이드레이션에서 발생하는 에러는 왜 생기고 어떻게 핸들링해야 하는지1️⃣ react-draft-wysiwyg2️⃣ React-Q

2022년 6월 15일
·
0개의 댓글
·
post-thumbnail

권한분기

로그인 인증을 마쳤으면 이에 따른 권한 분기가 이루어 진다.아주 작게는 로그인을 한 사람과 로그인을 하지 않은 사람.추가적으로 로그인에 등급을 매기면, 운영자로 로그인 한 사람, 판매자로 로그인 한 사람, 거래처 사장님으로 로그인 한 사람 등 다양하게 권한을 분리할 수

2022년 6월 15일
·
0개의 댓글
·

Cookie, Session, Local Storage

쿠키는 매번 서버로 전송된다.웹 사이트에서 쿠키를 설정하면 이후 모든 웹 요청은 쿠키정보를 포함하여 서버로 전송된다. Web Storage는 저장된 데이터가 클라이언트에 존재할 뿐 서버로 전송은 이루어지지 않는다. 이는 네트워크 트래픽 비용을 줄여 준다.단순 문자열을

2022년 6월 15일
·
0개의 댓글
·

Throttling & Debouncing

버튼을 그냥 숨기고 onchange일어날때마다 refetch하면, 바로 계속 리패치는 되고 가장 쉬운 방법이긴 하지만, 계속 graphql요청이 들어가기때문에 좋은 방법이 아니다.특정작업의 특정시간내에서 그 작업이 반복되지 않으면 마지막만 데이터를 전송하는것쉽게 생각하

2022년 6월 15일
·
0개의 댓글
·

shallow routing

shallow routing 은 새로고침 하지 않고 url을 불러올 수 있는 next/js의 기능이다.Next.js에서 데이터 패칭 메소드를 다시 사용하지 않고 웹 사이트의 URL을 변경할 수 있게하는 기능 제공이라고 이해하면 된다 !데이터 패칭 메소드로는 getSer

2022년 6월 15일
·
0개의 댓글
·