profile
개발자로서 한걸음

최종프로젝트를 마치며 느낀 부분들

하루에 12시간 이상씩 개발에 몰두하고, 필요에 따라 충분히 소통하면서, 때로는 서로를 격려해주며, 서로를 의지하며 웃으면서 프로젝트를 함께 해준 팀원들에게 너무나도 감사하다. 기획을 했을 당시에 나는, 나의 개발 실력에 비해 너무 거창한 프로젝트라고 생각이 들었다.

2023년 3월 14일
·
0개의 댓글
·

chat, scroll to bottom 자동 스크롤

태그 아래쪽에 이게 보일 것이다. useEffect를 통해 스크롤이 해당위치로 왔을 때 스크롤 이벤트를 발생시켜준다.

2023년 3월 9일
·
0개의 댓글
·
post-thumbnail

Recoil, state를 전역 관리

버그를 찾아나서는 중에 헤더 아이콘 토글 문제를 발견했다.헤더는 드랍다운 형식으로 클릭시 true, false로 열고 닫을 수 있다.하지만, 아이콘을 클릭 후 다른 페이지로 넘어가면 토글이 그대로 남아있는 것이었다.마이페이지를 누를 때 토글 state를 false로 바

2023년 3월 8일
·
0개의 댓글
·

Recoil과 React Query로 firestore 데이터 받아오기

팀원들과 프로젝트를 진행하면서 데이터를 관리를 해야할 필요성을 느꼈다. > #### 1. props drilling이 일어나는 곳이 부분적으로 있다. 2. 불필요한 컴포넌트에서 데이터가 호출 된다. 이러한 이유로 데이터를 useQuery로 받아오고 그 데이터를 전역으

2023년 3월 6일
·
0개의 댓글
·

firebase 배포, 소셜 로그인 문제

이 순서로만 해주면 배포된 사이트에서도 기존 로컬에서와 하는 것과 똑같이 사용할 수 있다.

2023년 3월 4일
·
0개의 댓글
·
post-thumbnail

React, Firebase. firestore를 이용한 팀 매칭 기능

우리가 기획한 것은 모각코 ( 모여서 각자 코딩 )에서 뜻을 반영해 모코라는 이름으로 사이트를 기획했다.주 기능은 매칭기능으로써 코딩을 하려는 사람이 대상이다.코딩을 하려는데 주변에 마땅히 같이 할 사람이 없을 시 이 사이트를 유용하게 사용할 수 있는데, 프로젝트, 스

2023년 3월 2일
·
0개의 댓글
·
post-thumbnail

React firebase, 소셜 로그인 기존 데이터 저장하기 (google, github)

그 중 Google과 GitHub로 로그인을 할 수 있는 서비스를 기획하였다. ⛔⛔ FireBase에서 제공하는 서비스로 간편하게 로그인 할 수 있지만, 문제는 이게 회원가입 따로, 로그인 따로가 아니라 동시에 하는 것이기 때문에 로그인 할 때마다 초기화 된 정보가 D

2023년 3월 2일
·
0개의 댓글
·

React 실시간 채팅, realtimebase에서 firestore로 바꾼 이유(feat. firebase)

1\. 대부분 옛날 글들이었다.2\. firebase 문서에서도 realtimebase보다 firestore에 대해 더 자세하게 나와있다. 3\. 비교적 최신버전이다.4\. 용량도 훨씬 크게 사용할 수 있다.5\. collection 관리를 쉽게 할 수 있다화면에 보여

2023년 2월 16일
·
0개의 댓글
·

react state에 push 인식 안됨(...스프레드 연산자)

이렇게 되면 info의 값이 새로운 배열로 newInfo 안에 들어가게 된다.

2023년 2월 14일
·
0개의 댓글
·

기획 단계에서의 의견 불일치 (feat. 최종 프로젝트)

최종 프로젝트에서는 디자이너님과의 협업을 할 기회가 생겼다. 총 5주의 프로젝트 기간이 주어졌다.우리 팀원들은 기간을 쪼개며 계획을 세웠다.📌 와이어프레임, 필요한 기능, DB구조, API 명세서, 역할분담 등 📌 기능구현, CSS작업, API 호출 등 📌 추가

2023년 2월 13일
·
0개의 댓글
·

최종 프로젝트 시작 (기획단계)

어떤 서비스를 할 것인가에 대해서 여러 의견들을 주고 받았다.기준은 이렇게 잡았다.등등, 서로 머리를 맞대어 고민한 결과 우리 모두가 개발자 취업을 꿈꾸기도 하기 때문에, 우리와 같은 처지에 있는 분들을 대상으로 기획했다.그것은 바로, 이미 이러한 서비스를 제공하는 H

