전체 글76 프론트엔드인 내가 새벽2시에 출근해서 서버교체를? 네 그게 실제로 일어났습니다. ✅ 우리는 왜 서버교체를 하게 되었는가? 현재 재직중인 회사는 트래픽이 일정하지 않다. 특정 이벤트가 있을 때에만 확 몰리고, 그 외 시간에는 잠잠한 편이다. 2022년 초까지는 고정인스턴스를 사용하고있었다. 그러다가 이렇게 사람이 몰리게 되면... 완전 죽어버려서 아~무것도 못하는 대형이슈가 발생한다. 그래서 오토스케일링이 되는 serverless v1으로 변경을 했었다. (그 때에도 점검중 화면을 만들었었지) 그런데도! 이벤트가 있을 때 RDS의 커넥션풀이 꽉차고, CPU가 터진다. serverless v2는 RDS Proxy도 적용 가능하고, Reader/Writer도 나눌 수 있기 때문에 우리는 v2로 변경을 하기로 결심하게 된다... ✅ 어떻게 변경을 했는가? (0.. 2022. 10. 1. [JavaScript] JS의 반복문 그동안 배운 것들이 있었다... 그냥 for문을 써도 되는 상황에 굳이굳이 map을 사용한 나는 바보다 그래서 예전에 정리해둔 반복문을 가져왔다... 😎 두줄 요약 객체 순회 할 때 → Object.keys, Object.values, Object.entries 배열 순회 할 때 → forEach, map, filter, reduce 등등 ✔ for for (let i = 0; i < 10; i++) { console.log(i); } 너도알고 나도알고 모두가 아는 그 for문 ✔ for in const obj = { name: '김점프', age: '4' } for (const key in obj) { console.log(`${key} : ${obj[key]}`); } // name : 김점프 // .. 2021. 11. 21. [React] 리액트에서 왜 useState를 쓰라고 할까 코드리뷰를 받았는데, 엄청 상세해서 놀랐다! 역시 해봐야 아는 것들이 아주 많다는 것을 깨닫는 요즘이다😎 🤔 그냥 변수 말고 state를 쓰는 가장 큰 이유 state가 변경 될 때 관련된 DOM을 다시 렌더링 되게 해야 한다면, state를 써야 한다! → SPA를 사용하고싶으면 state를 써야한다 왜냐하면 리액트는 state에 수정이 일어나면 state가 포함된 DOM을 재렌더링 해주기 때문인데.... 그걸 알기 위해서는 리액트의 Life cycle을 알아야 한다🤯 #가보자고 🤔 setState말고 state를 직접 변경해주면 왜 화면 갱신이 안될까? 리액트의 컴포넌트는 Mount 상태에서 한번 render() 를 실행하고, 후에는 Update 상태에 진입하여 shouldComponentUpdate.. 2021. 10. 26. [JavaScript] 디바운스(Debounce) vs 스로틀(Throttle) ✅ 공통점 짧은 시간에 여러번 발생하는 이벤트를 그룹화해서, 과도한 이벤트 호출을 방지 엄청나게 빠른속도로 클릭을 여러번 하기 검색창에 키보드로 입력하기 스크롤바를 위아래로 쭉쭉 움직이기 창을 리사이징하기 등등... ✅ 디바운스 (Debounce) 요청이 들어오면 일정시간을 기다린 후 요청을 수행하는데, 기다리는 동안 같은 요청이 추가로 들어오면 이전 요청은 취소됨 연이어서 호출되는 함수 중 가장 마지막(또는 가장 처음)만 호출 되도록 함 쉼없이 계~~~속 클릭하면 클릭이 멈출때까지 기다렸다가 멈추면 실행함 그래서 만약 무한 입력을 하면 무한 기다림을 함 toggle 버튼 이벤트 등에 주면 좋음 function debounce(callback, limit = 100) { let timeout return.. 2021. 10. 12. [JavaScript] var과 호이스팅 ✅ 호이스팅이란? catName("클로이"); function catName(name) { console.log("제 고양이의 이름은 " + name + "입니다"); } /* 결과: "제 고양이의 이름은 클로이입니다" */ 함수 안에 있는 선언들을 모두 끌어올려서, 해당 함수 유효 범위의 최상단에 선언하는 것 함수 선언만! 끌어올려짐 (할당은❌) //변수의 호이스팅 예시 console.log(name); // undefined var name = "김점프"; //------------------------------- var name; // name변수가 호이스팅 되어 상단으로 이동 console.log(name); name = "김점프"; //함수의 호이스팅 예시 foo(); foo2(); funct.. 2021. 10. 11. 이전 1 2 3 4 ··· 16 다음
