profile
프론트엔드를 공부하고 있는 학생입니다🐌
post-thumbnail

[데브코스/TIL] DAY91 - Vue(7) vue-router & pinia

설치 : npm install vue-routermain.js 설정정적 import장점 : 미리 불러오기 때문에 리소스에 대한 로딩이 빠르다단점 : 필요없는 페이지에 대한 컴포넌트도 모두 불러온다동적 import장점 : 필요한 페이지만 불러와서 초기 로딩 속도가 빠르다

2025년 1월 13일
·
0개의 댓글
·
post-thumbnail

[데브코스/TIL] DAY90 - Vue(6) slot & composition api

컴포넌트의 특정 영역을 대체하는 기술리액트의 Children과 동일한 역할부모가 템플릿 조각을 자식 컴포넌트에 전달자식 컴포넌트가 전달받은 템플릿 조각을 렌더링할 수 있게 하는 기능슬롯을 설정해두지 않으면 자식 컴포넌트로 감싸도 렌더링되지 않음부모 컴포넌트에서 동일한

2025년 1월 11일
·
0개의 댓글
·
post-thumbnail

[데브코스/TIL] DAY89 - Vue(5)

컴포넌트 호출과 함께 속성 정의 ⇒ 원하는 값 전달기본 자료형 : 문자열(String) 자료형String형이 아닌 다른 데이터 타입으로 전달받고 싶다면v-bind 디렉티브로 바인딩해서 정의 (ex. :age="20")단 문자열 자료형을 v-bind로 넘겨줄 땐, 반드시

2025년 1월 8일
·
0개의 댓글
·
post-thumbnail

[데브코스/TIL] DAY88 - Vue(4)

main.js에서 컴포넌트 등록import문 없이 언제든지 어디서든 자유롭게 사용 가능컴포넌트 이름 마음대로 지정 가능장점 : 별도의 컴포넌트 등록 과정없이 쉽게 사용 가능단점 : 컴포넌트가 필요없어도 불러옴scoped 속성을 설정하면 해당 컴포넌트 내부에서만 스타일

2025년 1월 7일
·
0개의 댓글
·
post-thumbnail

[데브코스/TIL] DAY87 - Vue(3)

Vue가 사용중인 아키텍처애플리케이션의 데이터data 객체로 관리변경 시, ViewModel에 통보Model과 View를 연결하는 중간 역할computed , methods , watch 같은 기능을 통해 데이터 처리View와 동기화사용자와 상호작용하는 UI 부분v-b

2025년 1월 7일
·
0개의 댓글
·
post-thumbnail

[데브코스/TIL] DAY84 - Vue(2)

값만 참조 : v-for="value in array"값 & 인덱스 참조 : v-for="(value, index) in array"배열 처리필터 : v-for="value in array.filter(...)"포함 : v-for="value in array.inclu

2025년 1월 3일
·
0개의 댓글
·
post-thumbnail

[데브코스/TIL] DAY52~53 - API & JWT Token

HTTP 요청을 보내는 데 사용되는 도구브라우저에서 기본적으로 제공하는 API따로 설치할 필요 없음HTTP 요청을 보내는 데 사용되는 도구따로 라이브러리를 설치해야 함자동으로 json을 적용하여 response 객체를 바로 반환 (편리)fetch에서는 없는 기능들 제공

2025년 1월 3일
·
0개의 댓글
·
post-thumbnail

[데브코스/TIL] DAY52~53 - 전역 상태 관리 라이브러리

리액트에 내장되어 있는 라이브러리리액트 컴포넌트를 같은 문맥(Context)으로 묶어, 데이터 공유를 위한 일관된 인터페이스 제공useContext 훅을 사용하여 필요한 컨텍스트 호출기본적인 설정과 코드량이 많아 다소 러닝 커브가 높은 전역 상태 관리 라이브러리tool

2025년 1월 3일
·
0개의 댓글
·
post-thumbnail

[데브코스/TIL] DAY52~53 - 메모이제이션

함수형 컴포넌트에서 생명주기를 다룰 때 사용하는 리액트 훅생명주기 : 컴포넌트가 태어나고 죽을 때까지렌더링 이후의 Side Effect를 발생시키는 역할useEffect(콜백 함수, 의존성 배열)클린업 함수컴포넌트가 언마운트되기 직전 실행시키는 함수🔍 메모이제이션이란

2025년 1월 2일
·
0개의 댓글
·
post-thumbnail

[데브코스/TIL] DAY83 - Vue(1)

JSX : 설정 X. 뷰는 기본적으로 template를 지원함. JSX는 리액트에서 사용Pinia : Vue3에서 사용 가능한 상태 관리 패키지package.json \- private : 애플리케이션 공개 여부 (대부분 true, 공개 X)dependencies :

2025년 1월 2일
·
0개의 댓글
·
post-thumbnail

