기록하는 개발자 기록하는 개발자

Arrow Function 설명 ES6부터 도입된 새로운 함수 표현식. 자신만의 this를 가지지 않는 대신 Arrow Function 내부에서 this를 사용하면 상위 스코프의 this를 참조한다. 자신만의 this를 가지지 않아 생성자 함수로 사용할 수 없다. 단일 표현식에서 값을 반환하는 경우 중괄호를 생략 할 수 있는데 이 경우, 자동으로 해당 표현식의 값을 반환한다. == 연산자와 === 연산자의 차이 == 연산자는 값만을 비교하며 비교 시 자동 형 변환을 수행한다. 비교하는 두 값이 서로 다른 데이터 타입을 가지고 있다면 자동으로 형 변환을 하여 같은 타입으로 만든 후 비교하게 된다. === 연산자는 값과 데이터 타입까지 비교한다. 자동 형 변환이 일어나지 않기 때문에 비교하는 값이 서로 다른..

시간 복잡도, 공간 복잡도에 대한 설명 시간 복잡도 특정 알고리즘이 어떤 문제를 해결하는데 걸리는 시간을 의미 결과가 같아도 코드 작성 방법에 따라 걸리는 시간이 달라지고, 이 시간이 적게 걸리는 것이 좋은 코드이다. 공간 복잡도 작성한 코드가 얼마나 많은 메모리를 차지하는지 분석하는 방법 시간복잡도와 공간복잡도는 반비례적인 경향이 있다. 최근 컴퓨터 성능의 발달로 메모리 공간이 넘쳐나 공간 복잡도 보다는 시간 복잡도를 더 중요시 한다. 스택, 큐에 대한 설명 스택 차곡차곡 쌓아올린 형태의 자료구조 같은 구조의 자료를 정해진 방향으로만 쌓을 수 있다. top으로 정한 곳에서만 접근이 가능 나중에 들어온것이 맨 먼저 나가게 되는 후입선출 구조(LIFO, Last In First Out) 웹브라우저 뒤로가기..

https://www.youtube.com/watch?v=pjakE0D4CeI&list=PLVsNizTWUw7FfOQedudGOz1N3bjt6iM0D&index=13 리액트쿼리가 점점 익숙해져간다. 쭉쭉 진도를 나가다가 발생한 이슈로 오늘 배운 것이다. 리액트의 생명주기. 항상 이것때문에 문제인데 계속 같은문제로 에러를 접해도 뭔가 애매~하다. 오늘은 구매자,판매자가 거래취소를 누르면 각각 cancel data가 true가 되고, 두 cancel data가 다 true가 되면 구매한 금액만큼을 구매자에게 더해주는 환불로직을 만들었다. 근데 취소버튼 onClick에 두 cancel버튼을 각각 누르면 true로 변하는 것 까진 짰는데, 구매자에게 돈이 돌아가지 않는 이슈가 발생했다. 왜그런건가 콘솔을 요리조..

오늘 배운 것 비동기 함수는 가면 언제올지 모른다....... 나는 오늘 글쓰기 페이지에서 글 등록을 하면 데이터가 저장된 후 navigate를 통해 상세페이지로 넘어가는 로직을 짰다. const { mutate, isError, isLoading } = useMutation((newPost: postType) => axios.post('http://localhost:4000/posts', newPost) ); const [post, setPost] = useState({ id: uuidv4(), title: '', nickName, sellerUid, content: '', price: '', imgURL: [], category: '', like: [], views: 0, }); const onSub..

에러 // Detail.tsx const { data } = useQuery(['posts'], async () => { const response = await axios.get(''); return response.data; }); 내가 쓴 글의 Data를 받아오기 위해, useQuery를 이용해 데이터를 불러왔다. 그러나 브라우저에서는 이러한 오류를 뱉었다. 해결을 위해 시도한 일 첫번째, 공식문서 읽어보기 https://tanstack.com/query/v4/docs/react/guides/query-keys 쿼리 키란? 쿼리 캐싱을 관리할 수 있는 key 라고 한다. 여러가지 설명이 나와있지만 이해하지 못했다…. 두번째, 블로그 읽어보기 https://tech.kakao.com/2022/06/1..

