TIL 23.10.23

전민석·2023년 10월 23일
1

TIL

목록 보기
14/52

개인과제

display:none을 이용하여 토글 방식으로 한/영버전을 만드는건 실패했다.
언어 버전별로 class를 연결하려니 css도 엉망이고 너무 하드코딩을 할 것 같았다.
그래서 한 페이지로 만드는 것을 포기하고 html 파일을 하나 더 생성했다.

html 파일 복사해서 한 개, javascript 파일 복사해서 한 개 간단한 수정을 거친 두 개의 파일로 바로 완성됐다.
그래도 아쉬움이 남는다.
그래서 튜터님에게 여쭤보니 하나의 html 파일에서 하나의 javascript를 가지고 할 수 있는 방법을 알려 주셨다.

먼저 변환 시 바뀔 부분을 json 파일로 만들어 둔다.

{
title{
'en' : 'movie...',
'kr' : '영화...'
},
overview{
'en' : 'gotfather',
'kr' : '대부'
}......

그리고 환경에 맞게 변화하여 동작할 js 파일을 만든다.
이후 로컬스토리지를 이용하여 상태 관리를 한다.
페이지 랜딩 시 로컬스토리지가 비어있을 것이므로 localStorage.setItem('lang','kr') 이런 식으로 상태를 지정해 준다.
그리고 언어 상태에 맞는 함수를 실행한다.

이번에 들은 내용을 정리해 보았다.
이번 개인과제에서는 못해봤지만 내일부터 있을 팀 과제에서 활용해 봐야겠다.

0개의 댓글