[TIL] React - Redux

액션(Action): 상태를 어떻게 변경시킬지 추상화한 표현힙니다. 단순 객체(Plain object)로 type프로퍼티를 꼭 가지고 있어야 합니다.리듀서(Reducer): 애플리케이션의 다음 상태를 반환하는 함수입니다. 이전 상태와 액션을 받아 처리하고 다음 상태를

2020년 10월 11일
·
0개의 댓글

[TIL] spread와 rest 문법

spread라는 단어는 퍼뜨리다, 펼치다 라는 의미입니다. 객체 혹은 배열을 펼칠 수 있습니다.위 코드의 핵심은 기존의 것을 던들이지 않고, 새로운 객체를 만든다는 것 입니다. 이러한 상황에서 사용 할 수 있는 문법이 spread입니다.spread 연산자는 배열에서도

2020년 10월 11일
·
0개의 댓글

[TIL] useRef로 DOM 선택하기

GET: 데이터 조회POST: 데이터 등록PUT: 데이터 수정DELETE: 데이터 제거

2020년 10월 10일
·
0개의 댓글

[TIL] React Hooks- Using the Effect Hook

데이터 가져오기, 구독(subscription) 설정하기, 수동으로 리액트 컴포넌트의 DOM을 수정하는 것까지 이 모든 것이 side effects입니다. 리액트의 class 생명주기 메서드에 친숙하다면, useEffect Hook을 componentDidMount와

2020년 10월 4일
·
0개의 댓글

[TIL] React Hooks - React Hooks / State Hook 사용하기

Hook을 이용해서 Class 작성할 필요 없이 상태 값과 여러 React의 기능을 사용할 수 있습니다.Ryan Florence가 Hook를 사용하여 어텍스트떻게 애플리케이션을 리팩토링 할 것인지 보여주었습니다. !youtubedpw9EHDh2bM함수형 컴포넌트에서는

2020년 9월 30일
·
0개의 댓글

wecode 1차 프로젝트를 마치며

clone 프로젝트로 Logitech 미국 사이트를 선정 했습니다."https://www.logitech.com/en-us"Trello 와 같은 tool을 활용하여 프로젝트를 진행 했습니다.Standup Meeting을 매일 아침 미팅을 통해 진행 사항과 오늘

2020년 9월 27일
·
1개의 댓글

[TIL] React 입문 (with fetch ) - 2

첫 번째 then의 res가 어떤 값이 들어올 때 리턴하는가? console.log를 찍어봅니다.fetch() .then() .then()형태만 있었지만 백앤드에서 응당 body를 안 주는 경우도 많습니다.응답 body로 JSON 데이터를 주지 않는데 프론트에서 Rea

2020년 9월 20일
·
0개의 댓글

[TIL] React 입문 (with fetch ) - 1

백앤드로부터 데이터를 받아오려면 api를 호출하고 데이터를 응답받습니다.이 때 자바스크립트 Web API fetch 함수를 사용합니다.fetch() 화살표 함수 선언식 fetch() 함수 선언식 fetch() 함수에서 default method는 get입니다.

2020년 9월 20일
·
0개의 댓글

[TIL] HTML/CSS 입문 (with flex-grid)

