[Computer Science] 네트워크 기초 익혀먹기
·
Development Study/CS(Computer Science)
컴퓨터 사이언스, 우리가 흔히 CS라고 부르는 이 분야는 모든 관련분야의 시작이라고 불릴 정도로 매우 근본적이고도 매우 중요합니다. 저의 경우에는 이 CS 지식이 앞으로 개발자로 살아가는데 많은 도움을 줄 것이라고 생각합니다. 그럼 지금부터 네트워크 기초를 익혀먹어보도록 할까요? 물론 이 글에서 모든 기초를 담고있지는 않지만 중요한 개념에 대해 다루어 두었습니다. 도움이 되었으면 좋겠습니다. 무엇을 목표하나요? 네트워크 정보를 확인하는 방법을 이해해봅니다. 리눅스의 네트워크 관련 개념을 이해하고 중요 명령어를 익혀봅니다. 리눅스의 시스템 설정 명령어를 익혀봅니다. 시스템 구분 1. 노드 (Node) 인터넷에 연결된 시스템의 가장 일반적인 용어입니다. 노드는 컴퓨터 또는 다른 장치로 구성된 인터넷에 연결된..
[React] useMemo 쓰지 마세요?
·
Development Study/Frontend
최근 useEffect 대응방안에서 useMemo를 사용해서 개선하는 방향과 관련된 글을 쓰다가 생각난 건데, 어떤 글에서 useMemo를 쓰지 말라는 주제로 글이 있던 것이 생각났습니다. 그래서 이참에 이것도 알아보기로 하였죠. 왜 useMemo를 쓰면 안 되는 건지, 그전에 useMemo는 무엇인지부터 알아보고 가도록 하겠습니다. 이전 글 보고오기 [React] 왜 React에서는 useEffect의 사용을 추천하지 않을까? - Side Effect 관리 React는 페이스북에서 개발한 강력한 프론트엔드 라이브러리 입니다. 상당히 많은 부분에서 useEffect 훅을 이용하여 개발을 진행하는데, React에서는 useEffect를 지양하고 있다고 합니다. 이번 글에서 time-map-installer..
[React] useEffect 쓰지 마세요?
·
Development Study/Frontend
React는 페이스북에서 개발한 강력한 프론트엔드 라이브러리입니다. 상당히 많은 부분에서 useEffect 훅을 이용하여 개발을 진행하는데, React에서는 useEffect를 지양하고 있다고 합니다. 이번 글에서는 useEffect 훅을 지양하는 이유가 무엇인지, 그리고 연관되어 있는 개념인 Side Effect 관리에 대해 알아보겠습니다. 1. Side Effect란 무엇인가? Side Effect는 컴포넌트 외부에 영향을 미치는 작업을 의미합니다. 예를 들어보면 데이터 가져오기, 네트워크 요청, 로컬 스토리지 접근 등이 여기에 해당됩니다. React 컴포넌트는 Side Effect 관리를 위해서 useEffect 훅을 제공합니다. 2. 불필요한 Side Effect로 인한 성능 저하 useEffec..
[SEO] 서비스의 검색 엔진 순위를 높여보자, 헤더에 SEO 적용하기
·
Development Study/Frontend
SEO(검색 엔진 최적화)는 웹사이트의 검색 엔진 순위를 높이기 위한 중요한 요소 입니다. 웹사이트를 아무리 잘 만들어 두어도 검색이 되지 않는다면 사용자는 쉽게 들어오지 않을 것이고, 결국 그러한 서비스는 오래가지 못한다는 특성을 가지고 있습니다. 오늘 알아볼 것은 프론트엔드의 헤더에 SEO를 어떻게 적용하면 좋을 지에 대한 내용입니다. SEO(Search Engine Optimization)란 무엇일까? SEO는 "검색 엔진 최적화"를 의미합니다. 주위에서 많이 사용하는 Google, Bing, Naver 등의 검색 엔진에서 웹사이트가 더 잘 보이도록 향상시키는 과정을 말합니다. 페이지가 검색 결과에서 보이는 정도가 더 좋을수록, 발견되고 클릭되는 확률이 올라갑니다. 결국에는 검색 엔진 최적화의 목표..
[Recoil vs Redux] Frontend Engineer를 위한 React 상태관리 도구 알아보기
·
Development Study/Frontend
프로젝트의 고도화가 진행되던 중, 이제는 전역 상태관리 도구를 이용하여 관련된 작업을 해야겠다 느꼈습니다. 리액트를 사용하고 있는 저는 리액트에서 쓸 수 있는 상태관리 툴들에 대해 알아보아야겠다 싶었습니다. 따라서 작성 시점 기준의 정보를 가지고 상태관리 툴에 대한 리서치를 시작하겠습니다. 상태관리(State Management)란 무엇일까? 상태관리는 프론트엔드 엔지니어링에서 중요한 개념이라고 볼 수 있습니다. 조금 더 쉽게 설명 해보자면 프론트엔드 단에서 관리되는 "시간이 지남에 따라 변경되는 모든 데이터에 대한 상태"를 관리하는 것을 말합니다. 프론트엔드 서버에서만 오가는 데이터 뿐만 아니라 백엔드와 네트워크와 소통하는 과정에서 이동하는 데이터 또한 이 상태관리에 해당됩니다. 만약 쇼핑몰에 들어간다..
[D3.js] 강력한 성능의 시각화 라이브러리, D3.js에 대해 알아보자
·
Development Study/Frontend
D3.js 라는 이름을 들어 보셨나요? "Data-Driven Documents"의 줄임말인 D3.js는 웹 표준을 이용해 데이터를 시각화하는 데 사용되는 강력한 자바스크립트 라이브러리입니다. 주로 프론트엔드 고도화의 주제로 많이 쓰이며 시각화 중에 가장 복잡하고 커스터마이징이 자유롭다는 특징을 가지고 있습니다. D3.js란 무엇인가? D3.js는 웹에서 데이터를 시각화하기 위한 도구로서, 대화형 그래프와 동적인 시각화를 만드는 데에 주로 사용됩니다. DOM, HTML, CSS, SVG 등의 웹 표준 기술을 활용해 사용자의 데이터를 브라우저 상에서 시각적으로 표현할 수 있게 해줍니다. D3.js의 중요한 특징 중 하나는 '데이터 중심' 접근법입니다. 즉, D3.js는 주어진 데이터를 바탕으로 웹 문서의 ..