분류 전체보기190 Indexed DB와 dexie.js (feat. 브라우저에 데이터를 저장하는 방법 비교) 브라우저에 데이터 저장하는 방법과 비교 브라우저에 데이터를 저장하는 방법으로는 아래와 같이 크게 4가지가 있다. 방법 만료기간 설정 가능 여부 브라우저가 닫혀도 데이터 유지 오프라인 환경에서도 데이터 유지 저장공간 특징 쿠키 O O X 4KB local storage X (사용자가 수동으로 삭제하지 않는 이상 데이터가 계속 남아있음) O X session stotage와 함께 전체 10MB 같은 origin에서는 어떤 창이든, 탭이든 데이터를 공유함 session storage X (탭이 종료되면 데이터 삭제) X X session stotage와 함께 전체 10MB indexed db X (사용자가 수동으로 삭제하지 않는 이상 데이터가 계속 남아있음) O O 브라우저의 전체 Disk용량의 80%까지 사.. 2024. 3. 29. [nuxt3] plugin 기능과 definePageMeta를 활용한 웹 내 페이지 검색 기능 구현 🎯목표 이렇게 페이지의 타이틀을 검색하면 검색 결과가 나오고, 클릭하면 routing이 되는 기능을 구현해 볼 것이다. 1. 먼저 plugins 폴더가 없다면 폴더를 생성하고 하위 파일을 생성한다. 공식문서에 따르면 "Nuxt는 자동으로 plugins 디렉토리의 파일을 읽고 Vue 애플리케이션 생성 시 로드합니다." 라고 되어있다. 이제 이 기능을 활용해서 웹페이지가 로드될 때 useRouter로 앱에 있는 모든 router 정보를 긁어올 것이다. https://nuxt.com/docs/guide/directory-structure/plugins plugins/ · Nuxt Directory Structure Nuxt automatically reads the files in your plugins di.. 2023. 8. 7. [nuxt] nuxt3 + vue3 개념 및 용법 정리 🔎nuxt 폴더 구조 . ├── assets/ ├── components/ ├── layouts/ ├── middleware/ ├── pages/ ├── plugins/ ├── static/ ├── store/ ├── nuxt.config.js └── package.json assets 이미지, 스타일시트 및 기타 자산을 저장하는 디렉토리. 이 자산은 빌드 후에 /_nuxt/ 디렉토리에 복사됨. components Vue.js 컴포넌트를 저장하는 디렉토리. layouts 애플리케이션의 레이아웃을 저장하는 디렉토리. 레이아웃은 페이지 컴포넌트를 렌더링할 때 사용됨. middleware 미들웨어 함수를 저장하는 디렉토리. 미들웨어는 페이지 렌더링 전에 실행됨. pages 애플리케이션의 페이지 컴포넌트를 저장.. 2023. 5. 10. 코드 스플릿팅(Code splitting) 이란? 코드 스플릿팅(Code splitting)은 웹 애플리케이션에서 자바스크립트 파일의 크기를 줄이고, 초기 로드 속도를 개선하기 위해 사용되는 기술입니다. 일반적으로, 웹 애플리케이션은 하나의 큰 자바스크립트 파일을 사용합니다. 그러나 이러한 방식은 파일 크기가 매우 크고, 브라우저에서 로딩하는 데에 시간이 오래 걸리므로 초기 로드 속도가 느려질 수 있습니다. 이를 해결하기 위해 코드 스플릿팅 기술을 사용합니다. 코드 스플릿팅은 큰 자바스크립트 파일을 작은 파일들로 분할하는 기술입니다. 이렇게 작은 파일들은 필요에 따라 로드되며, 초기 로드시 필요하지 않은 코드들은 로드되지 않습니다. 이를 통해 초기 로드 속도가 개선되고, 사용자가 웹 애플리케이션을 사용하는 동안 필요한 코드들만 로드하여 자원의 낭비를 줄.. 2023. 3. 14. 서버 사이드 렌더링과 Nuxt.js 📝 목차 클라이언트 사이드 렌더링 서버 사이드 렌더링 서버 사이드 렌더링과 클라이언트 사이드 렌더링 차이점 서버 사이드 렌더링의 장점 서버 사이드 렌더링의 단점 Nuxt란? Nuxt를 쓰는 이유? 📌 클라이언트 사이드 렌더링 뷰 싱글 페이지 어플리케이션은 클라이언트 사이드 렌더링 방식 서버에서 브라우저로 빈 HTML을 보내고, 화면에서 js로 DOM을 그려주는 방식 이벤트가 발생할 경우 서버로 가지않고 화면에서 값을 변경하는 방식 클라이언트 사이드 렌더링을 이해하기 위해서 뷰 CLI로 생성된 프로젝트의 실행 결과를 살펴보겠습니다. 아래는 뷰 CLI로 생성한 프로젝트의 기본 코드입니다. // src/main.js import Vue from .. 2023. 3. 14. [블록체인] 하이퍼렛져 1. 퍼블릭 블록체인의 한계 퍼블릭 블록체인에는 다음과 같은 한계점이 있습니다. 확장성 퍼블릭 블록체인은 모든 노드가 모든 거래를 처리하고 검증해야 하기 때문에 확장성에 한계가 있습니다. 이는 블록체인 네트워크가 대규모 거래 처리에 어려움을 겪게 되는 원인이 됩니다. 성능 퍼블릭 블록체인은 분산 시스템으로 구성되어 있기 때문에 데이터를 처리하고 검증하는 데 시간이 오래 걸릴 수 있습니다. 이는 대규모 거래 처리에 필수적인 빠른 처리 속도를 보장하지 못하게 됩니다. 개인 정보 보호 퍼블릭 블록체인은 모든 거래 정보가 공개되는 특성을 가지고 있어, 개인 정보 보호에 취약합니다. 이는 블록체인 기술을 의료나 금융과 같은 민감한 분야에서 적용하는 데 제한을 둘 수 있는 원인이 됩니다. 비용 퍼블릭 블록체인에서는.. 2023. 3. 13. 이전 1 2 3 4 ··· 32 다음
