[TIL] 24/01/18 [최종] 글 카테고리 선택 창 입출력 지옥..
오늘도 화이팅!
1. 카테고리 선택 창
카테고리라고 칭했지만 글종류를 의미하는 건 아니고, 글쓸 때 저 많은 선택 사항들을 의미한건데,
DB에서 읽어오고 저장할 데이터가 너무 많아. DB 지옥을 경험했다.
카테고리로 필터링을 해야하는 동료가 있어서, 그 부분에서는 DB에서 읽어서 뿌려줘야하는데,
그건 같이 해서 다행이었다.
1. db에서 읽어오는 부분 - 포지션에 따른 기술스택들 : 이것밖에 없긴한데, db가 복잡한 죄로 제일 어려웠다.
-> 이것도 몇개 없을 텐데 하드코딩으로 뿌려줄걸 그랬다ㅋㅋㅋㅋ 물론 이렇게하면 이름 조금 틀리면 망함.
2. 저장할 DB :
- Projects Table (프로젝트방식, 오프라인이면 지역, 프로젝트 시작일, 종료일, 인원)
- Project_position (프론트엔드인지 백엔드인지 디자인인지 중복 선택시 여러 row로 저장해야함)
- Project_tech (프론트에서 선택한 javascript, typescript, next 등등과 백엔드에서 저장한 node.js 등등을 여러 row로 저장)
2. useMemo 공부
연산을 한번만 하도록 한다, 의존성 배열 지정가능
아직 써본적이 없는데 오늘 튜터님에의해 동료의 코드에 들어가서 확인 !
[React] useMemo란?
📋 useMemo란? useMemo는 리액트에서 컴포넌트의 성능을 최적화 하는데 사용되는 훅이다. useMemo에서 memo는 memoization을 뜻하는데 이는 그대로 해석하면 ‘메모리에 넣기’라는 의미이며 컴퓨터 프로
velog.io
3. set 자료구조 공부
곂치지 않게 저장할 수 있다. 쓰려고 했는데 못썼다.
두개의 값을 동시에 넣고 비교하고 싶은데 객체타입으로 넣어줘도 객체끼리 비교가 되는지 예제를 못찾겠다.
그렇단 말은 안되는 건가.. test 해볼 시간은 없어서 일단 패스.
[Javascript] Set 객체
코테를 공부하다보면, 중복 값을 제거하는 연산을 할 때가 있다. 그럴 때 보통 new Set()을 사용해왔는데...그냥 중복을 제거하는 것만 알고 있었다. 그래서 Set 객체를 사용하는 다양한 방법을 알아
velog.io
체크 박스에서 상태관리 하는 이런 목적이긴 했는데
이분은 체크박스 한세트 인데 우리는 여러개의 세트를 한 함수에서 처리하느라.. 뭔가 복잡.
[React] 리액트에서 Set 이용한 Checkbox 상태관리하기!
0. 소개 프로젝트 작업을 하면서 checkbox가 필요하게 되었고, 다양한 방법중에 Set과 useState를 이용한 방법으로 작업을 해보았습니다. Set과 useState를 이용한 방법을 예제와 함께 정리해보겠습니다 1
shape-coding.tistory.com
4. 체크박스 css
data가 하나라도 있으면 체크하는 부분은 some 이라는 method 를 사용하였다.
const isPositionChecked = (position_id: string) => {
return categoryData.techs.some((tech) => tech.position_id === position_id)
}
지금은 A set B set 에 같은 data가 있으면 하나로 처리되어 이슈가 있는 것 같다. ^0^
5. (복습 예정) 셀렉트 박스 선택과제코드 한번 살펴보기
이때 했었어야 했는데..
https://teamsparta.notion.site/React-Lv-3-98089379b6d94dd4a9c21e07b6b29f37
프로젝트 진행 상황
✓ 몰라 많이 함 70%?
내 진행 상황
오늘 한일
1. 오늘 남의 코드만 봐주다가 할거 못하고 밤에 수정페이지 하는 데 난관이다.ㅋ.ㅋ.ㅋ.
디자인회의
근데 결론적으로 바꾸길 잘했다
굳잡 미뇽! 기존 색이 칙칙하다고 의견 내주셔서ㅋ
획기적으로 요새스타일 되버림^.^
최종시안 오른쪽으로 결정!
