
SCSS를 사용하려는 경우, SASS를 설치해야 한다 SCSS 파일은 브라우저에서 직접 사용할 수 없기 때문에, SCSS를 CSS로 컴파일하는 도구가 필요하다 SASS는 SCSS 파일을 CSS로 변환하는 컴파일러 역할을 하고 아래 기능들을 제공해 준다중첩 규칙: CSS에서는 지원하지 않는 규칙의 중첩 허용변수 사용: CSS 코드에서 변수 사용믹스인(Mixin): 재사용 가능한 스타일 조각 생성.확장 및 상속: 기존 클래스의 스타일을 다른 클래스에 상속 1. 프로젝트에 sass 설치하기npmyarnnpm install sass --save-devyarn add sass --dev2. SCSS 파일 생성, 작성하기컴파일할 내용이 있어야 하기 때문에 필수 파일이 생성만 되어 있는 상태에서는 컴파일을 수행할 S..

시간 복잡도와 공간 복잡도복잡도란?알고리즘의 성능과 효율성을 나타내는 척도로 시간 복잡도와 공간 복잡도로 나뉜다알고리즘이 주어진 크기의 입력을 기준으로 수행시간과 사용공간이 얼마나 되는지 객관적으로 비교할 수 있는 기준을 제시한다복잡도를 나타내는 방법은 점근 표기법으로 O(빅오), Ω(오메가), Θ(세타) 등이 있고, 주로 빅오와 세타 표기법이 많이 사용된다.정리하면 복잡도란 알고리즘의 효율성을 판단하는 척도이다 시간 복잡도연산에 걸리는 시간이 아닌 연산의 횟수를 나타낸다왜 시간이 아닌 횟수를 측정하는가? 환경에 따라 결과가 다르게 나오기 때문단순히 특정 입력에 대해 실행되는 연산의 횟수만 보는 게 아닌, 입력의 크기가 증가함에 따라 실행되는 연산의 횟수가 얼마나 증가하는지를 나타낸 것.시간복잡도를 표기..
var , let , constthis클로저Rest APIRest Ful APIAxios, Fetch, Promise, TanStack Query(React Query)Axios, React Query 차이브라우저 렌더링 과정주소창에 naver.com입력 시 어떤 일이 일어나는가쿠키랑 세션 차이토큰이란쓰로틀링 디바운싱var , let , constvarvar는 es6 이전 버전에서 변수 선언 시 사용되었다전역 또는 함수 스코프를 가지며 TDZ(Temporal Dead Zone)의 영향을 받지 않는다함수 내부에 선언된 var는 함수 스코프(지역변수)를 가지기 때문에 함수 내부에서만 사용 가능하지만 if, for 내부에 선언된 변수는 블록을 무시하고 함수 또는 전역 스코프를 가지게 된다외부에 선언된 변수..
root에 DockerFile 생성// Dockerfile# 1. 베이스 이미지 설정 (Node.js 18 사용)FROM node:18-alpine# 2. 작업 디렉토리를 설정WORKDIR /app# 3. 의존성 파일을 복사하고 설치COPY package.json yarn.lock ./RUN yarn# 4. 환경 변수 파일을 복사 or env를 compose로 했을 경우는 제외COPY .env.local .env.local# 4. 나머지 프로젝트 파일을 복사COPY . .# 5. start.sh 파일 복사 및 실행 권한 부여COPY start.sh /app/start.shRUN chmod +x /app/start.sh# 6. 빌드RUN yarn build# 7. 포트 설정EXPOSE 3000 4000# ..
서버 요청 api// 내역 추가export const PostHistory = async (newHistory: History) => { try { const { data } = await axiosApi.post("/history", newHistory); return data; } catch (error) { console.error(error); throw error; }};타입리스트는 리스트 타입을 사용하고등록은 등록타입을 사용하는데뮤테이트로 갱신하는 건 리스트니까 리스트 타입을 받아야 한다export type HistoryList = { id: number; name: string; price: number; phone_number: string; descri..