저 많은 사람 중에 '나'

    [백준/JS] 2661 좋은 수열

    문제 링크: https://www.acmicpc.net/problem/2661 2661번: 좋은수열 첫 번째 줄에 1, 2, 3으로만 이루어져 있는 길이가 N인 좋은 수열들 중에서 가장 작은 수를 나타내는 수열만 출력한다. 수열을 이루는 1, 2, 3들 사이에는 빈칸을 두지 않는다. www.acmicpc.net 백트레킹 문제였다. 1. dfs 를 사용하여 '1', '2', '3' 문자를 추가한다. 2. 좋은 수열인지 아닌지 판별한다. (checkDuplicate) 2-1. 예를 들어 123123 이라는 값이 들어왔다고 가정을 해보자. 2 3 31 23 123 123 맨뒤 인덱스-1 부터 에서 수열의 길이 / 2 까지 구간을 나누어 확인을 한다. 2-2. 위 방법을 사용할때 좋은 수열이 아닌 값들은 pru..

    Glitch 에 json-server 배포한 과정

    Glitch 에 json-server 배포한 과정

    배경 이전에 작업해두었던 프로젝트를 시연하기위해서 서버가 필요했습니다. 같이 협업한 백엔드분들에게 서버를 켜달라고 부탁드리는 것은 다들 바쁘시기도 하고 분명히 에러가 날것이기때문에 귀한 시간을 잡아먹을 것이 뻔했습니다. 따라서 혼자서 해결할 수 있는 방법을 찾아보았습니다. 개발환경에서는 msw 나 json-server, promise 와 setTimeout 을 사용해 fakeAPI 를 구현하는 방법이 있지만, 현재 저는 github page 를 사용하여 웹을 배포할 생각이기 때문에 개발환경에서 api 요청을 하는 방식으로는 문제를 해결할 수 없었습니다. 해결할 수 있는 방법은 다음과 같았습니다. (더 많을 것으로 판단됩니다.) json-server 를 heroku에 배포하기 json-server 를 gl..

    setState에 대해 고민했던 하루

    setState에 대해 고민했던 하루

    사건의 발단 채팅방의 한분께서 위와 같은 질문을 해주셨다. 여러가지 답변이 오갔고 내가 똥답변을 해버렸다. 이때 까지만해도 setState 안의 함수를 넣는 형태인 함수형 업데이트를 사용하면 batching 이 발생하지 않고 setState 마다 리렌더가 발생할 것이라고 생각했었다. 하지만 아래의 코드를 돌려본 결과. 내 생각이 잘못되었다는 것을 알게되었다. import { useState } from "react"; import "./styles.css"; export default function App() { const [count, setCount] = useState(0); console.log("render"); return ( { setCount((c) => c + 1); setCount((..

    [React Query] staleTime vs cacheTime

    [React Query] staleTime vs cacheTime

    React Query 의 staleTime 과 cacheTime 에 대한 차이를 알려주는 좋은 글을 봤다. 하지만 글로만 읽으니 제대로 이해한 것이 맞는지 의심이 들어 직접 라이브러리를 만져가면서 익혀보기로 했다. 우선 참고자료에서 알려주신 내용은 다음과 같다. React Query의 라이프 사이클 A 쿼리 인스턴스가 mount 됨 네트워크에서 데이터를 fetch 하고 A라는 query key로 캐싱함. 이 데이터는 fresh 상태에서 staleTime(기본값 0) 이후 stale 상태로 변경됨 A 쿼리 인스턴스가 unmount 됨 캐쉬는 cacheTime (기본값 5min) 만큼 유지되다가 GC에 의해 삭제됨 만일 cacheTime 이 지나기 전에 A 쿼리 인스턴스가 새롭게 mount 되면, fetch..

    진행중인 프로젝트에 스토리북 도입하기.

    진행중인 프로젝트에 스토리북 도입하기.

    왜 스토리북을 도입하려고 하였나요? 내가 구현해야하는 UI이다. 그리고 아래 UI는 이미 구현해둔 UI 이다. 비슷하지만 조금다른 이 컴포넌트를 재활용하려고 했다. 하지만 HTML로 일일히 만들어둔 컴포넌트가 내가 원하는 형태인지 확인하는 과정이 귀찮았다. 이를 storybook을 사용했을 때 더 빠르게 확인이 가능하고 나는 확인된 컴포넌트로 UI를 완성만 하면 된다. 이러한 장점으로 인해 storybook을 도입하자 라고 판단하였다. Storybook 설치 프로젝트에 루트에서 다음 명령어를 실행시킨다. npx storybook init 그러면 루트에 .storybook 폴더와 src/stories 폴더가 생성된다. 나는 src/stories 폴더는 삭제했다. 그 이유는 각 컴포넌트 폴더안에 해당 컴포넌..

    [우아한 테크코스 프리코스] 1차 탈락

    [우아한 테크코스 프리코스] 1차 탈락

    탈락했다. 올해 나름 열심히 했다고 생각했는데, 아직까지는 누적된 공부량이 부족한가보다. 어디서 판별이 되었을까? 생각해보았을때 아마 자소서 부분에서 갈리지 않았나 싶다. 냉정하게 내 자소서를 다시보았을때 1년간 몰입했던 경험이 내가 생각하기에도 그리 매력적이지 않았던 것 같다. 마침 같이 공부하시는분들과 함께 결과를 확인하였고 내가 떨어져버려서 그분들께 축하한다고 제대로 말씀을 못드린 것 같아 아쉽다. 공부하면서 아직 노력에 대한 보상을 받아본적이 없어 최종코테만이라도 꼭 가고 싶었는데 그것도 허락이 되지않아 많이 속상했다. 할 수 없다! 더 열심히 하는 수 밖에, 나보다 잘하는 사람이 이렇게 많다는 것을 다시한번 느끼게 된다. 앞으로 탈락할 일이 얼마나 많은데 여기서 징징대고 있을 시간이 없다. 그러..

    [우아한 테크코스 프리코스] 4주차

    [우아한 테크코스 프리코스] 4주차

    4주차를 시작하기 전에 3주차 공통 피드백을 공부하고 넘어가려고 한다. 피드백에 어떤 의도가 숨어있을지 나름대로 생각해보자. 함수(메서드) 라인에 대한 기준 3주차 과제에는 라인제한이 15줄이였는데 이번 4주차 과제는 라인제한이 10줄이었다. 함수 또는 메소드로 쪼개는 것을 더 엄격하게 보려는 것으로 파악된다. 아래 코드는 프리코스를 진행하시는 분의 코드를 발췌한 것이다. 나는 이 코드가 좋다고 생각했다. 위에서 아래로 코드를 막히는 부분없이 읽을 수 있었고, 관련 메소드 끼리 붙어있어 코드를 파악하기 편했다. 컨트롤러 부분은 이렇게 흐름을 쉽게 파악 할 수 있게 작성할 생각이다. 비즈니스 로직과 UI 로직을 분리한다. 비즈니스 로직과 UI 로직을 분리하게되면 관심사가 분리되어 유지보수에 용이하다. 예를..

    책 잘 읽는 방법

    책 잘 읽는 방법

    이글은 딱딱체로 되어있습니다. 당신.. 원래 책 안 읽는 사람 아닌가요? 맞다. 책 안 읽는 사람이다. 책은 지루하고 잠 올때 배개 정도로 쓴다. 하지만 이런 생각이 바뀌게 된 계기가 있다. 코로나가 안정화가 되면서 자연스레 집에서 사회로 방생되었다. 또한 취업 걱정이 커지면서 가입한 동아리를 기점으로 여러사람을 만날 수 있게 되었다. 정말 행운이게도 배울 점이 많은 분들을 많이 만날 수 있었던 것 같다. 그 중에서는 롤모델로 삼고 싶은 정현님이 있었다. 정현님의 꾸준함과 자신감을 보면서 부러웠다. 나도 저렇게 되어야겠다고 생각했다. 정현님과 같이 공부를 할 수 있게 되어 학업적으로나 나의 가치관에 영향을 줄 만큼의 조언과 피드백들을 들으면서 나를 발전시켜나가야겠다고 생각했다. 자기계발에 대한 관심도가 ..

    [우아한 테크코스 프리코스] 3주차

    [우아한 테크코스 프리코스] 3주차

    3주차에 들어가기에 앞서서 이번주는 어떤 목표를 가지고 풀어나가야할지 고민하는 시간을 가졌다. 클래스(객체)를 분리하는 연습 숫자야구 과제를 구현할때에는 모듈화를 하였지만 객체 분리를 하지는 않았었다. 이번 기회를 통해 객체지향 프로그래밍을 조금이나마 다뤄볼 수 있을 것 같다. 그리고 MVC 패턴을 적용해 볼 생각이다. 이전에 MVC 패턴에 대해 궁금해서 검색했던 기억이 나는데 그 당시에 잘 이해가 가지않아서 다음으로 미뤘었다. 이번에는 적용해보면서 한번 더 공부를 해봐야겠다. 도메인 로직에 대한 단위 테스트를 작성하는 연습 Jest 라는 테스팅 프레임워크를 배웠고, 바로 적용을 할 수 있었다. 저번주의 테스트는 단위 테스트 보다는 통합 테스트에 가깝게 구현을 했었다. 이번에는 요구사항대로 클래스로 나누..

    [우아한 테크코스 프리코스] 2주차

    [우아한 테크코스 프리코스] 2주차

    이글은 딱딱체로 쓰여져있습니다. 참고해주시면 감사하겠습니다! 2주차에 들어가기 앞서서 먼저 새로운 과제를 진행하기전에 어떤점을 보완을 해야할까 생각을 해봤다. 왜 이러한 과제를 냈는지 파악해보자. 지난 1주차 과제에서는 소감문을 작성할때에 왜 코치분들이 이 과제를 내셨을까라는 생각을 했었다. 문제를 풀기전에 이런 고민을 해봤어야했는데 순서가 바뀐 공부를 했던 것 같다. 또한 질문에 대한 의미를 제대로 파악하지 못하고 과제에 임하는 것은 학습효과가 떨어져 나에게 손해가 될 것이기 때문에 이번 2주차에는 이런 과제를 왜 냈는지에 생각을 해보고 들어가려고 한다. 가독성에 너무 집중했다. 변수명, 함수명 그리고 읽기 편한 코드를 만들겠다는 생각에 빠져버려 정작 중요한 기능확인을 제대로 하지 못한 것 같다. 슬랙..