[알고리즘] 합병 정렬

정렬 알고리즘의 두번째 파트.작은 규모에서 잘 작동하는 버블, 삽입, 선택 알고리즘보다는 난이도가 있는 중급 정렬 알고리즘이다. 이 파트는 코드를 살펴보고 작동 방식을 이해하며 알고리즘을 설명할 수 있도록 다루고 있지,첫 번째 시도부터 다시 작성할 수 있는 능력을 기르는 목적이 아니다!코드의 각 행이 수행하는 작업을 설명할 수 있는 능력을 기르는 데에 집중하도록 하자. Merge Sort합병과 정렬이라는 두 가지 조합으로 이루어짐0개 요소, 1개 요소로만 이루어진 배열은 이미 정렬 되어있는 배열이란 사실을 활용함분할 정복: 배열을 더 작은 배열로 쪼갬 How does it work? Merging Arrays PseudocodeCreate an empty array, take a look at the ..

• format_list_bulleted Study Notes/알고리즘
• · 2025. 10. 28.
• textsms

[React] useReducer와 ReactContext 개념 잡기

요새 매번 컴퓨터로 필기하며 공부를 했었는데요...저는 아무래도 아날로그가 잘 맞는 것 같습니다.노트에 직접 한자한자 적으면서 할때 가장 이해가 잘 되고, 집중도 잘 되는 거 같아요. 그래서 이번엔 한입리액트 몇 안남은 강의를 들으며 노트 필기로 내용정리를 했습니다.코딩이란게 종이에 적으면서 공부하기엔 너무 어려운 부분이라(컴퓨터 언어잖아요...) 굉장히 지저분한 필기가 되었지만 ㅋㅋㅋ어쨌든 저만 알아볼 수 있으면 되니까요^__^... 이미 이전에 useReducer와 Context를 각각 두번씩 블로그에 타자 치며 열심히 정리도 하고 강의도 들었었는데...와오늘 직접 종이에 적으면서 하니 이제야 구조가 제대로 이해가 되었고, GPT없이도 직접 코드를 칠 수 있겠더라고요 ㅋㅋㅋ;; 다소 비효율적이지만 다..

• format_list_bulleted Study Notes/React
• · 2025. 10. 15.
• textsms

[Framer Motion] Framer Motion을 정복해보자😵‍💫-1(4)

📌실습파일 전체 다운: https://github.com/yeom-kenco/framer-motion-study-kit.git 저는 framer motion으로 스크롤애니메이션 구현할때마다,특정 임계값에 스크롤이 걸치면 무한으로 애니메이션이 트리거되는 현상이 일어나더라고요... 저번 잡생각 프로젝트때도 이것때문에 진짜 고생고생해서 현상이 거의 안보이게 완화시키는 것 까지는 성공했지만,100%해결하지는 못했었습니다. 다른분들은 어떻게 이 점을 해결하셨는지 궁금하네요! 저는 이번 학습에서 들어올 때 기준과, 나갈 때 기준을 다르게 두는 완충(버퍼) 작용을 해주는 훅을 사용해서 해결했습니다!!바로 비교될 수 있도록 3-1, 3-2로 기존 코드와 함께 영상으로 글 마지막에 정리해두었습니다~!! Week 1 ..

• format_list_bulleted Study Notes/Framer Motion
• · 2025. 10. 15.
• textsms

[Framer Motion] Framer Motion을 정복해보자😵‍💫-1(3)

📌실습파일 전체 다운: https://github.com/yeom-kenco/framer-motion-study-kit.git Week 1 — Step 3 (Variants / Stagger / AnimatePresence)개념 핵심Variants(상태에 이름 붙이기): 숫자/스타일을 직접 쓰는 대신 hidden / show / exit 같은 의미 있는 상태 이름으로 정의해서 가독성/재사용성/오케스트레이션을 높인다.Stagger(간격 재생): 부모 variants.show.transition에 staggerChildren, delayChildren을 넣으면 부모가 자식들의 시작 타이밍을 지휘한다.AnimatePresence + exit(퇴장): 조건부 렌더에서 사라질 때 바로 unmount하지 않고 e..

• format_list_bulleted Study Notes/Framer Motion
• · 2025. 10. 15.
• textsms

[Framer Motion] Framer Motion을 정복해보자😵‍💫-1(2)

📌실습파일 전체 다운: https://github.com/yeom-kenco/framer-motion-study-kit.git📌PreviewwhileHover={{ y: -6, scale: 1.02, boxShadow: "0 18px 40px rgba(0,0,0,0.18)", }}whileTap={{ scale: 0.98, y: -2 }}transition={{ type: "spring", stiffness: 320, damping: 26 }}→ 이런 간단한 프로퍼티만으로 호버시 떠오르는 효과, 눌리는 효과를 구현할 수 있다는게 정말 편리합니다! Week 1 — Step 2: 인터랙션 (whileHover / whileTap)목표: “사용자 입력에 반응하는” 마이크로 인터랙션을 정확히 쓰는 법. 개..

• format_list_bulleted Study Notes/Framer Motion
• · 2025. 9. 19.
• textsms

[Framer Motion] Framer Motion을 정복해보자😵‍💫-1(1)

실습 예제를 따라하면서 직접 값을 하나하나 변경해봤더니, 벌써 이해가 쏙쏙 되는 기분입니당다들 따라서 같이 공부해봐요..ㅎㅂㅎ! 📌실습파일 전체 다운: https://github.com/yeom-kenco/framer-motion-study-kit.git Week 1 — Step 1: motion 기본기 (initial / animate / transition)1) 개념 딱 3개만motion.*: 어떤 태그든 motion.div, motion.button처럼 감싸면 “움직일 수 있는 컴포넌트”가 됨.initial / animate: 시작 상태 → 도착 상태를 선언. style이 아니라 애니메이션 상태를 적는다고 생각하기.transition: “어떤 느낌”으로 이동할지.type: "spring": 탄성(..

• format_list_bulleted Study Notes/Framer Motion
• · 2025. 9. 19.
• textsms