본문 바로가기

개발93

👋국비 후기 모음👋 (이력도 확인 가능!)
테오의 스프린트 12기 후기 ** 후기, 회고, 프로젝트 순으로 작성했습니다. 후기 생략하실 분들은 아래로 쭈욱 내려주세요! 짧다면 짧고 길다면 길었던 10/12 ~ 10/17의 기록. 6일간의 테오의 스프린트 12기 후기를 작성해본다. 프론트엔드 개발자로 전향하기 위해 우연히 알게된 테오의 오픈채팅방에 들어갔다. 그렇게 채팅방 염탐을 하던 중 테오의 스프린트 9기의 결과물들이 올라왔고 나도 신청을 해봐야겠다고 다짐했다. 10기 신청은 아직 실력이 부족하다는 판단을 했었고 11기 신청을 하려했지만.. 너무 바쁜 나머지 신청을 못해서 이번엔 꼭 하리라 다짐하고 12기는 언제쯤 하냐고 테오한테 물어본 뒤 그 시기쯤에는 카톡을 매일 확인했던 것 같다. 그렇게 기다리다가 올라오자마자 처음 타자로 신청 Get!! My nickname is .. 2022. 10. 19.
Memoization (React.memo, useCallback, useMemo) 메모이제이션(memoization)은 컴퓨터 프로그램이 동일한 계산을 반복해야 할 때, 이전에 계산한 값을 메모리에 저장함으로써 동일한 계산의 반복 수행을 제거하여 프로그램 실행 속도를 빠르게 하는 기술이다. - 출처 위키피디아 React에서는 메모이제이션을 세 가지 방식으로 할 수 있다. React.memo() - HOC useCallback() - Hook useMemo() - Hook React.memo React.memo는 HOC다. 동일한 props로 동일한 렌더링을 한다면, React.memo를 사용하여 성능 향상을 누릴 수 있다. memo를 사용하면 React는 컴포넌트를 렌더링하지 않고 마지막으로 렌더링된 결과를 재사용한다. App.js import Memo from './component.. 2022. 9. 28.
고차 컴포넌트 (HOC)란? Hook 예제 HOC를 공부하려다 보니 옛날 예제(클래스형 컴포넌트)들로 나와있다. 요즘엔 거의 다 Hook(함수형 컴포넌트)으로 코딩을 하기에 예제 이해하는데에 약간의 어려움이 있었다. 그래서 Hook으로 정리해보려고 한다. HOC란? 공식문서 - HOC(Higher-Order Components) 한 줄로 표현하자면 이렇다. 고차 컴포넌트는 컴포넌트를 가져와 새 컴포넌트를 반환하는 함수.(재사용성) 공식문서를 완벽히 이해하면 좋겠지만 클래스형 컴포넌트로 짜여 있어 한번에 와닿기가 힘들었다. 한 번 이해하고 나면 아주 쉬운 개념이라고 할 수 있다. 공식 문서의 예제와는 조금 다르게 더 쉬운 예제로 설명하고자 한다. 주의! 아래의 설명들은 무지막지하게 초간단 설명이므로 자세한 건 공식문서를 참고 App.js impor.. 2022. 9. 19.
Recoil 직접 구현하기 (동작원리 이해) Recoil을 쓰다보니 직접 구현해보면 더 잘 이해할 수 있을거 같아서 자료를 찾아보았다. Atoms 먼저 Atom class를 선언해보자 class Atom { constructor(private value: T) {} // setter update(value: T) { this.value = value; } // getter snapshot(): T { return this.value; } } Recoil은 “atoms”이란 개념을 채택한다. Atoms는 상태의 단위이며, 업데이트와 구독이 가능하다. atom이 업데이트 되면 각각의 구독된 컴포넌트들은 새로운 값을 반영하여 다시 렌더링된다. 수정된 Atom class type Disconnecter = { disconnect: () => void };.. 2022. 9. 14.
개발자 1년차 끝. 음... 너무 오랜만에 쓰니까 뭘 써야할지 모르겠다. ㅎㅎ.. 이 글을 쓰는 오늘은 22년 7월 18일. 21년 7월 19일 개발자로 첫 걸음을 한 날로부터 정확히 365일째 되는 날이다. 내일부터는 1년차 개발자가 아닌 2년차 개발자로 시작을 하게 된다. 날짜에 큰 의미를 둬봤자 뭐하겠냐만은.. 내 진로가 정해진 시점부터는 하나하나가 나에겐 크게 와닿는다. 20년 4월 웹퍼블리셔 국비를 시작으로 21년 1월 웹개발 국비, 21년 7월 취뽀 그리고 오늘까지 나름 열심히 달려온 것 같다. 1년동안 뭐했는지 적기에는 이미 [2021년 회고]에 자세히 적어놨다. 그로부터 오늘까지 추가로 뭘 했는지 정리하면 좋을거 같아 블로그를 켰다. 뭐 했어? 독립 청구팀에서 개발 JS, React.js 공부 방통대 1학년 .. 2022. 7. 18.
[Git] commit이나 fetch를 해도 확인이 안될 때 // local과 remote sync가 안될 때... upstream을 확인해보자 간만에 기분 좋은 블로그를 쓰게 생겼다...!!! 문제가 된 부분과 해결방법은 아래 부분에 쓰겠습니다..!! 급하신 분은 바로 스크롤 다운 ㄱㄱ~! 우선 첫번째..! https://okky.kr/article/1168362 OKKY | git commit push관련 질문드립니다 선배님들! 1111111- 위의 폴더에서 코드 수정 후 커밋을 한 상태입니다. push 하기 전엔 저렇게 위화살표 숫자가 뜹니다. push하고 나면 저 숫자가 사라집니다. 보통은 이렇게 동작을 했습니다. 2222222- 여기 보 okky.kr 내가 질문한 글이다. 작성일 22.02.28. 이 때 해결 못 함... ㅠ 그렇게 그냥 좋은게 좋은거지.. 하는 마음으로 넘어감. 두번째. (사진 비율이 이상해서 참고사진 첨부함.) 작성일.. 2022. 5. 10.