개발해보개

useReducer useReducer는 useState와 같이 상태관리를 도와주는 Hook이다. 이 Hook 함수를 사용하면 컴포넌트의 상태 업데이트 로직을 컴포넌트에서 분리시킬 수 있다. 상태 업데이트 로직을 컴포넌트 바깥에 작성 할 수도 있고, 다른 파일에 작성 후 불러와서 사용 할 수도 있다. 같은 작업을 useState와 useReducer로 해보았다. useState import React, { useRef , useState, useMemo, useCallback } from 'react'; import CreateUser from './CreateUser'; import UserList from './UserList'; // active값이 true인 사용자의 수를 세어 화면에 렌더링하기...

React 2021. 11. 12. 14:44

HTTP(Hyper Text Transfer Protocol)란, 인터넷에서 데이터를 주고받을 수 있는 프로토콜(규칙)이다. 즉, 웹 서버와 클라이언트 간의 통신을 하기 위한 통신 규약이다. HTML 뿐만 아니라 텍스트나 이미지, 음성, 영상 JSON 등 거의 모든 형태의 데이터가 전송이 가능하며 서버간의 데이터 전송 시 대부분 HTTP를 사용한다. HTTP의 동작원리 클라이언트는 브라우저라는 웹 어플리케이션을 이용해서 웹서버에게 무언가를 요청(Request)한다. 요청을 받은 웹서버는 해당 요청에 대한 응답(Response)을 클라이언트에게 보내준다. HTTP의 특성 - Stateless(무상태 프로토콜) : 클라이언트의 상태를 보존하지 않는다. - Connectionless(비연결성) : 연결을 유지..

Computer Science 2021. 11. 12. 01:41

useMemo 성능 최적화를 위하여 연산된 값을 useMemo라는 Hook을 사용하여 재사용하는 방법을 알아보자. active값이 true인 사용자의 수를 세어 화면에 렌더링하려고 하는데, users에 변화가 있을 때만 세는 것이 아니라, input 값이 바뀔 때에도 수를 세고 있다. 이렇게 불 필요한 리렌더링을 막기 위해 useMemo를 사용 할 수있다. useMemo의 Memo는 "memoized"를 의미 (이전에 계산 한 값을 재사용한다는 의미)

React 2021. 11. 11. 23:17

useEffect useEffect라는 Hook을 사용하여 컴포넌트가 마운트 됐을 때 (처음 나타났을 때), 언마운트 됐을 때 (사라질 때), 그리고 업데이트 될 때 (특정 props가 바뀔 때) 특정 작업을 처리하는 방법을 알아보자. useEffect의 첫번째 파라미터 = 함수 / 두번째 파라미터 = 의존값 ** cleanup함수란? useEffect에서는 함수를 반환 할 수 있는데 이를 cleanup함수라고함 useEffect안에서 return 할 때 실행된다. useEffect의 뒷정리 담당. (state에서 값 지울때 실행됨) useEffect의 deps 배열을 비울 경우. useEffect의 deps에 특정 값을 넣을 경우. useEffect의 deps 파라미터를 생략 할 경우.

React 2021. 11. 11. 23:06

Git으로 버전관리를 하다보면 반드시 시간을 되돌려야 하는 순간이 찾아온다. reset 경우 1. 기록이 남지 않도록 돌리기. 사용법 git reset --mixed [commit ID] git reset --soft [commit ID] git reset --hard [commit ID] 아예 현재가 없었던 것 처럼 원하는 과거로 돌아갈 수 있다. 정말 말 그대로 '리셋'이다. reset은 이력을 남기지 않는다. 따라서 현재까지의 commit 이력을 남기지 않고 원하는 시점으로 완전히 되돌아가고 싶을 때 사용할 수 있다. revert 경우 2. 기록 남기고 돌리기. 사용법 git revert [commit ID] revert는 과거로 돌아가겠다는 이력을 남겨두고 원하는 시점으로 돌아간다. 즉, 이전의 ..

etc. 2021. 11. 11. 21:21

Markup Language란? 태그를 사용하여 문서 내의 요소를 정의하는 컴퓨터 언어. 문서가 화면에 표시되는 형식을 나타내거나 데이터의 논리적인 구조를 명시하기 위한 것으로 사람이 읽을 수 있는 비교적 쉬운 방식으로 작성되어진다. 컴퓨터에 특정 작업을 수행하도록 하는 프로그래밍언어와는 다르다. 대표적인 예로 HTML, XML, XHTML이 있다.

Computer Science 2021. 11. 10. 10:56

Markdow이란? 마크다운은 일반 텍스트 문서의 양식을 편집하는 문법이다. README파일이나 온라인 문서, 혹은 일반 텍스 트편집기로 문서 양식을 편집할 때 쓰인다. 마크다운을 이용해 작성된 문서는 쉽게 HTML등 다른 문서 형태로 변환이 가능하다. VSCODE의 Markdown Preview를 통해 공부해보았다. (유튜브채널 엘리의 드림코딩 '마크다운 6분 순삭 정리' 영상 참조) # Heading 1 ## Heading 2 ### Heading 3 #### Heading 4 ##### Heading 5 ###### Heading 6 Paragraph 언더스코어3개면 밑줄완성!! ___ checkin **hamberger** sweetpotato *potato* kimchi ~remon~ 결과 Li..

Computer Science 2021. 11. 5. 10:43

프로그래밍 언어란? 컴퓨터를 이용하여 특정 문제를 해결하기 위한 프로그램을 작성하기 위해 사용되는 언어. 일반적으로 저급언어(기계어, 어셈블리어)와 고급 언어(컴파일러 언어) 로 분류. 저급언어(Low Level Language) -기계어 1. 컴퓨터가 직접 이해할 수 있는 언어 2. 0과 1의 2진수 형태로 표현되며 수행시간이 빠름 3. CPU에 내장된 명령들을 직접 사용하는 것으로, 프로그램을 작성 및 이해하는데 어려운 편 4. 기종마다 기계어가 다르므로 언어의 호환성이 없음 -어셈블리어 1. 기계어와 1:1로 대응되는 기호로 이루어진 언어 2. 하드웨어 제어에 주로 사용되며 언어의 호환성이 없음 3. 컴퓨터가 직접 이해할 수 없으므로 기계어로 번역이 필요 고급언어(High Level Language..

Computer Science 2021. 11. 5. 01:18