profile
i'm groot
post-thumbnail

[Tailwind CSS] vscode 플러그인

html 작성 시, 입력한 문자로 시작하는 클래스명들을 보여준다.vscode에서 tailwind 클래스명들을 속성별로 검색 확인할 수 있다.이와 비슷한 플러그인으로는 Tailwind Docs가 있는데, 이는 vscode에서의 바로 확인은 아니고, 검색한 클래스의 설명이

약 20시간 전
·
0개의 댓글

리액트 훅 - useMemo 란?

memoization이란 기존에 수행한 연산의 결과값을 어딘가에 저장해두고 동일한 입력이 들어오면 재활용하는 프로그래밍 기법을 말한다.memoization을 절적히 적용하면 중복 연산을 피할 수 있기 때문에 메모리를 조금 더 쓰더라도 애플리케이션의 성능을 최적화할 수

2022년 4월 21일
·
0개의 댓글
post-thumbnail

React Hook Form

React Hook Form은 React에서 Form을 쉽게 만들기 위한 라이브러리로 공식문서에 적혀있는 그대로 성능이 좋고 유연하며 유효성 검사에 아주 탁월합니다.적은 코드로 더 좋은 퍼포먼스를 낼 수 있다.다른 라이브러리 혹은 React에 비해 Re-render 수

2022년 4월 21일
·
0개의 댓글
post-thumbnail

Element.scrollLeft

