선초코

[level 0] 배열 뒤집기 - 120821 문제 링크 성능 요약 메모리: 33.4 MB, 시간: 0.04 ms 구분 코딩테스트 연습 > 코딩테스트 입문 채점결과 정확성: 100.0 합계: 100.0 / 100.0 문제 설명 정수가 들어 있는 배열 num_list가 매개변수로 주어집니다. num_list의 원소의 순서를 거꾸로 뒤집은 배열을 return하도록 solution 함수를 완성해주세요. 제한사항 1 ≤ num_list의 길이 ≤ 1,000 0 ≤ num_list의 원소 ≤ 1,000 입출력 예 num_listresult [1, 2, 3, 4, 5] [5, 4, 3, 2, 1] [1, 1, 1, 1, 1, 2] [2, 1, 1, 1, 1, 1] [1, 0, 1, 1, 1, 3, 5] [5, 3,..

리액트에서 리렌더링 될 때 1. state 변경될 때 2. props가 변경되었을 때 3. 부모 컴포넌트가 변경되면 자식 컴포넌트도 같이 리렌더링 memoiztion 종류 3가지 1. React.memo는 컴포넌트를 캐싱(메모이제이션) 2. useCallback은 함수를 캐싱(메모이제이션) 3. useMemo는 값을 캐싱(메모이제이션) 어떤 값? 객체, 배열, 함수 (변화가 없을 시 캐시로 저장해주었다가 같이 리렌더링 되지 않고 캐시에서 가져온다.) React.memo import {memo} from "react" export deafault memo (Box1) useCallback memo 해놓은 컴포넌트가 다시 렌더링 되었다... 왜? 프롭스가 바껴서 , 근데 함수 자체는 변하지 않았는데? 왜? ..

팀원들과 아침 조회시간에 알게된 것 스타일 컴포넌트에서 글로벌 css가 그때 그때 반영이 되지 않는 문제 해결하는 법 cssf를 이용해서 감싸주면 된다. tailwind styling 코드가 한정되어있다고 생각했는데 커스텀 할 수도 있다고 한다. group과 peer이라는 개념이 이용된다. git commit 컨벤션 템플릿을 만들어서 쓸 수 있다. txt 파일로 설정해서 불러올 수 있다? 근데 앞에 넣어놓은 내용을 다 지우고 해야하나? 예시는 뭘 많이 넣어놓은 것 같던데 jest로 test role 넣어주는 코드를 구경했다. 아주 큰 프로젝트일 때 안정성을 위해 쓰면 좋을 것 같다. 매번 테스트 롤 코드 써주고 테스트 돌리고 하면 개발 시간이 엄청 많이 걸릴 듯 하다. 오늘의 목표 next.js 포트폴리..

팀원들과 아침 조회시간에 알게된 것 개발자 도구 => 도구 더보기 => css 개요 여기에 들어가면 폰트, 색상에 대한 정보들이 상세히 나와 있고, 정보를 클릭하면 어떤 요소에서 쓰이고 있는지도 보여준다. image 컴포넌트를 써줘라 (next에서 import 해온 것) 공통 레이아웃을 주었어도 getlayout 메서드?로 보여주고 싶지 않은 컴포넌트 가려줄 수가 있다. next.js에서 어떻게 하면서 로딩 없이 바로 불러올 수가 있다고? html을 다 그린 다음에 가져와서? 공부하다보면 이 내용도 나오겠지. 벌써 2월이네 ㅎㄷㄷㄷ 오늘 목표 스파르타 next.js 강의 다 듣고 정리 (다 듣긴했는데 정리는 안 함) throttling, debouncing 코드 따라치기 (코드 따라칠 시간은 없었다) 렌..

throttiling, debouncing throttiling, debouncing: 유저가 짧은 시간 안에 많은 이벤트를 발생시켰을 경우 매번 서버에 전달하면 서버에 무리가 되기때문에, 한번에 모아서 서버에 보내주는 것 throttling: 지정해준 delay 시간 안에 일어난 요청은 한번만 해주기 leading: 요청 보내고, delay trailing: delay하고 요청 leading& trailling: 요청 보내고 delay하고 또 요청 delay 시간 기준 앞뒤로 한번 씩 요청 보내준다. debouncing: 마지막 이벤트 발생 기준으로 일정시간이 지나면 요청을 보낸다. == 일정 시간이 지나지 않았는데 계속 이벤트를 발생시키면 서버에 보내지지 않는다. 리액트 lifecycle 마운트=> ..

Keep 특별한 기능이 필요하지 않는 이상 Supabase로 파이어 베이스를 대신합니다. 버그를 조기에 모두에게 공유하도록 합니다. github 프로젝트를 적극적으로 활용하는 것을 유지합니다. Review 컬럼을 추가하고 PR 올라간 상태도 확인합니다. Tailwind 사용으로 불필요한 시간을 줄입니다. 깃의 이슈, 프로젝트, 피그마, 노션, 슬랙 등의 협업에 유용한 프로그램을 사용합니다. Problem 브랜치는 항상 연결상태를 유지합니다. 중간에 다른 사람의 브랜치를 확인하는 시간도 있습니다. import 할 때 컴포넌트가 여러 줄로 작성되었습니다. 1번만 사용하는 컴포넌트가 export로 접근가능할 수 있었습니다. 서로의 코드를 충분히 숙지하지 못 했습니다. 배포 할 때 오류가 같이 올라갔습니다. 발..

랜딩 페이지 입장하기 13단계 단계 선택 skeleton ui 단계 이동 (헤더, 드롭다운, 로드맵으로, 스티키, 내림 스크롤 안보임, 올림 스크롤 보임, 스티키) 영상 링크로 실행 댓글 달기 댓글 비번 틀리면 수정 삭제 안됌 댓글 비번 맞추면 수정 삭제 가능 넘어가기 전에 검증 리스트에 체크하기 (모달, 로컬 스토리지를 이용해서 데이터 관리) 발표 시간 나중에 확인해보니까 15분 ㅎㄷㄷ 두배를 더 넘겨버림 ㅠ 담에 시간 관리 확실하게 하기 배포 전에 오류잡기 무조건 모달로 알러트창 쓰지마라 슬랙이랑 깃헙이랑 연동해서 풀리퀘스트 올라가면 슬랙으로 메세지가 날아오는 기능이 있나는데? 풀리퀘스트 리뷰를 꼼꼼하게 남기는거 해보고 싶다. 아울렛 컴포넌트는 칠드런 대신 넣는거다 최신 버전 넣어야해요

스냅샷 단축키! 윈도우 + shift + s "https://www.googleapis.com/youtube/v3/playlistItems?part=snippet&playlistId=PL1BztTYDF-QNrtkvjkT6Wjc8es7QB4Gty&maxResults=50&key=AIzaSyCHT-JZ1WdmBmyKJEecK8jpQumVDvuVtxI" supabase에서 데이터 베이스에서 새로운 테이블을 만들었다. 그런데 값이 배열인 경우에 어디에 넣어야할지 몰라서 헤메다가, ㄷㅇ 님과 ㅅㅎ님한테 물어봐서 배열값을 넣을 수 있었다. https://supabase.com/docs/guides/database/arrays https://supabase.com/docs/guides/database/arrays T..

팀원들과 공부한 내용 공유 파일명을 이름.d.ts로 하고 안에 declare로 정의해주면 import export를 해주지 않아도 바로 가져다 쓸 수 있다.! 꿀팁~~ declare interface Itodo { id: number; title: string; body: string; isDone: Boolean; } redux에서 action creator를 문자형 enum으로 만들어주고 타입으로 가져다가 쓴다. 반드시 인터페이스를 밖에다가 만들 필요없이 컴포넌트 매개변수 자리에다가 바로 써주어도 가능하다. 근데 뭔가 잘못했는데 혼자 써보니까 오류가 난다. 컴포넌트를 프롭스로 넘겨줄 수 있고 타입이 Propstype이던가? 여튼 그게 있고, 컴포넌트 안에 들어갈 타입도 안에 넣어준 것을 봤다. ㅅㅎ님..

타입스크립트로 리팩토링 타임어택 스파르타 강의를 다 들었지만 활용예시는 부족해서 유튜브와 유데미 강의를 참고해서 리팩토링을 했다. 처음부터 다시 깔아서 한게 아니라, 파일명을 바꿔주고 npm install typescript npx tsc --init (tsconfig.json 생성) 명령어를 넣어주었다. 새로 알게 된 내용 그래서 그런지 tsconfig.json에 주석이 많고 기본 설정이 이상하게 되어있는 것 처럼 보였다. 유데미 강의에서 tsconfig.json을 쓰는 법도 알려주는 것 같던데 강의를 봐야겠다. 제천 튜터님이 주석 처리 되어있던 jsx를 주석 풀고 react-jsx로 값을 넣어줘야 오류들을 막을 수 있다고 하셨다. // "jsx": "preserve" "jsx": "react-jsx"..