공부 정리

출처 : https://ko.redux.js.org/tutorials/fundamentals/part-2-concepts-data-flow Background Concepts state management import react, { useState } from "React"; function Counter() { // state const [counter, setCounter] = useState(0); // action // code that causes an update to the state when something happens const increment = () => { setCounter((prevCounter) => prevCounter + 1); }; // view return ( v..

redux overview This tutorial will introduce you to the core concepts, principles, and patterns for using Redux. part1 리덕스 앱 예제 소개 part2 리덕스 앱에서 데이터가 흐르는 방식과 디테일 소개 part3 state, action, reducer에 대한 활용 redux가 어떻게 작동하는지 설명 이후 표준 패턴, 추상화 what is redux 리덕스는 app 상태를 ‘action’이라고 불리는 이벤트를 이용해서 관리하고 갱신하는 패턴과 라이브러리이다. 상태에 대해 중앙 집중식 저장소 역할을하고, 예측 가능한 방식으로만 업데이트 될 수 있도록 하는 규칙을 제공한다. why should i use Redux 리..

브라우저에서 MSW는 네트워크 수준에서 요청을 가로채는 책임을 지는 서비스 워커를 등록함으로써 작동합니다. 서비스워커는 원칙적으로 HTTPS를 통해 제공되어야 한다 그러나 브라우저는 로컬호스트에서 개발할 때 HTTP에서도 워커를 등록할 수 있도록 허용한다 worker 스크립트 복사하기 만약 애플리케이션이 서비스 워커를 등록한다면, 해당 워커 스크립트를 호스팅하고 제공해야 합니다. 라이브러리의 CLI는 init 명령을 제공하여 빠르게 ./mockServiceWorker.js 워커 스크립트를 애플리케이션의 공개 디렉토리로 복사할 수 있음 npx msw init 복사했으면, 브라우저에서 애플리케이션의 /mockServiceWorker.js URL로 이동한다 💡 만약 localhost:3000 이면 localh..

Import MSW는 HTTP 요청을 설명하기 위한 별도의 네임스페이스를 제공한다 이 네임스페이스로 가로챌 요청과 그에 대한 응답 방법을 설명한다 import the http namespace from the msw package src/mocks/handlers.js import { http } from 'msw' export const handlers = [] Request handler 이제 Request handler를 만든다. http namespace의 모든 메서드는 HTTP 요청 메서드에 대응되는 요청 핸들러를 만들게한다. http[method](predicate, resolver) Request handler : 요청과 mock 응답을 가로채게 하는 함수 실습 endpoint GET /po..

Intercepting requests 요청에 대해 mocked response를 보내기 위해, 우선 요청을 가로채야한다. MSW에서는, 요청 인터셉션을 request handler로 불리는 함수로 수행한다 // Intercept an HTTP GET request which path // matches the "predicate", and resolve it // using the given "resolver" function. http.get(predicate, resolver) "predicate"와 일치하는 경로의 HTTP GET 요청을 가로채고, 이를 주어진 "resolver" 함수를 사용하여 resolve한다 HTTP request HTTP 요청은 http request 네임스페이스를 사용하여..

참고 : https://developer.mozilla.org/en-US/docs/Learn/Accessibility/WAI-ARIA_basics WAI-ARIA basics - Learn web development | MDN This article has by no means covered all that's available in WAI-ARIA, but it should have given you enough information to understand how to use it, and know some of the most common patterns you will encounter that require it. developer.mozilla.org unsemantic HTML과 자바스크립..

참조 https://www.w3.org/WAI/ARIA/apg/patterns/accordion/examples/accordion/ Accordion Example Accessibility resources free online from the international standards organization: W3C Web Accessibility Initiative (WAI). www.w3.org 아코디언 패턴 아코디언 - 각각이 섹션의 콘텐츠를 표현하는 title, content snippet, thumbnail 이 포함된 상호 작용 가능한 제목으로 구성된 수직으로 쌓인 집합 제목들은 사용자가 관련 콘텐츠 섹션을 나타내거나 숨길 수 있는 기능이 있다. 아코디언은 일반적으로 단일 페이지에서 여러 섹션..

( 이전에 만들어두었던 ppt로 작성되었습니다) Transformer 많은 PLM들의 백본모델 각 토큰의 hidden state들은 하위 레이어로부터 누적되면서 업데이트 된다. 최종적으로 Transformer의 아웃풋은 시퀀스내부에서 각 토큰들의 문맥적 표현을 담고있을 것이다. 논문에서 제안된 구조 아래부터는 단계별로 설명입니다. Embedding & positional Encoding 문장의 sparse represetion을 시작으로 word vertor로 매핑시킨다. 중간에 임베딩 차원의 제곱근으로 나누어 스케일링을 진행하고, 위치 정보는 삼각함수를 이용하여 적절히 첨가한다 이렇게 해서 모델에 들어갈 Embedding matrix가 만들어진다 dot product attention 유사도 연산이 들..

unsupervised representation learning 은 NLP Domain 에서 매우 성공적이었다. ( word2Vec, ELMo, BERT, GPT ... ) 일반적으로 이 방법론들은 우선 대규모의 unlabeled text corpora 로 Neural Net 을 pretrain 하고, 그 이후 downstream task 들에 대해 representation 이나 모델을 finetuning 한다. 다양한 unsupervised pretraining objective 가 있는데 이 중 AR 와 AE 가 가장 성공적인 pretraining objective 이다. AR Autoregressive model 로 text corpus 의 확률분포를 찾는 것을 원한다. 구체적으로 text se..

abstract ML model (including NN) 은 adversarial example을 오분류함. ⇒ 작지만 의도적으로 worst case perturbation 을 dataset의 example에 적용하여 만들어진 input 그래서, perturbed input 은 model이 high confidence로 오답을 뱉도록 한다. 위와 같은 현상을 설명하는데에 있어서 이전의 시도들 : nonlinearity 와 overfitting에 초점을 맞춤 introduction in Intriguing properties of neural networks, ML model은 adversarial example에 취약함. ⇒ ML model 은 data 분포로 부터 뽑힌 올바르게 분류된 example ..