말랑말랑 개발기

[회고] AI와 함께한 React 공식문서 스터디

참여 기간: 2024년 11월 ~ 2025년 5월 (6개월)스터디 주제: React 공식 문서 읽기참여 동기: 퓨처콘 행사에서 React 공식문서 발표를 듣고 체계적인 학습의 필요성을 느낌목표: React API 문서 독파진행 방식: 4인 그룹, 1인 1문서 발표, 회차당 2시간 (30분 발표 + 토론), AI 도구 적극 활용학습 범위: React API 참고서기록: 스터디 노션 페이지참여 계기'We are the future!' 프론트엔드 커뮤니티의 퓨처콘 행사에서 'React 공식문서'에 대한 발표를 듣고 공식문서 스터디에 관심을 갖게 되었습니다.React 개발자이면서 공식 문서를 체계적으로 정독해본 적이 없다는 사실이 부끄럽게 느껴졌고, 이번 기회에 제대로 학습해보고자 스터디에 참여하게 되었습니다...

참여 기간 : 2024년 9월 7일~12월7일 (3개월)스터디 주제 : '리액트 훅을 활용한 마이크로 상태 관리' 책을 매주 스터디스터디를 신청한 이유 : 책을 통해 리액트 훅과 상태 관리에 대해 공부하고 각자 프로젝트에서 어떻게 적용하고 있는지 고민을 나누기 위해 스터디를 진행했다. 스터디를 참여 시작할 때 세웠던 목표1. 책 완독2. 코드 레벨에서 이해하기진행 과정한 주에 1~2장을 읽고 내용을 정리한다.스터디날 발표자를 랜덤으로 선정하여 해당 회차 스터디를 진행한다. 지난 12월, 3개월간 진행된 자바카페 2024년 하반기 스터디가 마무리되었습니다. 마지막 발표회에서 제가 리더를 맡았던 '리액트 훅을 활용한 마이크로 상태 관리 (다이시 카토)' 스터디의 회고를 발표하게 되었습니다. 회고 발표스터디 ..

리액트에서 화면 캡쳐하기제가 받은 요구 사항은 아래와 같습니다. 1. 화면에 랜더링된 부분을 캡쳐하여 이미지로 저장2. 해당 화면에 접속하지 않아도 이미지 저장하는 기능 위 개발을 진행하면서 화면 캡쳐 시 발생할 수 있는 오류 상황과 해결방안을 알아보겠습니다. 1. html2canvas랜더링 된 화면을 캡쳐하고자 할 때 가장 간단하게 사용할 수 있습니다.import { saveAs } from 'file-saver';import html2canvas from 'html2canvas';const downloadImage = async () => { const modalElement = document.getElementById('your-element-id'); if (modalElement) ..