최종 프로젝트 시작 드디어 최종 프로젝트가 시작됐다. 팀이 꾸려지고 스파르타 측의 지원으로 디자이너님을 한분 모시게 되었다. 디자이너님을 모시고 프로젝트 주제를 정하는 회의를 진행하게 됐는데 다양한 아이디어들을 내주셨고, 기술적으로 다양한 부분들을 접할 수 있을 것 같아 디자이너님이 내신 의견에 따르도록 했다. 사용자 측면에서 좋은 ui,ux를 만들 수 있도록 zep에 접속해있는 내내 회의를 진행했는데 정말..입에 단내가 날때까지 회의를 한 것 같다. 우리가 피그마로 대충 와이어프레임을 네모네모박스들로 너더기처럼 짜면, 디자이너님이 환골탈태 시켜주신다. 역시... 의견충돌 아무래도 최종 프로젝트이기도 하니 의견충돌이 많이 일어난다. 더 잘하고싶은 마음이 커서 더 그런 것 같다. 코드 컨벤션, 커밋 컨벤션..

오늘은 추천기능을 만들었다 'ㅅ'ㅎㅎ 글 1개에 1사람당 추천을 1번씩만 할 수 있도록 해야했기에 일단 로직을 어떻게 짤지 고민해봤는데, 다른 팀원분에게 힌트를 얻었다. 데이터에 uid를 넣으라는 것, 아..? 그럼 이렇게 해보자. 1. 글에 추천을 누르면 아이콘이 검정색하얀색 토글되게 하기 2. 아이콘이 검정색이 되면 uid를 데이터에 추가하고 3. 흰색이 되면 uid를 데이터에서 삭제되게 하기 간단한 로직이다. 옛날 같았으면 로직도 생각 못하고 멍때리기만 했을텐데.. 많이 발전했다 ㅎㅎㅎ 그리고 코드를 짰다. 1. 글에 추천을 누르면 아이콘이 검정색하얀색 토글되게 하기. 이건 먼저 눌렀을 때 uid가 데이터 안에 있는지 확인하고, 그걸 true,false로 나타내어 아이콘 토글을 하려고 변수를 만들어..

그동안 코로나로 TIL,WIL을 작성하지 못했다. 어제까지 격리로 아무데도 못가고 집에서 골골 앓았는데 프로젝트는 팀끼리 하는거라.. 피해 끼칠까봐 어떻게든 마무리하려고 했다. 그래서 오늘 update는 거의 완성했는데 한가지 문제만 해결하면 된다. 글 수정하기를 누르고 수정완료버튼을 누르지 않고 Navigator를 이용해 뒤로가기를 진행하게되면, isEdit이 그대로 true 상태로 남아있다. 이렇게 되면 해당 글을 클릭해 상세페이지로 진입하게 됐을 때, 글을 볼 수 있는게 아니라 수정할 수 있는 화면이 보인다는게 문제이다. 알아 본 결과, Navigator가 항상 이전 페이지를 기억하고있지는 않는다고 하는데, 그럼 어떻게 해결을 했느냐. 1. Detail 페이지에서 Navigator의 setOptio..

https://my-engineering-blog.tistory.com/77 React Native로 영화소개 서비스 만들기-1. UI 만들기(1) 저번엔 TodoList를 만들었는데, 이번에는 이 후 강의에서 배운 여러 라이브러리,API들을 통해서 영화들을 소개하는 서비스를 만들어보려고 한다. 오늘 강의는 여러 라이브러리를 사용해서 UI 만드 my-engineering-blog.tistory.com 오늘은 심화강의를 1일차 완강하고, 두번째 정독하면서 정리를 하고있다. UI 만드는것은, 재미있다.. 재미있는데..... 이건 조금 어렵다. 설치해야 할 라이브러리들도 많고, 라이브러리마다 사용법도 익혀야 하기 때문에 정리하면서 학습이 필수일 것 같다. 그래서 오늘 원래 두번째 완독하고 TIL 쓰는게 목표였..

새해의 첫 수업을 마쳤다. 한살 더먹다니.. 슬픔... 오늘은 저번주에 듣다 말았던 React Native로 TodoList 만들기를 마저 진행하고, asyncStorage 연결, 그다음 asyncStorage 코드 지우고 firebase 연결 및 세팅까지 진행했다. https://my-engineering-blog.tistory.com/71 React Native로 TodoList 만들기 React Native로 TodoList 만들기 뼈대+CSS(styled component 사용) - styled component는 install 설치해줘야 한다. https://emotion.sh/docs/@emotion/native 참고 yarn add @emotion/react @emotion/native np..