Weeeeey Weeeeey

Exclude, Omit - TS에서 제공하는 type 변형을 유연하게 도와주는 타입들 Exclude Exclude from T those types that are assignable to U. (typescript 2.8 릴리즈) Exclude => union type에서 제외된 타입들에 대한 새로운 타입을 정의함 type MyUnion = string | number | boolean; type ExcludeNumber = Exclude; const value: ExcludeNumber = 'hello'; // value can only be of type string or boolean Omit TypeScript 3.5 introduces the new Omit helper type, which..

libs 폴더는 Next.js 프로젝트에서 프론트엔드 개발자들이 사용하는 라이브러리 및 유틸리티 함수들을 모아놓는 공통 디렉토리 공통 함수 및 유틸리티: libs 폴더는 여러 컴포넌트나 페이지에서 공통으로 사용되는 함수나 유틸리티 기능들을 저장하는 곳입니다. 이러한 함수들은 중복 코드를 피하고 코드 재사용성을 높이는 데 도움을 줍니다. 외부 라이브러리 및 통합: libs 폴더는 프로젝트에서 사용하는 외부 라이브러리들을 관리하는 곳으로 활용될 수 있습니다. 예를 들어, Next.js에서는 libs 폴더에 외부 라이브러리들을 가져와 사용하는 코드를 작성할 수 있습니다. API 클라이언트: libs 폴더는 백엔드 API와 통신하는 클라이언트 코드를 작성하는 데 사용될 수 있습니다. 예를 들어, REST API..

React.ReactElement와 React.ReactNode은 React에서 사용되는 두 가지 다른 타입입니다. React.ReactElement: React.ReactElement는 React 컴포넌트의 인스턴스를 나타내는 타입입니다. React 컴포넌트를 JSX로 작성할 때 생성되는 엘리먼트입니다.(jsx 요소만을 허용) React.ReactElement는 컴포넌트의 타입, 속성(props), 자식 엘리먼트 등을 포함합니다. 일반적으로 JSX를 사용하여 컴포넌트를 작성하면 React.ReactElement가 생성됩니다. (JSX.Element와 차이 없음) 예: React.ReactNode: React.ReactNode은 React 컴포넌트가 렌더링할 수 있는 모든 타입을 나타내는 타입입니다. R..

eslint-parser에 의해 발생. babel에 처리하는 형식으로 변환되지 않아서 발생 프로젝트 루트 경로에 .babelrc 파일 생성 후 아래 코드 작성 { "presets": ["next/babel"], "plugins": [] } 이 후 루트 경로에 있는 .eslintrc.json 파일을 열어 아래 코드로 수정 { "extends": ["next/core-web-vitals", "next/babel"] }

//tailwind.config.js const plugin = require('tailwindcss/plugin') module.exports = { plugins: [ plugin(function({ addVariant }) { addVariant('hocus', ['&:hover', '&:focus']) }) ], }

이터러블은 순회 가능한 객체를 의미 이러한 객체는 Sysyem.iterator 라는 특별한 메서드롤 가지고 있으면 이것을 통해 이터레이터를 반환함 이터레이터는 순회할 수 있는 값의 시퀀스를 나타내는 next() 메서드를 가짐 const iterable = [1, 2, 3]; const iterator = iterable[Symbol.iterator](); console.log(iterator.next()); // { value: 1, done: false } console.log(iterator.next()); // { value: 2, done: false } console.log(iterator.next()); // { value: 3, done: false } console.log(iterator...

1. map 메서드 js에서 map 함수는 배열에서 사용되는 메서드 배열의 각 요소에 대해 주어진 함수를 호출하여 새로운 배열을 생성함. 배열의 각 용소를 변형 / 추출하여 새로운 배열을 만들 때 사용 const nums = [1,2,3,4,5] const doubleNums = nums.map((n)=>n*2) //[2,4,6,8,10] 2. Map 객체 js의 내장 객체로 키- 값 쌍을 저장하는 자료구조 일반적인 객체와 다르게 키 - 값의 연결을 유지하며 순서가 보장 됨 기본적으로 삽입(set), 조회(get), 삭제(clear,delete) 가 있음 문자열 아닌 값도 키로 사용 가능 const mp = new Map() mp.set(1,3) mp.set("asd","asdasd") console.l..

Props, State, Context (참고 사이트) 1. Props 부모 컴포넌트에서 자식으로 전달 되는 데이터 부모에서 받으므로 자식에서 변경x const Text = ({text}) => { return {text} } const App = () => { return } Hello world! 라는 문자열 데이터를 전달 2. State 한 컴포넌트에서 동적 데이터를 다룰 때 사용 컴포넌트 안에서 데이터 변경 가능 import React, { useState } from 'react'; const Text = ({text}) => { return {text} } const App = () => { const [count, setCount] = useState(0); return setCount(co..