개발자_승딱 개발자_승딱

음 interface 랑 type 이랑 용도가 묶어서 타입을 지정해주는 거 같은데 뭐가 다른건지 그리고 좀 더 정확하게 어떤역할인지 알아보자.. 인터페이스 : 여러속성이 다른 타입을 가질때 이 묶음을 하나의 타입으로 만들어 버리기~ 타입 앨리어스 : 새로운 타입을 지정 할수있다... 사실상 거의 비슷한 느낌이다. 차이점 > 1. 인터페이스는 타입만 지정할수 있지만 타입앨리어스는 원시값이나 유니온타입 튜플 등도 타입으로 지정 할 수있다. // 문자열 리터럴로 타입 지정 type Str = 'Lee'; // 유니온 타입으로 타입 지정 type Union = string | null; // 함수 유니온 타입으로 타입 지정 type Func = (() => string) | (() => void); // 인터페..

리덕스 : 전역 상태관리 도구 리액트 의 데이터 흐름은 단방향이다. 부모 컴포넌트에서 프랍을 통해서 전달 받을수 있다. 근데 이 컴포넌트 구조가 복잡해질때 , 혹은 멀리 떨어진 컴포넌트에서 같은 데이터를 사용하는 경우 불필요하게 전달용 코드들이 많아 진다. 리덕스는 상태관리를 컴포넌트 밖에서 할수 있게 하는 도구 이다. 이때 컴포넌트 밖에 store 라는 곳에서 상태관리를 하게 된다. 위 그림을 보게 되면 react component 는 state 를 store 에서 가져오는 것을 알수 있다. 하나씩 살펴보면 store 는 reducer 에 이전스테이트와 action 으 전달해주고 새로운 state 를 받는 것을 확인해 볼수 있다. reducer 는 store 의 state 를 관리하는 함수라고 생각 할..

어떤상황에서 쓰이는지 는 저번글에 알아봤고 오늘은 정규표현식 안에서 쓰이는 기$호들의 의미를 체크해보자 표현식 의미 예시 ^ 시작하는문자를 의미 ^x => x로 시작하는 문자 $ 종료할때 문자 x$ => x로 끝나는 문자 . 임이의 한 문자를 의미 ...x => 3글자 이후에 마지막은 x + 반복을 의미 x+ => x가 한번이상반복됨 ? 바로 앞에글자가 있을수도 없을수도 apples? => s?는 “s”가 있을 수도 있고, 없을 수도 있다는 의미로, “apple”, “apples” 모두에 매치된다. * 반복여부(0번 또는 그이상)를 나타낸다 n\d* : n 뒤에 숫자가 0개 이상이라는 의미. “n”, “n1”, “n123” 에 모두 매치된다. | 또는 을 의미한다. x|y => x또는 y 문자가 있는거를..

리액트 , 리덕스 , 함수형 프로그래밍 등등 공부하다가 보면 side effect 니 뭐니 immutable 몇가지 개념들과 함께 순수함수에 대한 이야기들이 나온다. 그냥 동일한 입력값은 동일한 출력값을 내는 함수를 순수함수 라고 알고 있는데 좀더 자세히 알아보고 왜 필요로 하는지 알아보자 순수함수의 정의 와 특징들 동일입력값 > 동일출력값 함수형 프로그래밍의 기반 side-effect 가 없다. 공유된 상태로부터 기인한 버그에 면역이 있다. 바깥상태로부터 독립적이다. 리팩토링 하기 쉽다. 특징들은 그러려니 하고 side-effect 와 함수형프로그래밍 은 어떤건지 알아보자 함수형 프로그래밍 일단 프로그래밍 패러다임중 하나다. 예를 들어 객체지향형 프로그래밍 절차적 프로그래밍 같은 근데 이거는 다음글에 ..

일단 parameter 와 argument 의 차이 argument > 실제 사용되는 인자 parameter > 형식 매개변수 선언부분에서는 parameter 라고 하고 호출부분에서는 argument 라고 한다. call by value , call by reference 정의 : 호출방식에 따라서 인자가 평가되는 방식이 달라진다 함수에 인자로 어떤것이 들어오느냐에 따라 실행되는 방법에 차이가 있다. 원시형자료형이 인자로 들어오는지 ? 아니면 참조형자료형이 들어오는지 ? 에 따라서 call by value 방식으로 함수가 실행될지 call by reference 방식으로 함수가 실행되는지 결정되는 것이다. 다시 정리하면 위에서 argument 에 해당하는게 참조형 자료다 그러면 call by refere..

원시자료형 정의 : (고정된 저장공간을 차지하는 데이터) 예시 : boolean, number, string, null, undefined 특징 : immutable 하다 , 그러나 다른값을 할당할수는 있다. > 하나의 변수에 하나의 데이터 참조자료형 정의 : 원시자료형 말고 그외 자료형(힙이라는 별도의 데이터 저장소에 저장이되고 변수에는 저장된 위치를 가지고있는다.) 예시 : 배열, 함수 , 객체 특징 : mutable 하다 , 하나의 변수에 여러데이터를 담을수 있다.

미디어쿼리 효과적적용(scss) @mixin example { @media screen and (max-width: 768px) { @content } } @include example(){ font-size : 여기에 적으면 위에 미디어 쿼리 적용됨 content 자리에 들어간다고 생각하면됨 } 여기에 @if 문 까지 쓰면 아주 편리함 그라데이션+ 배경 linear-gradient(to right, rgb(90, 121, 90) 0%, green 100%) background-blend-mode: multiply; 백그라운드 이미지 사이즈 조정 background-size: 100% 110vh; ( contain , cover) 그외 html { font-size: 62.5%; } em: 부모컴포넌트 ..

일단 url 문법부터 보자 아래와 같다. protocol: [//[user:password@]host[:port]][/]path[?query][#fragment]:port >> protocol :// url : port 구조이다. 1.host 부분을 인코딩한다.(인코딩이란? 정보의 형태나 형식을 변환하는 처리나 처리 방식) 퓨니코드(Punycode)는 유니코드 문자열을 호스트 이름에서 허용된 문자만으로 인코딩하는 방법 2.hsts 목록을 확인하여 있으면 https 없으면 http 프로토콜을 사용하여 통신한다. (hsts? 웹사이트가 브라우저에게 https 로 만 통신하라고 설정해놓은 사이트 목록) 3.해당 도메인 이 이미 브라우저에 캐쉬된 Ip 가 있는지 확인한다. 캐시란? Cache란 자주 사용하는 데..