[2022 동계 모각코] 1회차 회고록

1회차(2023.01.05 19:00 ~ 22:00)

오늘의 목표
1. 프로그래머스 - React 강의 듣기
2. Spring 개요, 강의, 책 찾기

---

1. 프로그래머스 - React 강의 듣기

React 소개

리액트는 페이스북에서 만들어졌고, 2013년 5월에 처음 오픈 소스로 공개되었다.

간단한 사용방법과 페이스북이라는 든든한 뒷백, 큰 커뮤니티로 인해 많은 인기를 끌었다.

한글 문서도 제공하고 있기에 기반 지식이 탄탄하다면 공식 홈페이지를 통해 바로 공부가 가능하다.

=> 안정적인 기술 스택

 

특징

1. Reactive Programming : 반응과 관련된 프로그래밍

반응형 프로그래밍은 상태가 변하는 경우 의존된 다른 곳도 연쇄적으로 새롭게 연산하게 된다.

반응형 프로그래밍의 가장 쉬운 예시 : 스프레드시트

React는 상태를 관찰하고 변화가 발생할 경우 연관된 곳에서 연산이 수행된다.

 

2. MVC(Model - View - Controller)

리액트는 View만을 관리하는 라이브러리

컴포넌트 - 재사용이 가능한 독립적인 객체, 런타임 시점에 사용된다.

 

컴포넌트는 트리 구조로 구성할 수 있다.

조합이 가능하다는 특징

React는 컴포넌트의 조합으로 View를 구성한다.

 

3. Virtual DOM

필요한 부분만 한 번에 렌더링한다는 점

성능보다는 개발을 편하게 할 수 있도록 도입했다.

 

React는 Library이다.

많은 오픈소스는 훌륭한 개발자 경험을 위해 나왔다.

React를 구성하는 기능들은 최소한의 노력으로 최대의 효율을 내기 위함이다.

 

create-react-app, JSX

npx, npm, yarn을 이용하는 방법

 

App : root component

html처럼 보이는 것은 사실 가상 DOM을 정의한 것이다. (JSX)

HTML과 다른 점 : className

class가 이미 JS 내에서 예약어이기 때문

반드시 최상위 요소가 하나여야 함 or React Fragment 사용

 

<></>

<React.Fragment></React.Fragment>

 

컴포넌트 = 함수

컴포넌트는 상태와 이벤트를 가질 수 있다.

트리 형태로 이루어져있으며, 데이터는 위에서 아래로만 흐른다.(단방향)

만들 수 있는 최선으로 컴포넌트를 만들고 자주 리팩토링하자

 

어떻게 재사용이 가능한 컴포넌트를 만들까?

- UI를 추상적으로 바라보기

- 점차 규칙을 정하는 것

ex) 도메인으로 분류하기, 역할로 분류하기, 크기로 분류하기

 

JSX의 분기와 반복

표현식인 삼항연산자와 map, filter 등을 사용한다.

 

2. Spring 개요, 강의, 책 찾기

1. 인프런 - 스프링 입문

https://www.inflearn.com/course/%EC%8A%A4%ED%94%84%EB%A7%81-%EC%9E%85%EB%AC%B8-%EC%8A%A4%ED%94%84%EB%A7%81%EB%B6%80%ED%8A%B8

[무료] 스프링 입문 - 코드로 배우는 스프링 부트, 웹 MVC, DB 접근 기술 - 인프런 | 강의

2. 예제로 배우는 스프링 입문

https://www.inflearn.com/course/spring_revised_edition#curriculum

[무료] 예제로 배우는 스프링 입문 (개정판) - 인프런 | 강의

 

타입스크립트 코리아 : 기초 세미나

https://www.inflearn.com/course/%ED%83%80%EC%9E%85%EC%8A%A4%ED%81%AC%EB%A6%BD%ED%8A%B8-%EC%BD%94%EB%A6%AC%EC%95%84-1705-%EA%B8%B0%EC%B4%88-%EC%84%B8%EB%AF%B8%EB%82%98

[무료] 타입스크립트 코리아 : 기초 세미나 - 인프런 | 강의

타입스크립트 코리아 : React with TypeScript 세미나

https://www.inflearn.com/course/react-with-typescript

[무료] 타입스크립트 코리아 : React with TypeScript 세미나 - 인프런 | 강의

---

도서관에서 다같이 공부를 했다.

원래는 TypeScript를 모각코 시간동안 공부하려고 했으나 학습중인 React에 API를 구현하여 연결해보는 것이 더 시급할 것 같아 계획을 변경했다.