[충격][공포] 브라우저의 놀라운 실체

EntryDSM·2020년 6월 3일
8
post-thumbnail

안녕하세요! 대덕 소프트웨어 마이스터 고등학교 입학전형 서비스를 개발하는 EntryDSM팀에서 루비 언어로 백엔드 개발을 하고 있는 정보보안과 정우영입니다. 여러분들께서 사용해주시고 계신 SCARFS의 기획과 개발에도 참여했습니다. 책임감을 가지고 사용자에게 항상 개선된 서비스를 제공하고자 계속 노력하고 있습니다. 루비 서버 개발에 흥미가 생기신다면 저를 찾아주세요!😀

이번 5차시에서는 브라우저의 동작에 대해서 다루어 보려고 합니다. 여기서 말씀드릴 내용은 사파리, 크롬, 인터넷 익스플로러 등 웹 사이트의 문서를 파싱해주는 소프트웨어에 관한 내용은 가볍게 보시고, 브라우저를 통해 웹 사이트에 접속 할 때 벌어지는 일들에 중점을 맞추어 작성하였습니다.

브라우저?

브라우저의 동작에 대해 다루기에 앞서서 우선 브라우저가 무엇인지는 알아야겠죠? 앞선 차시에서 웹 페이지는 HTML, CSS, JavaScript (이후 약어 'JS'로 표기하겠습니다!)로 구성되어 있다고 했습니다.

여러분, C언어 배우고 계시죠? C언어로 코드를 작성하고 그 코드를 실행시키려면 빌드를 거쳐야 해요. 그런데 빌드를 할 때 필수적으로 필요한 프로그램이 있어요. 바로 컴파일러에요. 컴파일러라는 번역기를 통해서 여러분의 소스코드는 빌드되어 결과물을 뱉어내게 됩니다. HTML과 CSS는 렌더링 엔진, JS는 자바스크립트 엔진이라는 번역기로 소스코드를 번역하여 결과물을 보여줍니다. 여기에 통신 기능과 여러 편의 기능, 이 편의 기능들을 실제로 동작하게 할 브라우저 엔진을 잘 조율하여 편리하게 작동하도록 만든 프로그램이 브라우저입니다.

웹 사이트에 접속하면 무슨 일이 일어날까?

웹 브라우저(크롬)을 띄우고 주소창에 "https://www.dsm-scarfs.hs.kr" 을 입력하면 끔찍한 과제가 기다리고 있는 과학 사이트에 접속할 수 있어요. 그런데 그냥 크롬을 켜고 저 문자열만 입력하면 과학 사이트에 접속할 수 있다는게 조금 신기하지 않나요? 맞다고 해주세요.. 이 신기한 상황에 대해서 저희는 조금 자세히 알아 볼 거에요.

"그" 문자열, 도메인

모든 IP 주소는 0부터 255까지의 숫자 네 개의 조합으로 이루어져 있어요. 서버 컴퓨터(지금은 필요한 정보를 주는 컴퓨터 정도로 알고 계시면 될 것 같습니다. 자세한 내용이 궁금하면 다음 차시로😜)도 예외는 아니기 때문에 서버 컴퓨터의 IP주소 역시 숫자의 조합으로 이루어져 있죠. 그런데요 여러분, 뜻을 알고 있는 단어들의 조합과, 랜덤한 숫자의 조합 중 어떤 게 더 기억하기 쉬울까요? 물론 사람마다 다르겠지만 저는 단어들의 조합이라고 생각해요. 저 말고도 많은 사람들이 같은 생각을 했는지 IP주소를 문자열 주소로 변환 하여 사람들이 더욱 편리하게 웹 서비스를 이용할 수 있도록 했어요. 이 때, 변환된 문자열 주소를 도메인이라고 해요.

도메인 네임 서비스, DNS

도메인을 도입하면 사람들은 더 편리하겠지만, 컴퓨터의 입장에서는 단순 문자열이기 때문에 도메인을 다시 IP주소로 변환하여 요청을 보내야 성공적으로 원하는 사이트에 접속할 수 있어요. 하지만 찾아볼 사이트는 많고, 이를 일일이 로컬에 저장해놓고 접속할 수 없기에, 이를 전문적으로 처리하기 위해 DNS가 등장하게 됩니다. DNS는 도메인의 IP정보를 저장하여 사용자에게 제공하는 서비스로, 여러분이 SCARFS IP주소에 직접적으로 요청을 보내는 대신 DNS서버에 요청을 보내면, DNS서버가 사용자의 컴퓨터에 IP주소를 알려주고, 여러분은 전달받은 IP주소로 요청을 보내서 사이트에 접속하게 됩니다.

사이트에 접속하면?

사이트에 접속하는 것을 조금 더 정확히 하면, 서버에 요청을 보내서 원하는 값을 받는 것입니다. 아까 서버에서 필요한 정보를 준다고 말씀드렸죠? 위에서 말씀드린 험난한 과정을 거쳐 서버에 요청을 보내면, 서버는 적절한 HTML, CSS, JS 소스코드를 브라우저에 전달하고, 브라우저는 전달받은 파일들을 잘 해석해서 예쁘게 보여줍니다. 어때요 좀 어썸하지 않나요? 아니라고요? 정상이지롱

글을 마치며🥇

예고했던 것 처럼 다음 차시에서는 '서버'에 대해 다뤄 볼 거에요. 여기까지 읽어주셔서 감사합니다

(_ _) 혹시 아직 엔트리에 지원할까 말까 고민하고 계시다면 주저 말고 지원하세요. 장담하는데 절대 후회 안 하실 거에요. 멋있는 여러분과 함께하게 되어 정말 기쁩니다!(AVOCAT도 지원하면 포트폴리오는 방치해도 될 건데 ㅎㅎ)

profile
대덕소프트웨어마이스터고등학교의 입학전형 시스템을 만드는 EntryDSM팀 입니다.

0개의 댓글