flex는 두 가지 요소로 이루워져 있습니다.flex container은 flex itex을 포함한 부모 역할을 합니다.박사가 늘어나는 방향(flex-direction)과 박스가 다음 줄로 넘어가는 방식 (flex-wrap)을 정합니다. flex 아이템을 정렬(alig

2020년 9월 19일
·
0개의 댓글

[TIL] React 입문 (with Stack & Queue)

LIFO (Last in First Out)마지막으로 들어온 데이터가 가장 먼저 나갑니다.아이스크림의 콘 위에 쌓이는 것도 스택책들을 쌓아두는 것도 스택FIFO (First In First Out)처음으로 들어온 데이터가 가장 먼저 나갑니다.마트에서 장을 볼 때, 버스

2020년 9월 12일
·
0개의 댓글

Westagram 프로젝트를 마치며

웹 개발자가 되기 위해 위코드를 들어온지 벌써 4주차가 끝났습니다.HTML부터 React까지 필요한 모든 기초적인 개념을 배웠고, Westagram을 마쳤습니다.1주차 웹 서비스의 역사와 발전Linux & Termainal프론트엔드 개발자가 하는 일개발자 도구Repli

2020년 9월 12일
·
0개의 댓글

[TIL] React 입문 (with . Mock Data 활용)

UI를 구현하다 보면 API가 나오기 전에 페이지가 먼저 나오는 경우가 많습니다. 그럴 때를 대비해서 mock data를 활용합니다. mock data로 우리가 만든 화면에서 데이터를 어떻게 나타나는지 테스트를 하며 개발을 진행 할 수 있습니다.mock이란 거짓된, 가

2020년 9월 9일
·
0개의 댓글

[TIL] React 입문 (with . Props & Event)

Props는 속성을 나타내며 한 구성 요소에서 다른 요소로 데이터를 전달하는데 사용 (Props : Properties)Props가 있는 데이터가 단방향 흐름으로 전달 된다는 것 입니다.(부모에서 자녀로의 편도)Props를 통해 부모 컴포넌트부터 자식 컴포넌트에게 st

2020년 9월 5일
·
0개의 댓글
post-thumbnail

[TIL] React 입문 (with . State & Event)

변경될 수 있는 데이터를 처리할 때 효율적으로 사용될 수 있습니다.state는 컴포넌트안에서 관리state는 화면에 보여줄 컴포넌트의 정보(상태)를 지니고 있는 객체닙니다.state는 컴포넌트 내에서 정의하고 사용하며 얼마든지 데이터(객체)가 변경될 수 있습니다.클래스

2020년 9월 5일
·
0개의 댓글
post-thumbnail

[TIL] React 입문 (with . C.R.A / components / JSX)

모든 사이트에 들어가면 보여지는 것이 UI(User Interface),사용자 편의성을 고려하는 UX(User Experience)가 포함되어 있습니다.애플리케이션의 규모가 커지고 다양한 UI / UX를 구현하기 위해서는 DOM / jQuery로는 코드를 유지보수 하는

2020년 9월 2일
·
0개의 댓글

Semantic web / Semantic tag

시맨틱 웹(Semantic Web)은 "의미론적인 웹"이라는 뜻으로, 기계가 이해할 수 있는 형태로 제작된 웹을 의미합니다. (물론 사람도 이해할 수 있습니다.)Wiki 백과사용자들이 생산하는 정보둘이 너무 많아졌고 유익한 정보도 말고 불피요한 정보들이 넘쳐나기 시작

2020년 8월 20일
·
0개의 댓글

[CSS] float 속성

float을 그대로 번역하면 '뛰우다'라는 뜻입니다. css에서 정렬하기 위해 사용됩니다.예를 들어, 문서와 사진이 있을 때 사진의 위치를 좌측 또는 우측으로 정렬을 할 수 있습니다.절대 위치 요소는 float 속성을 무시합니다.none - 뛰우지 않음left - 왼쪽

2020년 8월 20일
·
0개의 댓글

[CSS] display 속성 - inline, block, inline-block

display 속성이 inline으로 지정된 요소는 줄바꿈 없이 한 줄에 나란히 배치됩니다. inline 속성으로 span, a, br, button, img, input, label, span, textarea이 있습니다.그리고 text-align으로 텍스트의 중앙,

2020년 8월 20일
·
0개의 댓글

[CSS] position 속성 - relative, absolute, fixed, static

position속성은 문서상에 객체를 위치하기 위한 속성입니다.아래와 같이 다양한 값이 있습니다.relativeabsolutefixedstaticstatic은 기본 값이며 relative absolute fixed으로 바꿀 수 있습니다.상대 위치 지정 요소에 해당 되는

2020년 8월 19일
·
0개의 댓글