매일 공부한거 기록하기

첫번째 시도는 해당 월의 날짜들만 받아왔었고 이번에는 이전 달, 다음 달의 날짜들도 받아오려고 한다. 저번달의 날짜 배열을 만들었다 현재 달의 요일을 숫자로 받아와 일곱칸중에 몇번째 칸까지 for문을 반복할지 정해준다. 그리고 이전달의 마지막 숫자에서 하나씩 빼준다. 이때 배열은 거꾸로 넣어줘야하므로 unshift해준다. 왜냐면 lastDayofPrev는 31-0, 31-1, 31-2..이런식으로 들어가기때문 31,30,29 배열을 unshift해주는것 해당월은 첫번째 달력에서 만든것과 같다 다음달역시 1부터 시작해 마지막 요일을 일곱칸중에서 빼준다 그럼 일주일중에 몇칸이 비어있는지 알 수 있으니까 1부터 증가시켜 넣어준다 그리고서 map으로 해당 배열들을 컴포넌트로 리턴시켜준다 //저번달 날짜 배열 i..

내가 생각한 방법은... 해당 월의 시작요일을 찾고 해당 월의 마지막 날짜를 찾아서 배열에 push를 해주는것 이었다! 0부터 시작요일까지는 "" 빈값을 넣어주고 시작부터 마지막까지는 for문을 돌려 날짜를 넣어준다 그리고 마지막날짜부터 달력의 마지막 칸까지 또 ""빈값을 넣어주는 그런 방법이였다 const getDays = () => { const startDate = currentMonth.startOf("month").format("d"); const endDate = currentMonth.endOf("month").format("D"); const endDateIndex = currentMonth.endOf("month").format("d"); const dateRow = []; for (le..

달력을 만들어 보자 :) ~ dayjs 공식홈페이지 ~ https://day.js.org/en/ 달력을 구현하기 위한 로직을 정리하자 ~ :) 1. 이번달의 시작 요일을 알아야 한다. 1-1 . dayjs 에서 startOf는 지정 시간 단위의 시작을 알려준다. 1-2 . dayjs().startOf("month")는 object를 리턴한다. 1-3. dayjs().startOf("month").format("d") 를 이용해 필요한 포맷으로 리턴받으면 된다. 1-4. format("d")는 요일이 0-6까지로 표현된다. (일요일이 0으로 시작함) 2. 이번달의 마지막 날짜 2-1.마찬가지로 이번달의 마지막은 dayjs().endOf("month")를 사용해 Object를 리턴받는다. 2-2 .dayjs..

신기하다 ㅋㅋㅋㅋ v-model을 쓴다면 양방향 데이터 바인딩이 가능하다 ! 데이터컨트롤하기 생각보다 더 쉬운것같다 이래서 vue를 좋아하는 것인가 .. 크크크

React 처럼 import해주면 바로 사용할 수 있을 줄 알았다... :( (원래 부딪히면서 배우는거 아니겠냐고요) 1. 단순하게 import해서 사용하는 방법 Before 처음에 이렇게 import만 해주려고 했다. After 이렇게 import를 우선해온 상태에서 export default {} 안에 import해온 component를 선언해주면 사용할 수 있다! 2. 전역에서 사용해야하는 컴포넌트는 어떻게 등록할까? main.js에 import한 후에 등록해주면된다 Vue.component('컴포넌트이름','옵션') 컴포넌트 이름은 당연히~ 컴포넌트를 사용할때 쓸 이름이고 옵션은 렌더링시 필요한 옵션들을 작성하면 된다! import GlobalTest from "./components/Global..

바쁜 벌꿀은 슬퍼할 시간도 업ㄸㅏ vue를 아라보자 1. 아래 명령어를 iterm에 입력 npm init vue@2 vue 2.7기준 , vite기준 으로 설치함 2. 프로젝트 이름은 vue-test 잘 모르겠으니까 일단 NOooo...만 입력해준다 나중에 필요하면 추가해보자 설치완료 3. cd vue-test npm install npm run dev 입력해주면 local에서 띄울수있다 :)

target: "es6", //브라우저 호환성에 맞게 설정 module: "ES2015" outDir: "./dist", rootDir: "./src", removeComments:true //배포할때는 코멘트를 다 삭제함 noEmitOnError :ture // 컴파일 에러가 발생하면 더이상 컴파일 하지 않는다 strict: true //항상 strict모드로 설정한다 /*Additional Checks*/ noUnusedLocal: true, noUnsuedParameters: true, //local에서 사용하지 않는 변수들이 있을때 경고를 받는다 noImplicitReturns: true, noFallthroughCaseInSwitch:true, noUncheckedIndexedAccess:true,

백엔드 개발자 칭구가 프로토타입을 물어봤는데 뭔가 느낌으로 설명하기 어려워서.. 정리를 해보려고 한당 :) https://developer.mozilla.org/ko/docs/Learn/JavaScript/Objects/Object_prototypes Object prototypes - Web 개발 학습하기 | MDN Javascript에서는 객체를 상속하기 위하여 프로토타입이라는 방식을 사용합니다. 본 문서에서는 프로토타입 체인이 동작하는 방식을 설명하고 이미 존재하는 생성자에 메소드를 추가하기 위해 developer.mozilla.org javaScript는 프로토 타입 기반 언어이다. 모든 객체들이 메소드와 속성들을 상속받기 위한 템플릿으로써 프로토타입 객체 prototype object를 가진다는..

화면에 애니메이션을 구현하려고 검색했을때 throttling 과 debouncing 그리고 requestAnimationFrame을 찾아봤는데 이제야 다시 읽어본다! requestAnimationFrame() 브라우저에게 동작하기를 원하는 애니메이션을 알리고 다음 리페인트가 진행되기 전에 해당 애니메이션을 업데이트 하는 함수를 호출하게 한다. window.requestAnimationFrame(callback); callback : 다음 repaint를 위한 애니메이션을 업데이트 할 때 호출할 함수이다.

우선 호이스팅을 알아보자 쉽게 말하면 스코프 내부 어디에서든 변수'선언'은 최상위에 선언된것처럼 행동하는것이다. 으로 정리 할 수 있고 MDN정의를 정리하면 아래와 같다. 인터프리터가 변수와 함수의 메모리공간을 선언전에 미리 할당하는 것을 의미한다. 즉 선언 전에 미리 할당하는것이다 그렇기 때문에 let과 const도 호이스팅 된다는것이다 :) 그렇다면 var로 선언한 a는 undefined로 동작하는것은 알겠는데 console.log(a); //undefined var a ; let으로 선언한 b는 왜 ReferenceError가 발생하는 것일까? 너두 호이스팅 된다면서! console.log(b); //ReferenceError: b is not defined let b; 이유는 TDZ Tempora..