2023년 2월 7일
·
0개의 댓글
·

리액트 훅 useMemo, useCallback

➡ 메모이제이션(memoization)은 컴퓨터가 동일한 계산을 반복해야 할 때 맨 처음 계산한 값을 메모리에 저장해서 필요 할때마다 메모리에서 해당 값을 꺼내서 사용하는 것을 말한다. state와 props를 통해 수많은 랜더링이 일어난다.랜더링이 일어날 때 무거운

2023년 2월 2일
·
0개의 댓글
·

프로젝트 회고

1주일간의 5명의 팀원들과 프로젝트를 성공적으로 마무리했다.설 연휴에도 새벽까지 함께 고민하고 진행 해준 팀원들에게 감사한 마음이다.프로젝트 일정, 기능 개발, 참고자료 등 꼼꼼한 문서화를 통해 현재 작업하고 있는 것, 상태 등을 바로바로 기록해서 누가 뭘 하고 있는

2023년 2월 1일
·
0개의 댓글
·
post-thumbnail

Firebase를 이용한 댓글 등록, 수정, 삭제 (CRUD)

댓글 등록을 하고 싶을때는 파이버에이스의 데이터 추가할 수 있는 API를 이용해야 한다.그중에서 나는 addDoc( ) 이라는 함수를 사용해서 내가 원하는 key : value 값을 데이터 베이스에 객체로 저장해줄 것이다.onClick 이벤트로 AddCommentBut

2023년 1월 31일
·
0개의 댓글
·
post-thumbnail

리액트 프로젝트 (API를 이용해 데이터 불러오기 feat. Youtube API)

타입스크립트를 배우고 나서 곧장 프로젝트가 시작 되었다. 새로운 5명의 팀원으로서 이번에는 구글에서 제공하는 유튜브 API를 이용해서 유튜브 영상을 이용한다. 주제는 초보 개발자를 위한 사이트로써 언어별로 영상을 볼 수 있고, 댓글로 깃헙 링크를 주고 받으며 소통할

2023년 1월 30일
·
0개의 댓글
·

react, 코딩을 처음 접하는 사람을 위한 프로젝트 (firebase)

새로운 프로젝트를 하게 되었다. 저번과 달리 이번에는 react로 프로젝트를 하기로 결정 했다. 😀😀 새로운 팀원 들과 기획을 하면서 정한 것들은 데이터베이스는 구글에서 제공해주는 파이어베이스를 이용하고, youtube 오픈 API를 이용해서 우리가 기획한 취지에

2023년 1월 30일
·
0개의 댓글
·

타입스크립트 유니온 타입 ( | )과 인터섹션 타입( & ) 과 이넘( enum )

위에 경우에는 string, number, boolean 값 모두를 충족 시키기 위해 불가능한 타입이다🔵 유니온 타입 ( | )🔸장점한가지 이상 타입을 쓰고 싶을 경우🔸특징⛔ 쓸 수 있는 속성도 공통된 부분만 쓸 수 있다. name에만 접근 가능🔵 인터섹션 타입

2023년 1월 19일
·
0개의 댓글
·
post-thumbnail

타입스크립트 interface와 type 별칭의 차이점

이 2개의 차이점이 있지만 아주 결정적인 차이점이 존재한다바로, interface 에는 extends 라는 확장이 가능 하지만, type 별칭에는 확장이 가능하지 않는다. 그래서 type 별칭보다는 interface로 타입을 주는 것이 바람직하다.

2023년 1월 18일
·
0개의 댓글
·

타입스크입트 interface

타입스크립트 인터페이스 (interface) 타입스크립트의 인터페이스는 상호 간에 정의한 약속 혹은 규칙을 의미한다. 보통 다음과 같은 범주에 대해 약속을 정의할 수 있다. > 🔘 객체의 스펙(속성과 속성의 타입) 🔘 함수의 파라미터 🔘 함수의 스펙(파라미터,

2023년 1월 17일
·
0개의 댓글
·

타입스크립트(Typescript) 시작하기

타입스크립트는 자바스크립트에 타입을 부여한 언어입니다. 자바스크립트의 확장된 언어라고 볼 수 있습니다. 타입스크립트는 자바스크립트와 달리 브라우저에서 실행하려면 파일을 한번 변환해주어야 합니다. 이 변환 과정을 우리는 컴파일(complile) 이라고 부릅니다. (출처:

2023년 1월 16일
·
0개의 댓글
·