본문 바로가기

프론트엔드25

리액트 포탈과 렌더링 고민 컨텍스트를 포탈로 감싸는게 flux 패턴을 위함일까? 기존의 provider 방식과 무슨 차이를 가질까? 렌더링 측면에서 관련없다. 포탈로 context를 제공한다고 해도 각 상태값이 렌더링 되는건 기존의 context api와 차이가 없다. context을 제공하는데 portal을 활용하는게 아니라 portal을 공통으로 제공하는데 context를 활용하는 측면이 있다. 그 역은 성립하지 않는다. (라고 설명을 들었다.) 개인적으로 영감을 느낀 부분이 조금 있어서 해당 부분을 상태관리에 활용할 방법을 고민해봐야겠다. DOM트리를 벗어나는 설계를 한 이유는 그냥 모바일 특유의 네비게이션 이 목적으로 보인다. UI 특징에 상단 해더와 하단 버튼등 해당 레이아웃을 포탈을 통해서 컨테이너 컴포넌트 내부에서 관.. 2022. 4. 9.
프론트엔드 설계 고민 -2- 일반적인 웹 애플리케이션을 구성하는 부분은 어떤 게 있을까? 해당 웹의 라우팅, 해당 웹의 UI, 해당 웹의 상태 사용자 액션에 따른 요청 처리 등을 생각해 볼 수 있다. 간단하게 정의 내리면 라우팅은 두 가지 측면을 가진다. 해당 애플리케이션의 절차라는 측면과 해당 애플리케이션이 제공하는 서로 다른 도메인을 가진 기능이라는 측면으로 말이다. 즉 동일 도메인 내의 플로우나 서로 다른 도메인을 라우팅으로 구분지어서 제공 할 수 있다. 도메인의 경우 보통 루트에 가까운 라우팅으로 나뉘는 경우가 대부분이지만 특정 액션이 복잡하거나 반드시 특정 절차를 따라서 지켜져야 한다면 복잡도가 증가함에 따라서 동일한 도메인에 속하더라도 서로 다른 도메인으로 분리해서 취급 하는게 좋을 것이다. 라우팅을 통해서 코드스플릿까지.. 2022. 4. 8.
프론트엔드 설계 고민 -1- SPA 컴포넌트 방식의 프로젝트의 경우 기본적인 entry 포인트가 존재한다. 그게 vue든 앵귤러든, 스벨트든 말이다. index로 명명하든 main으로 명명하든 기본적인 SPA의 entry가 존재하고 이를 통해서 다양한 번들러나 트랜스 파일러들이 프로젝트를 파싱 해서 빌드한다. 이때까지는 보일러플레이트들을 따라서 만들다 보니 리액트 기준으로 index 파일에 store연결 등과 App컴포넌트(웹 애플리케이션 entry)를 바인딩하고 있었는데 최근 모종의 기회로 해당 부분에 대해서 생각을 되짚어볼 기회가 생겼다. 내가 내린 index와 app 파일의 정의는 각각 index: "개발 entry", app: "웹어플리케이션 entry"인데 store를 바인딩하는 것을 index에 넣는게 맞는 것일까? 각자.. 2022. 4. 5.
JWT 간단정리 jwt 관한 논의를 보면 경력이나 실력에 상관없이 중구난방인 케이스가 많이 보여서 간단히 정리해본다. jwt 토큰 구현은 여러가지 방법이 존재한다. 보통 엑세스와 리프레쉬 토큰으로 토큰을 구분하는 방식과 그냥 토큰 하나로 관리하는 방식이 존재한다. 토큰 하나로 관리 하는 방식의 경우 토큰 자체가 가진 권한이 매우 크기에 토큰 자체를 유저가 발급하고 그 권한을 설정할 수 있게 해 줄 필요가 있다. 또는 매우 단기간에만 사용 가능하도록 하는게 보안상 유리하다. 보통 사용자가 관리에 대해서 많은 권한을 가진 구현은 대표적으로 깃허브 토큰을 예로 들 수 있다. 깃허브 토큰의 경우 사용자가 토큰 발급과 권한 및 삭제까지 모두 관리한다. 토큰 권한과 유효 기간을 단축하여서 보안상 이점을 보는 방식으로는 대표적으로 .. 2022. 1. 27.

티스토리툴바