swimjiyswimjiy깊게 이해하고 쉽게 설명하기 위해 공부하는 개발자입니다./@@5xeg2018-04-25T04:03:15Z비전공자 프론트엔드 개발자는 왜 네트워크 책을 썼을까? - 애매한 재능은 저주라고 생각하는 사람들을 위해/@@5xeg/512024-01-03T14:25:53Z2023-11-26T13:52:12Z올해 4월 말에 브런치에서 연재 중인 해치지 않는 웹 네트워크 시리즈를 토대로 한 책, 『그림으로 쉽게 이해하는 웹/HTTP/네트워크』책을 출간했습니다. 주변의 많은 분들이 축하해 주셨고, 그중 자주 듣는 질문이 있었습니다. 어쩌다 글을 쓰게 되었는지, 그리고 비전공자에다가 프론트엔드 개발자인데 왜 뜬금없이 네트워크 책을 쓰게 되었는지가 그것이었죠. 오늘<img src= "https://img1.카지노 쿠폰.net/thumb/R1280x0/?fname=http%3A%2F%2Ft1.카지노 쿠폰.net%2Fbrunch%2Fservice%2Fuser%2F5xeg%2Fimage%2FNp8d52aGDcznbLWNA1WlllAfc18.png" width="500" /『그림으로 쉽게 이해하는 네트워크』출간 소식 안내/@@5xeg/502023-11-30T07:07:12Z2023-04-23T01:36:49Z안녕하세요, swimjiy입니다:) 브런치에서 연재 중인 해치지 않는 웹 네트워크 시리즈를 토대로 한 책,『그림으로 쉽게 이해하는 웹/HTTP/네트워크』를 4월 27일에 출간합니다. https://wikibook.co.kr/whn/ 2022년 초에 위키북스 출판사에서 먼저 좋은 제안을 주셔서 집필을 시작했고, 편집자분들을 포함한 많은 분들의 도움과 주<img src= "https://img1.daumcdn.net/thumb/R1280x0/?fname=http%3A%2F%2Ft1.daumcdn.net%2Fbrunch%2Fservice%2Fuser%2F5xeg%2Fimage%2Fxbe23fyhWf11FbJFrwBPgKDZGiA.jpg" width="500" /그림으로 쉽게 보는 이더넷 - 이더넷의 개념부터 구성 요소까지 한 눈에 이해하기/@@5xeg/492024-05-14T02:43:10Z2023-04-16T12:15:16Z하나의 지역 네트워크를 구성하는 방법은 다양합니다. 이름도 처음 들어보는 토큰 링이나 FDDI(Fiber Distributed Digital Interface)부터 우리에게 친숙한 와이파이처럼 말이죠. 그중 가장 대표적이고 현재까지 가장 많이 사용하고 있는 기술이 이번 포스팅에서 이야기할 이더넷입니다. 인터넷 말고 이더넷 이더넷(ethernet)은 같은<img src= "https://img1.카지노 쿠폰.net/thumb/R1280x0/?fname=http%3A%2F%2Ft1.카지노 쿠폰.net%2Fbrunch%2Fservice%2Fuser%2F5xeg%2Fimage%2F2gA_MEOd21ttnU-vDj1NzlPXRVI.png" width="500" /3년 차 개발자의 늦은 2022년 회고 - 주니어 개발자는 올해도 혼란했다/@@5xeg/482023-11-28T01:31:15Z2023-01-16T18:00:03Z항상 연초가 되면 하루하루를 소중히 아끼며 살자고 다짐하지만, 늘 그렇듯 인생은 뜻대로 흘러가지 않기 때문에 연말만 되면 아쉬움이 남는 것 같습니다. 좀 많이 늦긴 했지만 그래도 회고를 써야 미련 없이 묵은해를 보내줄 수 있을 것 같아 썼다 지운 문장들을 어떻게든 그러모아 정리했습니다. 있으셨는데요, 없어지셨습니다. 올해 회사에서 있었던 가장 큰 변화는 <img src= "https://img1.카지노 쿠폰.net/thumb/R1280x0/?fname=http%3A%2F%2Ft1.카지노 쿠폰.net%2Fbrunch%2Fservice%2Fuser%2F5xeg%2Fimage%2Fl9xtqN3CpuZBAlWhcYdvgMlbpts.png" width="500" /그림으로 쉽게 보는 카지노 쿠폰S, SSL, TLS - SSL과 TLS는 무슨 차이일까/@@5xeg/472023-11-28T01:44:16Z2022-10-24T16:40:56Z지난 포스팅에서 웹 브라우저와 웹 서버 간에 데이터를 주고받기 위해 사용하는 인터넷 프로토콜인 HTTP에 대해 알아봤습니다. 1996년에 탄생한 이후부터 지금까지 HTTP는 웹 통신에 있어 필수 요소로 굳건히 자리하고 있는데요. 그러나 사용하는 사람이 많아지고 웹 기술이 고도화되며 다양한 해킹 방법이 등장했고, 그에 따라 더욱 안전하게 데이터를 전달할 수 <img src= "https://img1.카지노 쿠폰.net/thumb/R1280x0/?fname=http%3A%2F%2Ft1.카지노 쿠폰.net%2Fbrunch%2Fservice%2Fuser%2F5xeg%2Fimage%2Fgp2iBxsJ_C22drrlKa3TGKvhUGA.png" width="500" /함께 만드는 음악 플레이리스트 'Muzily' 개발기 - 주니어 프론트엔드 개발자가 사이드 프로젝트에서 새롭게 경험한 5가지/@@5xeg/462022-11-29T09:45:05Z2022-09-21T06:52:07Z변하지 않고 안락한 환경에 오래 머물다 보면 나도 모르게 상황에 안주하게 되곤 합니다. 그도 그럴게 지금의 상황에 만족하는데 굳이 바뀔 필요가 없으니까요. 저 또한 예외는 아니라고 생각합니다. 그래서 의도적으로 새로운 상황에 던져지고자 노력하는 편입니다. 물론 초반에는 낯설고 괜히 시작했나 하는 생각도 들지만, 그래도 마무리는 늘 뭔가 하나쯤은 새롭게 얻어<img src= "https://img1.카지노 쿠폰.net/thumb/R1280x0/?fname=http%3A%2F%2Ft1.카지노 쿠폰.net%2Fbrunch%2Fservice%2Fuser%2F5xeg%2Fimage%2F223156IOMEsTYnc4P3ZU0Cx_o40.png" width="500" /그림으로 쉽게 보는 IP 주소 (하) - 클래스, CIDR로 IP 주소 더 알뜰하게 쓰기/@@5xeg/442024-04-24T15:18:37Z2022-07-25T11:14:30Z앞서 그림으로 쉽게 보는 IP 주소 (상)에서 우리는 IP 주소가 무엇인지, 어떤 구조로 되어 있는지 알아봤습니다. 그리고 IP주소 만으로는 어디까지가 네트워크 부분이고 호스트 부분인지 찾기 힘들다는 것도 배웠죠. 이 말은 즉 192.168.123.132이라는 IP 주소에서 192까지만 네트워크 부분일 수 있고 아니면 192.168까지가 네트워크 부분일 수<img src= "https://img1.카지노 쿠폰.net/thumb/R1280x0/?fname=http%3A%2F%2Ft1.카지노 쿠폰.net%2Fbrunch%2Fservice%2Fuser%2F5xeg%2Fimage%2FibiUffg1A0aXleLFBtVpkNLyicA.png" width="500" /그림으로 쉽게 보는 IP 주소 (상) - IP 주소의 구조와 네트워크 부분/호스트 부분으로 구분하기/@@5xeg/432023-06-10T03:50:39Z2022-06-21T22:57:01Z이전 IP 포스팅에서 우리는 IP가 무엇인지, 그리고 고갈 문제를 해결하기 위한 방법은 무엇인지 간단하게 알아봤습니다. 하지만 IP는 네트워크 분야에 있어 중요한 개념인 만큼 훨씬 더 방대한 내용을 담고 있는데요. 그래서 이번 시간에는 좀 더 깊이 들어가, 우리가 익히 보던 IP 주소가 어떤 구조로 되어 있는지 하나씩 쪼개가며 알아볼 예정입니다. 개념이 점<img src= "https://img1.카지노 쿠폰.net/thumb/R1280x0.fjpg/?fname=http%3A%2F%2Ft1.카지노 쿠폰.net%2Fbrunch%2Fservice%2Fuser%2F5xeg%2Fimage%2FrlSVomAFseXh6QLTEaFWL-QSW_s.PNG" width="500" /웹 1.0부터 3.0까지, 가볍게 읽는 웹 변천사 - 웹 얘기에 왜 자꾸 블록체인 얘기가 나올까/@@5xeg/422023-06-27T11:16:53Z2022-04-03T06:12:02Z우리가 일상생활에서 느낄 수 있듯 웹은 다른 학문이나 기술에 비해 유독 빠르게 진화해 왔습니다. 그래서 역사가 약 30년이 채 되지 않음에도 큼직한 패러다임이 두 번이나 바뀌었죠. 웹의 과거와 미래를 분석하는 사람들은 그 분기점들을 기준으로 웹을 1.0, 2.0, 그리고 3.0으로 구분하고 있습니다. 이번 시간에는 이러한 웹의 역사를 가볍게 훑어보며 시기별<img src= "https://img1.카지노 쿠폰.net/thumb/R1280x0.fjpg/?fname=http%3A%2F%2Ft1.카지노 쿠폰.net%2Fbrunch%2Fservice%2Fuser%2F5xeg%2Fimage%2FMTmJm2tEw6MOl5MF_hZfoNb-Ltk.PNG" width="500" /그림으로 쉽게 보는 카지노 쿠폰 변천사 - 웹과 함께 시작된 0.9부터 따끈하게 등장한 3.0까지/@@5xeg/392023-02-13T15:21:09Z2022-01-23T03:52:46Z시리즈 초기에 우린 인터넷 상에서 컴퓨터와 컴퓨터가 서로 데이터를 주고받기 위한 규약인 HTTP에 대해 알아봤습니다. 그리고 다른 네트워크 요소들이 그러하듯 HTTP도 처음부터 짜잔 하고 지금의 완성된 형태로 등장한 것은 아닙니다. WWW, 웹이 탄생한 1989년부터 시작해 오늘날에 이르기까지 많은 시도와 변화가 있었죠. 그래서 이번 포스팅에선 이런 HTT<img src= "https://img1.카지노 쿠폰.net/thumb/R1280x0.fjpg/?fname=http%3A%2F%2Ft1.카지노 쿠폰.net%2Fbrunch%2Fservice%2Fuser%2F5xeg%2Fimage%2Fi2tUSIJNzCiZ28KRGFfhmGOr780.jpeg" width="500" /2년 차 개발자의 조금 늦은 2021년 회고 - 휘낭시에 쿨타임이 돌아오기 전까지는/@@5xeg/382022-07-27T11:47:18Z2022-01-02T16:03:30Z사실 이전까지의 회고는 하루 이틀이면 금세 나왔는데 이번 회고는 썼다 지웠다를 반복해 지우개의 흔적이 많이 남아있는 글입니다. 4개월 만의 포스팅이라 제 안의 인문학적 감성이 전사했는지 몰라도 이 다사다난했던 한 해를 어떻게 하면 정리할 수 있을지 고민이 많이 되더라고요. 그래서 이번 회고에서는 간략히 회사 안에서, 회사 밖에서는 어떤 일을 했는지 사건 위<img src= "https://img1.카지노 쿠폰.net/thumb/R1280x0.fjpg/?fname=http%3A%2F%2Ft1.카지노 쿠폰.net%2Fbrunch%2Fservice%2Fuser%2F5xeg%2Fimage%2F2rxW3C7w0t49G2ZUnI4iXNw89l8.jpeg" width="500" /밈으로 알아보는 개발: 0 = '0' = [] ? - 스폰지밥 밈으로 알아보는 JavaScript 비교 연산자와 형 변환/@@5xeg/372023-05-02T05:32:33Z2021-08-18T14:25:39Z개발 지식을 무겁지 않게 다룰 수 있는 방법이 있을까 고민하다가 밈을 이용해 보기로 했습니다. 해석이 필요한 활자에 비해 뭔가 무해한 첫인상을 가진 밈은 사람들의 경계심을 풀어주기에 좋은 소재니까요. 그래서 이번 시간에는 JavaScript 언어에 대한 밈 하나를 소개하고, 한 단계씩 해부해보도록 하겠습니다. 오늘의 밈 이보다 무해할 수 없는 뚱이와, 이<img src= "https://img1.카지노 쿠폰.net/thumb/R1280x0/?fname=http%3A%2F%2Ft1.카지노 쿠폰.net%2Fbrunch%2Fservice%2Fuser%2F5xeg%2Fimage%2FYs8IiH_K2I6bqYATXAMvomg7RKg.png" width="500" /그림으로 쉽게 보는 TCP - 그래서 TCP/IP의 TCP가 뭘까/@@5xeg/352023-11-30T07:06:04Z2021-06-24T14:57:25Z저번 시간에 우리는 원활한 인터넷 통신을 위한 프로토콜인 IP에 대해 알아봤습니다. IP는 데이터가 원하는 주소로 정확하게 전송될 수 있도록 사회적으로 약속한 규약이었죠. 그러나 사실 정확하게 원하는 정보를 주고받기 위해서는 우리가 생각하는 것보다 더 많은 규약이 필요합니다. 택배만 하더라고 도착은 했지만 내용물이 다를 때, 배송 지연이 될 때 등 다양한 <img src= "https://img1.카지노 쿠폰.net/thumb/R1280x0.fjpg/?fname=http%3A%2F%2Ft1.카지노 쿠폰.net%2Fbrunch%2Fservice%2Fuser%2F5xeg%2Fimage%2FKwTzdEJgP39UZg3eCU6E1GewBfQ.JPG" width="500" /심리테스트 서비스"나와 닮은 개발자 찾기" 개발기 - 개발자가 얘기하는 심리테스트 기획부터 개발까지/@@5xeg/332022-06-22T15:17:23Z2021-04-27T16:46:08ZMBTI의 흥행 때문인지 스낵 컬처의 유행 때문인지는 잘 모르겠으나 요 근래 가볍게 즐길 수 있는 심리테스트가 유행하는 것 같습니다. 최근에는 기업들도 홍보를 위해 자체적으로 심리테스트를 만들면서 이제 심리테스트는 단순 오락거리가 아닌 마케팅이나 행동심리를 분석하는 수단으로도 활용되고 있다고 생각합니다. 저 또한 평소 MBTI를 좋아하고 단톡방에 심리테스<img src= "https://img1.카지노 쿠폰.net/thumb/R1280x0/?fname=http%3A%2F%2Ft1.카지노 쿠폰.net%2Fbrunch%2Fservice%2Fuser%2F5xeg%2Fimage%2FOGb70nLFpxTlFxzhKpZ-jC9Lmcs.png" width="500" /보기 좋은 코드가 쓰기에도 좋다 - gist로 brunch에서 깔끔하게 코드 작성하기/@@5xeg/282021-08-01T06:18:26Z2021-01-31T15:37:09Z많은 개발자들이 다양한 플랫폼에서 개발 블로그를 운영하고 있고 저 또한 이런저런 고민 끝에 브런치에 정착하게 되었습니다. 깔끔한 UI 때문에 만족하며 쓰고 있지만 코드를 깔끔하게 올리는 기능인 코드 스니펫이 지원되지 않았기에 선뜻 브런치를 추천하기엔 걸리는 감이 없지 않아 있었습니다. 개발자들에게 코드는 생명이니까요. 그러던 중 다행히도 작년 말에 브런<img src= "https://img1.카지노 쿠폰.net/thumb/R1280x0/?fname=http%3A%2F%2Ft1.카지노 쿠폰.net%2Fbrunch%2Fservice%2Fuser%2F5xeg%2Fimage%2F2yPsT1vMZhEGtcsCeH4vwyOkIdQ.png" width="500" /100일 뒤의 나는 변화했을까? - 카카오 프로젝트 100 시즌3 참여 후기/@@5xeg/302023-11-03T03:04:25Z2021-01-10T14:35:54Z작년에 카카오 프로젝트 100과 관련한 포스팅을 읽은 기억이 있습니다. '기술 아티클 읽기'라는 프로젝트를 주최한 소감과 그 당시 올렸던 글들을 크롤링하여 정리한 글이었는데 당시 IT업계에 들어간 지 얼마 되지 않았던 저는 개발과 관련해서 이런 루틴을 만들 수도 있다는 사실을 처음 알게 된 순간이었기에 한동안 그 글이 기억에 오래 머물러있었습니다. 아쉽게<img src= "https://img1.카지노 쿠폰.net/thumb/R1280x0.fjpg/?fname=http%3A%2F%2Ft1.카지노 쿠폰.net%2Fbrunch%2Fservice%2Fuser%2F5xeg%2Fimage%2FYTv32C9hFVBq4sihgwOdmQ7XPs0.jpeg" width="500" /언택트 시대를 사는 개발자의 2020년 회고 - 코로나 19가 내게 가져다준 일상의 변화들/@@5xeg/312023-11-03T03:01:25Z2020-12-31T09:23:41Z언택트 시대에서 1년 간 살아본 후기 얼마 전 재미있는 밈을 발견했습니다. 2020년을 한 단어로 요약하는 트윗이었는데 표현 방식은 각자 다르지만 모두 한 마음으로 올 한 해를 생각하는 것 같아 공감이 많이 되더군요. 저 또한 올 한 해를 요약하자면 밈의 내용과 크게 다르지 않을 것 같습니다. 이토록 평범한 일상이 절실했던 순간도 없었으니까요. 그럼에도 시<img src= "https://img1.카지노 쿠폰.net/thumb/R1280x0.fjpg/?fname=http%3A%2F%2Ft1.카지노 쿠폰.net%2Fbrunch%2Fservice%2Fuser%2F5xeg%2Fimage%2FYz_2bWMuULHZqKo2a42bvScVW70.jpeg" width="500" /개발자 취업은 처음이라 - 평범한 문과 개발자가 취업을 위해 시작한 세 가지/@@5xeg/292023-12-12T15:12:31Z2020-12-19T15:12:45Z마냥 계속될 줄 알았던 취준 생활도 마무리가 되었습니다. 두려움 반 패기 반으로 다니던 회사를 그만두고 개발자 취업 준비를 시작한 작년의 저는 어느덧 모 게임 회사의 웹 프런트엔드 신입 개발자가 되었습니다. 신기하게도 취준생일 때보다 공부해야 할 것들은 더 늘어났지만, 소크라테스의 입을 빌리자면 뭘 모르는지 모르는 상태에서 뭘 모르는지 아는 상태가 되었기 <img src= "https://img1.카지노 쿠폰.net/thumb/R1280x0.fjpg/?fname=http%3A%2F%2Ft1.카지노 쿠폰.net%2Fbrunch%2Fservice%2Fuser%2F5xeg%2Fimage%2FiX51VqXSU6ZAQAIaaLXYFFjrKN8.jpeg" width="500" /CSS flexbox 톺아보기 - 2. 자식 요소 속성 - 효과적으로 레이아웃을 배치할 수 있는 flexbox 속성을 알아보자/@@5xeg/262022-04-28T05:23:52Z2020-10-24T03:33:54Z지난 포스트에서 flexbox 속성 중 부모 요소에 적용되는 속성들을 정리했다면, 이번 포스트에서는 자식 요소에 적용하는 속성에 대해 알아보겠습니다. 자식 요소 속성 order 자식 요소 간 순서를 정의하는 속성입니다. 기본값은 0이며 z-index와 동일하게 값이 작아질수록 최상단에 위치합니다. li { order: 0; /*default*/ }<img src= "https://img1.카지노 쿠폰.net/thumb/R1280x0/?fname=http%3A%2F%2Ft1.카지노 쿠폰.net%2Fbrunch%2Fservice%2Fuser%2F5xeg%2Fimage%2Frl_rVcwBaV7D7mIv9H7FR4lk61Y.jpg" width="500" /CSS flexbox 톺아보기 - 1. 부모 요소 속성 - 효과적으로 레이아웃을 배치할 수 있는 flexbox 속성을 알아보자/@@5xeg/252023-05-01T11:53:07Z2020-10-18T06:19:20ZFlexbox는 브라우저의 크기 혹은 요소의 크기가 동적이거나 명시되지 않은 경우에 문서 내의 공간에 대한 배치, 정렬 및 분산을 효율적으로 작업할 수 있게 돕는 CSS 모듈입니다. 단순하게 말하자면 반응형 웹과 같이 레이아웃의 유연성이 요구되는 상황에서 필요한 모듈이라고 볼 수 있죠. 인터넷 익스플로러 11부터 사용이 가능하기 때문에 이전 버전을 지원하기<img src= "https://img1.카지노 쿠폰.net/thumb/R1280x0/?fname=http%3A%2F%2Ft1.카지노 쿠폰.net%2Fbrunch%2Fservice%2Fuser%2F5xeg%2Fimage%2FAv8c6a__2icOOzGsO0ltKwcxD54.jpg" width="500" /