요즘 공부 7

시간복잡도 그리고 빅오 표기법

02. 알고리즘 복잡도 알고리즘 평가 지표 정확성 작업량 메모리 사용량 최적성 효율성 -> 시간복잡도, 공간복잡도 코딩테스트에서 중요시 할 것은 : 메모리 사용량 과 효율성 중에 시간복자도를 중요시 해야 한다. 메모리 사용량은 많이 주기 떄문에 문제에서는 시간복자도에 포커스를 두는 것이 좋다. 시간복잡도 입력 크기의 값에 대해 단위 연산을 몇 번 수행하는지 계산하여, 알고리즘의 수행시간을 평가하는 방법 3가지 접근적 표현법 빅오 : 최악의 상황을 고려하여 성능 측정 결과 표현(어떤한 상황이더라도, 이것보다 나빠질 수 없다는 케이스) 세타 : 평균적인 경우에서의 성능 측정 결과 표현 (평균적인 상황) 오메가 : 최선의 상황일 때의 성능 측정 결과 표현( 베스트 상황일때 이정도의 퍼포먼스가 나온다는 케이스)..

React-toastify를 이용한 토스트 메세지 만들어보자

React-toastify https://fkhadra.github.io/react-toastify/introduction/ 기본적으로 우측 상단에 토스트 메세지가 나오도록 만들어져 있다. Installation With npm: npm install --save react-toastify With yarn: yarn add react-toastify The gist 프로젝트 최상단의 toastify css파일과, 컴포넌트를 사용한다. Remember to render the ToastContainer once in your application tree. If you can't figure out where to put it, rendering it in the application root would..

tsconfig.json파일 설정 - 상대경로 임포트에서 절대경로 임포트하기

tscofig.json 타입스크립트를 자바스크립트로 컴파일할때 어떻게 변환할 것인지 세부 설정을 지정해주는 파일이라고 생각하면 쉽다. 상대경로, 절대경로를 설정하는 옵션도 있어 유용하게 사용하기 편하다. 간단한 개념 및 옵션 요약이 있는 링크 :: https://codingapple.com/unit/typescript-tsconfig-json/ 1. 기본 config파일 현재 하고 있는 프로젝트의 기본 config파일의 예시 { "compilerOptions": { "target": "es5", "lib": [ "dom", "dom.iterable", "esnext" ], "allowJs": true, "skipLibCheck": true, "esModuleInterop": true, "allowSynt..

GSAP 기본 문법에 대해 알아보자

GSAP 타임라인 기반으로 애니메이션을 쉽고 빠르게 만들기 도와주며 javascript기반의 라이브러리이다. transition 속성을 조작하는 것으로 inline요소에는 동작하지 않을 수 있으니, 최소한 inline-block 속성으로 설정을 요한다. 기본동작 1. to() to() : 현재 상태에서 애니메이션 동작을 수행한다. gsap.to('애니메이션대상', {애니메이션 동작}) gsap.to(".box", { rotation: 45, duration: 10, x: 100, }); // .box의 현재 위치에서부터 10초동안 45도를 돌면서 x축으로 100px 이동한다. 2. from() from() : 애니메이션 동작에서 현재 위치로 동작을 수행한다. 즉, 애니메이션대상의 css값이 애니메이션의 ..

[면접] 신입 웹퍼블리셔 면접 유형 및 후기 / 퍼블 테스트도 봤음

내가 신입 퍼블리셔로서 면접을 다니면서 껶은 질문들과 면접 유형들을 기록하고자 한다. 이번에 운이 좋게 5곳에서 면접 제의가 왔다. 이번에 면접을 보러다니면서 각 회사마다 진행하는 면접 유형들이 각기 다 달랐다. 큰 유형으로 분류하자면, 1. 포트폴리오 PT 2. 인성면접 3. 기술면접 4. 퍼블테스트 ( 손코딩, 직접 타이핑 코딩, 퀴즈) 4가지 유형을 이번 취업을 준비하면서 경험하게 되었다. 이런 일도 흔하지 않을텐데 골고루 겪게 되었다.. 복이 많은 건지, 고생길이 타고 난건지..ㅎ 1. A 기업 ( 1: 1 면접 ) 면접 유형 : 포트폴리오 PT, 인성면접, 기술면접(하), 퍼블테스트(손코딩 및 퀴즈) - 인성면접 중 받은 질문 - 자기소개 - 지원동기 - 이 직무를 선택한 이유 - 자신의 장단점..

요즘 공부 2022.12.09

[웹접근성 JS] 3. 하위메뉴 일체형(jQuery -> Vanilla JS) / 초점이동 중심으로..

이번 예제는 메뉴를 호버 및 초점 진입시 하위메뉴가 전부 나타나는 UI 디자인이다. 호버했을때 호버한 부분의 하위메뉴의 배경색이 변경되어 시각적으로 구분이 되도록 설정하였다. 특징 1. 배경색 jQuery에서는 마우스 호버에 대한 하위메뉴 배경변경만 설정되어 초접진입시 하위메뉴의 배경색이 변경되지 않는다. Vanilla JS로 변경할때 초점 진입시에도 지정된 1depth메뉴의 하위메뉴의 배경색을 변경할 수 있도록 보충해 보았다. (초점 부분 코드 작성할때 정말 애 많이 먹었따...ㅠ 그래서 책 예제에도 언급이 안되어 있었던 건가 싶기도 했다) 2. 하위메뉴에 최대 height값 자동 부여 이번 메뉴에서는 호버시 흰색 바탕이 메뉴의 회색영역의 높이값만큼 모든 하위메뉴가 동일하게 가져야 하는 경우이다. cs..