실수로 삭제된 commit 복구하기   ❗️상황작업하다가 실수로 commit한 소스가 사라져버림, 복구해보자! ❗️해결법git refloggit reset --hard commit_id 위 두 명령어만으로 로컬에 커밋한 소스를 복구할 수 있음 🔥마무리실수로 커밋한 소스가 삭제되버렸을때 나 처럼 모두가 당황하지 않고 해결했으면 하는 바램에 포스팅 해보았습니다!!오늘도 모두 힘내세요!!

Git 폴더/파일명의 대소문자 문제 해결    ❗️현상내 PC에서 폴더/파일명이 소문자인데 첫 글자만 대문자로 바꿔서commit push 했지만 나만 잘되고 팀원들은 안되는 상황 ❗️원인Git은 폴더/파일명의 대소문자를 구분하지 못함 ❗️결론Git 설정에서 대소문자 무시하지 말라고 설정해야함 ❗️해결법1) Git한테 무시하지 말라고 설정git config core.ignorecase false 2) 파일명 변경해보자!Ex) 기존 list.js.  ------>>List.js 로 변경이렇게 한후 commit push 해보자! +)위 작업후, Git 저장소에 변경된 폴더내 캐싱된 파일이 남아 있다면서이상한 메시지가 나오면, 아래 명령어로 캐시 지워주자!git rm -r --cached .git add .gi..

CSS 미디어 쿼리 문법    only | not의 위치에는 말 그대로 only 키워드 또는 not 키워드가 들어가게 되는데  only 키워드는 뒤의 조건 만 , not 키워드는 뒤의 조건을 제외한 조건을 뜻 합니다. 미디어 쿼리를 지원하지 않는 브라우저는 only 키워드가 쿼리 안의 내용이 무시되어 실행 되지 않습니다. only 키워드는 큰 의미는 없지만 미디어 쿼리를 지원하는 브라우저를 대상으로 할 경우 적어주는 것이 좋습니다. ❗️미디어 타입의 종류 ( 많지만 자주 쓰이는 것만 적어 봤습니다.)- all : 모든 미디어 타입- print : 인쇄 용도- screen : 컴퓨터 스크린 ❗️미디어 쿼리문의 속성과 속성 값 - width: 웹페이지의 가로 길이를 판단합니다.- height: 웹페이지의 세..

EOL(EndOfLine) 문제 해결    ❗️EOL(EndOfLine)이란?EOL(end-of-line)은 개행문자 또는 줄바꿈문자라고 불리며, 새줄문자(newline)라고 칭하기도 한다. 텍스트의 한 줄이 끝남을 표시하는 문자(문자열)이다. ❗️파일마다 EOL을 넣어야 하는 이유파일마다 EOL, 즉, 개행을 해야 하는 이유는 무엇일까? 이유는 POSIX 명세가 그러하기 때문이다. 많은 시스템과 프로그램이 이 표준을 따라 구현되어 있으며, 이를 위반 시 예기치 않은 동작이 일어날 수 있다고 한다. 또한, EOL이 있으면 파일을 구분하는 데에도 도움이 된다. 만약 파일의 끝에 개행이 되어 있지 않다면 깃허브에 커밋 시 경고 메시지를 볼 수도 있다 ❗️해결방법 - 파일마다 EOL을 자동으로 넣도록 설정1...

JavaScript - undefined, null의 차이   undefined 변수나 인수를 선언하고 초기값을 할당하지 않은 상태의 값이다. 즉, 자료형이 없는 상태를 말한다. null 변수를 선언하고 빈 값을 할당했다고 지정한 상태를 말한다. 자료형은 object가 나온다. typeof null; //'object'typeof undefined; //'undefined' typeof를 찍어봐도 이런 차이가 있지만 null의 경우  object가 나와서 타입을 체크하는 경우 아래와 같은 문제가 발생할 수 있다. typeof []; //'object'typeof null; //'object' 배열을 체크하고 싶을 때, 배열도 object로 구분된다. 배열인지 체크를 하고 있지만 null인 경우에도 체크가..

❗️에러해결❗️    ❗️ 에러프로젝트 작업 중 아래와 같이 img 태그 사용했는데 에러 발생했습니다!img src={image} />  ❗️ 에러 메시지 img elements must have an alt prop, either with meaningful text, or an empty string for decorative images.eslintjsx-a11y/alt-text  ❗️ 해결 방법img 태그 사용시 src 속성과 함께 alt도 같이 작성해야 합니다! (alt의 내용은 자유!) 오류해결!  마무리🔥오류해결 하나 씩 해결하고 다음엔 실수 안해야지!!오늘도 화이팅🔥

CSS의 Cascading    Cascading이란?최종적으로 적용할 CSS 속성들을 결정할 때, 계단식 폭포처럼 CSS 규칙을 순서에 따라 합쳐서 적용하는 걸 말합니다. 우선순위가 높은 규칙일수록 우선적으로 속성을 적용합니다. 규칙선택자마다 명시도 점수가 있고 명시도를 고려한 우선 적용되는 순서는 아래와 같습니다. - !important (명시도와 무관하지만, 명시도에 직접 영향을 미침, 다른 선언보다 우선함) - 인라인 스타일 정의 (인라인 스타일은 항상 외부 스타일시트의 모든 스타일을 덮어쓰기때문에 가장 높은 명시도를 갖는다고 생각할 수 있음)- 명시도     - 아이디 선택자      - 클래스 선택자, 속성 선택자, 가상(pseudo)클래스 선택자      - 태그 선택자, 가상(psuedo)..

CSR vs SSR vs SSG    Client Side Rendering (CSR)CSR은 웹 브라우저에서 자바스크립트로 HTML을 만들어 렌더링하는 방식을 말합니다.👍장점▪️ 페이지의 전환 속도가 SSR에 비해 빠르고, 깜빡임 없이 부드럽게 페이지가 바뀝니다.▪️ 자바스크립트에서 HTML을 만드는 연산작업이 서버에 집중되지 않기 때문에 서버에 부하가 적게 발생합니다.👎단점▪️ SPA(Single Page Application)의 경우 처음 페이지 접근시 서버로부터 전체 페이지에 대한 자바스크립트 번들파일, CSS 파일을 받아야 하므로 페이지를 만들고 유저가 사용하기 까지 시간이 SSR에 비해 오래 걸립니다.▪️ 검색엔진에서 자동화된 로봇인 ‘크롤러’로 웹 사이트를 읽는데, CSR은 자바스크립트를..

JavaScript Event Handler 모음    onabort이미지의 다운로드를 중지할 때 (브라우저의 중지버튼)onactivate개체가 활성화될 때 발생(태그의 기능이 작용할 때 발생하는 이벤트로 예를 들어 링크를 누를 경우 링크가 옮겨질때 발생하는 것을 감지하는 이벤트 핸들러)onafterprint문서가 출력되거나 혹은 출력하기 위해 출력미리보기를 한 후에 발생onafterupdate데이터영역 개체에서 발생하는 이벤트로 데이터 소스 오브젝트내의 데이터가  업데이트 되었을 때 발생(데이터 개체부분 참조)onbeforeactivate개체가 활성화 상태로 되기 바로 직전에 발생 (onactivate 참고)onbeforecopy선택 영역이 시스템의 클립보드로 복사되기 바로 직전에 발생onbeforec..