본문 바로가기

분류 전체보기

(166)
[code snippet] 단축키로 자주 쓰는 리액트 코드 만들기 code snippet 직접 제작 리액트의 컴포넌트 그리고 리덕스에서 반복되는 소스 매번 작성하기 손 아프다. Extenstions에서 snippet 다운받아 써봤는데 단축키 다 외우기 힘들뿐더러 내가 원하는 스타일이 조금씩 다르거나 존재하지 않는다. 고로 만들어서 쓰자!! 컴포넌트 단축키 만들기 컴포넌트 생성하고 컴포넌트 이름을 ${TM_FILENAME_BASE}로 변경 import React from 'react'; const ${TM_FILENAME_BASE} = () => { return ( ); }; export default ${TM_FILENAME_BASE}; https://snippet-generator.app/ 로 접속해서 컴포넌트 소스 복붙후 설명과 단축키 부분 작성하고 ..
[Pre-algrebra] 식, 방정식과 부등식 [Pre-algrebra] 식, 방정식과 부등식 변수 variable 변하는 값, 주로 x를 사용한다. 대수학에서는 곱하기를 변수 x랑 헷갈린다는 이유때문에 사용하지 않는다. 대수학에서 2 곱하기 x를 표현하는 방법 2·x, 2(x), 2x xy - y + 3x의 값, 단 x=3, y2 = 6 - 2 + 9 = 13 7j + 5 - 8k의 값 단 j=0.5 3.5 + 5 - 2 6.5 식의값 정수에 미지수를 곱하거나 더하면 -> 미지수 값이 증가하면 결과값도 증가 정수에 미지수를 나누거나 빼면 -> 미지수 값이 증가하면 결과값은 감소 위의 케이스로 모든 경우의 수가 나오는 것임 수식 만들기 괄호가 있는 식의 계산은 없는 식과 연산순서가 다르므로 결과가 다르게 나옴 식 계산하기 화씨온도(F)를 섭씨온도(C..
[리뷰] IT에 몸담은 이들을 위한 지적생산기술 IT에 입문하고서 공부법에 관련된 책들도 여럿 봤었다. 처음 공부해보는 분야라서 어떻게 공부해야 되는지도 잘 몰랐고 지금 내가 하고 있는 공부법이 맞는건지 검증하고 싶었다. 하지만 시중에 나와있는 책들은 거의다 수능을 위시한 특정 시험에 특화된 공부법, 즉 암기위주의 공부에 최적화 되어서서 내가 해야되는 프로그래밍의 공부 방법에는 잘 맞지 않았다. 학원 다니고 책보고 여러명이서 스터디하고 공식API문서 읽고 커뮤니티 가서 다른 글보기등 정말 다양하게 공부를 하다보니깐 프로그래밍에 걸맞는 나만의 공부의 틀이 하나씩 잡혀가기 시작했다. 이 책은 책 제목에서 한번 끌렸고 책쓴 저자의 책을 읽어봤던지라 시간을 내서 읽어보았다. 결론부터 말하자면 이건 개발자를 위한 공부법도 나와있어서 개발자에게 분명 도움이 된다..
[ES6] Proxy 객체와 Symbol Proxy 객체 이름처럼 대리자 역할을 해주는 객체 객체의 값이 변경이 일어나면 대신 나서준다 변경 동작에 맞는 메서드를 실행할 수 있다. 값의 변경을 감지하는 get, set, has, deleteProperty, defineProperty등의 내장메서드가 구현이 되어있다. 특정 객체의 값이 바뀌었을때 화면의 글씨를 바꾼다던지 할때 유용함 -> 화면과 데이터의 양방향 바인딩 구현 용이! // 점수 계산 var dummy = { score: 0, lines: 0 } var prx = new Proxy(dummy, { set: (obj, prop, value) => { // 대상 객체, set이 일어난 대상, 할당된 값 console.log("set동작", obj, prop, value); }, get: ..
[테트리스 만들기] 테트리스 기능 구현(다음 블록 생성, 한줄 채우면 사라지고 점수 증가) 고정하기 테트리미노 화면 바닥에 닿으면 조각을 고정하고 새로운 조각을 생성해야 한다. 먼저 조각을 고정하는 freeze() 함수 생성해서 테스트 //*** board.js class Board { grid; // 보드 그리드 piece; // 현재 조각 객체 // ... 기존 코드 drop() { let p = moves[KEY.DOWN](this.piece); if (this.valid(p)) { this.piece.move(p); } else { // 유효한 공간이 아니면 못움직이게 고정 this.freeze(); if (this.piece.y === 0) { // Game over return false; } } return true; } freeze() { this.piece.shape.forEa..
[Pre-algrebra] 약수와 배수 [Pre-algrebra] 약수와 배수 참고 자연수: 0 포함 정수: 0 제외 약수: 어떤 수를 나머지 없이 나눌 수 있는 수 배수(mutiple number) [2,3,4,5,6,9,10]의 배수판정법 2: 짝수인지 체크 2,799,588 = 가능 3: 모든 자릿수를 더하고 나온수를 3으로 나눠봄 2,799,588 -> 2+7+9+9+5+8+8 = 48 -> 48/3은 나눠떨어지므로 3으로 나눌수 있음 4: 맨뒤 두자리수를 4로 나눠본다. 2,799,588 -> 88 /4 = 가능 5: 끝자리가 0이나 5로 나눠진다 2,799,588 = 불가능 6: 2와 3으로 나눌수 있는수(6을 소인수분해 하면 2와 3) 2,799,588 = 가능 9: 모든 자릿수를 더하고 나온수를 9로 나눠봄 2,799,588 -..
[next.js] redux devtools 세팅법 redux devtools npm i redux-devtools-extension 예전이랑 세팅법이 약간 달라졌는데, 요즘 세팅법이 더 간결해졌다. react에서 redux devtools 사용하기 next.js 와 미들웨어 없이 오직 react.js만 사용할 때 세팅하는 순서이다. store를 생성할때 reducer와 composeWithDevTools()를 같이 넣어준다. Provider에 바로 store를 주입하면 끝이라 되게 간단하다. import React from 'react'; import ReactDOM from 'react-dom'; import App from './App'; import { Provider } from 'react-re..
[Pre-algrebra]유리수와 무리수 [Pre-algrebra] 유리수와 무리수 유리수(Rational number) 두 정수의 비로 나타낼수 있다. 분자와 분모 모두 정수인 분수 형태로 나타낼 수 있는 수 유리수의 종류 정수 -7 = -7/1 = 7/-1 = -14/2 유한소수(실수) 3.75 = 375/100 = 3(3/ 4) = 15/4 = -30/-8 순환소수 : 위에 짝대기 있는 소수 모든 순환소수는 분모와 분자가 정수인 분수로 나타낼 수 있다. 0.3333… = 1/3 무리수(Irrational number) 반복되지 않고 끝이 없음 무리수의 종류 원주율 3.14159… 2의 제곱근 1.41421… 완전제곱이 아닌 수의 제곱근은 무리수 황금비율 1.61803… 무리수와 유리수의 사칙연산 유리수랑 무리수랑 연산하면 결과는 항상 무리..