[프로그래머스 | JavaScript] 가운데 글자 가져오기

(1) 내 코드 function solution(s) { let len = s.length / 2; return s.length % 2 === 0 ? s.split('') .splice(len - 1, 2) .join('') : s.split('').splice(len, 1).join(''); } ▶input : "abcde" / output ="c" (글자수 홀수) && input:"qwer" / output= "we" (글자수 짝수) (1) 문자열 길이의 가운데 = s.length / 2; (2) 문자열 > 배열 변환 > splice로 요소 제거 (반환값: 제거된 요소) > 다시 문자열로 변환 (3) 짝수인 경우, - 길이가 4인경우 중앙은 2 => qwer (e가 선택되서) -1로 인덱스 위치 변경..

• format_list_bulleted 코딩테스트
• · 2023. 11. 18.
• textsms

리액트 팬레터 홈페이지 만들기: 3단계. Redux 리팩토링

0. 2단계 context으로 생성한 홈페이지 리액트 팬레터 홈페이지 만들기: 2단계. contextAPI로 리팩토링 0. 1단계 props-drilling으로 생성한 홈페이지 리액트 팬레터 홈페이지 만들기: 1단계. props-drilling 만들기 완료. 1. 필수 요구 사항 styled-components 를 이용하여 스타일링 전역 스타일에 reset.css 를 적용해 zerotonine2da.tistory.com 1. [3단계] 중 [3단계] 구현 & TIL redux 브랜치 : 모두 redux 라이브러리를 이용한 코드로 리팩터링 (1) props처럼 계속 부모>자식 컴포넌트로 전달을 안 해도 되는 장점이 있음 (2) 기존에 받아온 데이터의 형식과 리덕스로 전달받은 값이 약간 달라서 헷갈리는 부분..

• format_list_bulleted TIL :: Today I Learned
• · 2023. 11. 17.
• textsms

[프로그래머스 | JavaScript] 제일 작은 수 제거하기

1. 내 코드 (제출실패) function solution(arr) { var answer = []; let sort = arr.sort((a, b) => b - a); if (sort.length === 1) { return [-1]; } for (let i = 0; i < sort.length - 1; i++) { answer.push(sort[i]); } return answer; } ▶ 이 코드는 [코드 실행] 2문제는 통과되는데 [제출후 채점하기]에서는 실패가 나는 코드 ▶ 배열로 하려고 했으나 Math.min이 더 적합해 보임. 2. 내 코드 (제출완료) function solution(arr) { if(arr.length === 1){return [-1];} let minValue = Mat..

• format_list_bulleted 코딩테스트
• · 2023. 11. 17.
• textsms

React : 리덕스 설정 및 useSeletor

0. State (1) Local State (지역상태) : 컴포넌트에서 useState를 이용해서 생성된 state (2) Global State (전역상태) : 중앙 state 관리소 (props로 전달하지 않아도 사용 가능함) 1. 리덕스란? - "중앙 state 관리소"를 접근&제어 가능한 패키지(라이브러리) => yarn | npm으로 설치해야함 - 전역상태를 관리한다 2. 리덕스 설정 (1) 터미널에서 패키지 설치 : yarn add redux & yarn add react-redux 2개 설치 => yarn add redux react-redux (2) src 폴더 아래 redux 폴더 생성 (3) redux 폴더 안에 config 폴더 / modules 폴더 생성 (redux 폴더 : 리덕..

• format_list_bulleted React
• · 2023. 11. 16.
• textsms

리액트 팬레터 홈페이지 만들기: 2단계. contextAPI로 리팩토링

0. 1단계 props-drilling으로 생성한 홈페이지 리액트 팬레터 홈페이지 만들기: 1단계. props-drilling 만들기 완료. 1. 필수 요구 사항 styled-components 를 이용하여 스타일링 전역 스타일에 reset.css 를 적용해주고 box-sizing이 border-box가 되도록 설정 styled-components에 props를 넘김으로 인한 조건부 스타일링 적용 팬레터 zerotonine2da.tistory.com 1. [3단계] 중 [2단계] 구현 & TIL context 브랜치 : props-drilling의 작업 코드로 react context API를 사용 (전역상태를 이용한 코드로 리팩터링) (1) 확실히 props로 하는 것보다 코드가 간결해졌고, 이해하기 ..

• format_list_bulleted TIL :: Today I Learned
• · 2023. 11. 16.
• textsms

리액트 최적화: React.memo | useCallback | useMemo

provider (내 코드에서는 ) 가 제공한 value값이 달라지면 useContext 사용하는 모든 컴포넌트가 리렌더링됨! => 이것의 대안 : 메모이제이션 ▼ 아래 포스팅이 context API 내용 ▼ 리액트 : Context API (전역에서 데이터 사용) * props : 부모 > 자식 > 그 자식 > 그 자식의 자식 .... * props drilling 발생 : 이 props가 어떤 컴포넌트로부터 왔는지 파악하기 어려움 + 유지보수 어려움 * useContext : 전역에서 데이터 관리 가능 (1) Context zerotonine2da.tistory.com [리-렌더링의 발생 조건] 컴포넌트에서 state 변경시 컴포넌트가 내려받은 props가 변경시 부모 컴포넌트가 리-렌더링 되면 자식..

• format_list_bulleted React
• · 2023. 11. 16.
• textsms