profile
하루하루 성장하려 노력하는 FE 개발자 입니다~

test

2022년 1월 30일
·
0개의 댓글
·
post-thumbnail

린 분석 Part 1 정리

린 분석\_성공을 예측하는 31가지 사례와 13가지 패턴이 책의 1부에서는 사업이 성공하려면, 왜 데이터가 필요한지 알아본다.정성적 데이터 vs 정량적 데이터허상 지표상관관계코호트시장세분화선행 지표지나친 데이터 주도적인 접근법의 위험성창업자들은 거짓말을 많이 함.제대로

2021년 11월 19일
·
0개의 댓글
·
post-thumbnail

[greedy] 조이스틱

문제 링크 : 프로그래머스 Level 2 조이스틱스스로 풀었는가 : X(생각한 풀이과정은 맞았으나 풀이과정을 코드로 옮기지 못함...)참고한 블로그 : https://codingspooning.tistory.com/58

2021년 8월 2일
·
0개의 댓글
·
post-thumbnail

16. 배열 컨트롤4 (배열 항목 수정)

앞선 예제에서 계정명을 누르면 글자색이 초록색 ⟷ 검은색 이렇게 토글하는 기능을 구현할 예정이 기능을 수행하려면 먼저, users 배열에 각 user 별로 active라는 boolean 속성을 부여해야 함.그리고 App.js에서 active 값을 반전 시켜줄 함수 on

2020년 7월 30일
·
0개의 댓글
·
post-thumbnail

15. 배열 컨트롤3 (배열 항목 삭제)

배열에 항목 삭제를 할 때는 기존의 항목을 유지시키면서(불변성을 지켜주면서) 추가를 해줘야 함.그래서 삭제할 경우에는 filter 함수를 사용하여 구현한다.filter 함수 는 배열에서 특정 조건을 만족하는 값들만 따로 추출하여 새로운 배열을 만드는 함수 이므로,어떤

2020년 7월 30일
·
0개의 댓글
·
post-thumbnail

14. 배열 컨트롤2 (배열 항목 추가)

배열에 항목 추가를 할 때는 기존의 항목을 유지시키면서(불변성을 지켜주면서) 추가를 해줘야 함.그래서 push, splice, sort등의 함수를 사용하면 안된다.불변성을 지키며 배열에 새 항목을 추가하는 방법에는 spread 연사자를 이용하는 법, concat 함수

2020년 7월 30일
·
0개의 댓글
·
post-thumbnail

13. <Hook : useRef> useRef로 컴포넌트 안의 변수 만들기

이번에는 이전 시간에 배운 useRef를 활용해 컴포넌트 안에 변수를 만드는 법에 대해 설명만약 컴포넌트 안에서 let 키워드를 사용하여 변수를 선언하면, 해당 컴포넌트가 생성될 때마다 해당 변수는 해당 값으로 계속 선언됨. (다음에 리렌더링되어도 값이 초기화 됨)

2020년 7월 30일
·
0개의 댓글
·
post-thumbnail

12. 배열 컨트롤1 (배열 렌더링)

어떠한 정보가 객체 형태로 담겨져 있는 배열을 화면에 뿌려줘야할 땐 어캐 해야할까..?이러한 정보가 있다고 할때, 우선 제일 무식하고, 비효율적으로 작성해 보겠다.이렇게 작성을 하면, 각 user를 출력하는 부분이 반복된다.이 반복되는 부분을 수정하기 위해 새로운 Us

2020년 7월 30일
·
0개의 댓글
·
post-thumbnail

11. <Hook : useRef> useRef로 특정 DOM 선택하기

HTML과 JS를 사용할때, DOM에 접근하거나 선택할 일이 있으면, getElementById나 querySelector 등의 DOM selector 함수를 사용함.React를 사용하는 경우에서도 특정 DOM에 접근할 일이 있다. 특정 엘리먼트의 크기/위치를 알아

2020년 7월 30일
·
0개의 댓글
·
post-thumbnail

10. <Hook: setState> React에서 여러개의 input 상태 관리하기

저번 예시와 다르게 이번엔 인풋을 여러개 관리해야 하는 상황이다!이때 처음 드는 생각은 \*\*useSate 함수\*\*와 onChange 함수를 여러번 정의하고 쓰면 되는거 아닌가 하는 생각인데 그것은 가장 최선의 방법은 아니다!가장 좋은 방법은 input에 name

2020년 7월 30일
·
0개의 댓글
·
post-thumbnail

