[React] 3: 속성과 JSX, 상태 다루기, 카운터 설정, 데이터 불러오기

React에 대한 개인학습을 기록합니다. 체크리스트 ☑ TITLE ✔ 연습용 레포 생성 ✔ 리액트 개요 확인 ✔ JSX다루기 ✔ 리액트 컴포넌트 ✔ 리액트 스타일링 ✔ 컴포넌트 복잡하게 다루기 ✔ 속성 전달 ✔ JSX 복잡하게 다루기 ✔ 상태 다루기, 카운터 설정 ✔ 데이터를 UI로 불러오기 이벤트 다루기 컴포넌트 생명주기 (생명주기 메소드) DOM 엘리먼트 접근하기 라우터를 통한 싱글 페이지 앱 구축 Todo list 앱 제작 리액트 개발 환경 구성 6. 속성다루기 6.1. 나쁜, 짜증나는 방법 하나 목적지로 향하는 경로에 있는 모든 컴포넌트들기 각 속성에 접근하고 재정의 해 전달하는 것. 6.2. 해결책: 스프레드 연산자 var items = ["1", "2", "3"]; // 배열 선언 및 초기화 ..

• format_list_bulleted ✏️ 개발 공부/ETC
• · 2022. 1. 6.
• textsms

[React] 2: 컴포넌트 스타일링, 컴포넌트를 보다 복잡하게 다루어보기

React에 대한 개인학습을 기록합니다. 체크리스트 ☑ TITLE ✔ 연습용 레포 생성 ✔ 리액트 개요 확인 ✔ JSX다루기 ✔ 리액트 컴포넌트 ✔ 리액트 스타일링 ✔ 컴포넌트 복잡하게 다루기 속성 전달 JSX 복잡하게 다루기 상태 다루기, 카운터 설정 데이터를 UI로 불러오기 이벤트 다루기 컴포넌트 생명주기 (생명주기 메소드) DOM 엘리먼트 접근하기 라우터를 통한 싱글 페이지 앱 구축 Todo list 앱 제작 리액트 개발 환경 구성 4. Rreact 스타일링 4.1. 개요 4.1.1. CSS(cascading Style Sheets)에 대하여 콘텐츠와 프레젠테이션 사이를 잘 분리할 수 있음 셀렉터(selector)문법을 통해 스타일 적용과 건너뛸 엘리먼트를 유연하게 선택하도록함 4.1.2. 리액트가..

• format_list_bulleted ✏️ 개발 공부/ETC
• · 2022. 1. 5.
• textsms

[React] 1: JSX, 리액트 컴포넌트

React에 대한 개인학습을 기록합니다. 체크리스트 ☑ TITLE ✔ 연습용 레포 생성 ✔ 리액트 개요 확인 ✔ JSX다루기 ✔ 리액트 컴포넌트 리액트 스타일링 컴포넌트 복잡하게 다루기 속성 전달 JSX 복잡하게 다루기 상태 다루기, 카운터 설정 데이터를 UI로 불러오기 이벤트 다루기 컴포넌트 생명주기 (생명주기 메소드) DOM 엘리먼트 접근하기 라우터를 통한 싱글 페이지 앱 구축 Todo list 앱 제작 리액트 개발 환경 구성 1. 리액트 개요 1.1. React 등장 이전, UI 제작 경향 1.1.1. 기존의 멀티 페이지 앱- 여러 개의 개별 페이지로 구성됨 앱의 상태관리에 매우 좋음 쿠키를 통한 사용자 데이터 저장과 서버 측 매커니즘(그것도 약간)을 제외하면 신경 쓸 게 없음 1.1.2. 최근 싱..

• format_list_bulleted ✏️ 개발 공부/ETC
• · 2022. 1. 5.
• textsms

[React] 0: React 벽돌깨기 리스트

React에 대한 개인학습을 기록합니다. INTRO 내 블로그의 포스팅 양식을 한 번 뒤엎을 예정이다. 타이틀과 컨텐츠 둘 다 규격이 제멋대로이니 보기 좋지 않다. 템플릿도 나랑 안 맞는 것 같아서 티스토리보다 Velog나 Wordpress로 옮길까 싶기도 하지만 이에 대해선 설날 전에 결정할 것 같다. 이번에 빠르게 돌려 볼 컨텐츠는 React인데 하게 된 이유는 해야해서다. 해야 되는 걸 어케. 차례를 정하고 독파할 거다. 체크리스트 ☑ TITLE ✔ 연습용 레포 생성 리액트 개요 확인 JSX다루기 리액트 컴포넌트 리액트 스타일링 컴포넌트 복잡하게 다루기 속성 전달 JSX 복잡하게 다루기 상태 다루기, 카운터 설정 데이터를 UI로 불러오기 이벤트 다루기 컴포넌트 생명주기 (생명주기 메소드) DOM 엘..

• format_list_bulleted ✏️ 개발 공부/ETC
• · 2022. 1. 4.
• textsms

[ETRI] 연구연수생 1일차 : 인사하기, 점심먹기, 오리엔테이션

2021 동계 ETRI 연구 연수생 생활을 기록합니다. (보안상 진행되는 연구실 내 프로젝트 내용은 생략합니다. ) 열받는다. 1월 4일이 되는 이 새벽에 굳이 새로 산 다이어리를 두고 블로깅을 하는 이유는 IPtime 공유기를 쓰는데 화나서다. 그래서 출근 첫날에 대해 시간 역순마냥 이 새벽에 겪은 일부터 쓴다. 여긴 공유기관련으로 킹받는 것도 킹받는데 공유기뿐만 아니라 전체적으로 전류가 약한 지 자기멋대로 냉장고나 인덕션 전원을 꺼버린다. 전류가 잘 나올만한 곳으로 코드 위치를 커스텀하려 해도 못하게 되어있다. 잘 안 알아 본 탓이라치자, 그런데 분명 WIFI 잘 터진다고 자랑하는 곳을 원룸집으로 잡았는데 왜 공유기가 끊길까싶어 서치하니 펌웨어 업데이트 문제일 수도 있다고 한다. 그래서 자동업데이트를..

• format_list_bulleted ✏️ 개발자 공부/ETRI 인턴
• · 2022. 1. 4.
• textsms

[3] StringBoot, 롬복 플러그인 적용하기

도서, 스프링 부트와 AWS로 혼자 구협하는 웹 서비스(2019)를 토대로 공부한 내용입니다. 1. 롬복 : 자바 개발시 자주 사용하는 코드 Getter, Setter, 기본생성자, toString등을 어노테이션으로 자동 생성해줌 1.1. 의존성 코드 작성 build.grade > 의존성에 다음 코드 작성 implementation('org.projectlombok:lombok') annotationProcessor('org.projectlombok:lombok') testImplementation('org.projectlombok:lombok') testAnnotationProcessor('org.projectlombok:lombok') 1.2. 롬복 플러그인 2021기준 최신판에서는 lombok이 이..

• format_list_bulleted ✏️ 개발 공부/SpringBoot
• · 2022. 1. 3.
• textsms