실무에서 svelte 개발 어려웠던 부분, 덤으로 얻게된 이익 > JS프레임워크

JS프레임워크

실무에서 svelte 개발 어려웠던 부분, 덤으로 얻게된 이익 정보

SVELTE 실무에서 svelte 개발 어려웠던 부분, 덤으로 얻게된 이익

본문

나중에  svelte  개발 어느정도 익숙해지면 잃어도 됩니다.

 

1.  refresh token을 이용한  access token  생성

한번에 여러요청이 겹치는 경우 문제 

: 1년에 걸처서 이 문제가 해결되지 않았는데, 보안을 강화한답시고 제가 refresh token을  access token 갱실할 때마다 새로 생성되게 해놓은 것이 문제였더라구요. 그래서 순서가 겹치게되는 경우 에러가 나는 상황이 발생하게 되었습니다.

예를들면, 회원정보와 목록을 동시에 불러오려는데 토큰이 만료가 되면, 회원정보 요청후 토큰갱신으로 넘거가는데 중간에 목록불러고기 요청이 들어오고 그사이 토큰이 갱신이 되는데, 이때 refresh token도 동시에 갱신이 되어 다음 목록을 블러오는 토큰을 갱싱하려는 요청에서  refresh token 이 달라서 에러를 뱉어내고 죽는 상황이 벌어졌던 것이더라구요. 그래서 refresh token은 다른데에서 하는 방식으로 보름에 1번씩 갱싱을 하는 방법으로 바꾸니 해결이 되었습니다. 

현재 올려드링 파일은 완벽하게 리소스가 최적화된 방식은 아닙니다. 

완벽한 방법은  멀티로 요청이 들어오면 토큰 만료 시점에 갱신요청시 다른 요청을 스톱하고 다른 요청들을 특정 변수에 담아두고, 토큰이 갱신된 이후에 담아 놓은 요청을 다시 실행하도록 하는 방법이 리소스를 가장 효율적으로 확용하는 방식이라고하는데, 각요청들이 컴포넌트별로 스코프된 상태로 요청을 보내기 때문에, 한 변수에 담은 값들을 재요청이후에 다시 각자의 주소로 찾아가서 실행되어줘야하는데, 이부분이 좀 해깔려서 아직 구현을 미루고 있는 중입니다. 그래도 동시에 요청이 가면, access token을 각 요청별로 재요청을하긴해도 아무 탈없이 실행은 잘 됩니다.

 

2. 크로스 도메인 예외처리

그누보드에서 받아먹기만하던 실력으로 로그인 세션 등등의 문제를 처음 접하다 보니

쿠키, 세션, 크로스도메인에 의한 쿠기 삭제 등의 문제를 처음 알게되었고 각 상태별로 

결과값에 대한 경험이 없다보니 일일이 상태를 바꿔가면서, 설명이 있긴한데 당최 알기 힘들어서

몸으로 부딛혀서 경험해야 직성이 풀리다보니. 계속 상태 바꿔가면서 찾아내다보니

이부분이 좀 오래 결렸습니다. 지금은 상태값 그냥 살짝 설정하면 되는 수준이지만,

처음에는 많이 해메었던 부분입니다.

그리고 이런 예외처리상태에서 보안? 에 대한 스스로에 대한 포기와 타엽의 시간이 오히려 더큰 

벽이 되었기도 합니다. 이래도 되는 건가 더 좋은 방법이 있는데 내가 몰라서 그런거 아닌가

또검색 또검색.....

 

3. svelte 안정화 버전 이전의 많은 변화

스벨트 자체는 크게 변하는게 없는데, svelte kit 라우터, spa 등을 잡아주는 서비스가 심하게 변하였습니다.

라우터 spa 잡아주는 기능을 sapper 이라는 프로젝트로 진행하다가, 몇몇 문제점들이 지적되었는데,

