Для обучения я работал над приложением CRUD и хочу знать, как лучше всего писать код.Html

Программисты Html
Ответить
Anonymous
 Для обучения я работал над приложением CRUD и хочу знать, как лучше всего писать код.

Сообщение Anonymous »

Код: Выделить всё

let fetchURL = "https://jsonplaceholder.typicode.com/posts/";

const form = document.getElementById("post-form");

const title_input = document.getElementById("title-input");

const body_input = document.getElementById("body-input");

const posts_container = document.getElementById("posts-container");

const saveBtn = document.getElementById("save-btn");

const removeSaveBtn = document.getElementById("remove-save-btn");

let editId = null;

let globalIdx = null;

let globalData = [];

function getSaveData() {
let savedData = JSON.parse(localStorage.getItem("saveData"));

if (savedData) {
globalData = savedData;

renderData(globalData);

return true;
} else {
return false;
}
}

getSaveData();

if (getSaveData() == false) {
console.log("No saved data found, Fetching new data");

fetchData();
}

function renderData(data) {
posts_container.innerHTML = "";

data.forEach((element, idx) => {
posts_container.innerHTML += `

${element.title}

${element.body}

Edit

Delete



`;
});
}

async function fetchData() {
try {
let response = await fetch(fetchURL);

globalData = await response.json();

if (response.ok) {
console.log(globalData);

renderData(globalData);
}
} catch (error) {
console.log("something went wrong");
}
}

form.addEventListener("submit", async (e) => {
e.preventDefault();

const title = title_input.value.trim();

const body = body_input.value.trim();

let data_object = {
title: title,

body: body,

userId: 1,
};

if (editId) {

globalData[globalIdx].title = title_input.value;

globalData[globalIdx].body = body_input.value;

globalData[globalIdx].id = editId;

globalData[globalIdx].userId = 1;

renderData(globalData);

globalIdx = null;

editId = null;
} else {
globalData.push(data_object);

renderData(globalData);
}

form.reset();
});

function editItem(index) {
title_input.value = globalData[index].title;

body_input.value = globalData[index].body;

editId = globalData[index].id;

globalIdx = index;
}

function deleteItem(index) {
globalData.splice(index, 1);

renderData(globalData);
}

saveBtn.addEventListener("click", () => {
console.log("Data is successfully saved.");

localStorage.setItem("saveData", JSON.stringify(globalData));
});

removeSaveBtn.addEventListener("click", () => {
console.log("save data is being removed");

localStorage.removeItem("saveData");
});
Я создал приложение CRUD для своего обучения, в настоящее время я только новичок и не знаю, каковы лучшие практики, это код js, я использовал AI, чтобы получить оптимизированный код, но я подумал, что мне также следует посоветоваться по stackoverflow. Я хочу знать все, что можно улучшить в этом коде. А также то, сколько кода в день полезно для начинающих. Любой совет будет принят во внимание.

Подробнее: https://stackoverflow.com/questions/799 ... est-practi
Ответить

Быстрый ответ

Изменение регистра текста: 
Смайлики
:) :( :oops: :roll: :wink: :muza: :clever: :sorry: :angel: :read: *x)
Ещё смайлики…
   
К этому ответу прикреплено по крайней мере одно вложение.

Если вы не хотите добавлять вложения, оставьте поля пустыми.

Максимально разрешённый размер вложения: 15 МБ.

Вернуться в «Html»