어제 숙제 잘 못했어도 괜찮다고 하셔서... 증말 다행
이번주 중요한 것~~~~ 컴포넌트 생명주기, 백엔드.. 근데 코딩 그 자체보단 어떤 순서로 이루어지는 지 그림에 대한 이해
- 이미지 저장 과정 → Image-Process
- 이미지? 데이터 베이스에 저장하면 안돼? → Cloud-Storage
- 이미지 검증 → Validation (용량, 확장자 등)
freeboard 리뷰 - 파이어베이스
시작하자마자 받아오기 위해 useEffect에서 엑시오스 통해 받아옴
firestore 정보 받아오고, 거기서 board라는 컬렉션을 가져옴
보드 컬렉션에 있는 document를 가져옴(getDocs)
그리고 그 document들 뽑아서 맵으로 각각에 있는 객체들에서 데이터를 뽑아야 데이터가 나온다.
원리가 그런건 아니고 사용법이 이렇다! NOSQL 다 이런게 아니라 파이어베이스에선 이렇다.
몽고디비쓰면 얘도 NOSQL쓰면 사용방법이 달라질 수 있다.
절대 외워서 되는 게 아니다. docs보고 하라는대로 하면 된다.
일반적으론 한 번 가져오면 끝나지만 얘는 한번씩 더 뽑아내야 사용가능하다.
boards라는 부분엔 배열 안에 객체가 들어와 있게 된다. [ {writer:””, …} ]
그 배열을 스테이트에 저장한다.
스테이트가 처음엔 빈배열이었는데, 바뀐 것
<DocumentData[]> 이건 타입, 파이어베이스의 다큐먼트데이터라는 타입이 있어서 갖고 와서 사용해줌
다큐먼트를을 배열로 가지고 있는 것
다큐먼트 한 개를 가져오고 싶으면 getDoc을 씀
이미지 프로세스
input type="file", onChange={} 파일이 변경됐기 때문에 onChange발생
온체인지 함수 만들고 바인딩 해줌
on으로 시작하는것 → 이벤트가 들어옴 이벤트 핸들러 함수
업로드 위해 설치하고 세팅해야하는 부분
ChangeEvent<HTMLInputElement> <>안에 있는게 변경 됐을 때 라는 뜻!
yarn add apollo-upload-client
yarn add --dev @types/apollo-upload-client
그 다음! _app.tsx 파일 독스보고 수정해줘야함!
Ref, 레퍼런스, 참조한다. 가리킨다
특정 태그를 가리키는 변수를 만드는 것
일찍 자버릇했더니 12시만 지나면 졸리다... 문제는 아침에 알람이 그닥... 잘 들리진 않는다는 것이다. 그래도 오늘은 제대로 일어났다! 내일은 오늘보다 10분만 일찍 가자...! 아니면 아예 일찍 가든가... 버스에 사람이 너무 많아서 괴로웠다. 톺아보면 정말 난... 늦게 가거나 아예 일찍 가거나인듯... 경기도 사람이 서울오듯이 말야...
드디어 내일 시험이다~~^^^ 시험이라서 그런건지 아니면 오늘 축구 때문인지 사람들이 다 일찍 갔다. 그러고보니 학원 등록 전에 왔을 때 강의실 소개시켜주시면서 왜 아무도 없지? 시험봐서 그런가? 라고 하셨었는데, 그떈 정말... 먼 얘기 같았는데 벌써 왔다.ㅎ 정말 중간고사는 서서히 스며드는구나... 대학교는 기말고사기간이다^_^ 나는 종강보다 약 한 달 반 정도 더 학원에 있겠지... 다같이 고통받으면 좋을텐데 아쉽당..🥰나랑 같이 열품타 해달라고!!!
오늘 본 알고리즘 테스트, 20분인가 30분 걸렸다. 난 값 비교하는 문제만 나오면 아주 약해진다... 그리고 Math.min 이런거 있는 걸 아예 까먹고 있었어! 그래도 아직까지는 풀만함에 감사하다. 알고리즘 공부 진짜 열심히 해야겠다🧐
오늘 점심 보승회관 순대국밥. . . 장ㅎ이 안 좋았는데 이번주 다같이 먹는 건 마지막 식사라고 생각돼서 그냥 먹으러 갔다. 먹고 나니 먹을 걸로 눌렀는지 속이 편해짐~~^^b 여기 김치 진짜 맛있다. 나 밖에서 김치 잘 안 먹는ㄷㅔ~~~~ 맛있어 ! 어쩌다보니 이번주는 윤쉐프를 한 번도 안갔네...!! 식권 사니까 안 가는 매직. 내일 시험볼 때 혼자 먹게 되면 윤쉐프 가야겠당.히히 아 역시 블로그는 그날그날 쓰는게 기분이 제일 좋아~~~
'프론트엔드✏️ > 코드캠프' 카테고리의 다른 글
| 220603 프론트엔드 부트캠프 중간고사 (0) | 2022.06.05 |
|---|---|
| 프론트엔드 부트캠프 한 달, (0) | 2022.06.03 |
| 220601 프론트엔드 부트캠프 22일차 : CORS, API, firebase (0) | 2022.06.03 |
| 알고리즘 : reduce, filter, Math.min, splice (0) | 2022.06.02 |
| 220531 프론트엔드 부트캠프 21일차 : [Backend]Open-API, DB / 태그 (0) | 2022.05.31 |