[Tech Study] 10월 React Team

안녕하십니까 !

GDSC Sungshin React Team 팀장 김도은입니다.

 

GDSC Sungshin은 9월부터 12월까지 기술 스터디를 진행하고

매달 정기세션에서 스터디의 진행상황과 방향에 대해 이야기하는 시간을 가지는데요!

이번 포스팅은 10월 정기세션시간(10/24)에서의 리액트팀의 발표내용을 토대로 작성했습니다.

 

 

저희는 매주 수요일 6시부터 7시까지 한시간 동안 대면 스터디를 진행하고 있으며 인프런에서 소플의 "처음 만난 리액트" 개념 강의를 통해 공부하고 있습니다. 대면 스터디에서는 매주 정해진 분량의 강의를 듣고 나서 개발일지를 작성하여 제출하고 있으며 실습 도중 오류가 나거나 모르는 개념이 있을 경우 질의응답을 하며 진행 하고 있으며 강의를 잘 듣고 이해하였는지 확인을 위해 각자 퀴즈 1개 이상 만들어와 퀴즈풀이도 진행하고 있습니다.

 

 

 

우선, 간략하게 React가 무엇인지에 대해 설명드리겠습니다.

리액트는 2013년 페이스북(현재의 메타)이 공개한 JavaScript 기반 라이브러리입니다. 뛰어난 유연성과 호환성, 컴포넌트 재사용성, Virtual DOM을 이용한 랜더링 속도 등의 독보적인 장점으로 꾸준히 사랑받고 있습니다.

stackoverflow에서 2023년 진행한 설문조사(https://survey.stackoverflow.co/2023/#web-frameworks-and-technologies)에서 가장 많이 사용하는 웹프레임워크 및 기술 2위에 랭킹 된 대중적인 기술입니다.

 

stackoverflow 2023 developer survey

 

 

---

주차별 소개

 

 

1주차 study는 섹션 0과 1을 듣고 리액트를 시작하기에 앞서 알아야 할 개념들과 실습을 위한 환경 설정을 했습니다. 

 

 

2주차 study에서는 visual studio code와 리액트를 연동하는 법과 JSX 코드에 대한 개념과 사용법을 익혀 시계 만드는 것과 댓글 컴포넌트 만드는 실습을 진행하였습니다. 

 

 

위는 실습으로 진행한 시계와 댓글 컴포넌트를 만든 화면입니다.  

 

 

3주차 Study는 10월 11일 진행하였으며 state를 사용해 일정 알려주는 웹 만들기, 클릭 이벤트 처리, 로그인 여부를 알려주는 툴바 만들기, 출석부 만들기 실습을 공부하였습니다.

 

 

state, 이벤트 핸들러, map 등의 개념을 이용하여 실습을 진행했습니다.

 

 

4주차 study는 사용자 정보 입력 받는 화면과 섭씨온도와 화씨온도를 표시하는 실습을 진행하였습니다. 

 

 

Lifting State Up, props 등의 개념을 이용하여 실습을 진행하였습니다.

 

 

현재(11/11) 저희 리액트팀은 개념강의를 완강하고 리액트를 이용하여 open AI API를 연동하는 강의를 들으며 실습을 진행하고 있습니다.

솔루션 챌린지 이전에 저희 팀원끼리 프로젝트를 해보며 솔루션챌린지에 필요한 실전 기술을 습득 할 예정입니다.

 매주 모여서 함께 공부하면서, 혼자서는 어려웠을 개념 강의를 한 달 만에 완강하는 성과를 이뤄냈습니다. 또한, 서로 질문하며 오류를 해결하는 과정을 통해 리액트를 더 쉽고 재미있게 배울 수 있었습니다.

 

감사합니다 :)