앱에 refreshToken을 전송할때 궁금한점이 있습니다.

개인적으로 저는 보통 웹 기반의 서비스와 하이브리드앱 제작을 주로 해서 네이티브에 대한 지식은 한정적이라는 것을 우선 양해 부탁드리겠습니다. jwt의 핵심은 결국 json 키를 이용한 인증이기 때문에 cookie를 사용할 수 없는 환경이라면 access token과 마찬가지로 json 파일을 header등에 실어 보내는 방법이 가장 심플한 방법일 것으로 예상됩니다. 대신 키의 저장을 ios나 안드로이드에서 좀 더 안전한 곳에 보관할 수 있는 방법을 찾아 관리를 해야 할 것으로 예상됩니다.

리액트에서 적용할 때 질문있습니다.

제가 react를 써본지 오래 되서 정확히 어떤 부분을 어떻게 적용해야 하는지에 대해서 정확하게 알려드리기는 힘들지만 제가 알고 있는 부분에서 제 의견을 말씀드리겠습니다. 우선 긍정적으로 검토가 가능한 부분은 현재 apollo-client에서 메인으로 지원하는 프런트엔드는 react가 된다는 점입니다. 아래 링크를 보시면 apollo-client를 react로 어떻게 사용하는 것인지에 대한 전반적인 정보를 얻을 수 있을 것입니다. https://www.apollographql.com/docs/react/get-started 또 svelte에서의 steore는 react에서 비슷한 개념으로 redux나 recoil 등 전역 상태 관리 라이브러리를 사용하셔야 할 것 같습니다. 비슷한 패턴으로 react를 작성하기 위해서는 이부분을 참고해서 백엔드서버로 부터 가져온 데이터를 이 전역 스토어에 저장하고 이를 불러 사용하는 패턴으로 사용하면 되지 않을까 생각됩니다.

Upload, 파일사이즈 코드 질문있습니다.

mutation schema를 보면 file의 타입이 sclar로 정의된 Upload로 만든 것을 볼 수 있습니다. 여기서 이 Upload를 graphql-upload의 GraphQLUpload로 맵핑 시켜주어야 하는데 이를 위해 필요한 코드가 바로 Upload: GraphQLUpload, 이부분입니다. scalar Upload type File { fileName: String fileType: String filePath: String } type Mutation { addCategory(categoryName: String): ID updateCategory(_id: ID, categoryName: String): ID deleteCategory(_id: ID): ID addItem(itemName: String, itemPrice: Int, itemImage: String, itemCategoryId: ID): Item updateItem(_id: ID, itemName: String, itemPrice: Int, itemImage: String, itemCategoryId: ID): Item deleteItem(_id: ID): ID uploadFile(file: Upload): File } 스트림 스트림의 경우 메모리 효율성 보다는 nodejs의 스레드의 한계 때문에 사용하는 개념입니다. node는 기본적으로 멀티스레드가 아닌 단일 스레드이기 때문에 파일 처리와 같이 많은 시간이 걸리는 작업을 할 경우 작업을 하는 일꾼인 스레드가 이를 계속 잡고 있으면 모든 기능이 정지해 버리는 상태가 될 수 있습니다. 그래서 파일 업로드와 같은 작업의 경우 한번에 모든 일처리를 끝내기 보다 작은 사이즈로 잘라서 조금씩 처리하는 것이 효율적이게 됩니다. 프론트엔드의 경우는 브라우저에서 작동하지만 업로드된 이미지 처리의 경우는 서버에서 작동하게 되는데 특정 작업으로 서버의 스레드가 멈추게 되면 서비스 전체가 멈추게 될 위험이 있기 때문에 스트림과 같은 기능이 필요한 것입니다. 또 압축의 경우 이와는 조금 다른 개념이기때문에 효율을 높이기 위해서라면 이둘을 같이 사용할 수 있다면 해보는 것도 좋을 것 같습니다.

이벤트 함수 on, handle 어떤 기준으로 정하는걸까요?

저같은 경우 일단 해당 강좌를 만들 당시에는 함수 앞에 on을 붙이는 경우는 ui에서 호출되는 함수에 대해서 on을 붙였습니다 . 현재는 on대신에 handle을 붙여 사용하고 있습니다. 결론적으로 저의 경우 그래서 on과 handle의 차이는 없고 ui에서 호출되는 함수의 경우에만 on또는 handle을 붙여서 해당 함수의 역할을 쉽게 알 수 있도록 사용하고 있습니다. 이런 규칙의 경우 두루 살펴 보신다음에 사용하시기 편한 것을 쓰면 되고 대신 통일성은 중요하니 이부분을 유의해서 사용하시기를 추천드립니다.

itemForm에서 Modal바인딩 질문있습니다.

위의 내용의 경우는 svelte의 store라는 것 때문입니다. 아래 내용의 경우 writable스토어를 작성하는데 이 writable의 초기값을 false로 설정한 부분이 되겠습니다. writable스토어의 경우 다음과 같이 초기값을 설정하고 사용하게 됩니다. 지금은 boolean으로 설정했지만 여기에 숫자, 문자 그리고 객체등의 값을 초기화 해서 사용할 수 도 있습니다. 또 초기에 설정된 값의 내용은 변경 가능하지만 타입은 변경이 안됩니다. 그래서 wratable(false)이렇게 설정하면 이 스토어는 boolean타입의 스토어가 된다고 보시면 됩니다. (타입스크립트에서는 이부분이 좀 더 명확해 지긴 합니다. ) writable 스토어는 svelte프레임워크의 한가지 기능이고 아래는 그 사용법이라고 기억하시면 되겠습니다. 그리고 이렇게 설정된 스토어의 값은 ‘$스토어이름’ 이런식으로 값을 불러 사용하면 됩니다. 참고로 이 스토어는 리엑티브적으로 작동합니다. 그래서 이 값을 어딘가에서 변경시키면 이 값을 불러 사용하는 전역에서 이 값을 참고해서 변화가 일어납니다. 이는 프런트엔드에서 아주많이 사용되는 패턴입니다. 이부분이 잘 이해사 되지 않으신다면 아래 챕터를 한번 더 보시기를 추천드리겠습니다. ‘섹션7. Frontend 개발 -개발 준비 및 기본 설정 - Svelte store’ const { subscribe, set } = writable(false) 또 const { subscribe, set } 이 문법의 경우 js의 비구조화 할당 이라는 기능이 됩니다. 즉 다음과 같이 정의된 objec에서 a, b값을 가져오는 방법이 됩니다. const object = { a: 1, b: 2 }; const { a, b } = object; console.log(a); // 1 console.log(b); // 2 writable의 경우에 updqte, set, 등이 정의 되어 있으니 이를 가져와 사용하기 위한 준비라고 보면 되겠습니다.