이전다음 Javascript [Javascript] 프로미스(Promise) 더보기 SSAFY [SSAFY] 공통프로젝트 회고 (feat. 최우수상🏆) 더보기 Next.js [Next.js] 프리페칭(Pre-fetching) 더보기 Vue3 [Vue3] 컴포넌트 간 통신 (props, emit) 더보기 Flutter [Flutter] 특정 작업 수행한 뒤 위젯 갱신(rebuild)하기 더보기 C++ [C++] STL - 시퀀스 컨테이너(sequence container) [vector, deque, list] 더보기 Javascript [Javascript] 프로미스(Promise) 상점에 가서 물건을 주문하는데 그 물건이 나올 때까지 시간이 걸린다고 가정해보자. 언제 완료되는지 알 수 없고, 물건을 만들다가 실패하는 경우도 있다. 이럴 때 소비자는 10초에 한 번씩 "다 됐나요?"라고 물어본다. 판매자는 "아니요" 또는 "다 됐습니다"라고 대답한다. 실패했다고 말하는 경우도 있다. 그러면 물건을 다시 주문해야한다. 이럴 때 상점에 주문을 하고 상품이 준비되었거나 실패되었으면 알려달라고 하면서 전화번호를 주고 나오는 게 낫다. 상품이 준비되는 동안 다른 작업도 할 수 있다. 상점은 이 번호를 기억했다가 작업이 완료되거나 실패하면 소비자에게 알려준다. 이와 같은 상황에서 사용할 수 있는 것이 Promise이다. 프로미스는 다음과 같이 사용한다. const pr = new Promise.. SSAFY [SSAFY] 공통프로젝트 회고 (feat. 최우수상🏆) 7주간의 공통프로젝트가 끝났다!! 열심히 달려왔고 목표로 했던 수상, 그것도 1등을 해서 너무 뿌듯한 프로젝트로 기억에 남을 것 같다. 이대로 보내주기 아쉽지만 보내줄 때가 되었으니 회고를 써보려 한다.프로젝트 소개서비스명은 키즈링크, 유치원과 학부모를 연결하는 서비스이다. 유치원 선생님이 겪는 잡무와 학부모의 갑질 문제를 해결하고, 학부모의 입장에서 아이의 안전에 대한 걱정과 상담을 위해 유치원을 방문해야 하는 번거로움을 줄이기 위해 이 프로젝트를 기획했다. 핵심 기능은 AI 아이별 사진분류, 화상상담 예약 자동 일정 조율, 실시간 화상상담, 상담 중 폭언 감지, 등하원버스 실시간 위치 확인이고 부가 기능은 알림장, 성장일지, 서류관리, 일정관리가 있다. 이 프로젝트에서 나는 선생님용 서비스의 전체적인.. Next.js [Next.js] 프리페칭(Pre-fetching) 프리페칭은 Pre(사전에, 미리)-Fetching(불러온다) 즉, 사용자가 현재 보고 있는 페이지에서 링크로 연결된 모든 페이지를 사전에 불러오는 기능이다. 페이지 이동을 빠른 속도로 지체없이 처리하기 위해 만들어진 기능이다. 그런데..! Next.js의 사전렌더링 방식에 대해 알고 있다면 의문이 들 수 있다. Next.js는 서버가 브라우저에 사전 렌더링된 HTML 페이지를 응답한 후, 후속으로 모든 JS 파일을 번들 파일로 전달한다. 이 때문에 초기 접속 요청이 종료된 이후의 페이지 이동은 서버에 별도의 요청 없이 브라우저 측에서 직접 JavaScript 코드를 실행시켜 컴포넌트를 교체하는 방식(CSR)으로 이루어진다. CSR을 사용하는데 왜 Pre-Fetching이 필요할까?Next.js는 모든.. Vue3 [Vue3] 컴포넌트 간 통신 (props, emit) 동일한 사진 데이터가 한 화면에 다양한 위치에서 여러 번 출력될 수 있다.하지만 해당 페이지를 구성하는 컴포넌트가 여러 개라면 각 컴포넌트가 개별적으로 동일한 데이터를 관리해야 할까?그렇다면 사진을 변경해야 할 때 모든 컴포넌트에 대해 변경 요청을 해야한다.=> "공통된 부모 컴포넌트에서 관리하자" 부모는 자식에게 데이터를 전달(pass props)하며, 자식은 자신에게 일어난 일을 부모에게 알림(emit events)Props- 부모 컴포넌트로부터 자식 컴포넌트로 데이터를 전달하는데 사용되는 속성- 모든 props는 자식 속성과 부모 속성 사이에 하향식 단방향 바인딩(one-way-down binding) 형성부모 속성이 업데이트되면 자식으로 흐르지만 그 반대는 안됨자식 컴포넌트 내부에서 props를 .. Flutter [Flutter] 특정 작업 수행한 뒤 위젯 갱신(rebuild)하기 Stateful widget에서 위젯을 rebuild 하려면 setState((){}); 를 쓴다. 특정 작업을 수행한 뒤 화면을 갱신하려면 setState((){}); 내에서 작업이 완료된 뒤 then으로 setState((){}); 를 호출하도록 하면 된다. setState(() { 수행할 작업 .then((value) => setState(() {})); }); 예를 들어, 쿠폰을 반납하는 작업을 수행한 뒤 화면을 갱신하는 코드는 다음과 같다. setState(() { Get.find() .deleteCoupon(widget.welcomeMenu.menuId) .then((value) => setState(() {})); }); C++ [C++] STL - 시퀀스 컨테이너(sequence container) [vector, deque, list] 시퀀스 컨테이너(sequence container) 특징 메모리 상에서 모든 요소가 직전 순서로 배치되어 순서가 존재해야 한다. 즉, 첫 번째 요소와 마지막 요소를 제외한 모든 요소는 앞뒤로 컨테이너의 요소가 존재해야 한다. 반복자가 이동할 때 요소의 순서가 변경되지 않음을 보장하기 위해 반복자는 최소 순방향 반복자를 사용해야 한다. 시퀀스 컨테이너는 직선 순서로 배치되어 명확한 순서가 존재하므로 특정 위치에 대한 참조가 가능해야 한다. vector 벡터는 동적 배열의 클래스 템플릿으로 가장 기본이 되는 컨테이너이다. 벡터는 데이터가 들어가고 나올 수 있는 입출구가 뒤쪽 하나이며 앞쪽은 막혀있는 형태이다. 따라서 데이터를 넣을 때도 뒤에서부터 쌓이고 데이터를 꺼낼 때는 맨 뒤에서부터 뺄 수 있다. 시퀀스..