Don’t worry about failures

리스트와 Key 리액트에서 엘리먼트를 배열로 만들어 렌더링을 할 수 있습니다. 여기서 map()을 통해 렌더링을 돕는다. 예제는 위와 같다. 여기서 컴포넌트, 즉 함수로 따로 빼서 할 수도 있지만 인라인으로써 다음과 같이 map을 사용할 수 있다. 리액트에서 반복문을 통해 렌더링 하는 방법이다. 여기서 주의해야할 점은 바로 key이다. key 값을 제공하지 않으면 콘솔에서 경고를 뿜어낸다. key를 통해 항복을 변경, 추가, 삭제 등의 작업을 하기 위한 식별자로 사용되기 때문이다. 동일한 엘리먼트가 반복되는 만큼 이를 식별하는 것은 렌더링에 있어 필수로 잡는 것이다. key 값으로 할당하는 값은 보통 id 값으로 할당을 하지만, 어쩔 수 없는 경우 index 값으로 할당하게 된다. index로 할당할 경..

이벤트 처리하기 1. camelCase 형태의 이벤트 ex ) onClick 2. JSX를 사용하여 문자열이 아닌 함수로 이벤트 헨들러 전달 ex ) onClick={activateLasers} 3. return false를 통한 기본동작 방지X => e.preventDefault를 명시적으로 호출 필요 4. react에서 전달된 e는 합성 이벤트 => react는 W3C 명세에 따라 합성 이벤트를 정의, 브라우저 호환 걱정 X 5. onClick을 통해 전달된 이벤트에서 this는 바인딩X => 호출 시 onClick={this.handleClick} 형태로 호출해야한다. 6. 인자 전달하기 6-1 onClick={(e) => this.deleteRow(id, e)} 6-2 onClick={this.d..

비전공자, 국비 학원 출신의 타이틀 기초 없이, 기본 개념 없이 무턱대고 프로그래밍을 배워보고 싶다고 전진했다. 하다보니 재미있고, 배워야할 것도 많아 기초를 놓치고 있다고 생각한다. 처음에는 기초가 왜 중요한지, 굳이 필요한지에 대해 생각했며, 난 다른 언어, 프레임워크를 더 배워야지, cs는 나중에 천천히 해야지. 라는 생각을 가지게 되었다. 하지만, 글을 읽거나, 어떠한 이슈가 발생했을 때 그 문제에 대한 접근 그리고 이해에서 차이가 벌어진다고 생각이 들었다. 문제를 이해 하고 파악하고 해결해 나아가야 하지만, 기초가 없으면 왜 그런지에 대해 파악이 안돼, 근본적인 원인을 해결하지 못하는 생각이 들었다. 그래서 별도로 조금씩 정리하고 반복하려한다.

평소 알고 싶었던 내용 혹은 모르는 내용 등 많은 개발적 지식을 글을 통해 계속해서 접해왔다. 이렇게 하다보니, 블로그에 잘못된 내용을 접하는 경우도 생길때도 있고, 정해진 커리큘럼 없이 주먹구구식으로 막찾아 보게된다. 이렇게 하는 것이 나쁘다는 것은 아니다. 많은 이들이 검색을 통해 많이 배우고 한다. 하지만, 이번에는 조금 더 기초에 맞춰 정해진 커리큘럼에 맞춰서 공부를 해보고자 강의를 신청하였다. 이전에도 '엘리' 유료 강의를 신청해서 학습을 했던 경험이 있다. 좋은 내용과 배울 점이 많아서 좋았지만, 그때는 단순히 눈으로만 보고 끝냈다. 이렇게 하다보니 들을 때는 이해 갔지만, 그 이후에 다시 생각해보면 잊어버리게 된다. 이 때문에 이번에는 강의를 들으면, 강의에 대한 학습한 내용 및 느낌점을 블..