본문 바로가기

📄Today I Learned41

Local Storage 📦 로컬 스토리지(LocalStorage)로컬 스토리지(LocalStorage)는 웹 브라우저에 데이터를 영구적으로 저장할 수 있는 클라이언트 사이드 저장소입니다.한 번 저장된 데이터는 사용자가 브라우저 데이터를 지우거나 캐시를 삭제하기 전까지 유지됩니다. 다만 로컬에 데이터를 저장하기 때문에 다른 사람과 업로드한 데이터를 공유 할수는 없다라는 단점이 있습니다.로컬 스토리지의 특징영구 저장브라우저를 닫거나 컴퓨터를 재부팅해도 데이터가 삭제되지 않습니다.도메인 단위로 저장같은 도메인 내에서는 저장된 데이터를 공유할 수 있습니다.다른 도메인에서는 접근할 수 없습니다.용량 제한대략 5~10MB 정도의 데이터를 저장할 수 있습니다.브라우저마다 차이가 있을 수 있습니다.문자열(String)만 저장 가능모든 데이.. 2024. 12. 29.
나만 폰트가 적용이 안돼? VSCode 경로 문제로 인한 삽질 기록 이번 팀을 소개하는 홈페이지를 만드는 프로젝트에서 저는 멤버정보를 자세히 볼수 있는 Modal window을 구현하는 파트를 맡았습니다. 여러가지 라이브러리를 이용해서 열심히 꾸미고 있었는데 아무리 폰트를 넣어도 폰트 적용이 되지 않는 것이였던 거 아니겠어요? 아니 폰트하나 가지고 몇 시간을 투자하는 제 자신이 너무 답답했어요😭 CDN 링크도 빠뜨리지 않았고 폰트 선언과 폰트 패밀리 사용도 했는데 아무리 해도 적용이 안되는데..? 대체 이유가 뭐지 라는 생각을 계속 하면서 영상도 찾아보고 구글링도 해봤지만 바뀌는 건 없었습니다. 혹시나 해서 경로 문제인가? 싶은 생각이 들었고 경로를 상위폴더로 변경 폰트가 적용이 된다!! 근데 왜지...? 1️⃣ Alt + B (브라우저에서 열기)Alt + B는 VSC.. 2024. 12. 26.
Git과 Github 1. Linux 필수 명령어      Desktop 폴더를 더블 클릭한 것과 같은 효과이며 Desktop으로 이동한 후에 내부의 다른 폴더로도 이동이 가능하다." .. " 은 한 단계 위의 폴더라는 뜻이다." cd 폴더명/폴더명 " 으로 한번에 더 깊이 들어갈 수 있다.    2. Git & Github 의 개념 1. 코드관리를 시작하는 명령어(git init)git init(initialise)은 프로젝트 시작전 딱 한번만 입력하면 됨정확한 프로젝트 폴더(경로)에서 입력해야 함입력 시 .git이라는 폴더가 생성됨2. 코드를 저장하는 명령어 git add & commitgit add 파일명 git commit -m "메세지 작성" (메세지 부분은 내가 무슨코드를 짰는지 자세하게)왜 저장 명령어가 2개일까.. 2024. 12. 25.
수량을 올리고 내리고 싶다면? 조금 더 개선할 사항이 어떤 것일까 고민하던 중에 만약 내가 4개를 주문해야하는데 5번을 눌러버리면 다시 삭제후 4번을 클릭해야하는 번거로움이 있을 수 있다고 판단해서 주문 내역에 추가로 갯수를 올리고 내릴수 있는 " - " " + "버튼을 추가해 보았습니다. JavaScript 변경된 코드 // 주문 내역 업데이트 함수 function updateOrderList() { orderList.innerHTML = ''; for (let itemName in order) { const orderItem = order[itemName]; const orderItemElement = document.createElement('li'); .. 2024. 12. 20.
CSS의 상속개념 📌Today I learned 결론부터 말하면 CSS에는 상속개념이 있어서 내가 특정 값을 주지 않아도 그 값에 포함되는 것들은 모두 영향을 받는다는 것입니다. 이게 갑자기 두서없이 무슨 소리냐? 할 텐데 위에 사진을 보면서 같이 얘기를 나눠볼까 합니다.  모든 코드를 다 작성하고 주문 내역에 추가 박스를 넣고 각각 의 주문 리스트와 삭제 버튼을 가지런하게 정렬하려는 과정에서 문제점을 찾았습니다. 보시는 것처럼 삭제 버튼이 선택된 박스 내에서 중앙에 있어야하는데 아랫쪽으로 치우쳐져 있는 상황입니다.   근데 문제는 저는 이미 align-items 를 이용해 세로 가운데 정렬을 한 상태였기 때문에 "딸기 요거트 블렌디드" 라는 텍스트와 삭제 버튼은 세로로 가운데 정렬이 되어야 정상인데 말이죠! 그리고 그.. 2024. 12. 19.