관심있는것들

일반적으로 라우팅은 웹 서버의 역할이다. 클라이언트에서 특정 주소를 웹서버에게 요청하면 서버는 이에 맞는 화면을 클라이언트에게 제공하는 것이다. 클라이언트에게 라우팅역할을 맞길 수 도 있다. 웹 서버가 항상 같은 리소스를 제공하고 브라우져가 이 리소스를 바탕으로 요청 주소에 따라 화면을 렌더링 하는 방식이다. (react라면 component rendering) const App = () => { const { pathname } = window.location; return ( {pathname === "/order" && } {pathname === "/cart" && } {!["/order", "/cart"].includes(pathname) && } ); }; export default App; ..

time domain에서 각 함수를 convolution을 한 한것은 s domain 즉, L transform 한 값을 곱한 것과 결과 값이 같다. function convolution이 복잡할 때는 각각 L transform을 해주고 그것을 곱하여 output 을 계산하고 다시 inver L transform을 하는방법이 존재한다. derivative 도 결국은 system (LTI)이다. 여기서 LTI에 L transform을 적용하는 것은 input x(t)에 L transform을 적용하는것 과 동일하다. 값도 Y(S) = s * X(S) 로 위의 과정과 동일하게 나오게된다. 위 의미를 해석하자면 time domain에서는 미분을 한다는 것은 s domain에서는 s를 곱해주는 것과 동일하다. ..

프롭 드릴링의 문제값의 출처 파악 어려움 , 컴포넌트 중첩이 깊숙히 될수록B는 A와 C 사이에 위치했다는 이유만으로 고유의 역할과 무관하게 메시지를 전달해야함 이벤트 에미터 패턴을 통해 해결 할 수 있다.두 객체 간의 메시지를 비교적 자유롭게 주고 받을 수 있는 통로 역할이다.const createEventEmitter = (value) => { let handlers = []; const on = (handler) => handlers.push(handler); const off = (handler) => { handlers = handlers.filter((h) => h !== handler); }; const get = () => value; const set = (newValue)..

CartPage / ProductItem const ProductItem = ({ product, onClick }) => { const { name, price, thumbnail } = product; return ( {name} {price.toLocaleString()}원 {onClick && 주문하기 } ); }; export default ProductItem; 기존의 ProductItem component 는 CartPage, ProductPage 두 곳에서 item list들을 렌더링 할 때 쓰였다. CartPage에서는 이미 주문한 목록의 item들이기 때문에 주문하기 button이 필요하지 않았다. 이를 위해 ProductItem을 onclick을 주입 받았을 때만 button이 존재하..

1.2.3 Button const Button = ({ styleType, block, children, onClick }) => { let className = "Button"; if (styleType) className += ` ${styleType}`; if (block) className += ` block`; return ( {children} ); }; export default Button; 주문하기 이런식으로 styleType , block등을 주입해서 Button component를 여러방면으로 사용할 수 있다. 마찬가지로 onClick또한 주입받아서 좀 더 확장성 있게 button을 쓸 수 있다. import { rest } from "msw"; const Button = ({ sty..

는 b1, b2 vector의 내적을 의미한다. c_i 는 x가 b_i를 얼마나 가지고있는가 를 의미한다. c_i를 나태내는 분모의 값 (b_i, b_i) 는 normalization factor라고 생각하면 된다. H(jw) 는 fourier series에서 각 harmonic component의 계수를 의미했었다. 현재 x에 e^jwt 가 얼마만큼 분포 해 있는 지 구하기 위해서 내적을 한 결과가 결국 x를 fourier transform 한 결과라는 것을 의미한다. Fourier transform 은 laplace transform의 special case이다. imagnary 영역 (compelx) 만 고려할 때 사용되는 개념이다. 즉 s = jw (complex) 일 때 적용된다. laplace..

Second Order ODE wn 은 system(H, LTI system)의 natural frequency 이다. 오메가는 input 의 frequency이고 natural frequency와는 아무런 상관이 없다. 계산한식으로 A, theta를 r(gamma) 에 대해서 plot을 해보고 싶다. 그래프 색깔의 zeta는 damping 지수 (zeta) 이다. 이것이 커질수록 output response인 A(amplitude)가 감소하는 경향을 확인 할 수 있다. gamma 가 4인 경우 system frequency 보다 input frequency가 압도적으로 높은 경우이다. 이때는 Amplitude 가 거의 0으로 수렴하는 것을 확인 할 수 있다. natural frequency 랑 inpu..

Fourier Transform w = kw0 , dw = w0 인 이유는 T가 무한으로 가면 w0 가 dw 가 되기 때문이다. (아주 작은 delta가 됨) 이떄 k 는 정수배를 의미하는것이다. X(jw) 는 크기 + phase 를 , e^jwt 는 compelx harmonic 즉 주기를 의미하게 된다. aperiodic input은 기존 periodic input과 다르게 discrete harmonic compoenent 로 이뤄지는게 아니라 continous , 즉 모든 frequency로 이뤄진다고 볼 수 있다. anaysis 부분은 위 공식에서 e^jwt, e^-jw't 의 곱연산중에 w==w'이 되는 순간에만 주기함수의 적분할때 0이 되는것에서 살아남음을 표현한 것이다. w == w'이면 ..

filtering이 된다는 것은 LTI System인 H 를 구했을 때 k 에따라 (ak, w0k 가 fourier series에 index임으로) amplitude 가 달라짐을 의미한다. input 함수의 T를 높여서 frequency 를 늘리니까 H의 값 (즉 amplitude) 이 frequency가 클수록 감소되는 양상을 보인다. 즉 고주파 input들은 값이 줄어들게 된것이다. input은 빨간색 사각형 주기함수인데 실제로 LTI를 거쳐서 나오는 output은 모양을 달리 띄게 된다. 주로 저 직각 부분에 frequency가 높은 부분이라 output이 잘 따라오지 못하는 양상을 띄게 된다. y는 x의 주기 (ejwt)와 같고 phase, amplitude만 달라지기에 저렇게 놓고 식을 전개할 ..

Fourier Series LTI(linear time invariant) system에 일정한 주기를 가지고 있는 input이 들어왔을 때 output y를 계산하는 법은 convolution 을 이용하여 계산하게 된다. convolution은 어떤 특정 input값 t (x(a), h(b) 에서 a+b = t가 되는) 에 대해서 y(t) (output) 을 구하는 방법이다. 알아둬야할 점은 input의 frequency와 output 의 frequency 가 그대로 유지되고 앞단에 eigen value가 붙어서 복소평면에서 보면 크기와 회전만 다르다. 즉 주기는 같지만(원운동을 하는 각속도는 같지만) 높이와 phase가 달라진다고 볼 수 있다. 실제 한 예시를 state space representa..