반응형

javascript 8

[리액트 컴포넌트 라이브러리 고도화] 전체 컴포넌트 리팩토링 대장정

처음에는 단순히 기능이 작동하는 컴포넌트들을 만드는 데 초점을 맞췄지만, 점차 접근성, 성능, 사용자 경험 측면에서 많은 개선이 필요하다는 것을 깨달았다. 이번 글에서는 우리 라이브러리의 15개 핵심 컴포넌트를 어떻게 전면 개선했는지 종합적으로 공유하려고 한다.전체 컴포넌트 개선 방향먼저 전체 컴포넌트에 공통으로 적용한 개선 원칙은 다음과 같다:접근성 강화: 모든 컴포넌트에 WAI-ARIA 표준 적용성능 최적화: React.memo, useCallback, useMemo 활용일관된 API: 컴포넌트 간 일관된 Props 구조 설계유연한 확장성: 컴포지션 패턴 적용타입 안전성: TypeScript 타입 강화이런 원칙을 바탕으로 각 컴포넌트별 리팩토링을 진행했다.인기 라이브러리와의 벤치마킹우리는 Chakra..

생각/javascript 2025.03.17

순열과 조합(코딩테스트)

순열(Permutation)과 조합(Combination)의 차이순열과 조합의 가장 큰 차이점은 순서의 고려 여부입니다:순열(nPr): 순서가 중요한 경우 사용조합(nCr): 순서가 상관없는 경우 사용시간 복잡도 이해하기For문이 중첩될 때마다 시간 복잡도가 n배씩 증가합니다. 특별한 경우로 n/2씩 감소하는 경우 시간 복잡도는 O(log N)이 됩니다.JavaScript로 구현하는 순열function permutation(arr, r, output = [], visited = new Array(arr.length).fill(false)) { if (output.length === r) { console.log(output); return; } for (l..

생각/javascript 2025.02.21

배열과 유사배열

배열(Array) 자바스크립트에서 배열이란 관련 있는 데이터를 하나의 변수에 할당해 관리하기 위해 사용하는 데이터 타입이다. 자바스크립트는 명시적 타입이 없기때문에, 하나의 배열은 여러 자료형을 가질 수 있는 특징이 있다. 배열을 사용하면 여러 데이터를 관련성 있게 관리할 수 있기 때문에 생산성 및 코드 가독성이 높아지고 이는 유지보수 비용의 감소로 이어진다. 이 외에도, 배열에서 기본으로 제공하는 함수를 사용할 수 있는 점, 데이터에 순차적으로 접근이 가능하다는 점 등을 비롯해 장점이 아주 많다. JS(JavaScript)에서 배열을 사용하는 방법은 아래와 같다. // array 배열 선언 // 자바스크립트 특성 상 배열의 명시적 타입이 없기 때문에, 여러 자료형을 포함할 수 있다. let array ..

생각/javascript 2022.09.30

혼공스 피라미드 , 윤년

// let output = ""; // for (let i = 1; i i; j--) { // output += ""; // } // for (let k = 0; k < 2 * i - 1; k++) { // output += "*"; // } // output += "\n"; // // i는 줄 생성 // // j능 공백 생성 // // k는 내용 생성 // } // console.log(output); function isLeapYear(year = new Date().getFullYear()) { // 4로 나누어 떨어지는 해는 윤년이다. 100으로 나누어 떨어지는 해는 윤년이 아니다. 400으로 나누어 떨어지는 해는 윤년이다. re..

생각/javascript 2022.09.24

알고리즘 연습 21-28번

// 21. 이상한 문자 만들기 // 문자열 s는 한 개 이상의 단어로 구성되어 있습니다. // 각 단어는 하나 이상의 공백문자로 구분되어 있습니다. // 각 단어의 짝수번째 알파벳은 대문자로, 홀수번째 알파벳은 소문자로 바꾼 문자열을 리턴하는 함수, solution을 완성하세요. const solution = (s) => { // 문장을 단어별로 짜르기 const words = s.split(" "); // 새로운 배열 만들기 위해 map을 써서 조건이 부합하면 들어가게 해줌 const newWord = words.map((n) => { // 배열 요소 저장 let save = ""; for (let i = 0; i b - a).join("")); } // 25. 정수 제곱근 판별 // 임의의 양의 정..

생각/javascript 2022.09.24

JavaScript 정리

🐤 JavaScript의 자료형과 JavaScript만의 특성은 무엇일까 ? JavaScript만의 특성 자바스크립트(JavaScript)는 객체(object) 기반의 스크립트 언어입니다. 자바스크립트로는 웹의 동작을 구현할 수 있습니다. 자바스크립트는 주로 웹 브라우저에서 사용되나, Node.js와 같은 프레임워크를 사용하면 서버 측 프로그래밍에서도 사용할 수 있습니다. 자바스크립트는 동적이며, 타입을 명시할 필요가 없는 인터프리터 언어입니다. : 자바스크립트는 동적 타입 언어이기 때문에 런타임 속도는 빠르지만 타입 안정성이 보장되지 않습니다. : 타입스크립트는 정적 타입 언어이기 떄문에 컴파일 시간이 조금 걸리지만, 안정성이 보장됩니다. 자바스크립트는 객체 지향형 프로그래밍과 함수형 프로그래밍을 모두..

생각/javascript 2022.09.23

[TIL]2022.09.20

오늘 한 일 항해 99 2일차 1. 각 페이지 개발 중 - 글 작성 - 글 목록, 글 검색 2. 개발 완료 후 깃헙 커밋 완료 오늘 느낀 것 서버에서 각 DB를 받아와 각 디테일페이지 만드는 방법이 헷갈린다. 되긴 했는데 왜 됐는지 모르겠다. 내일 할 것 취합 후 오류부분 수정 및 업데이트 로그인 보안기능 ,로그아웃 , 로그인 시 화면에 유저 토큰가져오기 수정 중 상세페이지 추가 최신순 정렬로 업데이트 파비콘 작업 중, 발표 영상 썸네일 제작

생각/TIL,WIL 2022.09.22
반응형