{"id":28919417,"url":"https://github.com/luizrebelatto/poc-web-storage","last_synced_at":"2026-04-29T04:39:09.203Z","repository":{"id":293928765,"uuid":"985531486","full_name":"Luizrebelatto/poc-web-storage","owner":"Luizrebelatto","description":"POC to study difference between cookies, localstorage, sessionStorage and indexedDB","archived":false,"fork":false,"pushed_at":"2025-05-23T01:28:28.000Z","size":54,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-06-22T03:08:57.782Z","etag":null,"topics":["cookies","indexeddb","javascript","localstorage","sessionstorage","vuejs","web"],"latest_commit_sha":null,"homepage":"","language":"Vue","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/Luizrebelatto.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null}},"created_at":"2025-05-18T00:57:30.000Z","updated_at":"2025-05-23T01:28:31.000Z","dependencies_parsed_at":"2025-05-18T01:44:51.234Z","dependency_job_id":null,"html_url":"https://github.com/Luizrebelatto/poc-web-storage","commit_stats":null,"previous_names":["luizrebelatto/poc-web-storage"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/Luizrebelatto/poc-web-storage","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Luizrebelatto%2Fpoc-web-storage","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Luizrebelatto%2Fpoc-web-storage/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Luizrebelatto%2Fpoc-web-storage/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Luizrebelatto%2Fpoc-web-storage/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Luizrebelatto","download_url":"https://codeload.github.com/Luizrebelatto/poc-web-storage/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Luizrebelatto%2Fpoc-web-storage/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":261229094,"owners_count":23127555,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["cookies","indexeddb","javascript","localstorage","sessionstorage","vuejs","web"],"created_at":"2025-06-22T03:08:54.349Z","updated_at":"2026-04-29T04:39:09.198Z","avatar_url":"https://github.com/Luizrebelatto.png","language":"Vue","funding_links":[],"categories":[],"sub_categories":[],"readme":"# POC Web Storage\n\n## How to run Locally\n1. Clone repository\n```\nhttps://github.com/Luizrebelatto/poc-web-storage.git\n```\n2. Run `yarn install` and `npm install`\n3. Run `yarn dev` and `npm run dev`\n4. access this url `http://localhost:5173`\n5. Login\n```\nemail: test@test.com\npassword: 123456\n```\n\n### Cookies\n- Browser can create, edit, update cookies\n- cookies last until the browser is closed\n- limited size (~4 KB por cookie)\n- string (key=value)\n- Use Cases\n  - user preferences\n  - login\n- create\n```\nSet-Cookie: \u003ccookie-name\u003e=\u003ccookie-value\u003e\n\nexample:\n\ncreate a cookie with an expiration date\n\nSet-Cookie: id=a3fWa; Expires=Thu, 31 Oct 2021 07:28:00 GMT;\n\n```\n- update cookie\n```\ndocument.cookie = \"yummy_cookie=chocolate\";\n```\n- Enable security\n```\nSet-Cookie: id=a3fWa; Expires=Thu, 21 Oct 2021 07:28:00 GMT; Secure; HttpOnly\n```\n\n### sessionStorage\n- Limit size ~5–10 MB\n- Only on the current tab\n- When the tab is closed the data is deleted\n- Format type string\n- Use Cases\n - temporary data\n - filter\n - multi-form\n```\nsessionStorage.setItem(\"nome\", \"João\");\n\nlet nome = sessionStorage.getItem(\"nome\");\nconsole.log(nome);\n\nsessionStorage.removeItem(\"nome\");\n\nsessionStorage.clear();\n```\n\n### localStorage\n- Limit size ~5–10 MB\n- persists until it is deleted\n- share between tabs\n- Use Cases\n - temporary data\n - filter\n - multi-form\n```\n// create\nconst usuario = { id: 1, nome: \"luiz\", idade: 24 };\nlocalStorage.setItem(\"user\", JSON.stringify(user));\n\n// edit\nlet user = JSON.parse(localStorage.getItem(\"user\"));\nuser.age = 25;\nlocalStorage.setItem(\"user\", JSON.stringify(user));\n\n// Remove\nlocalStorage.removeItem(\"user\");\n\n// Clean\nlocalStorage.clear();\n\n```\n\n### IndexedDB\n- application can work offline and online\n- 100MB+\n- format JSON\n- \n```\n// open database\nconst request = window.indexedDB.open(\"MyTestDatabase\", 3);\n\nconst customerData = [\n  { ssn: \"444-44-4444\", name: \"Bill\", age: 35, email: \"bill@company.com\" },\n  { ssn: \"555-55-5555\", name: \"Donna\", age: 32, email: \"donna@home.org\" },\n]\n\nrequest.onupgradeneeded = (event) =\u003e {\n  // Save the IDBDatabase interface\n  const db = event.target.result;\n\n  // Create an object\n  const objectStore = db.createObjectStore(\"name\", { keyPath: \"myKey\" });\n};\n\nrequest.onerror = (event) =\u003e {\n  console.error(\"Why didn't you allow my web app to use IndexedDB?!\");\n};\n\nrequest.onsuccess = (event) =\u003e {\n  db = event.target.result;\n};\n\n```\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fluizrebelatto%2Fpoc-web-storage","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fluizrebelatto%2Fpoc-web-storage","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fluizrebelatto%2Fpoc-web-storage/lists"}