책정리 41

모던 리액트 Deep Dive 2.1 - 2.2 :: JSX와 리액트 파이버

2.1 JSX란? JSX는 리액트가 등장하면서 페이스북에서 소개한 새로운 구문이지만, 반드시 리액트에서만 사용하라는 법은 없다. JSX는 XML과 같은 내장형 구문이며, 리액트에 종속적이지 않은 독자적인 문법이다. JSX는 반드시 트랜스파일러를 거쳐야 비로소 자바스크립트 런타임이 이해할 수 있는 의미있는 자바스크립트 코드로 변환된다. JSX의 설계목적 다양한 트랜스파일러에서 다양한 속성을 가진 트리 구조를 토큰화해 ECMAScript로 변환한다. 2.1.1 JSX의 정의 JSX를 구성하는 가장 기본 요소 JSXOpeningElement: JSXClosingElement: JSXSelfClosingElement: JSXFragment: JSXChildren(optional) JSX 식별자로 가능한 것 $,..

크리에이티브 프로그래머 7장) 창의적 마인드셋

7장 창의적 마인드셋 1. 올바른 창의적 분위기 만들기 아-하 모멘트는 사색과 휴식 중 의식적인 사고에 이어 무의식이 작동하는 순간이다. 즉, 매너리즘에 빠졌을 때 영감을 주는 휴식을 취하는 순간 창의적 마인드셋을 가지게 되면서 창의성을 발휘하게 된다. 우리의 잠재의식 속의 자아는 분별력 있고, 재치와 섬세함을 지니며, 선택하는 방법과 영감을 얻는 방법을 알고 있다. 일이 너무 고될 때에는 약간의 장난을 치는 것으로 다시 기력을 되찾고 아이디어의 흐름을 이어갈 수 있다. 2. 딥 워크의 흐름 시간이 순식간에 흘러가는 듯한 현상 플로(flow)는 깊은 즐거움, 창의성, 삶에 대한 전적인 참여를 유발한다. 명확한 목표를 염두에 둔다. 모든 활동에는 즉시 피드백이 뒤따른다. 도전과 기술 사이에 균형이 있다. ..

자바스크립트의 동등 비교 (==, ===, Object.is)

==와 ===의 차이 JavaScript에서 ==와 ===는 두 값의 동등성을 비교하는 데 사용되는 연산자입니다. 하지만 이 둘은 다른 방식으로 동작합니다. == (동등 연산자): ==는 값의 동등성을 비교합니다. 하지만 엄격한(strict) 동등성이 아니라 변환된 동등성을 비교합니다. 이것은 필요에 따라 다른 데이터 타입을 변환하여 비교를 수행합니다. 예를 들어, 0 == false는 true를 반환합니다. 이는 JavaScript가 숫자 0을 불리언 false로 변환하여 비교하기 때문입니다. === (일치 연산자): ===는 값의 엄격한(strict) 동등성을 비교합니다. 이것은 값뿐만 아니라 데이터 타입까지 고려하여 비교를 수행합니다. 예를 들어, 0 === false는 false를 반환합니다. 이..

크리에이티브 프로그래머 6장) 호기심

6장 호기심 1. 호기심은 창의력의 원동력 미하이 칙센트미하이가 창의적인 천재들을 인터뷰한 결과, 창의적인 성공을 위한 가장 중요한 두 가지 성격 특성은 호기심과 인내심이다. 호기심은 무언가를 만들려는 동기를 만든다. 그리고 인내심으로 작업을 마무리한다. 2. 커져 가는 호기심과 방랑벽 우리의 잠재력을 최대한 발휘하는 힘은 모두 마음에 달려 있다. 고정된 사고방식 vs 성장 사고방식 - 고정된 사고방식: 자신의 재능과 능력이 이미 정해져 있다는 믿음. 이러한 사고방식을 가진 사람들은 자신에게 부족한 자질을 가진 다른 사람을 부러워하거나, 반대의 경우에는 자질이 부족한 사람들에게 거만해지고 경멸한다. - 성장 사고방식: 자신의 재능과 능력이 시간이 지남에 따라서 배양하고 성장할 수 있다는 믿음. 코딩을 절..

크리에이티브 프로그래머 5장) 비판적 사고

5장 비판적 사고 1. 창의적인 비판적 사고 창의적 사고와 비판적 사고는 모두 창의적 노동의 결실을 거두기 위한 필수 조건이다. 창의적 사고는 독창적인 아이디어를 창출하고, 비판적 사고는 아이디어를 검증하거나 피드백을 요청하고 올바르게 해석하며 많은 인지적 편견을 극복하게 해준다. 2. 창의적인 프로세스 창의적인 프로세스는 총 5단계로 설명 가능하다. 참여: 창의적인 결과물을 위해 오랜 기간에 걸친 준비 작업 배양: 참여하기를 잠시 멈춘 채 거리를 두고 프로세스를 중단하는 기간. 무의식적으로 통찰의 속도를 높인다. 조명: 참여 중 번뜩이며 떠올리는 통찰력을 발견한 순간 검증: 그만한 가치가 있는 지 확인하고 그렇지 않다면 다시 시작한다. 발표/수용: 사회적으로 발표하고 수락되어야 진정으로 창의적이라고 할..

크리에이티브 프로그래머 4장) 제약 조건