속성 은 Element.scrollLeft요소의 콘텐츠가 왼쪽 가장자리에서 스크롤되는 픽셀 수를 가져오거나 설정합니다.요소 direction가 rtl(오른쪽에서 왼쪽으로)인 경우 스크롤 막대 scrollLeft가 0가장 오른쪽 위치에 있을 때(스크롤된 콘텐츠의 시작 부

2022년 4월 20일
·
0개의 댓글

!important

CSS는 같은 속성을 여러 번 정의했을 때, 나중에 설정한 값이 적용됩니다. 만약 나중에 설정한 값이 적용되지 않게 하려면 속성값 뒤에 !important를 붙입니다.예를 들어 다음은 마지막에 설정한 color의 값이 blue이므로, red는 무시하고 문단의 글자색을

2022년 4월 19일
·
0개의 댓글
post-thumbnail

Promise.all

여러 개의 프라미스를 동시에 실행시키고 모든 프라미스가 준비될 때까지 기다린다고 해봅시다.복수의 URL에 동시에 요청을 보내고, 다운로드가 모두 완료된 후에 콘텐츠를 처리할 때 이런 상황이 발생합니다.Promise.all은 이럴 때 사용할 수 있습니다.문법:Promis

2022년 4월 19일
·
0개의 댓글
post-thumbnail

map 함수 적용시 key props를 부여하는 이유

위와 같이 코드를 작성했을 때 정상인 것처럼 브라우저에는 렌더링되지만 Missing "key" prop for element in iterator 와 같은 warning message가 뜨고, 터미널에는 사진과 같이 컴파일되었지만 warning이 있다는 메세지가 뜬다!

2022년 4월 15일
·
0개의 댓글
post-thumbnail

[React] 리액트 .js vs .jsx 차이점

jsx는 JavaScript 확장 문법JavaScript안에서 HTML 사용 가능jsx 사용이 필수는 아니지만 추천 (리액트 공식 홈페이지 - 문서 - JSX 소개 탭)기능적인 차이는 없으나 팀 내 협의의 문제리액트를 공부할 때 js보다 jsx를 쓰는 이유가 "자바스크

2022년 4월 7일
·
0개의 댓글
post-thumbnail

Next.js의 페이지 로딩 진행률 표시줄Page Loading Progress Bar in Next.js

<span style="color: yarn add @badrap/bar-of-progress npm i @badrap/bar-of-progress<span style="color: <span style="color: <span style=

2022년 4월 3일
·
0개의 댓글
post-thumbnail

colspan과 rowspan

하나의 셀 또는 행을 여러 열로 나누고 둘 이상의 열로 합병하기 위해서 사용합니다.즉, 테이블의 셀을 가로로 합병.하나의 셀을 두개 이상으로 확장하거나 셀을 여러 행으로 나눌 때 사용합니다.테이블의 셀을 세로로 합병.colspan은 헤더셀이나 데이터셀에 상관없이 가로로

2022년 4월 2일
·
0개의 댓글

expected a string or class/function 리액트 에러

Error: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: object. You likely

2022년 3월 31일
·
0개의 댓글
post-thumbnail

tailwindcss 사용시 Unknown at rule @tailwind 뜨는 경우

vscode의 settings로 들어간다. command + ,검색창에 css.lint.unknownAtRules 를 검색한다.옵션을 ignore 로 변경한다.vscode issues 참고

2022년 3월 31일
·
0개의 댓글
post-thumbnail

자바스크립트 (JavaScript) 느낌표 두개 (Double Exclamation Marks) 연산자 (Operator),!!

정리하자면 느낌표 두개(!!) 연산자는 확실한 논리결과를 가지기 위해 사용합니다.예를 들어 정의되지 않은 변수 undefined 값을 가진 내용의 논리 연산 시에도 확실한 true / false를 가지도록 하는게 목적입니다.javascript 에서 '!!' 를 사용하지

2022년 1월 14일
·
0개의 댓글
post-thumbnail

코드 자동완성 플러그인 tabnine

구글 광고에 자주 뜨던 tabnine 을 설치해봤다.흔한 자동완성 플러그인이라고 생각했는데, 링크를 타고 들어가자 예전부터 관심있게 보던 GTP-2 기반 자동완성 플러그인이라는 소개글을 보고 깜짝 놀라서 설치하게 되었다.tabnineGTP-2에 대한 소개글은 아래에서.

2022년 1월 11일
·
0개의 댓글

99일차

일급 객체로서 함수가 가지는 가장 큰 특징은 일반 객체와 같이 함수의 매개변수에 전달할 수 있으며, 함수의 반환값으로 사용할 수도 있다는 것이다. 이는 함수형 프로그래밍을 가능케 하는 자바스크립트의 장점 중 하나이다.외부 상태를 변경하지 않고 외부 상태에 의존하지도 않

2021년 12월 24일
·
0개의 댓글

98일차

활용도가 높아지는 웹 프론트엔드 언어, 타입스크립트(TypeScript) 2012년 마이크로소프트가 발표한 타입스크립트(TypeScript)는 자바스크립트(JavaScript)를 기반으로 정적 타입 문법을 추가한 프로그래밍 언어이입니다. 요즘은 대형 SI 프로젝트에서

2021년 12월 22일
·
0개의 댓글
post-thumbnail

97일차

class와 object 차이점

2021년 12월 21일
·
0개의 댓글
post-thumbnail

항해99 Week_14 WIL

Javascript 함수를 지난 포스팅에서 알아보았습니다. 기존에 함수 사용법과 ES6 이상에서의 함수를 사용하는 방법이 추가되었고 다양하게 함수를 표현해서 사용하는 방법을 알아보았습니다.이번 포스팅에서는 함수 사용법에 이해서 재귀(Recursion) 함수에 대해서 알

2021년 12월 19일
·
0개의 댓글
post-thumbnail

95일차

오늘은 컴퓨터에 있는 이미지를 업로드 하고 싶을 때, 미리보기를 구현해 보려고 한다.파일업로드를 위해서는 form태그의 enctype='multipart/form-data'를 이용해야한다.multipart/form-data에 대해서는 찾아보길 바란다.form태그에 en

2021년 12월 19일
·
0개의 댓글

94일차

CORS Link 🔥 CORS가 뭔가요? CORS는 Cross Origin Resource Sharing의 약자로, 교차 출처 공유라는 의미입니다. Origin은 ① scheme, ② host, ③ port 로 이루어진 도메인을 의미합니다. (IE의 경우 por

2021년 12월 18일
·
0개의 댓글