호팍이
[백준] 1927 최소 힙 JavaScript
백준 문제 2024. 6. 18. 15:45

1927. 최소 힙문제널리 잘 알려진 자료구조 중 최소 힙이 있다. 최소 힙을 이용하여 다음과 같은 연산을 지원하는 프로그램을 작성하시오.배열에 자연수 x를 넣는다.배열에서 가장 작은 값을 출력하고, 그 값을 배열에서 제거한다.프로그램은 처음에 비어있는 배열에서 시작하게 된다. 입력첫째 줄에 연산의 개수 N(1 ≤ N ≤ 100,000)이 주어진다. 다음 N개의 줄에는 연산에 대한 정보를 나타내는 정수 x가 주어진다. 만약 x가 자연수라면 배열에 x라는 값을 넣는(추가하는) 연산이고, x가 0이라면 배열에서 가장 작은 값을 출력하고 그 값을 배열에서 제거하는 경우이다. x는 231보다 작은 자연수 또는 0이고, 음의 정수는 입력으로 주어지지 않는다. 출력입력에서 0이 주어진 횟수만큼 답을 출력한다. 만약..

article thumbnail
[Redux] Next.js로 Redux-persist를 사용해보자

헤더의 로그인 유무를 나타내기 위해, 로그인 유저의 정보를 관리하는 전역 상태의 필요성을 느끼고 redux를 도입했었는데, 새로고침에도 해당 정보를 유지할 필요성을 느꼈다. 평소의 전역 상태는 일반 상태와 똑같이 새로고침 시에도 사라지는 특성이 있기 때문에 redux-persist를 이용하면 전역 상태를 보존할 수 있기 때문에 이를 사용하기로 했다. 하지만 끊임없는 난관에 봉착해버렸다. 처음에는 빌드에러... 빌드를 고치면 다른에러... 그 에러를 고치면 또 빌드에러... 무려 2일동안 에러의 늪에 빠져버렸다.다음부터는 이런 에러가 있지 않기를..!! 나를 계속 괴롭혔던 에러는 2가지가 있었다.1. 에러 사항redux-persist failed to create sync storage. falling b..

article thumbnail
[MapleInfo] 다크모드
토이프로젝트/MapleInfo 2024. 4. 30. 23:46

다크 / 라이트 모드예전부터 적용해보고 싶었던 모드였는데, 생각보다 적용하기 수월해서 오랜 시간이 걸리진 않았었다.Redux와 tailwind, custom Hook을 이용해 만들었다.우선 dark 모드를 사용하기 위해 tailwind.config.js에 darkMode를 추가해 주었다. tailwind간단하게 module.exports에 darkMode: "class"만 넣어주면 된다.사용법은 다크모드의 경우 'dark:'뒤에 원하는 style을 넣어주기만 하면 된다. 'dark:'가 없을 경우, light모드일 때 적용 된다. Redux리덕스의 경우에도 toolkit 덕분에 쉽게 해결할 수 있었다.가장 상위 컴포넌트인 index.tsx에 Provider로 감 싸준 뒤, store를 넣어준다.  - i..

[Js] 객체의 불변성
JavaScript 2024. 4. 30. 21:46

프로젝트를 진행하던 중에 객체의 형식을 상수로 만들어서 초기값을 모조리 0으로 두고, 이걸 state의 초기값으로 담았었다.이 변수의 값을 api 작업을 통해 바꿔주게 되었었고, 이 값을 setState를 통해 바로 state를 변경시켜주었다.그런데 여기서 예상치 못한 일이 생겼다. setState로 변경을 했는데 값이 2번 변경되어 count가 +1이 되어야 하는데 +2가 돼버린 것이다.. 이는 상수로 만든 객체를 참조하고 그대로 변형시켜 버린 탓이었다.객체 참조가 이루어지기 때문에, 설령 state의 값을 변경하더라도 원래 상수의 초기값인 0도 같이 늘어나 +1이 됐던 것이다.따라서 state의 count+1, 상수 객체의 count+1가 되어 도합 count+2가 된 것이다. 이 경험으로 인해서 객..

article thumbnail
[MapleInfo] 디렉토리, 컴포넌트 구조
토이프로젝트/MapleInfo 2024. 4. 23. 17:19