[데브코스/TIL] DAY52 - React Hook (useReducer)

useState와 유사하며, 로컬 상태를 정의할 때 사용const \[상태, 액션발생함수] = useReducer(리듀서 함수, 초기값)useState와의 차이점useState: 상태를 변경하는 함수가 별도의 로직으로 여러 개 정의되어 상태 예측이 어려움. 간단함use

2024년 12월 4일
·
2개의 댓글
·
post-thumbnail

[데브코스/TIL] DAY46~49 - React

서로 다른 언어 규약으로 작성된 파일을 웹 브라우저가 이해할 수 잇는 형태의 파일로 변환해주는 역할JSX를 JS 코드로 변환최신 버전의 JS, TS 문법을 다운그레이드하여 변환예시) 바벨, swc여러 개의 프로젝트 파일들을 각 종류 별로 하나의 파일로 묶어주는 역할묶어

2024년 12월 3일
·
0개의 댓글
·
post-thumbnail

[프로그래머스 Lv.4] 매출 하락 최소화

AI 추천 문제 풀었다가 울 뻔 했다.이 문제를 볼 때, 일단 트리로 접근해야하는 건 확신했다.그래서 DFS로 풀어야겠다고 생각하고 열심히 시도해봤다.그런데 아무리 생각해봐도 직원 배열이 최대 30만개인데,DFS로 하면 100%, 500%, 1000% 시간 초과가 발생

2024년 12월 3일
·
0개의 댓글
·
post-thumbnail

[데브코스/TIL] DAY45 - React(1)

이미 공부했더랬지웹 페이지의 성능을 높이기 위해서는 리플로우와 리페인트를 줄여야 함JS로 보여지는 여부를 결정해야 한다면, transform이나 opacity를 사용하는 것 권장 (display, position 노놉)이 속성들은 GPU가 관여할 수 있는 속성이기 때문

2024년 11월 25일
·
0개의 댓글
·
post-thumbnail

[프로그래머스 Lv.3] 단어 변환

단어 변환가장 짧은 단계의 변환을 찾아야 한다 => 전형적인 BFS 방식이다.words 배열에 target이 존재하지 않으면 변환이 불가능 하므로 0을 반환한다.BFS 순회를 위해 방문해야 할 단어를 저장하는 need_visited 배열, 방문한 단어를 기록하는 vis

2024년 11월 22일
·
2개의 댓글
·
post-thumbnail

[데브코스/TIL] DAY38 - TypeScript(3)

🥨 타입 별칭 (type alias) 1. 기본적인 타입 별칭 2. 객체 타입 별칭 3. 함수 타입 별칭 4. 제네릭 타입 별칭 제네릭은 여러 개 사용 가능 관용적으로 대문자 사용 5. 튜플 타입 별칭 6. 인터섹션 타입 별칭 7. 리터럴 타입 별칭 리터럴

2024년 11월 20일
·
0개의 댓글
·
post-thumbnail

[데브코스/TIL] DAY37 - TypeScript(2)

🦾 타입 오퍼레이터 1. 유니언 타입 매개변수, 반환 값 모두 유니언 타입을 적용할 수 있다. 단, 어떤 타입이 올 지 확실하지 않기 때문에 특정 타입에만 사용 가능한 메서드를 호출하면 에러가 발생한다. 타입 가드를 사용한다. (typeof) 타입 가드 코드에

2024년 11월 19일
·
0개의 댓글
·
post-thumbnail

[데브코스/TIL] DAY36 - TypeScript(1)

매개변수와 반환 값의 타입을 지정하는 것void: 매개변수 타입. 아무것도 반환하지 않는다는 뜻never: 매개변수 타입. 반환 값으로만 사용하는 타입무한루프나 에러 던질 때 사용&(AND) : intersection 타입기본 타입에서는 사용 불가보통 객체에서 사용됨같

2024년 11월 18일
·
0개의 댓글
·
post-thumbnail

[데브코스/TIL] DAY33 - TypeScript(1)

템플릿 문자열함수 (함수 선언문, 함수 표현식, 화살표 함수)비구조화 할당 : 배열과 객체에서 값을 추출하여 변수에 할당하는 것배열객체spread 연산자 (...)객체 혹은 배열 합치기에 편리깊은 복사가 불가능 하다는 점spread 연산자와 rest 파라미터의 차이사용

2024년 11월 17일
·
0개의 댓글
·
post-thumbnail

[데브코스/TIL] DAY29 - Node.js(2)

Promise 리턴콜백 or async/await 처리버퍼 : 메모리에서 직접 바이트 데이터 처리한 번에 메모리에 올릴 때 유용대용량 데이터에는 비효율적ex) fs 모듈 - readFile스트림 : 청크 단위로 데이터를 처리하여 메모리 사용량 절약읽기 스트림 / 쓰기

2024년 11월 11일
·
0개의 댓글
·