تو راهم!! سفر کدنویسی من

من روی اولین پروژه زندگی ام کار می کردم. این اولین باری است که من در واقع کد را به تنهایی انجام می دهم. به این معنی که من از 19 سالگی کد را می دیدم اما هرگز به آن توجه کامل نداشتم. من معمولا فقط برای گذراندن کلاس کدنویسی میکردم، اما هیچ وقت واقعاً برای آن تلاش نکردم. قبل از اینکه از FlatIron لذت ببرم، دانش اولیه بسیار کمی از نحو داشتم.
من در این بوت کمپ شگفت انگیز ثبت نام کردم زیرا دوستانی دارم که واقعاً در این زمینه کار می کنند.
من نمیدانستم برای یک پروژه چه کار کنم تا اینکه وقتی بچه بودم یکی از کارتونهای مورد علاقهام را دیدم که دیجیمون بود، بنابراین سعی کردم به کدنویسی فکر کنم. مثل برق روی سرم بود. یادم می آید قبلاً کارت های دیجیمون داشتم و واقعاً از آنها لذت می بردم.
یک مشکل بزرگ برای من زمانی بود که باید در مورد api یاد می گرفتم. برای من کمی گیج کننده بود. قبل از اینکه دیجیمون را انتخاب کنم، همه آن دسته از api عمومی را بررسی میکردم که دادههای زیادی دارند. یکی از دلایل اصلی دریافت api digimon عمومی این بود که فقط نام، تصویر و سطح دارد. این واقعاً به من کمک زیادی کرد تا بفهمم کجا و چگونه از api استفاده کنم. چگونه واقعاً از واکشی استفاده کنیم. دادههای بهدستآمده از یک API را میتوان به روشهای مختلف در برنامه یا سیستم شما پردازش، تحلیل، نمایش یا استفاده کرد.
کار بر روی پروژه خود با api و fetch به من کمک کرد تا بفهمم که هر دو مربوط به درخواست HTTP از یک برنامه سمت سرویس گیرنده به سرور برای بازیابی داده ها یا انجام اقدامات هستند که واقعاً جالب است.
const digimonContainer = document.getElementById(“digimon-container”);
واکشی (“https://api.example.com/digimon”)
.then(response => answer.json())
.then(data => {
const digimons = data;
digimons.forEach(digimon => {
const digimonCard = document.createElement("div");
digimonCard.classList.add("digimon-card");
const digimonName = document.createElement("h2");
digimonName.textContent = digimon.name;
const digimonImage = document.createElement("img");
digimonImage.src = digimon.image;
const digimonLevel = document.createElement("p");
digimonLevel.textContent = `Level: ${digimon.level}`;
digimonCard.appendChild(digimonName);
digimonCard.appendChild(digimonImage);
digimonCard.appendChild(digimonLevel);
digimonContainer.appendChild(digimonCard);
});
})
.catch(خطا => {
console.error(“Error:”, error);
})؛
این کد فقط Digimon api را دریافت می کند و آرایه ای از اشیاء Digimon را برمی گرداند. هر شی حاوی ویژگی هایی مانند نام، تصویر و سطح است. با استفاده از Fetch، درخواست GET را به نقطه پایانی api میدهد، دادههای JSON بازیابی شده را پردازش میکند، و عناصر HTML را برای نمایش اطلاعات digimon در صفحه ایجاد میکند.
من برای ادامه دادن به این سفر هیجان زده هستم و تجربیاتم را با شما به اشتراک می گذارم. من می خواهم به یادگیری ادامه دهم و در مورد سفر برنامه نویسی خود پست خواهم گذاشت.