개인 사정으로 인해 1년이라는 시간이 훌쩍 지나가 버렸다.다시 개발자의 길을 걷기로 다짐하고 나서 바로 프로젝트를 만들기로 다짐했었는데 막상 다시 돌아오고 나니 뭔가 붕뜬 느낌이었다.앞길이 막막한 느낌? 어떻게 코드를 짰더라.. npm으로 어떻게 켰더라.. 이 생각에 2일간 절망에 빠졌었는데 다행히도 차근차근 하다보니금방 기억이 나고 몸이 기억해서 3일째부터는 조금씩 나아지기 시작했고, 일주일이 지났을 때부터는 예전처럼 코드를 짤 수 있게 되었다.그동안 정말 만들고 싶었던게 있었는데 바로 메이플 관련 사이트였다.메이플은 한동안 푹 빠져서 했을 정도로 애정이 많은 게임이었기도 하고, OPEN API가 공유 되면서 유저들의 정보와 스킬, 스탯 뿐만이 아니라 큐브와 스타포스 히스토리등 이용할 수 있는게 굉장히..

article thumbnail
CRA + TypeScript 절대경로 설정하기
Devlog 2023. 3. 9. 21:57

CRA 환경이 아닌 그냥 TypeScript 환경에서는 절대경로를 tsconfig에서 설정해주면 됐는데, CRA 환경에서는 적용이 되지 않는다. 따라서 craco를 이용하여 사용하도록 하자. craco-alias 라이브러리는 사용만료가 되었다고 한다. react-app-alias를 사용하는 방법도 있는데 널리 쓰이지 않는 것 같아서 사용하지 않았다. npm i -D @craco/craco yarn add -D @craco/craco TypeScript를 사용할 때에는 craco/types를 설치해야한다! npm i @craco/types craco를 설치해준 뒤, 최상단에 craco.config.js와 tsconfig.paths.json을 만들어 준다. craco.config.js const path =..

article thumbnail
[수풀] 프로젝트 2번째 리팩토링(0)
토이프로젝트 2023. 2. 14. 20:08

벌써 코드스테이츠를 졸업한 지가 4개월이 지났다. 코드 스테이츠를 졸업하고 바로 원티드 프리온보딩을 거치고, 이력서를 계속 수정하면서 이력서를 제출하고, 과제 테스트를 보고, 면접을 보면서 지냈더니 4개월이라는 시간이 훌쩍 지나갔다. 4개월이라는 시간이 지나다보니 이력서에 제출한 프로젝트가 하나라는 게 공부를 열심히 하지 않은 것처럼 보일 수 있겠단 생각이 들었다. 그래서 새로운 프로젝트를 하나 만들어 보기로 했는데, 완벽하게 끝내지 못한 메인 프로젝트가 걸렸다. 따라서 메인 프로젝트를 제대로 마치고 새로운 프로젝트를 만들어 보자는 생각에 1차 리팩토링을 끝낸 코드를 다시 헤집어 봤는데... 좀 많이 건드려야 할 거 같다는 생각이 들었다. 이번에야 말로 저번에 적용하지 못한 전역 상태 관리와 react ..

article thumbnail
[프로그래머스] 햄버거 만들기 (feat. JavaScript)
프로그래머스 2023. 1. 20. 17:21

햄버거 만들기 문제 설명 햄버거 가게에서 일을 하는 상수는 햄버거를 포장하는 일을 합니다. 함께 일을 하는 다른 직원들이 햄버거에 들어갈 재료를 조리해 주면 조리된 순서대로 상수의 앞에 아래서부터 위로 쌓이게 되고, 상수는 순서에 맞게 쌓여서 완성된 햄버거를 따로 옮겨 포장을 하게 됩니다. 상수가 일하는 가게는 정해진 순서(아래서부터, 빵 – 야채 – 고기 - 빵)로 쌓인 햄버거만 포장을 합니다. 상수는 손이 굉장히 빠르기 때문에 상수가 포장하는 동안 속 재료가 추가적으로 들어오는 일은 없으며, 재료의 높이는 무시하여 재료가 높이 쌓여서 일이 힘들어지는 경우는 없습니다. 예를 들어, 상수의 앞에 쌓이는 재료의 순서가 [야채, 빵, 빵, 야채, 고기, 빵, 야채, 고기, 빵] 일 때, 상수는 여섯 번째 재..