---
# System prepended metadata

title: Untitled

---

### 안녕하세요 피어세션 즐겨봅시다.

#### 진행

### 기술 공유

1. 토마토 양지 파스타 - 크...  -> 기술공유 하십쇼

2. 


### 기술 발표

1. 에디터 한부분
    - 버그 발견! 텍스트 박스 
    - top, left 는 css 작업이 헤비하다 
    - translate를 사용하면 더 좋다. (최적화)
    - css trigger 사이트 [csstriggers](https://csstriggers.com/);
    - 

2. 리코일
    - 서스펜스를 붙이기 용이하다.
    - 셀렉터 파생 상태를 만들어주는 것
    - 아톰에 엮인, 셀렉터에 엮인 파생상태
    - 셀렉터는 비동기로직을 포함할 수 있다.
    - jsx가 실제 돔과 달라진다. 라는 단점이 있을 수 있다.

3. 불투명도 - backdrop filter 

4. 시간 동기화
    - sse 서버에서 

5. sql 제너레이터 하드코딩인데..
    - 


1. 번역 기능 
    - 메인 컨셉이었다가. sns 기술이 웹프로그래밍 전반적을 다룰 수 있다.
    - 동물 카테고리 정하고 (강아지) 번역 키워드 설정을 하고 게시글 썼을때 본문과 번역 키워드 스트링 길이(구분 난수 생성해서 키워드 조합으로 생성)
    - 돌멩이 직접 카테고리 만들어서 한다. 
    - 클라이언트, 백 어디서 해야할까
    - 프론트도 나쁘지 않다. 로그인할 때 카테고리와 키워드 
    - sns에서 내려가면서 정보를 볼수있어야 한다. 클릭하게되서 보게되면 UX가 안좋다. 환경설정에서 설정을  한다. 

2. 무한 스크롤
    - 인터섹션 옵저버를 사용해서 구현했다.
    - 같은 피드에서 두번 요청하지 않도록 했다.
    - 뷰포인트 설정을 통해서 원하는 밑에있는 피드까지 미리 감지를 해서 미리 fetch를 할 수 있다.
    - 계속 DOM을 붙이는 형식이다. 예전에 크롱님이 말씀해주신 DOM 객체를 일부만 그리도록 해서 최적화 할 수있다. 

3. 레이지 로딩
    - 인터섹션 옵저버를 이용해서 구현
    - 사용자가 봐야하는 이미지 부터 로딩하기 위해서 사용했다.
    - 렌더링할 때 기본 이미지를 보여주고 뷰포인터를 들어오면 target.src를 바꿔주면 된다. 



1. 프론트 - 

2. 백 - nest interceptor 주제 








