0xVantrex / 0xVantrex/DevHub-JS

Build LocalStorage persistence (js/storage.js)

Đang mở Phù hợp với người mới
#3 0 bình luận 0 reaction 1 người được giao Được @aganyo360 nhận Xem trên GitHub
LocalStorage
Ngôn ngữ chính
HTML
Star
0
Fork
0
Chỉ số merge pull request
Không có pull request nào được merge trong 30 ngày

Mô tả

Goal

Ensure all profiles (added, edited, or deleted) are saved automatically and loaded again when the page reloads — no data loss.

File Ownership

You fully own:
/js/storage.js
Only you touch this file. You create all functions related to saving and loading profiles.

Learning Concepts

JSON.stringify() and JSON.parse()

Browser localStorage API

Exporting and importing JS functions

Code modularization and function reusability

Functional Requirements
1. Create saveProfiles(profilesArray)

This function receives the current list of profiles (an array of objects) and saves it to localStorage.

function saveProfiles(profilesArray) {
localStorage.setItem("profiles", JSON.stringify(profilesArray));
}

Every time a profile is added, edited, or deleted — other modules will call this function to update storage.

2. Create loadProfiles()

This function loads the saved profiles from localStorage when the app starts.

Steps:

Get the stored item:

const storedData = localStorage.getItem("profiles");

If data exists, parse and return it:

if (storedData) {
return JSON.parse(storedData);
}

Otherwise, return an empty array:

return [];

Final version:

function loadProfiles() {
const storedData = localStorage.getItem("profiles");
return storedData ? JSON.parse(storedData) : [];
}

3. Export Both Functions
export { saveProfiles, loadProfiles };

4. Integration Example

In app.js or profiles.js, teammates will call your functions like this:

When App Starts

import { loadProfiles } from "./storage.js";

let profiles = loadProfiles();

When Profiles Are Updated

import { saveProfiles } from "./storage.js";

saveProfiles(profiles);

Definition of Done

Profiles persist even after page reload.

saveProfiles() and loadProfiles() work without breaking anything.

No duplication or undefined data.

No console errors.

Code is modular, clear, and fully commented.

(Optional)

Add a timestamp when saving (e.g., lastSaved: new Date()).

Log in console when saving/loading occurs for debugging.

Hướng dẫn đóng góp

Chưa lập chỉ mục được hướng dẫn đóng góp cho kho mã nguồn này

Hướng nghiên cứu

The work is isolated to /js/storage.js. Start by creating the file and implementing the saveProfiles and loadProfiles functions as described. Test by integrating them into app.js or profiles.js to ensure profiles persist across page reloads. Check for console errors and verify data is saved and loaded correctly using the browser's developer tools.

Do mô hình lập chỉ mục viết ra từ nội dung của issue.

Đánh giá

Công nghệ
javascript
Lĩnh vực
frontend
Loại issue
Tính năng
Độ khó
2/5
Thời gian dự kiến
1-3 giờ
Mức độ hoạt động
Đình trệ
Độ rõ ràng
Đặc tả rõ ràng
Mức phù hợp với người mới
75/100

Nhận issue mới trong hộp thư của bạn

Bản tóm tắt ngắn những issue GitHub phù hợp với người mới.