본문 바로가기

개발 일기장/SWM Onestep97

20241008 TIL: 다국어 처리 지원하기 [진행중] ✅ 오늘 배운 것오늘은 설정에서 i18n 패키지를 통해 다국어를 바꿔주는 작업을 진행했다. '한국어'와 '영어' 옵션 중에 선택할 수 있도록 UI Kitten의 Menu 옵션을 사용해주었다.  그리고 selectedIndex라는 메뉴의 옵션을 통해 현재 사용하고 있는 언어가 선택된 것으로 표기되도록 해 주었다.  전체 코드는 다음과 같다. const SettingsLanguageView = () => { const { t, i18n } = useTranslation(); const [selectedIndex, setSelectedIndex] = useState(new IndexPath(setIndex())); const handleKoreanPress = () => { i18n.changeLa.. 2024. 10. 8.
20241007 TIL: 다국어 처리 진행하기 [진행중] ✅ 오늘 배운 것어제의 포스트를 통해 다국어 지원이 잘 동작하는 것을 확인했다. 이제 남은 것은 손수 앱에 있는 모든 한국어/영어를 ko.json과 en.json 파일에 넣어 주는 것이다. 복잡하진 않지만 할 일이 많은 반복 작업만이 남았다.  다행히 앱 페이지가 많지는 않으니 일단 해보자. 아래와 같이 ko.json과 en.json 파일을 만들어주고 어제와 같은 방법을 적용하니 다국어 지원은 잘 되었다. // ko.json{ "views": { "index": { "signIn": "구글 로그인" }, "_layout": { "addCategory": "Add Category", "manageCategory": "Manage Category", "e.. 2024. 10. 7.
20241006 TIL: 다국어 처리 지원하기 [진행중] ✅ 오늘 배운 것오늘은 전날과 전전날 토스 과제와 회고로 미뤄두었던 다국어 처리 지원을 더 해보려고 한다. 저번에 i18-react, i18n 공식 라이브러리는 찾았었는데 여기서 안드로이드 전용 설정을 해주지는 않았었다. 그 설정을 마저 하고 다시 앱을 실행시켜서 잘 나오는지를 봐야 하겠다. 처음부터 따라해 보자.  우선 npm을 이용해서 라이브러리를 설치해 준다. npm install react-native-i18n --save 글에 cocoapods라는 프로그램(?)을 이용해서 설치하는 방법도 있었는데 이게 설치되어있지 않아서 굳이 해야하나 싶었다. 나는 그 밑의 방법을 사용했다.  그러다가 뭔가 이상한 점을 느꼈다. 분명 그때 봤던 블로그 글에서는 한 번에 다국어지원을 하고 있었는데 말이다. 다시 .. 2024. 10. 6.
20241005 TIL: 메타인지 #1 ✅ 오늘 배운 것요즘의 개발 일상이라 카테고리를 'SWM OneStep'으로 지정은 해 두었지만 살짝 거리가 있는 포스팅을 해 보려고 한다. 그렇다고 다른 데 넣기도 애매한 게, 오늘은 철저히 주관적으로 내가 아는 것들을 한번 슥 훑어볼 예정이기 때문이다. 이유는 바로 오늘 오후에 있을 토스 next 전형에 대해 django 지식을 조금이나마 정리하기 위해서이다. 코테를 갓 끝내고 정신이 비교적 맑을 때 어서 글을 작성해 보자. 참고로 모든 질문과 대답은 내 머릿속에서 나온 것이므로 정확한 질문과 정확한 정답은 없다. 하지만 이렇게 정리하기만 해도 내가 모르는 게 뭔지를 알 수 있어서 해 보려고 한다.   django란 무엇일까?장고(django)는 웹 프레임워크(framework)이다. 프레임워크와 라.. 2024. 10. 5.
20241003 TIL: 다국어 처리 지원하기 [진행중] ✅ 오늘 배운 것어제 발생했던 이슈를 처리하고 이제 남은 다국어 처리를 마저 진행해보자. 어제 참고한 블로그와 비슷한 방식으로 .json 파일을 작성한 다음 react-i18next의 useTranslation 훅을 가져와서 사용했는데, 다음과 같은 에러가 났다.  i18next 인스턴스를 init한 다음에 사용되는 방법이 잘못된 것 같았다. 그래서 이번에는 /locales/index.js 파일에서 export한 i18n 객체를 import해서 위의 코드의 인자로 넣어주려고 했다. 즉 이전 코드가 다음과 같다면,import { useTranslation } from 'react-i18next';const Login = () => { const { t } = useTranslation(); ... 이 .. 2024. 10. 3.
20241002 TIL: 사용자 문의 폼 적용하기 [끝] & 다국어 처리 지원하기 [진행중] ✅ 오늘 배운 것어제 있었던 이슈는 특수 상황이기도 했지만, 프론트 멘토님의 조언을 참고하면 두 가지의 해결 방안이 있는 것으로 보였다. 1. 프로덕션과 개발 DB를 같이 쓰기2. 개발환경 앱 빌드와 프로덕션 앱 빌드 환경을 분리하기 사실 2번의 의미를 정확히는 이해하지 못했다. 빌드 환경을 분리한다는 것은 어떤 의미일까? 아예 다른 환경에서 앱이 실행되는 거라면, 그렇다면 개발 환경에서 사용되는 자원(AsyncStorage 등)과 프로덕션 환경에서의 자원이 분리되는 의미라고 이해했다.  이 경우 프로덕션 앱 빌드를 하다가 개발 앱 빌드를 하더라도 둘이 자원을 공유하지 않으니 기존 환경에서의 AsyncStorage에 기존 토큰이 남아있을 리 없다.  사실 1번의 방법도 가능은 하지만, 그래도 원칙상 DB.. 2024. 10. 2.