프론트엔드 스터디

1.JSON 셋팅하기 설정 > 설정 열기(JSON) > 아래 내용 입력 { "editor.mouseWheelZoom": true, //ctrl+휠로 확대/축소 설정 "emmet.variables": { "lang": "ko" //html 기본언어 한글로 설정 }, "explorer.confirmDelete": false, //삭제할 때 물어보기 비활성화 "workbench.editor.enablePreview": false, //무조건 새탭열기 // ----- Sass 설정 ----- "liveSassCompile.settings.formats": [ { "format": "expanded", "extensionName": ".css", "savePath": null // .css파일 생성 } ], "l..

-----yarn 설치----- npm install -g yarn -----yarn 버전 확인하는법 ----- yarn -v -----react 기본파일 생성---- 원하는 폴더에 가서 터미널 연 후 아래 내용 입력 yarn create react-app 원하는폴더명 ----서버(브라우저) 여는법--- npm start

1.부트스트랩 사이트 접속 https://getbootstrap.com/ 2.CDN으로 세팅하는법 -Docs > CDN links를 복사하여 에 적용 3.설치하여 세팅하는법 -다운로드 버튼 클릭 > compiled css and Js 다운 > bootstrap.min.css 와 bootstrap.min.js만 복사

1.윈도우10 1.무료설치방법 [그램, 탐색기 기본설정] https://youtu.be/ptJDcm0qE5I 2.무료설치방법 [레노버, 윈도우 기본세팅] https://youtu.be/hozQeVouTRY 2.포토샵 cs6 1-1.무료 설치 방법 https://nameesse.tistory.com/467 1-2.무료 정품인증 방법 https://nameesse.tistory.com/468 3.msoffice365 1.설치방법[영상] https://www.youtube.com/watch?v=t0oFl1N11Gc 2.설치방법[글] https://bte-mrahn.tistory.com/442 4.포토샵 cc 2021 1.설치방법 https://myuncle-mrahn.tistory.com/1191

명령어 내용 a += 2; a= a+2 a -= 2; a=a-2 a *= 2; a=a*2 a /= 2; a=a/2 a %= 3; a=a%3 (a를 3으로 나누고 남은 나머지) A && B A,B 둘다 true일때 true A || B A,B 둘 중 하나만 true여도 true A != B A,B 둘 중 하나만 true여도 false

명령어 설명 --------------------출력 명령어-------------------- document.write('string') 바로 화면에 출력 alert('string') 경고창 (확인버튼) confirm('string') 확인창 (확인,취소버튼) prompt('제목','입력할 내용(생략가능)') 입력창 (입력칸, 확인, 취소 버튼) A.innerHTML=`` A에 해당내용 삽입 (텍스트,태그 모두 적용) A.textContent=`` --------------------선택 명령어-------------------- document.querySelector('.p1') 문서에서 class p1을 선택 (가까운 대상 한개만 선택 가능) document.querySelectorAll('.p..

html 이 브라우저에서는 동영상 기능을 지원하지 않습니다. controls : 콘트롤러 loop : 반복 재생 autoplay : 자동재생 muted : 음소거 playsinline : 아이폰에서 재생이 시작될 때 자동으로 전체화면 진입하는 것 방지 poster="" : 동영상 재생되기 전 썸네일 source src="" type="" : 타입별로 비디오 주소 설정 화면에 꽉 채우게 하고싶은 경우 css section.main_visual{ background-color: green; width:100%; height:100vh; video{ width:100%; height:100%; object-fit: cover; 부모에 width:100%, height:100vh; video태그에 width:1..

터미널에서 아래 명령어 실행 npm install nodemon -g

script const elImg2 = document.querySelector('.rd2 img'); const elBtn = document.querySelector('.rd2 button');

내장 객체 (build-in object) : 기존에 존재하는 객체 1.래퍼 객체 (wrapper object) : 원시타입의 값을 감싸서 마치 객체처럼 사용할 수 있도록 하는 역할 1)Number 객체 : number 타입에서 사용 가능한 내장객체 2)String 객체 : string 타입에서 사용 가능한 내장객체 script const nn = 1234; //typeof : number(숫자열) console.log(nn); //1234 그냥 출력 (넘버타입) console.log(nn.toString()); //숫자>문자열로 변환 // nn뒤에 .을 찍어 보면 사용할 수 있는 매서드가 뜬다 // 숫자 원시타입을 감싸고 있는 Number 객체로 감싸짐 const tt = ' 글씨 '; //typeof..