미션

번역된 글 번역해보고 완성본과 비교해보기

최근 프로젝트에서 쿠키에 대해 학습할 때 해당 부분을 참고했어서 이 주제를 선택했다.

원문
번역문 (완성본)

내 번역본

쿠키와 document.cookie

쿠키는 브라우저에 직접 저장되는 작은 문자열 데이터입니다. 쿠키는 RFC 6265 명세에 정의된 HTTP 프로토콜의 일부입니다.

쿠키는 보통 웹 서버가 응답 Set-Cookie HTTP 헤더를 사용하여 만들어집니다. 이후, 브라우저는 동일한 도메인으로의 매 요청마다 쿠키를 자동으로 Cookie HTTP 헤더에 넣습니다.

쿠키의 가장 널리 알려진 사용 사례는 인증입니다.

1. 사용자가 로그인 하면 서버는 응답에 Set-Cookie HTTP 헤더를 사용하여 고유한 “세션 식별자”를 가진 쿠키를 설정합니다.
2. 다음에 요청이 동일한 도메인으로 전송될 때, 브라우저는 Cookie HTTP 헤더를 사용하여 쿠키를 인터넷을 통해 전송합니다.
3. 이로써 서버는 누가 요청을 했는지 알 수 있습니다.

document.cookie 속성을 사용하여 브라우저에서 쿠키에 접근할 수도 있습니다.

쿠키와 쿠키의 속성은 다루기 어렵습니다. 이 챕터에서는 이에 대해 자세히 알아보도록 합시다.

document.cookie로부터 쿠키 읽기

브라우저에 이 사이트의 쿠키가 저장되어 있을까요? 한 번 확인해봅시다.

// javascript.info에서 저희는 통계를 위해 Google Analytics를 사용해야 하기 때문에 
// 몇몇 쿠키가 있어야 합니다.
alert( document.cookie ); // cookie1=value1; cookie2=value2;...

document.cookie 의 값은 name=value 쌍으로 이루어져 있으며, 각각의 쿠키는 ; 로 구분됩니다. 쌍 하나는 독립된 쿠키입니다.

특정 쿠키를 찾으려면 정규 표현식이나 배열 함수를 사용하여 document.cookie 를 ; 로 나눈 다음 올바른 이름을 찾을 수 있습니다.

연습할 수 있도록 남겨두겠습니다. 또한, 챕터의 마지막 부분에는 쿠키를 조작하기 위한 헬퍼 함수를 확인할 수 있을 것입니다.

document.cookie에 쿠키 쓰기

document.cookie 에 쿠키를 쓸 수 있습니다. cookie 는 데이터 프로퍼티가 아니고 접근자(getter/setter) 이므로 이에 대한 할당은 특별한 방법으로 처리됩니다.

document.cookie 에 쓰기 작업을 하면 언급된 쿠키만 수정되고 다른 쿠키는 건드리지 않습니다.

예를 들어, 이 호출은 이름이 user 이고 값이 John 인 쿠키를 설정합니다.

document.cookie = "user=John"; // 이름이 'user'인 쿠키만 수정
alert(document.cookie); // 모든 쿠키 표시

실행해보면 여러 개의 쿠키를 볼 수 있을 것입니다. 이는 document.cookie= 작업이 모든 쿠키를 덮어쓰는게 아니기 때문입니다. 이 작업은 언급된 쿠키 user 만 설정합니다.

기술적으로 이름과 값에는 모든 문자가 올 수 있습니다. 유효한 형식을 유지하려면 내장된 encodeURIComponent 함수를 사용하여 이를 제거해야 합니다.

// 스페이스와 같은 특수 문자는 인코딩 필요
let name = "my name";
let value = "John Smith"

// 쿠키를 my%20name=John%20Smith 와 같이 인코딩
document.cookie = encodeURIComponent(name) + '=' + encodeURIComponent(value);

alert(document.cookie); // ...; my%20name=John%20Smith

한계

쿠키는 몇 가지 한계점을 가지고 있습니다.

• document.cookie 를 사용하여 한 번에 하나의 쿠키만 설정·수정할 수 있습니다.
• encodeURIComponent 를 거친 name=value 쌍은 4KB를 초과해서는 안 됩니다. 따라서 쿠키에는 상당히 큰 내용을 저장할 수는 없습니다.
• 도메인당 쿠키의 총 개수는 약 20개 이상으로 제한되고, 그 개수는 브라우저에 따라 다릅니다.

쿠키에는 설정되어야 하는 여러 중요한 속성이 있습니다.

속성은 다음과 같이 key=value 쌍 뒤에 나열되며, ; 로 구분됩니다.

document.cookie = "user=John; path=/; expires=Tue, 19 Jan 2038 03:14:07 GMT"

번역 과정에서 고민했던 부분

• 원문을 한국인이 자연스럽게 읽을 수 있게 하려면 어떤 문체로 써야할 지 고민했다. 완성본이 어떻게 원문을 의역했는지 계속 보다보면 감을 잡을 수 있을 것 같다.
• property 와 같은 기술적 용어를 번역을 해야할 지 아직 감이 안잡힌다.
• 컨트리뷰션 가이드에는 줄수를 변경하면 안된다고 나와있는데, 번역 완성본에는 줄수가 달라진 경우가 있다. 이 줄수가 의미하는 바를 정확히 짚고 넘어가야겠다.

내가 번역한 부분의 개선점

• 생각보다 의역을 하지 못한 부분이 많다.
  • ex) document.cookie 에 쓰기 작업을 하면 vs document.cookie에 값을 할당하면(완성본)

느낀점

• 생각보다 의역이라는 게 쉽지는 않다는 것을 느꼈다.
• 파파고와 같은 번역기를 활용하면 번역 자체는 잘 할 수 있다. 하지만 번역하고자 하는 기술 내용에 대해 어느정도 깊이있는 지식을 갖추고 있는 것은 번역을 더 잘하기 위해 중요하다.
• 영문을 한 문장씩 번역하다 보면 전체적인 맥락을 이해하지 못하고 기계적으로 번역하는 나의 모습을 볼 수 있다. 번역하기 전에 문서 전체나 하나의 소제목 내의 내용을 한 번 나의 이해를 바탕으로 먼저 정리해보자.
• 결국 한 주제에 대한 원문과 번역 완성본을 많이 비교해보며 이전 기여자들이 어떻게 번역을 수행했는지 그 노하우를 체득할 필요가 있다.