본문 바로가기

전체 글143

2023-11-23 본 캠프 36일차 / 55일차 TIL 2023-11-23 본 캠프 36일차 / 55일차 TIL 주요 진행사항 - 팀프로젝트 진행 이번 프로젝트에서는 google firebase authentication을 이용하여 일반 로그인/회원가입, 소셜로그인 기능을 구현하는 필수요건이 있다. 따라서 firebase authentication 세팅에 대하여 알아보겠다. google firebase Authentication 세팅 1. firebase 프로젝트 생성 2. authentication 활성화 3. sign in method에 원하는 OAuth 플랫폼 활성화 4. 도메인 추가 이때 로컬 도메인인 localhost는 미리 등록되어있다. * 만약 아이디 정보(이메일정보)가 겹치는 플랫폼들을 활성화 시키려면 사용자 계정연결에 ID 공급업체별로 여러 .. 2023. 11. 27.
2023-11-22 본 캠프 35일차 / 54일차 TIL 2023-11-22 본 캠프 35일차 / 54일차 TIL 주요 진행사항 - 팀프로젝트 진행 React에서 모달을 만들 때 방법을 찾아보다가, createPortal을 통한 모달 구현을 알게되었고 3개의 모달을 사용하는 이번 프로젝트에서 적용시키면 좋을 것 같아 내용을 정리하였다. React createPortal? React에서 모달이나 팝업 창과 같은 요소를 현재 컴포넌트 트리에서 벗어나 다른 DOM 요소에 랜더링할 때 사용하는 메서이며, 주로 모달이나 툴팁과 같은 UI 요소를 전역적으로 표시하거나, 다른 부분에 랜더링할 때 사용하는 방법이다. React createPortal으로 모달을 만드는 이유 일반적으로 모든 컴포넌트가 최초 root 내부에 트리에서 랜더링이 된다. createPortal을 이용.. 2023. 11. 27.
2023-11-27 본 캠프 38일차 / 57일차 TIL 2023-11-27 본 캠프 38일차 / 57일차 TIL 프로젝트 정보 프로젝트 주제 : 다양한 게임 정보를 공유하는 뉴스피드 배포 사이트 : https://www.compile-games.site/ 프로젝트 깃 레파지토리 : https://github.com/andrewpark231010/NewsFeed 발표 노션 자료 : https://www.notion.so/8b9d669005e64dbcaf015074298f9689 Keep - 현재 만족하고 있는 부분 칭찬을 아끼지 않고 예쁜말 쓰기 프로젝트 시작할 때 와이어프레임을 자세히 짠 것 꾸준한 소통 Problem - 불편하게 느끼는 부분 코드 가독성을 위한 주석사용의 부족함 함수나 변수, 파일 이름에 대한 통일성 부족 깃 사용 및 숙지 부족 Try - .. 2023. 11. 27.
2023-11-21 본 캠프 34일차 / 53일차 TIL 2023-11-21 본 캠프 34일차 / 53일차 TIL 주요 진행사항 - 팀프로젝트 발제 (뉴스피드 프로젝트) 팀프로젝트 시작 주제 : 뉴스피드 프로젝트 기간 : 11/21~27 (7일) 요구사항 (필수) - 로그인, 회원가입 - CRUD - 마이페이지 - 배포 본격적인 진행에 앞서 팀 회의를 통해 프로젝트의 방향성을 결정하였다. 주제 : 게임 정보 뉴스피드 구현 계획 : 페이지 메인 페이지 (검색, 페이지네이션 or 스크롤) (로그인에 따라서 글쓰기 활성화) Route path='/' 검색 페이지네이션 (스크롤) 로그아웃버튼 글쓰기 버튼 토픽에 따른 글 정렬 (최신순) 마이 페이지 Route path =’/mypage’ 프로필 수정기능 내 글 모아보기 내 댓글 보기 블로그 글 작성 페이지 (로그인 상.. 2023. 11. 22.
2023-11-20 본 캠프 33일차 / 52일차 TIL 2023-11-20 본 캠프 33일차 / 52일차 TIL 주요 진행사항 - 알고리즘 문제풀이 - 리액트 강의 수강 리액트 강의 수강 내용 정리 1. useEffect useEffect는 서버와 통신하는 것과 같이 Side Effect를 처리할 때 사용한다. useEffect를 사용하는 방법은 크게 3가지로 나뉜다. - 의존성 배열이 없는 경우 해당 컴포넌트가 re-Rendering 될 때 마다 useEffect가 실행된다. 따라서 비효율적이라고 할 수 있다. - 의존성 배열이 있지만 내용이 비어있을 경우 의존성 배열이 빈 경우에는 컴포넌트가 마운트 될 때 한번만 실행되고 이후 랜더링 때 실행되지 않는다. - 의존성 배열이 있는 경우 의존성 배열 내부의 요소가 업데이트 될 때마다 useEffect가 실행된.. 2023. 11. 21.
2023-11-19 본 캠프 32일차 / 51일차 TIL 2023-11-19 본 캠프 32일차 / 51일차 TIL 주요 진행사항 - 알고리즘 문제풀이 - 개인 프로젝트 진행 (TIL 페이지) TIL 페이지 제작 ( Redux 사용) DEMO : https://react-today-til.vercel.app/ React App react-today-til.vercel.app 1. 컴포넌트 구조 더보기 App.js Router.js HeaderLayout Home WriteModal WriteModalForm WriteModalDateInput DateInput WriteModalTitleInput WriteModalCommentTextarea WriteModalRadioContainer WriteModalRadio TilList TilListItem Detail.. 2023. 11. 20.