09. <Hook: useState> Rect에서 input 상태 관리하기

이번에는 숫자 값이 아닌 input을 통해 입력받은 문자열의 상태를 관리.input 태그에 문자열을 입력하면, 바로 아래 실시간으로 입력한 문자열이 표시되고, 초기화 버튼을 누르면 입력한 문자열이 삭제되는 예제.이번엔, 문자열을 관리하니 useState 함수를 이렇게

2020년 7월 30일
·
0개의 댓글
·
post-thumbnail

08. <Hook : useState> useState를 통한 동적 상태 관리

React 16.8 버젼에 새로 도입된 Hook이라는 개념을 통해 함수형 컴포넌트에서도 상태관리...등의 기능이 가능해졌다...!useState 는 Hook 중 하나로 이 함수를 사용하면 함수형 컴포넌트에서도 상태(state) 관리를 할 수 있다.우선 맨 위에서 와 같

2020년 7월 30일
·
0개의 댓글
·
post-thumbnail

07. 조건부 렌더링

조건부 렌더링이란, 특정 조건이 참인지 거짓인지에 따라 다른 것을 보여주는 것\-> true or false 일때, 다른 결과값을 보여줌 ∴ 내용이 달라져야 할 때 사용함!!\+ JSX에서 null, false, undefined를 출력하면 아무것도 안나옴! but

2020년 7월 27일
·
0개의 댓글
·
post-thumbnail

06. props

props는 properties의 준말컴포넌트를 사용할때 특정 값을 전달해주고 싶을때 사용함!전달한 props는 객체 형태로 리턴함값을 전달할 때는,이렇게 사용하면 되고,값을 전달받은 해당 컴포넌트에서는 \+ props를 입력받을 때, 비구조화 할당 사용해서 편하게 쓸

2020년 7월 23일
·
0개의 댓글
·
post-thumbnail

05. JSX rules

JSX는 리액트에서 컴포넌트의 생김새?를 정의할 때 사용하는 문법우리가 JSX로 작성한 코드는 Babel이라는 도구를 통해 JS 코드로 바뀐다!!Babel 이란...?Babel을 통해 React 안의 createElement라는 함수를 통하여 컴포넌트를 만들는 것! 매

2020년 7월 23일
·
0개의 댓글
·
post-thumbnail

04. React Component

리액트 컴포넌트를 만들때는 상단에 import React from 'react'; //리액트를 불러와 사용하겠다컴포넌트는 함수형, 클래스형 두가지컴포넌트 이름은 대문자로 시작 그리고 중간중간 문장 끝날때마다 세미콜론은 취향~그리고 맨 마지막엔 export defaul

2020년 7월 23일
·
0개의 댓글
·
post-thumbnail

프로토타입과 클래스 (class)

es6에서 class 라는 문법이 도입이 됨!class 문법을 이용하여 객체 생성자를 통해 만든 Animal과 비슷하게 만든다고 하면이렇게 할 수 있고이렇게 정상적으로 실행됨을 알 수 있다.그리고 위에서 say라는 함수를 class 내부에 구현을 했는데, 이 say 함

2020년 7월 20일
·
0개의 댓글
·
post-thumbnail

프로토타입과 클래스 (객체 생성자의 상속)

객체 생성자 를 상속 받을 수 있다.위와 같은 상황에서 Animal 객체 생성자를 상속받아 Dog와 Cat이라는 객체 생성자를 만든다고 하면이렇게 하면 된다.

2020년 7월 20일
·
0개의 댓글
·
post-thumbnail

프로토타입과 클래스 (객체 생성자, prototype)

함수를 통해 새로운 객체를 만들고, 그 안에 넣고 싶은 값 또는 함수를 구현할 수 있게 해줌! Animal이라는 객체 생성자 를 만들어 보면여기서 포인트!! 객체 생성자 를 만들때는 함수 이름을 대문자 로 시작한다. 객체 생성자 를 사용할때는 new 라는

2020년 7월 20일
·
0개의 댓글
·
post-thumbnail

배열 내장함수 (reduce)

reduce 함수는 배열이 주어졌을때, 배열의 원소를 모두 사용하여 어떠한 연산을 해야할 때 사용.예를 들어 배열의 모든 원소의 합을 구할때,이렇게 구하는 대신 reduce 함수를 사용하면,reduce 함수의 매개변수로 어떠한 연산을 할지 기술해주는 callback f

2020년 7월 14일
·
0개의 댓글
·