분류 전체보기

[TIL] 서로 맞춰가는 건 어려운 거야

📝알고리즘 문제 풀이 programmers / level2 / 3xn타일링 GitHub - synuns/algorithm-study: 코딩 테스트 문제 풀이 및 알고리즘 공부 저장소입니다. 코딩 테스트 문제 풀이 및 알고리즘 공부 저장소입니다. Contribute to synuns/algorithm-study development by creating an account on GitHub. github.com 진짜 진짜 어려웠던 문제. 점화식을 이끌어내는 것도 상당히 어려웠는데, 수학적인 지식으로 점화식을 간결하게 만들어서 답을 출력했는데 이상하게 답안 실패가 나서 한참동안 헤맸다. 답이 전부 틀렸던 이유는 값이 너무 커져서 오버플로우가 발생한 상태에서 계산한 값이 음수가 만들어지는 경우가 있어서 모듈러..

[React] Lifecycle과 메소드 그리고 Hook

React Life-cycle 출처 : https://projects.wojtekmaj.pl/react-lifecycle-methods-diagram/ (각각의 메소드 버튼들이 리액트 공식문서로 연결되니 사이트에 들어가서 확인해봅시다.) 🕵️‍♂️클래스 컴포넌트 Mount 1. constructor() 컴포넌트가 마운트되기 전에 호출됩니다 초기 state 값을 세팅하기 위해 호출합니다. constructor(props) { super(props); // 여기서 this.setState()를 호출하면 안 됩니다! this.state = { counter: 0 }; this.handleClick = this.handleClick.bind(this); } 2. static getDerivedStateFromP..

[항해99] 4주차 React 숙련 회고

🎓이번 주차 목표 리덕스를 사용하여 전역상태 관리를 할 수 있다. [세부 목표] 1. redux로 상태 관리하기 2. styled-components로 css-in-js 적용하기 3. react-router-dom으로 router 구현 새롭게 적용하는 라이브러리 : styled-components, redux, react-router-dom [과제] 리덕스로 전역 상태 관리하여 투두리스트 만들기 📝숙련 주차 시험 망가진 코드 해결하기 redux로 전역상태관리하고 있는 투두리스트 리액트 앱을 잘 작동하도록 고쳐보자 ▶시험 해설 글 보러가기 [TIL] 하루가 너무 짧다구요 🥽리액트 입문 주차 시험 🔍시험 문제 살펴보기 1. 레이아웃과 기능은 화면에 보이는대로 2. App.jsx와 App.css 파일만 이용하..

[React] Redux-toolkit 입문하기

redux로 구성되어 있던 카운터 프로젝트를 redux-toolkit으로 바꿔보면서 무엇이 다른지 알아보겠습니다. 🔍카운터 코드로 비교하기 // Action Value const ADD_NUMBER = "ADD_NUMBER"; const MINUS_NUMBER = "MINUS_NUMBER"; // Action Creator export const addNumber = (payload) => { return { type: ADD_NUMBER, payload, }; }; export const minusNumber = (payload) => { return { type: MINUS_NUMBER, payload, }; }; // Initial State const initialState = { number: ..

[TIL] 시차 적응 중입니다

알고리즘 문제풀이 programmers / level2 / 올바른괄호 GitHub - synuns/algorithm-study: 코딩 테스트 문제 풀이 및 알고리즘 공부 저장소입니다. 코딩 테스트 문제 풀이 및 알고리즘 공부 저장소입니다. Contribute to synuns/algorithm-study development by creating an account on GitHub. github.com 효율성 체크에서 생각할 거리가 있었던 문제. 불필요한 반복과 연산되는 부분이 어디인지 어느 조건인지 생각해볼 수 있었다. Redux-toolkit 시작하기 [React] Redux-toolkit 입문하기 redux로 구성되어 있던 카운터 프로젝트를 redux-toolkit으로 바꿔보면서 무엇이 다른지 알..

[ESLint / Prettier] 레퍼런스 모아보기

🔮ESLint + Prettier시작하기 // npm환경이 존재하는 cra같은 경우에는 사용할 필요 없음 $ npm init -y // eslint 설치 $ npm install eslint prettier --save-dev // or $ yarn add -D eslint prettier // eslint 시작 설정 $ npx eslint --init //or $ yarn eslint --init eslint --init을 해주면 질문이 여러가지가 나오는데 세팅하려는 환경에 맞춰서 답변하면 그에 맞게 세팅하게 된다. $ yarn eslint --init yarn run v1.22.10 $ /home/identity/hanghae99/redux-toolkit-tutorial/node_modules/.bi..

[Git] fatal: Need to specify how to reconcile divergent branches.

git pull origin main From https://github.com/synuns/TMIL * branch main -> FETCH_HEAD hint: You have divergent branches and need to specify how to reconcile them. hint: You can do so by running one of the following commands sometime before hint: your next pull: hint: hint: git config pull.rebase false # merge hint: git config pull.rebase true # rebase hint: git config pull.ff only # fast-forward ..

[TIL] 저도 대충하고 싶은 날이 있다구요

리액트 심화 주차 시작 학습 목표 능력 리덕스 미들웨어를 활용할 수 있다. 미들웨어를 활용해 비동기 처리를 할 수 있다. 프론트엔드 성능 최적화에 활용할 수 있는 React hook을 숙지하고 있다. 최적화 hook을 활용한 경험이 있으며 장단점을 설명할 수 있다. 팀 프로젝트 : 본문과 댓글을 가진 구조의 리액트 앱 만들기 기획하기 와이어프레임 👻코멘트 오랜만에 다시 기획하니까 재밌기도 했고 팀프로젝트를 하게되니까 좋았다. 음... 할게 너무 많다. 오늘은 이 정도로 타협