개발일기

사내에서 Go 스터디를 하며, 그리고 react 프로젝트를 진행하며 궁금했던 점에 대해 찾아보고 동료분들께 공유한 내용입니다. 궁금했던 점Map 자료구조의 CRUD 작업이 Big-O(1)인데, 어떻게 메모리에 값이 저장되길래 이러한 연산 속도가 나오는 것일까? ## youtube 강의 채널과 카카오톡 Go 단톡방에 질문했던 내용 ##Q. Map 객체에서 데이터를 어떻게 관리하는지, 데이터를 비연속적으로 저장할 경우 데이터 지역성('tucker의 go언어 프로그래밍' p464)에 기반한 메모리 load가 되지 않아 효율적인 DS라고 할 수 있는지Q. map이 insert, delete, access 하는데 시간이 O(1)이여서 효과적이라고 하는데,map 내부적으로 key값에 해당하는 value값이 저장되는..

* GNB, LNB란? - GNB, LNB, FNB 는 매장에서 고객들이 자주 찾는 물건을 눈에 잘 띄는 위치에 배치해 빠른 구매를 이끌어내듯이, 웹 사이트에서 고객이 찾는 카테고리를 빠르게, 어디서나 확인할 수 있도록 하는 구성을 뜻한다. - GNB(Global Navigation Bar) - 웹 사이트 전체에 동일하게 적용되는 네비게이션 바 - 보통 웹사이트 최상단에 위치하며 어떤 페이지를 클릭해도 동일하게 보여진다. - 웹사이트가 제공하는 모든 서비스를 표현하며, 직관적으로 구성하는 것이 좋다. - LNB(Local Navigation Bar) - GNB를 클릭하거나 호버 했을 때 나오는 하위 카테고리 리스트 - FNB(Foot Navigation Bar) - GNB와 동일하게 모든 웹페이지 가장 ..

SPOF(Single Point Of Failure, 단일 장애점)은 시스템 구성 요소 중에 동작 하지 않으면 전체 시스템이 중단되는 요소를 말한다. cf) https://ko.wikipedia.org/wiki/%EB%8B%A8%EC%9D%BC_%EC%9E%A5%EC%95%A0%EC%A0%90

'함수형 프로그래밍'은 코드 작성 '스타일'이다. 함수형 프로그래밍 개념을 어떤 프로그래밍 언어에도 사용가능하다. clojure와 scala는 아예 함수형 프로그래밍으로 설계된 언어이고 빌트인 기능이 있어 함수형 코드를 작성하기 쉽다.(cf, Clojure, F#, Elixir, Erlang) 함수형 프로그래밍을 배우면, 프로그래밍 문제를 해결할 때 유용한 새로운 관점과 접근 방식을 얻을 수 있다. 함수형 방식에서는 버그 자체가 발생하기 어렵다. 왜 함수형프로그래밍이 좋을까? 이 이유를 알려면 명령형(imperative) 코드, 선언형(declarative) 코드간의 차이를 살펴야 한다. *선언형 코드 원하는 결과를 표현하기 위해 코드가 작성(ex, '토스트를 만들어줘') 원하는 결과를 얻기 위해 필쵸한..

button A button B button C 이벤트를 걸어줄 때, 요소 하나 하나마다 addEventListener를 통해 걸게 되면, 성능이 안좋게 된다. 따라서 event를 걸어줄 요소들의 부모에 event를 걸어주면, 성능을 향상 시킬 수 있다. 즉, event를 걸어줄 요소들의 부모로 event 처리를 위임하는 것이다. 위에 코드에서는 각 button 들에 addEventListener를 등록하는 것이 아니라 menu라는 클래스를 갖는 부모 div element에 event를 등록하는 것이다. 하지만 이러한 경우, 아래의 상황을 처리해야한다. 부모에 이벤트를 걸어줬기 때문에, 그 부모 내에서 어떤 자식요소(어떤 버튼)를 클릭했는지를 구분할 수 있는 작업이 필요하다. 구분할 수 있는 방법으로는 ..

[ CORS ] - Cross Origin Resource Sharing https://www.youtube.com/watch?v=bW31xiNB8Nc 내용 6분 30초까지 정리 https://www.youtube.com/watch?v=-2TgkKYmJt4 내용 12분까지 정리 한 사이트에서 주소가 다른 서버로 요청을 보낼 때 발생하는 문제. 상황에 따라 http 요청을 보낼 때 정상 작동하는 곳이 있기도 한데, 정상 작동하지 않는 곳도 있다. 어디에서 보내는 요청이 막히는 것인지 알아야 한다. 웹사이트에서 ajax 요청을 보낼 때마다 작동이 안되는데, 웹사이트를 여는 곳 즉, 크롬, 엣지, 사파리 같은 브라우저에서 일어나는 문제이다. 다시 말해 프론트엔드에서 일어나는 문제. 브라우저에서 내가 작업하는 ..

본 글은 드림 코딩 엘리의 강의를 정리한 글입니다. cf) https://www.youtube.com/watch?v=iZ9csAfU5Os&t=140s [ 역사로 알아보는 csr과 ssr ] 1990 중반 까지 - static sites ( 서버 내에 이미 배포되어 있는 html 문서를 받아와서 화면에 보여주는 형식) but 문제: 페이지 내 다른 링크 클릭 시 서버에서 다시 해당 html 문서를 받아와 페이지 전체가 업데이트 되는 문제. 1996 - 문서 내에서 또 다른 문서를 담을 수 있는 iframe 태그가 도입됨에 따라 페이지 내에서 부분적으로 문서를 받아와서 업데이트를 할 수 있게 되었다. 1998 이후 - XMLHttpRequest(fetch API의 원조)로 html 문서 전체가 아닌, jso..

