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

리덕스 : 전역 상태관리 도구 리액트 의 데이터 흐름은 단방향이다. 부모 컴포넌트에서 프랍을 통해서 전달 받을수 있다. 근데 이 컴포넌트 구조가 복잡해질때 , 혹은 멀리 떨어진 컴포넌트에서 같은 데이터를 사용하는 경우 불필요하게 전달용 코드들이 많아 진다. 리덕스는 상태관리를 컴포넌트 밖에서 할수 있게 하는 도구 이다. 이때 컴포넌트 밖에 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 와 함수형프로그래밍 은 어떤건지 알아보자 함수형 프로그래밍 일단 프로그래밍 패러다임중 하나다. 예를 들어 객체지향형 프로그래밍 절차적 프로그래밍 같은 근데 이거는 다음글에 ..

일단 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란 자주 사용하는 데..

문자열 내 에서 패턴으로 원하는 문자들을 찾아 원하는 작업을 수행하는일 패턴 지정해주기 let pattern = /abc/; let pattern = new RegExp("abc"); 위와 같은 형태로 패턴을 지정해줄수 있다. (리터럴방식, 생성자함수이용하는 방식) 정규표현식의 쓰임 원하는 패턴의 문자열을 찾아내 우리가 할수 있는것들은 3가지 정도다 1.추출 2.test 3.치환 추출 test 치환 다음글에서는 구체적인 예시와 함께 패턴을 설정하는 법을 알아보자!

const onChangeInput = useCallback((e) => { const { name, value } = e.target; setUser({ ...user, [name]: value }); }, []); >> 각각 안만들어도 되고 이런방식 으로 묶어쓸수 있음 White space : no wrap >> 공백문자 처리 관련 css text-overflow: ellipsis >> 글자 넘어갈때 ... deleteNote(note._id)}>X >> 화살표 함수를 이용해서 매개변수 전달하기

문제를 풀때 재귀로 생각하는게 아직 힘이든다 특히 재귀가 전부가 아니라 전체문제에서 일부분일 경우 이후 과정을 생각하는것은 어려운 일이다. 조합 과 순열은 대표적으로 재귀로 푸는 경우가 많은데 숙지를 위해서 적어두자 문제를 풀다보면 여러가지 속성이 있고 조합했을 때 결과가 어떠한 조건에 해당되는 경우를 확인하고 요구에 맞게 리턴을 해야하는 경우들이 있다. 이런경우 (조합) + (조건 탐색)의 형태로 문제를 풀게되는데 조건 탐색같은 경우는 문제마다 다 달라질수 있지만 조합하는 경우는 어떤 문제든 공통이 되는부분이라서 빠르게 풀고 가줘야 하는 부분이다. 여기서 조합이 아닌 순열이라는 개념이 있는데 (조합)+(순서까지 중요) => 순열 이라고 판단하면 된다. 예를 들자면 [1,10,2,20,3,30] =>[1..

노드 js 공부하면서 미들웨어라는 걸 배웠었지 그 때 당시에 그냥 말그대로 미들웨어 중간에 뭐해주는 역할을 정해줄수 있다 라는 내용 이었는데 사실 딱히 써본적이 없어서 기억속 어딘가에 있었던 개념이었다. 유튜브보다가 코드보니까 훨씬 이해가 잘되서 적어본다. 위사진의 맨 아래 라우터를 보면 경로(/infor) , auth , userCtrl.getUser 가 순차적으로 인자로 들어온 것을 확인 할수 있다. 여기서 userCtrl 는 mvc 모델에서 controller 를 의미하고 위에 파일을 불러온 것을 확인 하면 짐작할수있다. 위에 4개는 가운데 auth 미들웨어가 없는 상황인데 어떻한 점이 다른지 살펴보자~ 일단 위에꺼 중에서 로그인에 사용되는 userCtrl.login 함수를 살펴보자 login: a..