seopport.log

1. MapMap은 키-값 쌍을 저장하는 컬렉션이다.키로 모든 데이터 타입 사용 가능: 객체에서는 키로 문자열이나 심볼만 사용할 수 있지만, Map에서는 키로 숫자, 객체, 함수 등 다양한 데이터 타입을 사용할 수 있다.순서 보장: Map은 삽입 순서를 기억하고, 순서대로 데이터를 순회할 수 있다.Iterable: Map은 기본적으로 for...of나 forEach로 순회할 수 있다. 주요 메서드set(key, value): 새로운 키-값 쌍을 추가하거나 기존 값을 업데이트한다.get(key): 지정된 키에 대한 값을 반환한다.has(key): 지정된 키가 존재하는지 여부를 확인하여 true / false값을 반환한다.delete(key): 지정된 키-값 쌍을 삭제한다.clear(): 모든 키-값 쌍을 ..

[push, pop] = 배열의 마지막 요소 처리push(): 배열의 마지막에 요소를 추가한다. 요소를 추가한 배열의 길이를 반환한다.let array = [1, 2, 3];array.push(4);console.log(array); // 출력: [1, 2, 3, 4] pop(): 배열의 마지막 요소를 제거하고 반환한다. let array = [1, 2, 3, 4];let removedElement = array.pop();console.log(removedElement); // 출력: 4console.log(array); // 출력: [1, 2, 3] [shift, unshift] = 배열의 첫 번째 요소 처리shift(): 배열의 첫 번째 요소를 제거하고 반환한다.let array = [1, 2, 3..

1. 제곱 연산: ** 연산자** 연산자는 숫자의 제곱이나 지수 연산을 수행한다.let base = 2;let exponent = 3;let result = base ** exponent;console.log(result); // 출력: 8 2. 제곱근 연산: Math.sqrt() 함수Math.sqrt() 함수는 주어진 숫자의 제곱근을 계산한다. 음수에 대해서는 NaN(Not-a-Number)을 반환한다.let number = 16;let squareRoot = Math.sqrt(number);console.log(squareRoot); // 출력: 4

1. 더블 틸드(~~)로 Math.floor처럼 사용하기비트 NOT 연산자(~)는 정수의 모든 비트값을 반전시키는 역할을 한다.이걸 이용하면  Math.floor()와 비슷하게 소수점을 버리고 정수 부분만 남길 수 있다. Math.floor()나 parseInt()보다 연산 속도가 빠르다고 한다.const num = 3.14;console.log(~~num); // 출력: 3 동작 과정소수점을 제거하기 전 비트 변환:숫자가 3.14 일 때JavaScript에서는 숫자를 64비트 부동 소수점으로 저장하지만, 비트 연산을 할 때는 32비트 정수로 변환된다.첫 번째 비트 NOT 연산:3.14의 비트 NOT 연산을 통해 ~3.14는 -4로 변환된다. 두 번째 비트 NOT 연산:다시 비트 NOT 연산을 통해 ~..

replaceAll 메서드는 문자열에서 문자 또는 문자열을 지정하여 원하는 문자로 대체하는 메서드이다.replaceAll(pattern, replacement)replaceAll() 메서드는 pattern의 모든 일치 항목이 replacement로 대체된 새 문자열을반환합니다.  사용법string.replaceAll("타겟 문자", "바꿀 문자")  예시const myString = "applemango";console.log(myString.replaceAll("a","e")); //epplemengo

노션의 수식 입력칸과 KaTeX​ 텍스트 서식 명령어를  활용해서 다양한 폰트를 적용할 수 있다.  1. 적용 방법수식입력칸에 역슬래시(\, 백스페이스 밑에 있음)와 함께 원하는 서식을 적어주고 중괄호 안에 내용을 작성한다. 2. 폰트 바꾸기 2. 크기 바꾸기 3. 글자색 바꾸기\textcolor{원하는색} 으로 작성하면 된다. 색은 헥스 코드로도 적용가능폰트 서식과 같이 사용할 경우 내용에 폰트 서식을 먼저 적용하고 중괄호로 한번 더 묶어 텍스트컬러를 지정해준다.순서가 바뀌면 적용되지 않음!  배경색이나 테두리도 넣을 수 있다.  KaTex Supported Functions · KaTeX KaTeX – The fastest math typesetting library for the webSimple ..

이미 나뉘어진 단 안에서 한번 더 단을 나누고 싶을 때 사용하는 방법 1. 빈 페이지를 만들어준다. 2. 페이지 안에 들어가서 단을 나눈다. 3. 페이지를 나와서 페이지를 텍스트로 변환한다.그럼 이런식으로 페이지 제목과 안에 나눠두었던 내용이 남는다.  4. 제목을 지운 상태에서 그대로 백스페이스를 한번 더 눌러준다. 단을 더 많이 나눌 수도 있다.

1. font 폴더를 생성하고 다음과 같이 작성합니다.import localFont from 'next/font/local';export const pretendard = localFont({ src: [ { path: './PretendardVariable.woff2', weight: '400' }, { path: './PretendardVariable.woff2', weight: '700' } ], variable: '--font-pretendard'}); 2. tailwind config의 extend에 다음과 같이 추가합니다. fontFamily: { pretendard: ['var(--font-pretendard)'] ..

토스 테스트 결제 api가 모바일 환경에서는 지원이 안된다고 해서 pc에서만 예약 - 결제가 가능하도록 구현해야 하는 사항이었다. 반응형으로 width를 구해서 태블릿 넓이 아래로는 결제를 막는식으로 하려고 했으나.. pc에서도 개발자도구의 반응형으로 접속해서 결제를 진행하면 모바일 버전의 결제 api로 바뀌어서 결제가 되지 않았다.그런데 아래 사진과 같이 브라우저를 크기를 직접 줄여서 결제를 진행하면 정상적으로 된다..  따라서 반응형 넓이를 판단해서 막을 수 없고 사용자가 접속한 환경이 모바일인지 pc버전인지 확인해야만 의도한대로 기능을 구현할 수 있는 상황이다. 난감한 마음에 바로 구글링을 해봤더니 navigator객체의 userAgent라는 메서드가 있다는것을 찾았다NavigatorNavigato..

반응형 css를 구현하는 도중 스타일이 안먹히는 문제가 있었다.@media (max-width: 500px) { .embla__dot { background-color: transparent; cursor: pointer; position: relative; padding: 0; outline: 0; border: 0; width: 20px; height: 20px; margin-right: 7.5px; margin-left: 7.5px; display: flex; align-items: center; }}max-width로 500이하 일때 w, h를 20px로 설정해놨는데,아무리 화면을 줄여도 미디어 쿼리가 안먹고 w, h가 40px로..