분류 전체보기 (127) 썸네일형 리스트형 [CSS] 크롬과 shadow 관련 1. css에서 shadow 관련해서는 구글에 'box shadow css generator' 검색하면 이런 사이트가 나온다 2. 글씨체 바꾸기 크롬 설정에서 Experiments - Enable new Font Editor tool within the Styles Pane. 선택 그이후 F5하면 글씨체 변경 가능하다 3. Flex box editor 개발자 모드에서 옆에 아이콘 선택하면 가능 grid, flex도 가능 [Chrome] 1. [F12] - Ctrl + Shift + p - coverage 검색 현재 페이지에서 내가 쓰고 있는 부분을 퍼센테이지로 확인 가능 파란색이 쓰고있는것, 빨간색이 현재 페이지에서 안쓰고 있는 것 2. [F12] - Ctrl + Shift + p - snippets 긴 코드 console창에 입력 하고있을때 사용 실행 출처 : https://www.youtube.com/watch?v=toXJLUa7i0Y&list=WL&index=3 [css] 디버깅 - class, id 등 같은 이름의 오타 없는지 확인 - 저장 하여 최신 소스로 view를 보고있는지 확인 - html과 css파일이 잘 연결 되어있는지 확인 (html의 head 태그안에 기입) - 다른 css에서 적용된 것이 겹친게 있는지 확인 출처 : https://www.youtube.com/watch?v=inP3ILAWEo4&t=184 [css] css 관련 요즘 추세 볼 수 있는 사이트 https://2021.stateofcss.com/en-US/technologies/pre-post-processors/ The State of CSS 2021: Pre-/Post-processors You can click on any technology name to get extra details and a more in-depth look at its related data. 2021.stateofcss.com [Javascript] async / await 비동기 1) async 앞에 있으면 promise와 같다 function myFunc() { return 'func'; } async function myAsync() { return 'async'; } console.log(myFunc()); console.log(myAsync()); 결과 : 2) async 안의 함수에 return이 myAsync 호출하는 then의 result값에 찍힌다 async function myAsync() { return 'async'; } myAsync().then((result)=> { console.log(result); }); 결과 : async 3) function delayP(sec) { return new Promise((resolve, reject)=> { setT.. [Ajax] Ajax란 Ajax 서버에 새로고침 없이 요청을 할 수 있게 도와줌 -jQuery 설치해서 $.ajax() 사용 -axios 설치해서 axios.get() 사용 -쌩자바스크립트 fetch() 사용 GET 주소창에 URL 때려박는 요청 특정페이지/자료 읽기 POST 로그인 할때, 아이디 비밀번호 같은 서버로 중요 정보 전달 PUT 원래 GET/POST 요청 할 때마다 항상 새로고침되는데 Ajax 는 새로고침 없이 요청 [react] bootstrap 사용 (navbar) 1. react-bootstrap.netlify.app/components/navbar/#navbars React-Bootstrap The most popular front-end framework, rebuilt for React. react-bootstrap.github.io 2. 네비바 복사 React-Bootstrap Home Link Action Another action Something Separated link Search 3. import 해주기 import { Navbar, Nav, NavDropdown, Form, Button, FormControl } from 'react-bootstrap'; 4. navbar 왼쪽에 있는부분을 오른쪽으로 옮기고싶으면 의 className의 mr-a.. [react] bootstrap 설치 사용 1. react-bootstrap.github.io/getting-started/introduction React-Bootstrap The most popular front-end framework, rebuilt for React. react-bootstrap.github.io 2. VSC 터미널에 입력 npm install react-bootstrap bootstrap 또는 yarn add react-bootstrap bootstrap 3. 사이트에 있는 것 복사 더보기 4. index.html 에 붙혀넣기 5. getbootstrap.com/docs/5.0/components/buttons/ 사이트에서 예시를 가져온다 Success 6. App.js 에서 div 사이에 부트스트랩 을 넣는다 impo.. [react] npm start, yarn start npm start 와 yarn 설치 후, yarn start 는 같다. [react] yarn 설치 mac os yarn : npm 대신에 사용 가능하는 소프트웨어 A complete log of this run can be found in 와 같은 에러가 떠서 서치 결과.. 1) package-lock.json삭제 rm -rf node_modules 2) 설치 npm install 하고 yarn 설치 npm install --global yarn 하여도 같은 증상이 일어난다.. 내일 다시 해볼 생각이다.. 일어나면 출근..ㅠㅠ 이전 1 ··· 4 5 6 7 8 9 10 ··· 13 다음