vue router 설치 후 App.vue에서 로 루트 경로에 해당하는 컴포넌트를 띄우도록 하려고 하였다. 그런데, 콘솔 창에 아래와 같은 경고창이 나며 화면이 출력되지 않았다. 이 문제는 콘솔 창에서 router-view 태그를 커스텀 element로 인식하기 위해서 충고해주고 있듯이, router-view 태그를 인식하지 못하고 있음을 알 수 있다. 곧, (나의 경우) router-view를 프로젝트에서 사용하겠다는 것을 명시해줘야 하는 상황이였다. main.js 에서 프로젝트에 사용하겠다는 것을 명시해주지 않아 발생했던 문제로, 위 코드로 해결하였다...! 기본적인 것을 놓치지 말자..!!

1시간 20분 정도 전화면접을 진행했다.전화 면접을 하며 들었던 것들을 최대한 적어보려고 했다.기초적인 자료구조만 나온다고 지인한테 들었는데, 웹 개발자로서 알아야 할 전반에 대해 꽤 deep 하게 여쭤보셔서 당황스러웠었다.지인은 안드로이드 쪽으로 면접을 진행했다고 하긴 했는데, 그래도 이렇게 난이도 차이가 날줄이야.. 지인한테 뭘 잘못했나 싶기도 하면서, 열심히 공부해야겠다는 생각을 하게 됬다.😂웹 전반 렌더링 하는 과정html 화면 렌더링되는 과정레이아웃과 페인트 - 배치하는 과정(repaint, reflow)csr, ssr의 차이화면에 보여지는 타이밍과 렌더링 되는 타이밍(tti, ttv)cf) https://searching-power.tistory.com/13cors - SOP 정책 / 브라우..

백기선님 유튜브 개발자 고민 상담 1회('우리 진짜로 대화를 나눠봅시다.')를 들으며 기억하고 싶은 내용들을 적어서 올립니다. Q 커리어 패스란 무엇인가? 직장을 바뀌는 것 / 전문분야를 찾아가는 것일까 3,4년 마다 면접을 보는 것은 개발자 본인에게 health check를 하는 것과 같다. 많은 곳에서 다른 기술을 사용한다고 그 기술로 갈아타지 말고, 내가 사용하는 기술에 더 전문적으로 갈고 닦이면 다른 기술을 볼 때도 별로 위화감이 들지 않는다. 회사 이직할 때 코어 개발하는 쪽에 있어야 한다. 만약 코어 개발에 있지 않다면, 코어 쪽으로 가기 위한 인식을 늘 갖고 있어야 한다. 이직을 할 때 기술이 중심인 회사인지 혹은 컨텐츠가 중심인 회사인지 잘 판단하고 기술이 중심인 회사로 이직을 해야한다. ..