개선이 되지 않고 한참을 방치한 기간이 있었습니다. 그때 react 생태계처럼 이러한 문제를 해결한 별도 서비스들이 등장을하게 됩니다. routify, 나 ui 컴포넌트 잡아주는 여러 라이브러리 들이 그 문제점을 해결하면서 svelte 생태계가 구축되는것 같았습니다.

그런데 어느날 갑자기 sapper 을 접고 sveltekit 라는 서비스가 등정하게 됩니다. 

그러더니, 프로젝트 생성을 아예 sveltekit로 통합하더니, 올해초인가 sveltekit 정식버전이 나오게 됩니다.

그 중간중간 계속 업그래이드 되면서, 변화가 있어왔는데, 제가 중간에 서너개의 프로잭트를 동시에 진행하고 있다보니

코드들이 모두 다르고 개선된 코드로 업그래이드하는 것도 힘들고해서 어떤 프로젝트는 예전 코드로 그대로 빌드해서

납품된것도 있습니다. 리뉴얼 할때 업그레이드하기로 마음먹고, 

 

4. 덤으로 얻게된 이익

저는 svelte를 jquery 다음으로 쉬운 프론트 개발 도구라는 점에서 접근하였습니다. 

웹페이지 열라 빨리 만들수 있겠다. 

우와 너무 쉽고 간결하다. 

그래서 스벨트 관련 영상과 문서들을 계속 서핑하던 도중,

스벨트로 하이브리드앱을 만드는 장면을보게 됩니다.

우와 이게 웬떡이냐.

cordova + jquerymobile 로 앱을 만들어서 납품한 적은 있는데, 귀찮은게 하도 많고 구조나 반복 사용되는 라이브러리나 페이지들이 잘 구분되지 않고 혼합사용되다보니 만들고도 예상치 못한 문제가 발생할것 같아서 개운하지 않았습니다.

그래서 ionic 을 배워서 해볼려고 몇번을 시도하였으나,

javascript에서 뭔놈의 랩핑을 그렇게 많이하는지, 여기도 객체 마법의 수령으로 빠저들었구나..

하며, 쉽게 익히기 힘들어 차일 피일 미루면서 jquery 로 근근히 버텨 오다가.

잠시 프로그램업개를 떠났다가 돌아오니 react 를 지나 vue가 한잠 주가를 올리고 있을때

ionic vue 정도면 할만하겠다 싶던차에, 

떡하니 svelte가 나타나서는 그냥 바닐라 js 개발 + 번들링 혜택을 듬북 얹은

거기에다 cordova + ionic 동시 사용 가능한 capacitor 을 만나면서

쉽게 그리고 개발환경이 아주 쾌적한(저장하면 브라우저 자동갱신 : 손이 할일이 줄어듬) 개발 환경을

덤으로 얻게 되었습니다.

 

스벨트 왜하냐고 물어보시면, 하이브리드앱 쉽게 개발 할려고 그런다고 대답하셔도 됩니다.

말도 탈도 많은 듣보잡 웹뷰, 전 개발자 연락 끈기면 프로젝트 폐기해야하는 웹뷰 이제 사용 금지 입니다.

인프라가 중분히 구축되어 있는 sveltekit + capacitor 이용해서 급작스런 보안 업데이트에도 빠른 대응이 가능한

 든든한 오픈소스 진영에 이제 함께 할 수 있습니다.

추천
0

댓글 0개

전체 261 |RSS
JS프레임워크 내용 검색

회원로그인

진행중 포인트경매

  1. 참여4 회 시작24.04.25 20:23 종료24.05.02 20:23
(주)에스아이알소프트 / 대표:홍석명 / (06211) 서울특별시 강남구 역삼동 707-34 한신인터밸리24 서관 1404호 / E-Mail: admin@sir.kr
사업자등록번호: 217-81-36347 / 통신판매업신고번호:2014-서울강남-02098호 / 개인정보보호책임자:김민섭(minsup@sir.kr)
© SIRSOFT