4장 제약 조건 창의성을 발휘하는 데 있어서 제약은 가장 중요한 요소이다. 시간도 없어 비용도 너무 적어요. 자바 버전이 너무 낮아서 작업이 불편해요. 네트워크 연결이 너무 불안정해요. 초당 요청이 너무 많아서 이것을 잘 처리하기는 어려워요. 위와 같은 흔한 불평은 일종의 제약에 해당한다. 제약 조건이 나쁘다는 우리의 일반적인 생각과는 다르게 오히려 제약 조건으로 창의성이 향상할 수 있다. 제약의 종류 내재적 제약 조건 작업에 속해 있는 문제의 속성에 내제되어 있는 제약 조건 ㄴ 하드웨어 제약 조건: 하드웨어의 한계 때문에 16가지의 색상만으로 게임 아트를 구현한 ㄴ 소프트웨어 제약 조건: 소프트웨어를 작성하기 위해서 개발 생태계의 본질적인 범위 내에서 작업해야 한다. 키보드, 모니터 등을 사용하고 컴파..

크리에이티브 프로그래머 3장) 커뮤니케이션

3장 커뮤니케이션 피렌체 카메라타 카메라타란 16세기 말 피렌체에서 인문주의자, 음악가, 시인, 철학자들이 모여 예술, 음악에 대해 논의했던 자리이다. 여기에 모인 사람들은 고대 그리스 스타일의 예술 형식을 복원하고자 모였다. 바흐와 모차르트는 이 곳에서 영향을 받아 유명한 음악 작품을 작곡하는 등 예술과 미래에 대한 활발한 토론을 이어나갔다. 카메라타의 성공 요인 해결하고자 하는 문제를 서로 공유하고 있었다. 서로의 지식을 공유했다. 끊임없이 진화하고 상호 연결되는 시스템이었다. 비판적인 피드백을 주고받았다. 창의적 아이디어가 발현되는 환경 창의적인 사람들이 모였기 때문에 팀에서 아이디어가 나오게 되는 걸까? 아니면 창의적인 환경이 되었기 때문에 아이디어가 나오게 되는 걸까? 아마 둘 다 아닐까.. ㅎ..

크리에이티브 프로그래머 2장) 기술 지식

2장 기술 지식 1. 입력이 없으면 창의적인 결과물도 없다. 파이썬을 모르는 사람에게 창의적인 파이썬 코드를 기대할 수 있을까? 악기의 기존 스타일을 모르면서 창의적인 음반을 기대할 수 있을까? 그림을 모르는 사람에게 창의적인 그림 작품을 기대할 수 있을까? 안드레이 브레슬라프와 젯브레인 R&D 팀은 화이트보드 위에 스케치를 하면서, 다른 프로그래밍 언어의 기능들을 조사하면서 스케치 & 정보들을 가지고 코틀린이라는 새로운 프로그래밍 언어를 개발했다. 프로그래밍 언어의 기능들을 조사하지 않았다면, 문제 해결은 거의 불가능했을 것이다. 모든 창의적인 작업은 입력에서 시작된다. 그리고 창의성이 창의성을 낳는다. 2. 지식 수집하기 새로운 정보를 얻는 곳이 어디인가요? 정보를 얻을 때 글을 대충 훑어보나요 아니..

크리에이티브 프로그래머 1장) 프로그래머에게 창의성이란 무엇일까?

1장 창의성을 향한 여정 1. 창의성이란 정확히 무엇일까? 어떠한 데이터베이스를 사용할 지 결정이 필요할 때를 생각해보자. ⇒ 이 데이터는 정규화되기 어려운 데이터이므로 NoSQL 데이터베이스를 사용하자. 이 결정을 독창적인 아이디어라고 할 수 있을까? 창의적이라는 것은 어떻게 판단하는 것일까? 창의성은 사회적인 판단이다. 따라서 당신의 프로그래밍 노력이 창의적인 결과물로 이어졌는지는 다른 사람이 판단한다. 우리가 할 수 있는 것은 최선을 다할 뿐, 우리의 프로그래밍 노력이 창의적이라고 선언하는 것은 다른 사람의 판단을 받아들여야할 뿐입니다. 2. 왜 창의성일까? 창의성이 사회적인 판단이라면, 수동적으로 정해지는 것이라면, 왜 우리는 창의적인 개발자가 되기 위해 노력해야할까? 창의적인 개발자로 살아야 하..

이펙티브 타입스크립트 5장 - any 타입 다루기

5장 any 다루기 타입스크립트의 타입 시스템은 선택적이고 점진적이기 때문에 정적이면서도 동적인 특성을 동시에 가진다. 프로그램의 일부분에만 타입 시스템을 적용할 수 있다는 특성떄문에 자바스크립트 코드를 타입스크립트로 점진적인 마이그레이션이 가능하다. 이 때, any를 사용하여 일부분의 타입 체크를 비활성화시켜줄 수 있다. 하지만 any는 매우 강력하므로 남용하게 될 소지가 높다. 아이템 38 any 타입은 가능한 한 좁은 범위에서만 사용하기 1) 매개변수 내에서만 any 사용하기 x: any = returningFoo() // 1 processBar(x) x = returningFoo() // 2 processBar(x as any) 1보다는 2를 사용한다. any 타입이 매개변수에서만 사용되기 때문에..