빵 입니다.

리액트 기반의 개인 플젝을 하려 했으나 회사 업무에 치이고 개인 시간을 활용하지 못해 결국 아무것도 하지 못했다. 결국 변명뿐... 창피하다... 책을 읽고자 하는 노력은 꾸준히 하고 있어서 하반기엔 소설도 한 권 읽고 지금은 네트워크 도서를 읽고 있다. 이 책을 다 읽고 다시 한번 읽으면서 리눅스 책을 접해야겠다. 이사도 완료했고 운동도 다시 시작했고.. 다시 생활 패턴을 잡는 일만 남았다! 개인 시간을 어떻게 알차게 사용할지 생각해 보자!

📌 프로토콜- 기기가 서로 통신할 때는 양쪽 모두 이해할 수 있는 언어(프로토콜)를 사용해야 한다. - 기기가 인터넷에서 서로 어떻게 통신해야 하는지, 오류가 발생했을 때 무엇을 해야 하는지에 관한 규칙 🧿 프로토콜이 할 수 있는 질문❓ 한 패킷을 다른 패킷에 넣을 수 있을까? ❓ 패킷에 패킷 헤더가 없으면 어떻게 할까? ❓ 패킷의 크리는 얼마일까? ❓ 수신자 주소를 찾을 수 없으면 어떻게 해야 할까? ❓ 패킷을 수정할 수 있을까? ❓ 패킷 헤더에는 어떤 세부 사항들이 들어가야 할까? ❓ 패킷이 분실되면 어떻게 할까? 🧿 프로토콜의 종류같은 종류의 통신에도 다양한 프로토콜 유형이 사용된다. 대표적으로 아래와 같은 프로토콜들이 패킷을 한 노드에서 다른 노드로 전송하는 방법을 결정한다. - TCP(Tr..

📌 패킷이란?🧿 패킷(packet)인터넷 상에서 두 디바이스(또는 노드)가 서로 채팅 메시지, 그림, 비디오 등을 주고받을 때 이미지나 텍스트는 그대로 교환되지 않는다. 대신 패킷 형태로 교환되거나 그룹화된다. 네트워크 패킷은 크게 '발송 정보'와 '콘텐츠'의 두 체계로 이루어진 데이터 단위이다. - 발송 정보는 편지 봉투에 적는 주소 - 콘텐츠는 편지 봉투 안에 있는 편지 우리가 주고받는 데이터는 한 패킷 안에 담길 수 없을 만큼 양이 많다. 그래서 인터넷 프로토콜은 모든 데이터의 구조를 해체한 다음 여러 개의 패킷으로 쪼개 전송한다. 각 패킷에는 발신 및 수신 주소가 포함된 주소 태그가 지정되는데, 마치 택배 보낼 때 운송장을 붙이는 것과 같다. 주소 태그는 패킷 헤더(packet header)에..

📌 노드와 네트워크🧿 노드(node) - 정보를 주고받는 모든 네트워크에 있는 기기 - 모든 노드는 주소를 가지고 있다. - 노드는 쓰임새에 따라 여러 종류가 있다. 👉🏻 네트워크에 연결된 하드웨어를 노드라고 하고, 이 노드들은 모두 주소를 갖고 있다. ◾ 인터넷에서는 IP 주소가 이런 네트워크 주소 역할을 한다. 🧿 라우터(router) - 한 네트워크를 다른 네트워크에 연결할 때 중간 노드가 되는 기기(중개자 역할) - IP 패킷을 한 네트워크에서 다른 네트워크로 옮기는 역할 🧿 IP 패킷(packet) - 인터넷 트래픽을 구성하는 데이터 조각 📌 서버와 클라이언트🧿 서버(server) - 네트워크를 통해 서비스를 제공하는 노드 - 네트워크의 다른 노드로부터 연결을 받아들이고, 서비스 ..

📌 GET method🧿 경로 매개변수 (Route Parameters)URL 경로의 일부로 포함되어 전송되는 파라미터특정 리소스를 식별할 때 사용// 요청GET /user/123// 서버측 라우터app.get('/user/:id', (req, res) => { const userId = req.params.id; res.send(`User ID: ${userId}`);});===> :id는 경로 매개변수로, req.params.id로 접근할 수 있다.  🧿 쿼리 문자열 (Query Parameters)URL의 끝에 ? 뒤에 key=value 형태로 전송되는 파라미터검색 조건, 필터링 옵션 등을 전달할 때 사용// 요청GET /search?q=express&page=2// 서버측 라우터app.g..

라인 차트를 사용하는데, 기본적으로 흐린 라인이었다가 포커스가 가면 Point Dot과 라인에 색상이 입혀지는 디자인이 나왔다. 어찌저찌 레퍼런스에서 라인 색상 hover 전, 후를 대응하는 속성값들을 찾아서 적용했는데,아무리 찾아도 툴팁 레이블 색상과 레전드의 레이블 색상을 변경하는 방법을 모르겠더라. 그래도 똑같이 구현하고 싶고, 또 전혀 없을 것 같은 내용은 아니라 열심히 찾아보았다.역시나 없을리가 없지~다른 분들의 시간 절약을 위해 공유해 보겠습니다. 우선, 차트 마우스오버 효과를 주기 위한 설정값들입니다.import { type ChartData } from 'chart.js'const lineChartData = reactive>({ labels: ['January', 'February', ..

const options = reactive({ plugins: { }, scales: { x: { ticks: { font: { size: 16 } } }, y: { ticks: { font: { size: 16 } } } }})

📌 현재 작업 중인 파일들 stash 생성하기 git stash git stash save 📌 stash 리스트 보기 git stash list ``` 　stash@{0}: abc 　stash@{1}: xyz 　stash@{1}: pqr ``` 📌 모든 stash 삭제 git stash clear 📌 특정 stash 삭제 git stash drop stash@{index} ``` 　git stash drop stash@{0} ``` 📌 stash@{7}보다 오래된 모든 stash 삭제 while git stash drop 'stash@{8}'; do true; done 📌 가장 최근의 stash 적용 git stash apply 📌 특정 stash 적용 git stash apply  stas..