일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | 6 | 7 |
8 | 9 | 10 | 11 | 12 | 13 | 14 |
15 | 16 | 17 | 18 | 19 | 20 | 21 |
22 | 23 | 24 | 25 | 26 | 27 | 28 |
29 | 30 | 31 |
- 쌓임맥락
- SCSS import
- 폼 입력 바인딩
- 프로그래머스 데브코스
- 리액트
- Spacer
- git 같은계정 다른 컴퓨터
- vue 이벤트 수신
- react next
- SCSS use
- netlify redirect
- vue mixin
- postcss
- 다른컴퓨터에서 git사용
- SCSS forward
- vue 지역 컴포넌트
- Vue
- nextjs사용법
- KDT 프로그래머스 데브코스 프론트엔드
- 리스트 렌더링
- 프로그래머스 프론트엔드 데브코스
- intersection opserver
- 프로그래머스 K_Digital Training
- 이벤트 수식어
- 프로그래머스 데브코스 프론트엔드
- vuex map
- 고양이 사진 검색기
- KDT 프로그래머스
- SCSS extend
- flex
- Today
- Total
목록분류 전체보기 (307)
혼자 적어보는 노트
Xcopy /E /I SourceFolder DestinationFolder /E는 모든 하위폴더도 대상으로 복사 /I는 아래와 같이 백슬래시 사용 시 생략가능 Xcopy /EC:\dir1\sourcedir D:\data\destinationdir\
화면의 Home page에 접근 시 팝업을 띄우려는 작업 중 오늘 하루 안보기를 구현해보기로 했다. 대략적인 구현 방법은 Local Storage에 날짜 및 시간을 담는 것이고 Home에 접근 시 Local Storage에 있는 Date을 현재 날짜/시간과 조회하여 조건에 따라 팝업을 노출해 주는 것이다. 일단 Home에서 state를 만들어주고 제어를 해 준다. // Home.js import { useEffect, useState } from "react"; import MainPopup from "../components/mainPopup"; function Home() { const [showMainPop, setShowMainPop] = useState(false); // 기본 세팅 값은 fal..
거의 필수로 사용하는 VScode익스텐션들을 정리 해보았다. - prettier 저장 시 자동 줄바꿈등 코드를 예쁘게 만들어 줌 - Material Theme 코드화면의 테마 변경 - Material Icon Theme 파일 아이콘 예쁘게 변경 - Live Server 작성하고 있는 코드를 실시간으로 보여 줌 Open with Live Server (Alt+ L O)를 클릭하면 로컬 주소가 나오면서 실시간 창이 반영 됨. - indent-rainbow 들여쓰기 시 아래와 같은 컬러효과. (남들은 유용하다 했지만 쓰다보니 약간 거슬리는..) - HTML CSS Support Html 코드 작성시 미리 설정해둔 css가 있다면 자동 완성 기능 - CSS Peek Html코드에서 설정한 클래스명 ctrl+클릭..
맥북을 쓰면서 window를 사용하다보니 개발환경이 변경됨으로써 터미널 명령어가 달라서 적응할 겸 자주 쓰는 기본적인 것들만 정리해보았다 Windows Mac Os 현재 디렉토리 cd pwd 상위 디렉토리 cd.. cd.. 디렉토리 이동 cd 디렉토리명 cd 디렉토리명 현재 디렉토리의 파일리스트 dir ls 현재 디렉토리의 파일(+숨김파일) dir /a ls -al 디렉토리 이동 cd cd 디렉토리 생성 mkdir mkdir 디렉토리 삭제 rmdir rmdir 화면클리어 cls clear 파일삭제 del rm 파일이동 move mv 파일복사 copy cp https://www.windows-commandline.com/cmd-commands/
Warning: You provided a `value` prop to a form field without an `onChange` handler. input을 다루게 될 때 위와 같은 warning메세지를 보곤 한다. 태그 사용시 value속성이 고정값이 아니기 때문에 생기는 경고 메세지이다. defaultValue를 사용하던지, readOnly를 사용하던지, onChange를 사용하면된다. 몇가지 테스트를 진행해보았다. 사용자로부터 값을 변경시키지 않을때, 사용자를 통해 변경을 하는게 아닌 설정해놓은 이벤트로 인해 동적으로 값을 변경 하는 상황이다. 그럴 땐 변화되지 않게 readOnly 속성을 넣으면 경고 메세지가 사라진다. 사용자부터 값을 변경 시킬 때 이런식으로 defaultValue속성에 값..
화면 전체 기준으로 가운데 정렬을 하는 일이 종종 있다. 보통 fixed를 사용한 가운데 정렬은 .popup{ position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); } 위와 같이 설정을 하여 처리를 했었었다. 기본적인 부분에서는 문제가 되지 않지만 animation과 함께 사용 시 뜻하지 않는 대로 움직일 때가 있다. 찾아보니 { position: fixed; margin: 0 auto; left: 0; right: 0; } 이런식으로 가운데 정렬을 하는 방법도 있다 [문제상황] 팝업내용 scale이 변경될때 위치가 애매하게 적용되고, 점프되어서 원래 위치로 돌아가는 현상이 발생한다. transform의 translate이 변경된..
git reset HEAD^ > 파일 상태는 그대로이며 바로 직전의 커밋만 삭제 검색해보면 명령어는 대부분 위 처럼 나와있지만 more? 이라는 메세지가 뜬다면 git reset --soft "HEAD^" or git reset --soft HEAD~1 위와 같이 처리를 한다.
react에서 state를 변경하기위해 this.setState나 useState에서 setState를 사용하게 되는데 비동기적으로 업데이트되는 특성 때문에 종종 원하지 않는 결과를 보여줄 때가 있다. setState를 동기적으로 호출하기 위해 this.setState의 두번 째 인자에 콜백 함수를 넣어 동기적으로 실행하게 하거나 useState와 useEffect를 사용하여 setState가 실행된 후를 감지할 수는 있으나 개별적으로 나누어진 함수 안에서 state를 함께 변경 할때 state변경하기가 어려웠다. 아래의 코드는 직접 문제를 겪게된 코드이다. const addHistory = (keyword) => { if (!keyword) { return; } const hasHistory = his..