From bf98c081ca0bb9053d0abe45d6e822b1a9dbc513 Mon Sep 17 00:00:00 2001 From: "localizeflow[bot]" Date: Fri, 6 Mar 2026 17:46:07 +0000 Subject: [PATCH] chore(i18n): sync translations with latest source changes (chunk 1/1, 12 changes) --- translations/bn/.co-op-translator.json | 10 +- .../README.md | 890 ++++++++-------- translations/bn/AGENTS.md | 418 ++++---- translations/bn/README.md | 240 ++--- translations/mr/.co-op-translator.json | 10 +- .../README.md | 916 +++++++++-------- translations/mr/AGENTS.md | 382 +++---- translations/mr/README.md | 219 ++-- translations/ne/.co-op-translator.json | 10 +- .../README.md | 964 ++++++++++-------- translations/ne/AGENTS.md | 342 +++---- translations/ne/README.md | 274 ++--- 12 files changed, 2494 insertions(+), 2181 deletions(-) diff --git a/translations/bn/.co-op-translator.json b/translations/bn/.co-op-translator.json index 063b80bae..cdc357b10 100644 --- a/translations/bn/.co-op-translator.json +++ b/translations/bn/.co-op-translator.json @@ -1,7 +1,7 @@ { "1-getting-started-lessons/1-intro-to-programming-languages/README.md": { - "original_hash": "d45ddcc54eb9232a76d08328b09d792e", - "translation_date": "2025-11-03T22:28:30+00:00", + "original_hash": "bec5e35642176d9e483552bfc82996d8", + "translation_date": "2026-03-06T17:29:49+00:00", "source_file": "1-getting-started-lessons/1-intro-to-programming-languages/README.md", "language_code": "bn" }, @@ -493,7 +493,7 @@ }, "AGENTS.md": { "original_hash": "a362efd06d64d4134a0cfe8515a86d34", - "translation_date": "2026-02-06T16:37:00+00:00", + "translation_date": "2026-03-06T17:43:46+00:00", "source_file": "AGENTS.md", "language_code": "bn" }, @@ -516,8 +516,8 @@ "language_code": "bn" }, "README.md": { - "original_hash": "6d6385fd098088cb2d690fb0a6cdaedc", - "translation_date": "2026-02-06T16:32:46+00:00", + "original_hash": "a2c9eed480687319517c08a6319e5536", + "translation_date": "2026-03-06T17:24:35+00:00", "source_file": "README.md", "language_code": "bn" }, diff --git a/translations/bn/1-getting-started-lessons/1-intro-to-programming-languages/README.md b/translations/bn/1-getting-started-lessons/1-intro-to-programming-languages/README.md index 75101ce08..dd2f1fb49 100644 --- a/translations/bn/1-getting-started-lessons/1-intro-to-programming-languages/README.md +++ b/translations/bn/1-getting-started-lessons/1-intro-to-programming-languages/README.md @@ -1,183 +1,181 @@ -# প্রোগ্রামিং ভাষা এবং আধুনিক ডেভেলপার টুলসের পরিচিতি +# প্রোগ্রামিং ভাষাসমূহ ও আধুনিক ডেভেলপার সরঞ্জামগুলোর পরিচিতি -হ্যালো, ভবিষ্যৎ ডেভেলপার! 👋 আমি কি তোমাকে এমন কিছু বলতে পারি যা আমাকে প্রতিদিনই শিহরিত করে? তুমি শিখতে যাচ্ছ যে প্রোগ্রামিং শুধুমাত্র কম্পিউটার নিয়ে নয় – এটি এমন এক ক্ষমতা যা তোমার সবচেয়ে বন্য ধারণাগুলোকে বাস্তবে রূপ দিতে পারে! +হ্যালো, ভবিষ্যতের ডেভেলপার! 👋 আমি কি তোমাকে এমন কিছু বলতে পারি যা প্রতিদিন আমাকে রোমাঞ্চিত করে? তুমি শীঘ্রই আবিষ্কার করবে যে প্রোগ্রামিং শুধুমাত্র কম্পিউটার সংক্রান্ত নয় – এটি তোমার সবচেয়ে অবিশ্বাস্য ধারণাগুলো জীবন্ত করার জন্য সত্যিকারের অতিপ্রাকৃত ক্ষমতা পাওয়ার ব্যাপার! -তুমি কি সেই মুহূর্তটি জানো যখন তুমি তোমার প্রিয় অ্যাপ ব্যবহার করছ এবং সবকিছু একদম নিখুঁতভাবে কাজ করছে? যখন তুমি একটি বোতামে চাপ দাও এবং কিছু একেবারে জাদুকরী ঘটে যা তোমাকে "ওয়াও, তারা এটা কীভাবে করল?" বলতে বাধ্য করে। ঠিক এমন কেউ – সম্ভবত রাত ২টায় তাদের প্রিয় কফি শপে তৃতীয় এসপ্রেসো পান করতে করতে – সেই কোড লিখেছে যা সেই জাদু তৈরি করেছে। এবং যা তোমার মনকে উড়িয়ে দেবে তা হলো: এই পাঠের শেষে, তুমি শুধু বুঝতে পারবে না তারা কীভাবে এটি করেছে, বরং তুমি নিজেই এটি চেষ্টা করতে উদগ্রীব হয়ে উঠবে! +তুমি কি সেই মুহূর্তটি জানো, যখন তুমি তোমার প্রিয় অ্যাপ ব্যবহার করছ, আর সবকিছু নিখুঁতভাবে কাজ করছে? যখন তুমি একটা বাটনে ট্যাপ করো এবং কিছু অবিশ্বাস্য ঘটনা ঘটে যা তোমাকে বলায় "আরে, ওরা এটা কীভাবে করল?" ঠিক সেইটাই—তোমার মতোই কেউ, সম্ভবত রাত ২টায় তাদের প্রিয় কফি শপে বসে তৃতীয় এস্প্রেসো পান করে, সেই জাদু তৈরি কোড লিখেছিল। আর এখানে যা তোমার মস্তিষ্ক ঘুরিয়ে দেবে: এই পাঠ শেষ হওয়ার আগে তুমি শুধু বুঝতে পারবে কিভাবে তারা এটা করেছিল তাই নয়, তোমাও নিজে যেন চেষ্টা করার জন্য উদ্বুদ্ধ হয়ে উঠবে! -শোনো, যদি প্রোগ্রামিং এখন তোমার কাছে ভয়ঙ্কর মনে হয়, আমি পুরোপুরি বুঝতে পারি। যখন আমি প্রথম শুরু করেছিলাম, আমি সত্যিই ভেবেছিলাম যে তোমাকে কোনো গণিতের জিনিয়াস হতে হবে বা পাঁচ বছর বয়স থেকেই কোডিং করতে হবে। কিন্তু যা আমার দৃষ্টিভঙ্গি পুরোপুরি বদলে দিয়েছিল তা হলো: প্রোগ্রামিং নতুন ভাষায় কথোপকথন শেখার মতো। তুমি "হ্যালো" এবং "ধন্যবাদ" দিয়ে শুরু করো, তারপর কফি অর্ডার করতে শেখো, এবং কিছুদিনের মধ্যে তুমি গভীর দার্শনিক আলোচনা করতে পারো! তবে এই ক্ষেত্রে, তুমি কম্পিউটারের সাথে কথোপকথন করছ, এবং সত্যি বলতে? তারা সবচেয়ে ধৈর্যশীল কথোপকথন সঙ্গী – তারা কখনো তোমার ভুলের বিচার করে না এবং তারা সবসময় আবার চেষ্টা করতে প্রস্তুত! +দেখো, আমি পুরোপুরি বুঝতে পারি যদি এখনই প্রোগ্রামিং তোমাকে একটু কঠিন মনে হয়। যখন আমি শুরু করছিলাম, আমি সত্যি ভাবতাম তোমাকে হতে হবে কেউ গণিতের মাস্টার বা পাঁচ বছর বয়স থেকেই কোডিং করে আসা। কিন্তু যা আমার দৃষ্টিভঙ্গি পুরো বদলে দিয়েছিল তা হলো: প্রোগ্রামিং ঠিক যেমন নতুন একটি ভাষায় কথোপকথন শেখার মতো। তুমি শুরু করো "হ্যালো" এবং "ধন্যবাদ" দিয়ে, তারপর কফি অর্ডার করার মতো কথা বলতে শিখো, আর হঠাৎ করে গভীর দার্শনিক আলোচনা করো! তবে এখানে, তুমি কম্পিউটারদের সঙ্গে কথোপকথন করছ, এবং সত্যিই? তারা সবচেয়ে ধৈর্যশীল কথোপকথন সঙ্গী—তারা তোমার ভুলের বিচার করে না এবং সব সময় আবার চেষ্টা করতে উৎসাহী! -আজ, আমরা সেই অসাধারণ টুলগুলো অন্বেষণ করব যা আধুনিক ওয়েব ডেভেলপমেন্টকে শুধু সম্ভবই করে না, বরং একেবারে নেশাসক্ত করে তোলে। আমি বলছি ঠিক সেই এডিটর, ব্রাউজার এবং ওয়ার্কফ্লো যা Netflix, Spotify এবং তোমার প্রিয় ইন্ডি অ্যাপ স্টুডিওর ডেভেলপাররা প্রতিদিন ব্যবহার করে। এবং যা তোমাকে আনন্দে নাচতে বাধ্য করবে তা হলো: এই পেশাদার-গ্রেড, ইন্ডাস্ট্রি-স্ট্যান্ডার্ড টুলগুলোর বেশিরভাগই সম্পূর্ণ বিনামূল্যে! +আজ, আমরা অন্বেষণ করব অসাধারণ সরঞ্জামগুলি যা আধুনিক ওয়েব ডেভেলপমেন্টকে শুধু সম্ভব করেই না, বরং অতিবার আসক্তিকর করে তোলে। আমি কথা বলছ আজীবনের একই সম্পাদক, ব্রাউজার এবং ওয়ার্কফ্লো নিয়ে যা Netflix, Spotify এবং তোমার প্রিয় ইন্ডি অ্যাপ স্টুডিও প্রতিদিন ব্যবহার করে। আর এখানে যা তোমাকে উল্লসিত করবে: এই পেশাদার মানসম্পন্ন, শিল্প-মানের সরঞ্জামগুলোর বেশিরভাগ সম্পূর্ণ ফ্রি! -![প্রোগ্রামিং পরিচিতি](../../../../translated_images/bn/webdev101-programming.d6e3f98e61ac4bff.webp) -> স্কেচনোট: [Tomomi Imura](https://twitter.com/girlie_mac) +![Intro Programming](../../../../translated_images/bn/webdev101-programming.d6e3f98e61ac4bff.webp) +> স্কেচনোট [Tomomi Imura](https://twitter.com/girlie_mac) দ্বারা ```mermaid journey - title Your Programming Journey Today - section Discover - What is Programming: 5: You - Programming Languages: 4: You - Tools Overview: 5: You - section Explore - Code Editors: 4: You - Browsers & DevTools: 5: You - Command Line: 3: You - section Practice - Language Detective: 4: You - Tool Exploration: 5: You - Community Connection: 5: You + title আজকের আপনার প্রোগ্রামিং যাত্রা + section আবিষ্কার করুন + প্রোগ্রামিং কি: 5: You + প্রোগ্রামিং ভাষাসমূহ: 4: You + সরঞ্জাম পর্যালোচনা: 5: You + section অনুসন্ধান করুন + কোড সম্পাদকগণ: 4: You + ব্রাউজার এবং ডেভটুলস: 5: You + কমান্ড লাইন: 3: You + section অনুশীলন + ভাষা গোয়েন্দা: 4: You + সরঞ্জাম অনুসন্ধান: 5: You + সম্প্রদায়ের সংযোগ: 5: You ``` +## চল, দেখি তুমি ইতিমধ্যেই কী জানো! -## দেখা যাক তুমি আগে থেকেই কী জানো! +মজা শুরু করার আগে, আমি জানতে আগ্রহী—তুমি এখনো প্রোগ্রামিং জগত সম্পর্কে কী জানো? আর শোনো, যদি তুমি এই প্রশ্নগুলো দেখে ভাবো "আমার একদমই ধারনা নেই," সেটা একদম ঠিক আছে, বরং এটা নিখুঁত! এর মানে তুমি একেবারে সঠিক জায়গায় রয়েছো। এই কুইজটাকে এক ধরণের ওয়ার্ম-আপ ভাবো – আমরা স্মৃতিশক্তির পেশী গরম করছি! -মজার অংশে যাওয়ার আগে, আমি জানতে চাই – তুমি এই প্রোগ্রামিং জগত সম্পর্কে আগে থেকেই কী জানো? এবং শুনো, যদি তুমি এই প্রশ্নগুলো দেখে ভাবো "আমি সত্যিই এর কিছুই জানি না," তাহলে সেটি শুধু ঠিকই নয়, বরং একদম পারফেক্ট! এর মানে তুমি ঠিক সঠিক জায়গায় আছ। এই কুইজটিকে একটি ওয়ার্কআউটের আগে স্ট্রেচিংয়ের মতো ভাবো – আমরা শুধু মস্তিষ্কের পেশিগুলো গরম করছি! +[পূর্ব-পাঠের কুইজ নাও](https://ff-quizzes.netlify.app/web/) -[পূর্ব-পাঠ কুইজ নাও](https://forms.office.com/r/dru4TE0U9n?origin=lprLink) -## আমরা যে অভিযানে যাচ্ছি একসাথে +## আমরা আজ যে অভিযানে যাচ্ছি -ঠিক আছে, আমি সত্যিই উত্তেজনায় লাফাচ্ছি আজ আমরা যা অন্বেষণ করতে যাচ্ছি তা নিয়ে! সত্যি বলতে, আমি তোমার মুখ দেখতে চাই যখন কিছু ধারণা তোমার মাথায় ক্লিক করবে। এখানে আমাদের অবিশ্বাস্য যাত্রা: +ঠিক আছে, আজ আমরা যা অন্বেষণ করবো তা নিয়ে আমি সত্যিই উচ্ছ্বসিত! সত্যি বলতে, আমি তোমার মুখটা দেখতে চাই যখন এই ধারণাগুলোর কোনটা তোমার জন্য স্পষ্ট হয়ে ওঠবে। এখানে আমাদের অবিশ্বাস্য যাত্রা: -- **প্রোগ্রামিং আসলে কী (এবং কেন এটি সবচেয়ে কুল জিনিস!)** – আমরা আবিষ্কার করব কীভাবে কোড আসলে অদৃশ্য জাদু যা তোমার চারপাশের সবকিছু চালিত করে, সেই অ্যালার্ম থেকে যা জানে এটি সোমবার সকাল, সেই অ্যালগরিদম পর্যন্ত যা তোমার Netflix রিকমেন্ডেশন নিখুঁতভাবে সাজায়। -- **প্রোগ্রামিং ভাষা এবং তাদের অসাধারণ ব্যক্তিত্ব** – কল্পনা করো একটি পার্টিতে ঢুকেছ যেখানে প্রত্যেকের সম্পূর্ণ ভিন্ন ক্ষমতা এবং সমস্যার সমাধানের পদ্ধতি আছে। প্রোগ্রামিং ভাষার জগত ঠিক এরকম, এবং তাদের সাথে পরিচিত হতে তোমার ভালো লাগবে! -- **ডিজিটাল জাদু ঘটানোর মৌলিক নির্মাণ ব্লকগুলো** – এগুলোকে চূড়ান্ত সৃজনশীল LEGO সেট হিসেবে ভাবো। একবার তুমি বুঝতে পারবে কীভাবে এই অংশগুলো একসাথে ফিট করে, তুমি বুঝতে পারবে তুমি যা কল্পনা করো তা তৈরি করতে পারো। -- **পেশাদার টুল যা তোমাকে মনে করাবে যেন তোমাকে একটি জাদুকরের ছড়ি দেওয়া হয়েছে** – আমি এখানে নাটকীয় হচ্ছি না – এই টুলগুলো সত্যিই তোমাকে মনে করাবে যেন তোমার সুপারপাওয়ার আছে, এবং সবচেয়ে ভালো অংশ? এগুলোই প্রোরা ব্যবহার করে! +- **প্রোগ্রামিং আসলে কী (এবং কেন এটা সবচেয়ে দারুণ জিনিস!)** – আমরা আবিষ্কার করবো কিভাবে কোড হল অদৃশ্য জাদু যা তোমার চারপাশের সবকিছু চালায়, সেই অ্যালার্ম থেকে যা সোমবার সকাল বুঝে নেয়ো, সেই অ্যালগরিদম পর্যন্ত যা নিখুঁতভাবে তোমার Netflix সুপারিশ করে +- **প্রোগ্রামিং ভাষাসমূহ এবং তাদের অসাধারণ বৈশিষ্ট্য** – কল্পনা করো এমন একটি পার্টিতে গিয়ে যেখানে প্রত্যেকে সম্পূর্ণ ভিন্ন অতিপ্রাকৃত ক্ষমতা এবং সমস্যা সমাধানের পন্থা নিয়ে আছে। প্রোগ্রামিং ভাষার জগৎ ঠিক এমনটাই, এবং তুমি তাদের সাথে পরিচিত হতে ভালোবাসবে! +- **মৌলিক নির্মাণ ব্লক যা ডিজিটাল জাদু ঘটায়** – এগুলোকে ভাবো একটি চূড়ান্ত স্রষ্টামূলক LEGO সেট হিসেবে। একবার কিভাবে এই টুকরোগুলো একসাথে কাজ করে বুঝলে, তুমি অফুরন্ত কিছুই তৈরি করতে পারবে তোমার কল্পনার নাম অনুসারে +- **পেশাদার সরঞ্জাম যা তোমাকে মনে করাবে তোমার কাছে যাদুর ছড়ি এসেছে** – আমি নাটকীয়তা করছি না — এই সরঞ্জামগুলো সত্যিই তোমাকে অতিপ্রাকৃত অধিকার পাওয়ার মত অনুভূতি দেবে, আর সবচেয়ে ভাল কথা? এগুলোই প্রফেশনালরা ব্যবহার করে! -> 💡 **মজার বিষয়**: আজ সবকিছু মনে রাখার চেষ্টা করো না! এখন আমি শুধু চাই তুমি সম্ভাবনার প্রতি উত্তেজনা অনুভব করো। আমরা একসাথে অনুশীলন করার সময় বিস্তারিত বিষয়গুলো স্বাভাবিকভাবেই মনে থাকবে – আসল শেখা এভাবেই হয়! +> 💡 **মর্ম কথা:** আজকে সবকিছু মুখস্থ করার চেষ্টা করো না! এখন শুধু এটা অনুভব করো যে কি সম্ভব তা নিয়ে তোমার মধ্যে আগ্রহ তৈরি হচ্ছে। বিস্তারিতগুলো স্বাভাবিকভাবেই চর্চার মাধ্যমে মজবুত হবে – এরাই তো আসল শেখার পথ! -> তুমি এই পাঠটি [Microsoft Learn](https://docs.microsoft.com/learn/modules/web-development-101/introduction-programming/?WT.mc_id=academic-77807-sagibbon) এ নিতে পারো! +> তোমরা এই পাঠটি [Microsoft Learn](https://learn.microsoft.com/en-us/learn/modules/web-development-101/introduction-programming/?WT.mc_id=academic-77807-sagibbon) এ নিতে পারো! -## তাহলে প্রোগ্রামিং আসলে কী? +## তাহলে প্রোগ্রামিং আসলে *কি*? -ঠিক আছে, চলো মিলিয়ন-ডলার প্রশ্নটি মোকাবিলা করি: প্রোগ্রামিং আসলে কী? +ঠিক আছে, আসুন আমরা সেরা প্রশ্নের উত্তর দিই: প্রোগ্রামিং আসলে কী? -আমি তোমাকে একটি গল্প বলব যা আমার চিন্তাভাবনা পুরোপুরি বদলে দিয়েছে। গত সপ্তাহে, আমি আমার মাকে আমাদের নতুন স্মার্ট টিভি রিমোট ব্যবহার করতে বোঝানোর চেষ্টা করছিলাম। আমি নিজেকে বলতে শুনলাম, "লাল বোতামটি চাপো, তবে বড় লাল বোতামটি নয়, ছোট লাল বোতামটি বাম দিকে... না, তোমার অন্য বাম... ঠিক আছে, এখন এটি দুই সেকেন্ড ধরে রাখো, এক সেকেন্ড নয়, তিন সেকেন্ডও নয়..." পরিচিত শোনাচ্ছে? 😅 +আমি তোমাকে এমন একটা গল্প বলব যা আমার পুরো চিন্তা বদলে দিয়েছিল। গত সপ্তাহে, আমি আমার মাকে বোঝানোর চেষ্টা করছিলাম কিভাবে আমাদের নতুন স্মার্ট টিভির রিমোট ব্যবহার করতে হয়। আমি নিজেকে বলছিলাম, "লাল বাটন চাপবে, কিন্তু বড় লাল বাটন নয়, বাম দিকের ছোট লাল বাটনে... না, তোমার অন্য বাম... ঠিক আছে, এখন দুই সেকেন্ড ধরে ধরো, এক নয়, তিন নয়..." মনে হচ্ছে পরিচিত? 😅 -এটাই প্রোগ্রামিং! এটি অত্যন্ত বিস্তারিত, ধাপে ধাপে নির্দেশনা দেওয়ার শিল্প, এমন কিছুতে যা খুব শক্তিশালী কিন্তু সবকিছু নিখুঁতভাবে ব্যাখ্যা করা প্রয়োজন। তবে মাকে বোঝানোর পরিবর্তে (যিনি "কোন লাল বোতাম?!" জিজ্ঞাসা করতে পারেন), তুমি একটি কম্পিউটারকে বোঝাচ্ছ (যা ঠিক তাই করে যা তুমি বলো, যদিও তুমি যা বলেছ তা হয়তো তুমি যা বোঝাতে চেয়েছ তা নয়)। +এটাই প্রোগ্রামিং! এটা একটা শিল্প যেখানে খুব বিস্তারিত, ধাপে ধাপে নির্দেশ দেওয়া হয় এমন একটি শক্তিশালী সিস্টেমকে যেটাকে সবকিছু নিখুঁতভাবে স্পেল আউট করতে হয়। তবে এখানে মাকে (যিনি জিজ্ঞাসা করতে পারেন "কোন লাল বাটন?") নয়, বরং কম্পিউটারকে বোঝানো হয় (যে ঠিক তোমার কথামতো কাজ করে, যদিও তুমি ঠিক যেমনটি বলেছিলে তা বুঝতে পারো না)। -যা আমার মনকে উড়িয়ে দিয়েছিল তা হলো: কম্পিউটার আসলে তাদের মূলে বেশ সহজ। তারা মাত্র দুটি জিনিস বোঝে – ১ এবং ০, যা মূলত "হ্যাঁ" এবং "না" বা "চালু" এবং "বন্ধ।" এটাই! কিন্তু এখানেই জাদু শুরু হয় – আমাদের ১ এবং ০-এ কথা বলতে হয় না যেন আমরা The Matrix-এ আছি। এখানেই **প্রোগ্রামিং ভাষা** আমাদের উদ্ধার করে। এগুলো এমন এক সেরা অনুবাদক যা তোমার সাধারণ মানবিক চিন্তাভাবনাকে কম্পিউটার ভাষায় রূপান্তর করে। +যা আমাকে প্রথম শিখার সময় বিস্মিত করেছিল তা হলো: কম্পিউটারগুলি আসলেই মূলে খুবই সরল। তারা মাত্র দুইটি জিনিস বোঝে—১ এবং ০, যা হল "হ্যাঁ" এবং "না" বা "চালু" এবং "বন্ধ"। তাই! কিন্তু এখানেই জাদু শুরু হয়—আমাদের ১ এবং ০ তে কথা বলতে হবে না আরও বুঝি না! তখনই **প্রোগ্রামিং ভাষাসমূহ** আসেন সাহায্যে। তারা যেন বিশ্বের সেরা অনুবাদক, যারা তোমার স্বাভাবিক মানব চিন্তাভাবনাকে কম্পিউটারের ভাষায় অনুবাদ করে দেয়। -এবং যা আমাকে প্রতিদিন সকালে সত্যিই শিহরিত করে তা হলো: তোমার জীবনের প্রতিটি ডিজিটাল জিনিস শুরু হয়েছিল তোমার মতো কারো দ্বারা, সম্ভবত তাদের পায়জামা পরে কফি হাতে ল্যাপটপে কোড টাইপ করতে করতে। সেই Instagram ফিল্টার যা তোমাকে নিখুঁত দেখায়? কেউ সেটি কোড করেছে। সেই রিকমেন্ডেশন যা তোমাকে তোমার নতুন প্রিয় গানের দিকে নিয়ে গেছে? একজন ডেভেলপার সেই অ্যালগরিদম তৈরি করেছে। সেই অ্যাপ যা তোমাকে বন্ধুদের সাথে ডিনারের বিল ভাগ করতে সাহায্য করে? হ্যাঁ, কেউ ভেবেছিল "এটি বিরক্তিকর, আমি বাজি ধরে বলতে পারি এটি ঠিক করতে পারি" এবং তারপর... তারা করেছে! +আর প্রতিদিন সকালে যখন আমি উঠি তখন যা এখনো আমাকে রোমাঞ্চিত করে: তোমার জীবনের সমস্ত ডিজিটাল কিছুই শুরু হয়েছিল ঠিক তোমার মতো কারো হাত থেকে, সম্ভবত প্যাজামায় মোড়ানো, কফির কাপ হাতে নিয়ে ল্যাপটপে কোড টাইপ করতে করতে। সেই Instagram ফিল্টার যা তোমাকে পরফেক্ট দেখায়? কেউ সেটি কোড করেছিল। প্রস্তাবনা যা তোমাকে তোমার নতুন প্রিয় গানের দিকে নিয়ে গিয়েছিল? একজন ডেভেলপার সেই অ্যালগরিদম তৈরি করেছিল। সেই অ্যাপ যা তোমাকে তোমার বন্ধুদের সাথে ডিনার বিল ভাগ করতে সাহায্য করে? হ্যাঁ, কেউ ভাবল "এটা বিরক্তিকর, আমি এটা ঠিক করতে পারি" আর তারপর করেই ফেলল! -যখন তুমি প্রোগ্রামিং শিখবে, তুমি শুধু একটি নতুন দক্ষতা অর্জন করবে না – তুমি সমস্যার সমাধানকারী এই অবিশ্বাস্য সম্প্রদায়ের অংশ হয়ে উঠবে যারা তাদের দিন কাটায় ভাবতে, "যদি আমি এমন কিছু তৈরি করতে পারি যা কারো দিনকে একটু ভালো করে তোলে?" সত্যি বলতে, এর চেয়ে কুল আর কিছু হতে পারে? +যখন তুমি প্রোগ্রামিং শিখবে, তুমি শুধু একটি নতুন দক্ষতা অর্জন করছ না—তুমি এমন একটি অসাধারণ সমস্যার সমাধানকারী সম্প্রদায়ের অংশ হয়ে উঠছো যারা প্রতিদিন ভাবছে, "কী হয়, যদি আমি এমন কিছু তৈরি করি যা কারো দিন একটু ভালো করে তোলে?" সত্যি বলছি, এর থেকে আর কিছু দারুণ হতে পারে? -✅ **মজার তথ্য অনুসন্ধান**: যখন তোমার হাতে একটু সময় থাকবে তখন একটি মজার বিষয় খুঁজে বের করো – তুমি কি জানো কে ছিলেন বিশ্বের প্রথম কম্পিউটার প্রোগ্রামার? আমি একটি ইঙ্গিত দেব: এটি হয়তো তোমার প্রত্যাশিত কেউ নয়! এই ব্যক্তির গল্পটি একেবারে চমকপ্রদ এবং দেখায় যে প্রোগ্রামিং সবসময় সৃজনশীল সমস্যার সমাধান এবং বক্সের বাইরে চিন্তা করার বিষয় ছিল। +✅ **মজার তথ্য খোঁজা:** যখন ফাঁকা সময় পাবে, এটা অনুসন্ধান করো—বিশ্বের প্রথম কম্পিউটার প্রোগ্রামার কে ছিলেন বলে তুমি ভাবো? আমি তোমায় একটি ইঙ্গিত দেবো: হয়তো তুমি যা ভাবছো তা নাও হতে পারে! এই ব্যক্তির গল্প বেশ মজাদার এবং দেখায় প্রোগ্রামিং সবসময় ছিল সৃজনশীল সমস্যা সমাধান এবং সাধারণ ধারা থেকে বেরিয়ে চিন্তার ব্যাপার। -### 🧠 **চেক-ইন সময়: তুমি কেমন অনুভব করছ?** +### 🧠 **চেক-ইন সময়: কেমন লাগছে?** -**একটু সময় নিয়ে ভাবো:** -- "কম্পিউটারকে নির্দেশনা দেওয়া" ধারণাটি কি এখন তোমার কাছে পরিষ্কার? -- তুমি কি এমন কোনো দৈনন্দিন কাজের কথা ভাবতে পারো যা তুমি প্রোগ্রামিং দিয়ে স্বয়ংক্রিয় করতে চাও? -- এই পুরো প্রোগ্রামিং বিষয়টি নিয়ে তোমার মনে কী প্রশ্ন উঠছে? +**একটু ভাবো:** +- "কম্পিউটারকে নির্দেশ দেওয়ার" ধারণাটা কি এখন তোমার কাছে স্পষ্ট? +- এমন কোন কাজ আছে যা তুমি প্রোগ্রামিং দিয়ে স্বয়ংক্রিয় করতে চাও? +- প্রোগ্রামিং নিয়ে এখন তোমার মাথায় কি প্রশ্ন জাগছে? -> **মনে রাখো**: যদি কিছু ধারণা এখনো অস্পষ্ট মনে হয় তবে এটি একেবারে স্বাভাবিক। প্রোগ্রামিং শেখা নতুন ভাষা শেখার মতো – তোমার মস্তিষ্কের সেই নিউরাল পথগুলো তৈরি হতে সময় লাগে। তুমি দারুণ করছ! +> **মনে রেখো:** কিছু ধারণা যদি এখন পরিচ্ছন্ন না মনে হয় তাতে চিন্তা করার কিছু নেই। প্রোগ্রামিং শেখা হল নতুন একটি ভাষা শেখার মতো—তোমার মস্তিষ্ককে নতুন রাস্তাগুলো তৈরি করতে সময় লাগে। তুমি অসাধারণ করছ! -## প্রোগ্রামিং ভাষা বিভিন্ন ধরণের জাদুর মতো +## প্রোগ্রামিং ভাষাসমূহ হলো বিভিন্ন ধরণের জাদুর স্বাদ -ঠিক আছে, এটি অদ্ভুত শোনাতে পারে, কিন্তু আমার সাথে থাকো – প্রোগ্রামিং ভাষা অনেকটা বিভিন্ন ধরণের সঙ্গীতের মতো। ভাবো: তোমার কাছে জ্যাজ আছে, যা মসৃণ এবং স্বতঃস্ফূর্ত, রক যা শক্তিশালী এবং সরল, ক্লাসিকাল যা মার্জিত এবং গঠনমূলক, এবং হিপ-হপ যা সৃজনশীল এবং অভিব্যক্তিপূর্ণ। প্রতিটি শৈলীর নিজস্ব পরিবেশ, নিজস্ব উত্সাহী ভক্তদের সম্প্রদায় আছে, এবং প্রতিটি ভিন্ন মেজাজ এবং উপলক্ষের জন্য উপযুক্ত। +ঠিক আছে, এটা অদ্ভুত শোনাতে পারে, কিন্তু আমার সাথে থাকো—প্রোগ্রামিং ভাষাগুলো অনেকটা বিভিন্ন ধরনের সঙ্গীতের মতো। ভাবো: তোমার কাছে আছে জাজ, যা মসৃণ ও ইমপ্রোভাইজেশনভিত্তিক, রক যা শক্তিশালী ও সরল, ক্লাসিক্যাল যা উজ্জ্বল ও গঠিত এবং হিপ-হপ যা সৃজনশীল ও প্রকাশ্য। প্রতিটি ধারার নিজস্ব ভেজ, পরিপাটি ফ্যানের সম্প্রদায় এবং প্রতিটি আলাদা মেজাজ ও উপলক্ষে যথার্থ। -প্রোগ্রামিং ভাষাগুলো ঠিক একইভাবে কাজ করে! তুমি একটি মজার মোবাইল গেম তৈরি করতে যে ভাষা ব্যবহার করবে, তা দিয়ে বিশাল পরিমাণ জলবায়ু তথ্য বিশ্লেষণ করতে পারবে না, যেমন তুমি যোগব্যায়ামের ক্লাসে ডেথ মেটাল বাজাবে না (ঠিক আছে, বেশিরভাগ যোগব্যায়ামের ক্লাসে!)। +প্রোগ্রামিং ভাষাসমূহ একই রকম কাজ করে! তুমি এমন এক ভাষা ব্যবহার করবে না যা খেলাধূলার একটি মোবাইল গেম বানাতে যা বিশাল পরিমাণ জলবায়ু তথ্য বিশ্লেষণ করার জন্য দরকার, যেমন তুমি যোগ ক্লাসে ডেথ মেটাল প্লে করবে না (ঠিক আছে, বেশিরভাগ যোগ ক্লাসে না! 😄)। -তবে যা আমাকে প্রতিবারই অবাক করে তা হলো: এই ভাষাগুলো এমন এক ধৈর্যশীল, উজ্জ্বল অনুবাদক থাকার মতো যা তোমার পাশে বসে আছে। তুমি তোমার চিন্তাভাবনাগুলো এমনভাবে প্রকাশ করতে পারো যা তোমার মানব মস্তিষ্কের জন্য স্বাভাবিক মনে হয়, এবং তারা সেই জটিল কাজগুলো করে যা কম্পিউটার আসলে বোঝে। এটি এমন একজন বন্ধুর মতো যে "মানব সৃজনশীলতা" এবং "কম্পিউটার লজিক" উভয় ভাষায় পুরোপুরি দক্ষ – এবং তারা কখনো ক্লান্ত হয় না, কখনো কফি বিরতি নেয় না, এবং কখনো একই প্রশ্ন দুবার জিজ্ঞাসা করার জন্য তোমাকে বিচার করে না! +কিন্তু যা আমাকে প্রতি বার মুগ্ধ করে ভাবলে: এই ভাষাগুলো হল একদম সবচেয়ে ধৈর্যশীল, মেধাবী দোভাষী তোমার পাশে বসে আছে। তুমি তোমার ভাবনা এমনভাবে প্রকাশ করতে পারো যা তোমার মানব মস্তিষ্কের জন্য স্বাভাবিক, আর তারা সমস্ত জটিল কাজ করে ১ ও ০ তে অনুবাদ করার যা কম্পিউটার বুঝে। এটা এমন একটি বন্ধুর মত, যিনি "মানব সৃজনশীলতা" এবং "কম্পিউটার যুক্তি" উভয় ভাষাতেই নিখুঁত পারদর্শী—তারা কখনো ক্লান্ত হয় না, কখনো কফি বিরতি দরকার হয় না, এবং তোমার একই প্রশ্ন বারবার করার জন্য কখনো বিচার করে না! -### জনপ্রিয় প্রোগ্রামিং ভাষা এবং তাদের ব্যবহার +### জনপ্রিয় প্রোগ্রামিং ভাষা এবং তাদের ব্যবহার ```mermaid mindmap root((Programming Languages)) Web Development JavaScript - Frontend Magic - Interactive Websites + Frontend Magic [ফ্রন্টএন্ড জাদু] + Interactive Websites [ইন্টারেক্টিভ ওয়েবসাইটস] TypeScript - JavaScript + Types - Enterprise Apps + JavaScript + Types [জাভাস্ক্রিপ্ট + টাইপস] + Enterprise Apps [এন্টারপ্রাইজ অ্যাপস] Data & AI Python - Data Science - Machine Learning - Automation + Data Science [ডেটা সায়েন্স] + Machine Learning [মেশিন লার্নিং] + Automation [স্বয়ংক্রিয়করণ] R - Statistics - Research + Statistics [পরিসংখ্যান] + Research [গবেষণা] Mobile Apps Java - Android - Enterprise + Android [অ্যান্ড্রয়েড] + Enterprise [এন্টারপ্রাইজ] Swift iOS - Apple Ecosystem + Apple Ecosystem [অ্যাপল ইকোসিস্টেম] Kotlin - Modern Android - Cross-platform + Modern Android [আধুনিক অ্যান্ড্রয়েড] + Cross-platform [ক্রস-প্ল্যাটফর্ম] Systems & Performance C++ - Games - Performance Critical + Games [গেমস] + Performance Critical [পারফরম্যান্স ক্রিটিক্যাল] Rust - Memory Safety - System Programming + Memory Safety [মেমরি সেফটি] + System Programming [সিস্টেম প্রোগ্রামিং] Go - Cloud Services - Scalable Backend + Cloud Services [ক্লাউড সার্ভিসেস] + Scalable Backend [স্কেলেবল ব্যাকএন্ড] ``` - -| ভাষা | সেরা ব্যবহার | কেন এটি জনপ্রিয় | -|------|--------------|------------------| -| **জাভাস্ক্রিপ্ট** | ওয়েব ডেভেলপমেন্ট, ইউজার ইন্টারফেস | ব্রাউজারে চলে এবং ইন্টারঅ্যাকটিভ ওয়েবসাইট চালিত করে | -| **পাইথন** | ডেটা সায়েন্স, অটোমেশন, AI | পড়তে এবং শিখতে সহজ, শক্তিশালী লাইব্রেরি | -| **জাভা** | এন্টারপ্রাইজ অ্যাপ্লিকেশন, অ্যান্ড্রয়েড অ্যাপ | প্ল্যাটফর্ম-স্বাধীন, বড় সিস্টেমের জন্য শক্তিশালী | -| **C#** | উইন্ডোজ অ্যাপ্লিকেশন, গেম ডেভেলপমেন্ট | শক্তিশালী মাইক্রোসফট ইকোসিস্টেম সাপোর্ট | -| **Go** | ক্লাউড সার্ভিস, ব্যাকএন্ড সিস্টেম | দ্রুত, সহজ, আধুনিক কম্পিউটিংয়ের জন্য ডিজাইন করা | +| ভাষা | সেরা ব্যবহার | কেন জনপ্রিয় | +|----------|----------|------------------| +| **JavaScript** | ওয়েব ডেভেলপমেন্ট, ব্যবহারকারী ইন্টারফেস | ব্রাউজারে চলে এবং ইন্টারঅ্যাকটিভ ওয়েবসাইট চালায় | +| **Python** | ডেটা সায়েন্স, অটোমেশন, এআই | পড়তে ও শেখতে সহজ, শক্তিশালী লাইব্রেরি | +| **Java** | এন্টারপ্রাইজ অ্যাপ্লিকেশন, অ্যান্ড্রয়েড অ্যাপ | প্ল্যাটফর্ম-স্বাধীন, বড় সিস্টেমের জন্য মজবুত | +| **C#** | উইন্ডোজ অ্যাপ্লিকেশন, গেম ডেভেলপমেন্ট | শক্তিশালী মাইক্রোসফট ইকোসিস্টেম সমর্থন | +| **Go** | ক্লাউড সার্ভিস, ব্যাক-এন্ড সিস্টেম | দ্রুত, সহজ, আধুনিক কম্পিউটিংয়ের জন্য ডিজাইন করা | ### উচ্চ-স্তরের বনাম নিম্ন-স্তরের ভাষা -ঠিক আছে, এটি ছিল সেই ধারণা যা আমাকে প্রথমে বিভ্রান্ত করেছিল, তাই আমি সেই উপমা শেয়ার করতে যাচ্ছি যা অবশেষে আমার জন্য এটি পরিষ্কার করেছিল – এবং আমি সত্যিই আশা করি এটি তোমার জন্যও সাহায্য করবে! +ঠিক আছে, এটা আসলেই এমন একটি ধারণা যা আমার মস্তিষ্ক ভেঙে দিয়েছিল যখন আমি প্রথম শিখছিলাম, তাই আমি সেই রূপকটি শেয়ার করব যা আমাকে শেষ পর্যন্ত বুঝতে সাহায্য করেছিল—আশা করি এটা তোমার জন্যও সাহায্য করবে! -কল্পনা করো তুমি এমন একটি দেশে গিয়েছ যেখানে তুমি ভাষা জানো না, এবং তোমার খুব জরুরি প্রয়োজন কাছের বাথরুম খুঁজে বের করার (আমরা সবাই এই পরিস্থিতিতে পড়েছি, তাই না? 😅): +ধরো তুমি এমন একটি দেশে যাচ্ছো যেখানে তুমি ভাষা বলতে পারো না, আর অবিলম্বে তোমার কাছে সবচেয়ে কাছের বাথরুম খুঁজে বের করতে হবে (আমরা সবাই সেখানে গিয়েছি, তাই না? 😅): -- **নিম্ন-স্তরের প্রোগ্রামিং** হলো স্থানীয় ভাষা এত ভালোভাবে শেখা যে তুমি রাস্তার কোণে ফল বিক্রি করা বৃদ্ধার সাথে কথা বলতে পারো সাংস্কৃতিক রেফারেন্স, স্থানীয় স্ল্যাং এবং ভিতরের রসিকতা ব্যবহার করে যা শুধুমাত্র কেউ বুঝবে যে সেখানে বড় হয়েছে। খুবই চিত্তাকর্ষক এবং অত্যন্ত কার্যকর... যদি তুমি সাবলীল হও! কিন্তু যখন তুমি শুধু বাথরুম খুঁজতে চাও তখন এটি বেশ চাপের। +- **নিম্ন-স্তরের প্রোগ্রামিং** এমন যেন তুমি স্থানীয় উপভাষাটি এতটাই ভালো শিখেছ যে তুমি সেই বুড়ি ঠাকুরমা সঙ্গে ফল বিক্রেতার সাথে বহু স্থানীয় রেফারেন্স, স্থানীয় ভাষা ও অভ্যন্তরীণ রসিকতা ব্যবহার করে আড্ডা মারতে পারো যা শুধু স্থানীয় মানুষই বুঝতে পারে। খুবই প্রভাবশালী ও কার্যকর... যদি তুমি সত্যিই সাবলীল হও! কিন্তু যখন তুমি শুধু বাথরুম খুঁজছ তখন সেটা বেশ জটিল। -- **উচ্চ-স্তরের প্রোগ্রামিং** হলো সেই অসাধারণ স্থানীয় বন্ধুর মতো যে তোমাকে বুঝে। তুমি "আমি সত্যিই একটি বাথরুম খুঁজতে চাই" সাধারণ ইংরেজিতে বলতে পারো, এবং তারা সমস্ত সাংস্কৃতিক অনুবাদ পরিচালনা করে এবং তোমার অ-স্থানীয় মস্তিষ্কের জন্য অর্থবহভাবে দিকনির্দেশনা দেয়। +- **উচ্চ-স্তরের প্রোগ্রামিং** হল সেই অসাধারন স্থানীয় বন্ধু যিনি তোমাকে বুঝে; তুমি সহজ ইংরেজিতে বলতে পারো "আমার বাথরুম খুঁজতে হবে," আর তারা সমস্ত সাংস্কৃতিক অনুবাদ করে এমন একটি পথ নির্দেশনা দেয় যা তোমার অজানা মস্তিষ্কেও একদম পরিষ্কার হয়। -প্রোগ্রামিংয়ের ক্ষেত্রে: -- **নিম্ন-স্তরের ভাষা** (যেমন Assembly বা C) তোমাকে কম্পিউটারের আসল হার্ডওয়্যারের সাথে অত্যন্ত বিস্তারিত কথোপকথন করতে দেয়, কিন্তু তোমাকে একটি মেশিনের মতো চিন্তা করতে হয়, যা... ঠিক আছে, এটি একটি বড় মানসিক পরিবর্তন! -- **উচ্চ-স্তরের ভাষা** (যেমন JavaScript, Python, বা C#) তোমাকে একজন মানুষের মতো চিন্তা করতে দেয় যখন তারা সমস্ত মেশিন-স্পিক পরিচালনা করে। এছাড়া, তাদের এমন অবিশ্বাস্যভাবে স্বাগত জানানো সম্প্রদায় আছে যারা নতুন হওয়ার অভিজ্ঞতা মনে রাখে এবং সত্যিই সাহায্য করতে চায়! +প্রোগ্রামিংয়ের ভাষায়: +- **নিম্ন-স্তরের ভাষা** (যেমন এসেম্বলি বা সি) তোমাকে কম্পিউটারের আসল হার্ডওয়ারের সঙ্গে খুব বিস্তারিত কথোপকথন করতে দেয়, কিন্তু তোমাকে মেশিনের মত চিন্তা করতে হবে, যা বলতে গেলে একটি বড় মানসিক পরিবর্তন! +- **উচ্চ-স্তরের ভাষা** (যেমন JavaScript, Python, অথবা C#) তোমাকে মানবের মত চিন্তা করতে দেয় এবং তারা পেছনে সব মেশিন-ভাষার কাজ করে দেয়। সাথে সাথে, এগুলোর এমন অসাধারণ মৈত্রীপূর্ণ সম্প্রদায় আছে যেটা তোমাকে মনে করিয়ে দেয় তারা যখন নতুন ছিল তখন তারা কেমন ছিল এবং তারা তোমাকে সাহায্য করতে চায়! -তুমি অনুমান করতে পারো আমি কোনটি দিয়ে শুরু করার পরামর্শ দেব? 😉 উচ্চ-স্তরের ভাষা হলো এমন প্রশিক্ষণ চাকা যা তুমি কখনো খুলতে চাইবে না কারণ তারা পুরো অভিজ্ঞতাকে অনেক বেশি উপভোগ্য করে তোলে! +তুমি ভাবছ কোথা থেকে শুরু করো? 😉 উচ্চ-স্তরের ভাষাগুলো হলো এমন প্রশিক্ষণ চাকা যা তুমি কখনই খুলে ফেলতে চাও না কারণ তারা পুরো অভিজ্ঞতাটাকে আরো উপভোগ্য করে তোলে! ```mermaid flowchart TB - A["👤 Human Thought:
'I want to calculate Fibonacci numbers'"] --> B{Choose Language Level} + A["👤 মানব চিন্তা:
'আমি ফিবোনাচ্চি সংখ্যা গণনা করতে চাই'"] --> B{ভাষার স্তর নির্বাচন করুন} - B -->|High-Level| C["🌟 JavaScript/Python
Easy to read and write"] - B -->|Low-Level| D["⚙️ Assembly/C
Direct hardware control"] + B -->|উচ্চ-স্তর| C["🌟 জাভাস্ক্রিপ্ট/পাইথন
সহজে পড়া এবং লেখা যায়"] + B -->|নীচু-স্তর| D["⚙️ অ্যাসেমবলি/সি
ডিরেক্ট হার্ডওয়্যার নিয়ন্ত্রণ"] - C --> E["📝 Write: fibonacci(10)"] - D --> F["📝 Write: mov r0,#00
sub r0,r0,#01"] + C --> E["📝 লিখুন: fibonacci(10)"] + D --> F["📝 লিখুন: mov r0,#00
sub r0,r0,#01"] - E --> G["🤖 Computer Understanding:
Translator handles complexity"] + E --> G["🤖 কম্পিউটার বোঝা:
অনুবাদক জটিলতা সামলায়"] F --> G - G --> H["💻 Same Result:
0, 1, 1, 2, 3, 5, 8, 13..."] + G --> H["💻 একই ফলাফল:
0, 1, 1, 2, 3, 5, 8, 13..."] style C fill:#e1f5fe style D fill:#fff3e0 style H fill:#e8f5e8 ``` +### কেন উচ্চ-স্তরের ভাষাগুলো এত বন্ধুতা পূর্ণ, আমি দেখাবো -### কেন উচ্চ-স্তরের ভাষা এত বেশি বন্ধুত্বপূর্ণ তা আমি তোমাকে দেখাই - -ঠিক আছে, আমি তোমাকে এমন কিছু দেখাতে যাচ্ছি যা পুরোপুরি প্রদর্শন করে কেন আমি উচ্চ-স্তরের ভাষার প্রেমে পড়েছি, কিন্তু প্রথমে – আমি তোমার কাছ থেকে একটি প্রতিশ্রুতি চাই। যখন তুমি প্রথম কোড উদাহরণটি দেখবে, আতঙ্কিত হয়ো না! এটি ভয়ঙ্কর দেখানোর জন্যই তৈরি করা হয়েছে। এটাই আমি বোঝাতে চাইছি! +ঠিক আছে, আমি তোমাকে কিছু দেখাতে যাচ্ছি যা দেখায় কেন আমি উচ্চ-স্তরের ভাষাগুলো ভালোবাসি, কিন্তু আগে—তুমি আমাকে একটা প্রতিশ্রুতি দাও। প্রথম কোড উদাহরণ দেখলে ভয় পেও না! এটা যথাযথরূপে একটু জটিল দেখাতে হবে। এজন্যই আমি এটা ধরিয়ে দিতে চাচ্ছি! -আমরা একই কাজ দুটি সম্পূর্ণ ভিন্ন শৈলীতে লেখা দেখব। দুটিই তৈরি করে যাকে বলা হয় Fibonacci সিকোয়েন্স – এটি একটি সুন্দর গাণিতিক প্যাটার্ন যেখানে প্রতিটি সংখ্যা আগের দুটি সংখ্যার যোগফল: ০, ১, ১, ২, ৩, ৫, ৮, ১৩... (মজার তথ্য: তুমি এই প্যাটার্ন প্রকৃতির সর্বত্র খুঁজে পাবে – সূর্যমুখীর বীজের ঘূর্ণন, পাইনকোনের প্যাটার্ন, এমনকি গ্যালাক্সি গঠনের পদ্ধতিতে!) +আমরা একই কাজ দুইটি সম্পূর্ণ ভিন্ন স্টাইলেই করব। দুইটাই ফিবোনাচ্চি সিকোয়েন্স তৈরি করবে – এটি একটি সুন্দর গণিত প্যাটার্ন যেখানে প্রতিটি সংখ্যা তার আগের দুটির যোগফল: ০, ১, ১, ২, ৩, ৫, ৮, ১৩... (মজার কথা: তুমি এই প্যাটার্ন প্রকৃতিতে সর্বত্র পাবে—সূর্যমুখীর বীজের সর্পিল, পাইনকন নিদর্শন, এমনকি গ্যালাক্সির গঠনেও!) -তফাৎ দেখতে প্রস্তুত? চলো যাই! +দেখতে প্রস্তুত? চলো যাই! -**উচ্চ-স্তরের ভাষা (JavaScript) – মানব-বান্ধব:** +**উচ্চ-স্তরের ভাষা (JavaScript) – মানুষের জন্য সহজ:** ```javascript -// Step 1: Basic Fibonacci setup +// ধাপ ১: মৌলিক ফিবোনাচ্চি সেটআপ const fibonacciCount = 10; let current = 0; let next = 1; @@ -185,32 +183,32 @@ let next = 1; console.log('Fibonacci sequence:'); ``` -**এই কোডটি যা করে:** -- **ঘোষণা করে** একটি কনস্ট্যান্ট যা নির্ধারণ করে আমরা কত Fibonacci সংখ্যা তৈরি করতে চাই -- **প্রাথমিকভাবে সেট করে** দুটি ভ্যারিয়েবল যা সিকোয়েন্সের বর্তমান এবং পরবর্তী সংখ্যাগুলো ট্র্যাক করে -- **শুরু করে** Fibonacci প্যাটার্ন নির্ধারণকারী প্রাথমিক মান (০ এবং ১) -- **প্রদর্শন করে** একটি হেডার বার্তা যা আমাদের আউটপুট চিহ্নিত করে +**এই কোডটি যা করে তা হলো:** +- **একটি ধ্রুবক ঘোষণা** করে আমাদের কত সংখ্যক ফিবোনাচ্চি সংখ্যা দরকার তা নির্ধারণ করে +- **দুটি ভেরিয়েবল শুরু** করে যা সিকোয়েন্সের বর্তমান ও পরবর্তী সংখ্যা ট্র্যাক করে +- **শুরুতে মান সেট** করে (০ ও ১) যেগুলো ফিবোনাচ্চি প্যাটার্ন সংজ্ঞায়িত করে +- **একটি শিরোনাম বার্তা প্রদর্শিত করে** আমাদের আউটপুটের পরিচয় হিসাবে ```javascript -// Step 2: Generate the sequence with a loop +// ধাপ ২: একটি লুপ দিয়ে সিকোয়েন্স তৈরি করুন for (let i = 0; i < fibonacciCount; i++) { console.log(`Position ${i + 1}: ${current}`); - // Calculate next number in sequence + // সিকোয়েন্সে পরবর্তী সংখ্যা গণনা করুন const sum = current + next; current = next; next = sum; } ``` -**এখানে যা ঘটে তা ভেঙে দেখা:** -- **লুপ করে** সিকোয়েন্সের প্রতিটি অবস্থান একটি `for` লুপ ব্যবহার করে -- **প্রদর্শন করে** প্রতিটি সংখ্যা তার অবস্থানসহ টেমপ্লেট লিটারাল ফরম্যাটিং ব্যবহার করে -- **গণনা করে** পরবর্তী Fibonacci সংখ্যা বর্তমান এবং পরবর্তী মান যোগ করে -- **আপডেট করে** আমাদের ট্র্যাকিং ভ্যারিয়েবলগুলো পরবর্তী ইটারেশনে যাওয়ার জন্য +**দেখো এখানে কী হচ্ছে:** +- **`for` লুপের মাধ্যমে** সিকোয়েন্সের প্রতিটি অবস্থানে ঘুরে +- **প্রতিটি সংখ্যা তার অবস্থানসহ** টেমপ্লেট লিটারাল ফর্ম্যাটিং দিয়ে দেখায় +- **পরবর্তী ফিবোনাচ্চি সংখ্যা হিসেব করে** বর্তমান ও পরবর্তী মান যোগ করে +- **আমাদের ট্র্যাকিং ভেরিয়েবল আপডেট করে** পরবর্তী ধাপে যাওয়ার জন্য ```javascript -// Step 3: Modern functional approach +// ধাপ ৩: আধুনিক কার্যকরী পদ্ধতি const generateFibonacci = (count) => { const sequence = [0, 1]; @@ -221,129 +219,166 @@ const generateFibonacci = (count) => { return sequence; }; -// Usage example +// ব্যবহারের উদাহরণ const fibSequence = generateFibonacci(10); console.log(fibSequence); ``` -**উপরের কোডে -- **মন্তব্য**: উচ্চ-স্তরের প্রোগ্রামিং ভাষা ব্যাখ্যামূলক মন্তব্যকে উৎসাহিত করে যা কোডকে স্বয়ং-দলিলীকরণ করে তোলে। -- **গঠন**: জাভাস্ক্রিপ্টের যৌক্তিক প্রবাহ মানুষের সমস্যাগুলি ধাপে ধাপে চিন্তা করার পদ্ধতির সাথে মিলে যায়। -- **রক্ষণাবেক্ষণ**: বিভিন্ন প্রয়োজনের জন্য জাভাস্ক্রিপ্ট সংস্করণ আপডেট করা সহজ এবং পরিষ্কার। +**উপরের কোডে আমরা:** +- **মডার্ন অ্যারো ফাংশন সিনট্যাক্স দিয়ে** একটি পুনঃব্যবহারযোগ্য ফাংশন তৈরি করেছি +- **একটি অ্যারে তৈরি করেছি** পুরো সিকোয়েন্স সংরক্ষণ করার জন্য, একে একে প্রদর্শনের পরিবর্তে +- **অ্যারে ইনডেক্স ব্যবহার করেছি** প্রতিটি নতুন সংখ্যা পূর্বের মান থেকে হিসাব করার জন্য +- **সম্পূর্ণ সিকোয়েন্স রিটার্ন করেছি** যাতে প্রোগ্রামের অন্যান্য অংশেও ব্যবহারযোগ্য হয় + +**নিম্ন-স্তরের ভাষা (ARM Assembly) – কম্পিউটারের জন্য বন্ধুত্বপূর্ণ:** + +```assembly + area ascen,code,readonly + entry + code32 + adr r0,thumb+1 + bx r0 + code16 +thumb + mov r0,#00 + sub r0,r0,#01 + mov r1,#01 + mov r4,#10 + ldr r2,=0x40000000 +back add r0,r1 + str r0,[r2] + add r2,#04 + mov r3,r0 + mov r0,r1 + mov r1,r3 + sub r4,#01 + cmp r4,#00 + bne back + end +``` + +দেখবে কিভাবে JavaScript সংস্করণটি ইংরেজি নির্দেশনার মতো পড়ে, যখন Assembly সংস্করণটি রহস্যময় কমান্ড ব্যবহার করে সরাসরি কম্পিউটারের প্রসেসর নিয়ন্ত্রণ করে। দুটোই একই কাজ সম্পন্ন করে, কিন্তু উচ্চ-স্তরের ভাষাটি মানুষের জন্য অনেক সহজ বোঝা, লেখা এবং রক্ষণাবেক্ষণের। + +**মুখ্য পার্থক্য যা তুমি লক্ষ্য করবে:** +- **পঠনযোগ্যতা**: JavaScript বর্ণনামূলক নাম যেমন `fibonacciCount` ব্যবহার করে, যেখানে Assembly রহস্যময় লেবেল যেমন `r0`, `r1` ব্যবহার করে +- **মন্তব্য**: উচ্চ-স্তরের ভাষাগুলো ব্যাখ্যামূলক মন্তব্যকে উৎসাহিত করে যা কোডকে স্ব-মূল্যায়নযোগ্য করে তোলে +- **গঠন**: JavaScript এর যৌক্তিক প্রবাহ মানুষের সমস্যাগুলো ধাপে ধাপে চিন্তার সাথে মিলে যায় +- **রক্ষণাবেক্ষণ**: বিভিন্ন চাহিদার জন্য JavaScript সংস্করণ আপডেট করা সরল এবং স্পষ্ট + +✅ **ফিবনাচ্চি ধারাবাহিক সম্পর্কে**: এই অত্যন্ত মনোরম সংখ্যার প্যাটার্ন (যেখানে প্রতিটি সংখ্যা তার পূর্বের দুই সংখ্যার যোগফল: 0, 1, 1, 2, 3, 5, 8...) প্রকৃতিতে *সর্বত্রই* দেখা যায়! আপনি এটি সূর্যমুখী ফুলের স্পাইরাল, পাইনকোনের প্যাটার্ন, নটিলাস শেল কিভাবে বাঁক নেয় এবং এমনকি গাছের শাখাগুলোর বৃদ্ধিতেও খুঁজে পাবেন। এটি অত্যন্ত বিস্ময়কর কিভাবে গণিত এবং কোড আমাদের প্রাকৃতিক সুন্দরতা তৈরি করতে ব্যবহৃত প্যাটার্নগুলো বোঝাতে এবং পুনরায় তৈরি করতে সহায়তা করে! -✅ **ফিবোনাচি সিকোয়েন্স সম্পর্কে**: এই অসাধারণ সুন্দর সংখ্যার প্যাটার্ন (যেখানে প্রতিটি সংখ্যা আগের দুটি সংখ্যার যোগফল: ০, ১, ১, ২, ৩, ৫, ৮...) প্রকৃতিতে প্রায় *প্রতিটি জায়গায়* দেখা যায়! আপনি এটি সূর্যমুখীর ঘূর্ণনে, পাইনকোনের প্যাটার্নে, নটিলাস শেলের বাঁকানো আকৃতিতে, এমনকি গাছের শাখাগুলির বৃদ্ধির পদ্ধতিতেও দেখতে পাবেন। এটা সত্যিই অবিশ্বাস্য যে গণিত এবং কোড আমাদের প্রকৃতির সৌন্দর্য তৈরির প্যাটার্নগুলি বুঝতে এবং পুনরায় তৈরি করতে সাহায্য করতে পারে! -## সেই ভিত্তি যা জাদু তৈরি করে +## যেসব মৌলিক উপাদান ম্যাজিক তৈরি করে -ঠিক আছে, এখন আপনি প্রোগ্রামিং ভাষাগুলি কীভাবে কাজ করে তা দেখেছেন, আসুন সেই মৌলিক অংশগুলি ভেঙে দেখি যা প্রায় প্রতিটি প্রোগ্রামের ভিত্তি। এগুলিকে আপনার প্রিয় রেসিপির প্রয়োজনীয় উপাদান হিসাবে ভাবুন – একবার আপনি বুঝতে পারবেন প্রতিটি কী করে, আপনি প্রায় যেকোনো ভাষায় কোড পড়তে এবং লিখতে পারবেন! +ঠিক আছে, এখন যেহেতু আপনি প্রোগ্রামিং ভাষাগুলো কর্মরত অবস্থায় দেখেছেন, চলুন সেই মৌলিক উপাদানগুলো ভাঙা যাক যা লিখিত প্রতিটি প্রোগ্রামের ভিত্তি তৈরি করে। এগুলোকে ভাবুন আপনার প্রিয় রেসিপির অপরিহার্য উপাদান হিসেবে – একবার আপনি প্রতিটির কাজ বুঝে গেলে, আপনি প্রায় যেকোনো ভাষায় কোড পড়তে এবং লিখতে সক্ষম হবেন! -এটি প্রোগ্রামিংয়ের ব্যাকরণ শেখার মতো। মনে আছে স্কুলে যখন আপনি নাম, ক্রিয়া এবং বাক্য গঠনের নিয়ম শিখেছিলেন? প্রোগ্রামিংয়ের নিজস্ব ব্যাকরণ রয়েছে, এবং সত্যি বলতে, এটি ইংরেজি ব্যাকরণের চেয়ে অনেক বেশি যৌক্তিক এবং ক্ষমাশীল! 😄 +এটি প্রোগ্রামিং ব্যাকরণ শিখার মতো। স্কুলে আপনি যখন noun, verb এবং বাক্য গঠনের নিয়ম শিখেছিলেন মনে আছে? প্রোগ্রামিং এরও নিজের ব্যাকরণ আছে, এবং সত্যি বলতে তা ইংরেজি ব্যাকরণ থেকে অনেক বেশি যৌক্তিক এবং সহিষ্ণু! 😄 -### স্টেটমেন্ট: ধাপে ধাপে নির্দেশনা +### বাক্য: ধাপে ধাপে নির্দেশনা -চলুন **স্টেটমেন্ট** দিয়ে শুরু করি – এগুলি আপনার কম্পিউটারের সাথে কথোপকথনের পৃথক বাক্যের মতো। প্রতিটি স্টেটমেন্ট কম্পিউটারকে একটি নির্দিষ্ট কাজ করতে বলে, ঠিক যেমন নির্দেশ দেওয়া: "এখানে বাঁ দিকে ঘুরুন," "লাল আলোতে থামুন," "ওই জায়গায় পার্ক করুন।" +আসুন শুরু করি **বাক্য** দিয়ে – এগুলো হলো আপনার কম্পিউটারের সাথে কথোপকথনের একক বাক্য। প্রতিটি বাক্য কম্পিউটারকে একটি নির্দিষ্ট কাজ করতে বলে, ঠিক যেমন দিকনির্দেশ দেয়া: "এখানে বামদিকে ঘুরুন," "লাল আলোয় থেমে যান," "ওখানে গাড়ি দাঁড় করান।" -স্টেটমেন্টের ব্যাপারে আমি যা পছন্দ করি তা হল এগুলি সাধারণত কতটা পড়ার যোগ্য। এটি দেখুন: +বাক্যগুলো সাধারণত পড়তে কতটা সহজ তা আমি খুবই পছন্দ করি। দেখে নিন: ```javascript -// Basic statements that perform single actions +// মৌলিক বিবৃতি যা একক ক্রিয়া সম্পাদন করে const userName = "Alex"; console.log("Hello, world!"); const sum = 5 + 3; ``` - -**এই কোডটি যা করে:** -- **ঘোষণা** করে একটি কনস্ট্যান্ট ভেরিয়েবল ব্যবহারকারীর নাম সংরক্ষণ করতে -- **প্রদর্শন** করে একটি অভিবাদন বার্তা কনসোল আউটপুটে -- **গণনা** করে এবং একটি গাণিতিক অপারেশনের ফলাফল সংরক্ষণ করে + +**এই কোডটি যা করে:** +- একটি ধ্রুবক ভেরিয়েবল ঘোষণা করে যা ব্যবহারকারীর নাম সংরক্ষণ করে +- কনসোলে স্বাগতম বার্তা প্রদর্শন করে +- একটি গাণিতিক অপারেশনের ফলাফল গণনা করে সংরক্ষণ করে ```javascript -// Statements that interact with web pages +// যে বিবৃতিগুলি ওয়েব পৃষ্ঠাগুলির সাথে যোগাযোগ করে document.title = "My Awesome Website"; document.body.style.backgroundColor = "lightblue"; ``` - -**ধাপে ধাপে যা ঘটছে:** -- **পরিবর্তন** করে ব্রাউজার ট্যাবে প্রদর্শিত ওয়েবপেজের শিরোনাম -- **পরিবর্তন** করে পুরো পৃষ্ঠার ব্যাকগ্রাউন্ড রঙ + +**ধাপে ধাপে, যা হচ্ছে:** +- ব্রাউজার ট্যাবে প্রদর্শিত ওয়েবপেজের শিরোনাম পরিবর্তন করে +- পুরো পৃষ্ঠা বডির ব্যাকগ্রাউন্ড রঙ পরিবর্তন করে ### ভেরিয়েবল: আপনার প্রোগ্রামের মেমোরি সিস্টেম -ঠিক আছে, **ভেরিয়েবল** সত্যিই আমার শেখানোর প্রিয় ধারণাগুলির মধ্যে একটি কারণ এগুলি এমন জিনিসের মতো যা আপনি প্রতিদিন ব্যবহার করেন! +ঠিক আছে, **ভেরিয়েবল** সত্যি বলতে আমার সবচেয়ে প্রিয় ধারণাগুলোর একটি কারণ এগুলো প্রতিদিন আপনি যা ব্যবহার করেন তার মতোই! -আপনার ফোনের কন্টাক্ট লিস্টের কথা ভাবুন। আপনি সবার ফোন নম্বর মুখস্থ করেন না – বরং "মা," "সেরা বন্ধু," বা "পিজ্জা প্লেস যা রাত ২টা পর্যন্ত ডেলিভারি দেয়" সংরক্ষণ করেন এবং আপনার ফোন আসল নম্বরগুলি মনে রাখে। ভেরিয়েবল ঠিক একইভাবে কাজ করে! এগুলি লেবেলযুক্ত কন্টেইনারের মতো যেখানে আপনার প্রোগ্রাম তথ্য সংরক্ষণ করতে পারে এবং পরে একটি অর্থপূর্ণ নাম ব্যবহার করে তা পুনরুদ্ধার করতে পারে। +আপনার ফোনের কন্টাক্ট তালিকা ভাবুন একটু। আপনি প্রত্যেকের ফোন নম্বর মুখস্থ করেন না – পরিবর্তে “মা,” “সেরা বন্ধু,” অথবা “পিজ্জা ডেলিভারি যা রাত ২টা পর্যন্ত” সংরক্ষণ করেন এবং আপনার ফোন সত্যিকার নম্বরগুলো মনে রাখে। ভেরিয়েবলগুলো একই রকম! এগুলো লেবেলযুক্ত পাত্রের মতো যেখানে আপনার প্রোগ্রাম তথ্য সংরক্ষণ করে এবং পরে বোঝান যায় এমন নাম ব্যবহার করে ফেরত আনে। -এখানে যা সত্যিই চমৎকার: আপনার প্রোগ্রাম চলার সময় ভেরিয়েবল পরিবর্তিত হতে পারে (তাই নাম "ভেরিয়েবল" – দেখুন তারা কী করেছে?)। যেমন আপনি হয়তো সেই পিজ্জা প্লেসের কন্টাক্ট আপডেট করবেন যখন আপনি আরও ভালো কোনো জায়গা খুঁজে পাবেন, তেমনি ভেরিয়েবলও নতুন তথ্য শিখলে বা পরিস্থিতি পরিবর্তিত হলে আপডেট হতে পারে! +একটি অসাধারণ জিনিস হলো: আপনার প্রোগ্রাম চলাকালীন ভেরিয়েবল পরিবর্তিত হতে পারে (এজন্যে নামটা “variable” – দেখুন কী সুন্দর)। যেমন আপনি পিজ্জা ডেলিভারি লিস্ট আপডেট করতে পারেন যখন আরও ভাল কিছু খুঁজে পান, ভেরিয়েবলগুলোও প্রোগ্রাম শিখতে থাকলে বা পরিস্থিতি পরিবর্তিত হলে আপডেট হতে পারে! -আমি আপনাকে দেখাই এটি কতটা সুন্দর এবং সহজ হতে পারে: +চলুন দেখাই কিভাবে এটা সুন্দর ও সহজ: ```javascript -// Step 1: Creating basic variables +// ধাপ ১: মৌলিক ভেরিয়েবল তৈরি করা const siteName = "Weather Dashboard"; let currentWeather = "sunny"; let temperature = 75; let isRaining = false; ``` - -**এই ধারণাগুলি বোঝা:** -- **সংরক্ষণ** করুন অপরিবর্তনীয় মান `const` ভেরিয়েবলে (যেমন সাইটের নাম) -- **ব্যবহার** করুন `let` মানগুলির জন্য যা আপনার প্রোগ্রামে পরিবর্তিত হতে পারে -- **অ্যাসাইন** করুন বিভিন্ন ডেটা টাইপ: স্ট্রিং (টেক্সট), সংখ্যা এবং বুলিয়ান (সত্য/মিথ্যা) -- **নির্বাচন** করুন বর্ণনামূলক নাম যা প্রতিটি ভেরিয়েবল কী ধারণ করে তা ব্যাখ্যা করে + +**এই ধারণাগুলো বোঝা:** +- ধ্রুবক মান `const` এ সংরক্ষণ করুন (যেমন সাইটের নাম) +- এমন মানের জন্য `let` ব্যবহার করুন যা প্রোগ্রামের মধ্যে পরিবর্তিত হতে পারে +- বিভিন্ন ডাটা টাইপ বরাদ্দ করুন: স্ট্রিং (টেক্সট), সংখ্যা, বুলিয়ান (সত্য/মিথ্যা) +- বর্ণনামূলক নাম দিন যা প্রতিটি ভেরিয়েবলের বিষয় বুঝায় ```javascript -// Step 2: Working with objects to group related data +// ধাপ ২: সংশ্লিষ্ট ডেটা গ্রুপ করার জন্য অবজেক্ট নিয়ে কাজ করা const weatherData = { location: "San Francisco", humidity: 65, windSpeed: 12 }; ``` - -**উপরের কোডে আমরা:** -- **তৈরি** করেছি একটি অবজেক্ট যা সম্পর্কিত আবহাওয়ার তথ্য একত্রিত করে -- **সংগঠিত** করেছি একাধিক তথ্য এক ভেরিয়েবল নামের অধীনে -- **ব্যবহার** করেছি কী-ভ্যালু পেয়ার প্রতিটি তথ্য স্পষ্টভাবে লেবেল করতে + +**উপরের কোডে আমরা:** +- সম্পর্কিত আবহাওয়ার তথ্য একত্রিত করতে একটি অবজেক্ট তৈরি করেছি +- একাধিক তথ্য একটি ভেরিয়েবল নামের অধীনে সংগঠিত করেছি +- প্রতিটি তথ্য স্পষ্ট করার জন্য কী-ভ্যালু জোড়া ব্যবহার করেছি ```javascript -// Step 3: Using and updating variables +// ধাপ ৩: পরিবর্তনশীল ব্যবহার এবং আপডেট করা console.log(`${siteName}: Today is ${currentWeather} and ${temperature}°F`); console.log(`Wind speed: ${weatherData.windSpeed} mph`); -// Updating changeable variables +// পরিবর্তনশীল পরিবর্তনশীল আপডেট করা currentWeather = "cloudy"; temperature = 68; ``` - -**প্রতিটি অংশ বুঝি:** -- **প্রদর্শন** করি তথ্য টেমপ্লেট লিটারাল ব্যবহার করে `${}` সিনট্যাক্সে -- **অ্যাক্সেস** করি অবজেক্ট প্রপার্টি ডট নোটেশন (`weatherData.windSpeed`) ব্যবহার করে -- **আপডেট** করি `let` দিয়ে ঘোষিত ভেরিয়েবল পরিবর্তিত পরিস্থিতি প্রতিফলিত করতে -- **সংযুক্ত** করি একাধিক ভেরিয়েবল অর্থপূর্ণ বার্তা তৈরি করতে + +**প্রত্যেক অংশ বোঝা যাক:** +- `${}` সিনট্যাক্স ব্যবহার করে টেমপ্লেট লিটারাল দিয়ে তথ্য প্রদর্শন +- অবজেক্টের প্রপার্টি ডট নোটেশন (`weatherData.windSpeed`) দিয়ে অ্যাক্সেস করা +- `let` দিয়ে ঘোষিত ভেরিয়েবলগুলো আপডেট করা যাতে পরিবর্তনশীল অবস্থা প্রতিফলিত হয় +- অর্থবহ বার্তা তৈরির জন্য একাধিক ভেরিয়েবল একত্রিত করা ```javascript -// Step 4: Modern destructuring for cleaner code +// ধাপ ৪: পরিষ্কার কোডের জন্য আধুনিক ডেসট্রাকচারিং const { location, humidity } = weatherData; console.log(`${location} humidity: ${humidity}%`); ``` + +**আপনাকে যা জানতে হবে:** +- ডেসট্রাকচারিং অ্যাসাইনমেন্ট ব্যবহার করে অবজেক্ট থেকে নির্দিষ্ট প্রপার্টি বের করা +- অবজেক্ট কী এর সাথে একই নামের নতুন ভেরিয়েবল তৈরি করা +- ডট নোটেশন বারবার ব্যবহার থেকে কোড সরল করা -**আপনার যা জানা দরকার:** -- **এক্সট্র্যাক্ট** করি নির্দিষ্ট প্রপার্টি অবজেক্ট থেকে ডেস্ট্রাকচারিং অ্যাসাইনমেন্ট ব্যবহার করে -- **তৈরি** করি নতুন ভেরিয়েবল যা অবজেক্ট কী-এর মতো নাম ধারণ করে -- **সরলীকরণ** করি কোড পুনরাবৃত্তি ডট নোটেশন এড়িয়ে - -### কন্ট্রোল ফ্লো: আপনার প্রোগ্রামকে চিন্তা করতে শেখানো +### কন্ট্রোল ফ্লো: আপনার প্রোগ্রামকে চিন্তা শেখানো -ঠিক আছে, এখানেই প্রোগ্রামিং সত্যিই অবিশ্বাস্য হয়ে ওঠে! **কন্ট্রোল ফ্লো** মূলত আপনার প্রোগ্রামকে স্মার্ট সিদ্ধান্ত নিতে শেখানো, ঠিক যেমন আপনি প্রতিদিন করেন। +ঠিক আছে, এটা সেই জায়গা যেখানে প্রোগ্রামিং সত্যিই অবিশ্বাস্য হয়ে ওঠে! **কন্ট্রোল ফ্লো** হলো আপনার প্রোগ্রামকে বুদ্ধিমত্তার সাথে সিদ্ধান্ত নিতে শেখানো, ঠিক যেমন আপনি প্রতিদিন বিনা চিন্তায় করেন। -ভাবুন: আজ সকালে আপনি সম্ভবত এমন কিছু ভেবেছেন, "যদি বৃষ্টি হয়, আমি ছাতা নিয়ে যাব। যদি ঠান্ডা লাগে, আমি জ্যাকেট পরব। যদি দেরি হয়, আমি নাশতা বাদ দিয়ে পথে কফি কিনব।" আপনার মস্তিষ্ক স্বাভাবিকভাবে এই if-then যুক্তি প্রতিদিন অসংখ্যবার অনুসরণ করে! +ভাবুন: আজ সকালে হয়তো আপনি এমন কিছু করেন “যদি বৃষ্টি হয়, আমি ছাতা নেব। যদি ঠান্ডা হয়, জ্যাকেট পড়ব। দেরি হলে নাস্তা বাদ দিয়ে পথে কফি নেব।” আপনার মস্তিষ্ক স্বাভাবিকভাবেই এই if-then লজিক দশোবার অনুসরণ করে প্রতিদিন! -এটি প্রোগ্রামগুলিকে বুদ্ধিমান এবং জীবন্ত মনে করে তোলে, শুধু কিছু বিরক্তিকর, পূর্বনির্ধারিত স্ক্রিপ্ট অনুসরণ করার পরিবর্তে। তারা আসলে একটি পরিস্থিতি দেখতে পারে, কী ঘটছে তা মূল্যায়ন করতে পারে এবং উপযুক্তভাবে প্রতিক্রিয়া জানাতে পারে। এটি আপনার প্রোগ্রামকে একটি মস্তিষ্ক দেওয়ার মতো যা মানিয়ে নিতে এবং সিদ্ধান্ত নিতে পারে! +এটাই প্রোগ্রামগুলোকে বুদ্ধিমান এবং জীবন্ত করে তোলে, শুধু একটি একঘেয়েমি স্ক্রিপ্ট অনুসরণ করার বদলে। তারা একটি পরিস্থিতি দেখতে পারে, মূল্যায়ন করতে পারে এবং যথোপযুক্ত প্রতিক্রিয়া দিতে পারে। এটা আপনার প্রোগ্রামকে এমন মস্তিষ্ক দেওয়ার মত যা মানিয়ে নিতে এবং সিদ্ধান্ত নিতে পারে! -দেখতে চান এটি কীভাবে সুন্দরভাবে কাজ করে? আমি আপনাকে দেখাই: +দেখতে চান এটা কতটা সুন্দর কাজ করে? দেখুন: ```javascript -// Step 1: Basic conditional logic +// ধাপ ১: মৌলিক শর্তাধীন লজিক const userAge = 17; if (userAge >= 18) { @@ -353,15 +388,15 @@ if (userAge >= 18) { console.log(`You'll be able to vote in ${yearsToWait} year(s).`); } ``` - -**এই কোডটি যা করে:** -- **পরীক্ষা** করে ব্যবহারকারীর বয়স ভোট দেওয়ার যোগ্যতা পূরণ করে কিনা -- **সম্পাদন** করে বিভিন্ন কোড ব্লক শর্তের ফলাফলের উপর ভিত্তি করে -- **গণনা** করে এবং প্রদর্শন করে ভোট দেওয়ার যোগ্যতা অর্জনের জন্য কত সময় বাকি -- **প্রদান** করে প্রতিটি পরিস্থিতির জন্য নির্দিষ্ট, সহায়ক প্রতিক্রিয়া + +**এই কোড যা করে:** +- ব্যবহারকারীর বয়স ভোটাধিকারের যোগ্যতা মেযা করে +- শর্ত অনুসারে বিভিন্ন কোড ব্লক চালায় +- যদি ১৮ এর নিচে হয় ভোটাধিকারের যোগ্য হওয়ার অবশিষ্ট সময় হিসাব করে দেখায় +- প্রতিটি পরিস্থিতির জন্য নির্দিষ্ট, সহায়ক ফিডব্যাক দেয় ```javascript -// Step 2: Multiple conditions with logical operators +// ধাপ ২: লজিক্যাল অপারেটর সহ একাধিক শর্ত্‌গুলি const userAge = 17; const hasPermission = true; @@ -373,26 +408,26 @@ if (userAge >= 18 && hasPermission) { console.log("Sorry, you must be at least 16 years old."); } ``` - -**এখানে যা ঘটছে তা বিশ্লেষণ:** -- **সংযুক্ত** করি একাধিক শর্ত `&&` (এবং) অপারেটর ব্যবহার করে -- **তৈরি** করি শর্তগুলির একটি শ্রেণিবিন্যাস `else if` ব্যবহার করে একাধিক পরিস্থিতির জন্য -- **হ্যান্ডেল** করি সমস্ত সম্ভাব্য কেস একটি চূড়ান্ত `else` স্টেটমেন্ট দিয়ে -- **প্রদান** করি স্পষ্ট, কার্যকর প্রতিক্রিয়া প্রতিটি ভিন্ন পরিস্থিতির জন্য + +**এখানে যা ঘটছে:** +- `&&` (এবং) অপারেটর ব্যবহার করে একাধিক শর্ত যুক্ত করা +- একাধিক পরিস্থিতির জন্য `else if` ব্যবহার করে শর্তের সজ্জা তৈরি করা +- সর্বশেষে `else` ব্যবহার করে সব সম্ভাব্য ক্ষেত্র পরিচালনা করা +- প্রতিটি ভিন্ন পরিস্থিতির জন্য স্পষ্ট এবং কার্যকর ফিডব্যাক প্রদান করা ```javascript -// Step 3: Concise conditional with ternary operator +// ধাপ ৩: টার্নারি অপারেটর দিয়ে সংক্ষিপ্ত শর্তীয় বিবৃতি const votingStatus = userAge >= 18 ? "Can vote" : "Cannot vote yet"; console.log(`Status: ${votingStatus}`); ``` - -**আপনার মনে রাখা উচিত:** -- **ব্যবহার** করুন টার্নারি অপারেটর (`? :`) সহজ দুই-বিকল্প শর্তের জন্য -- **লিখুন** শর্ত প্রথমে, তারপরে `?`, তারপর সত্য ফলাফল, তারপর `:`, তারপর মিথ্যা ফলাফল -- **প্রয়োগ** করুন এই প্যাটার্ন যখন শর্তের উপর ভিত্তি করে মান অ্যাসাইন করতে হবে + +**মনে রাখার জন্য:** +- সহজ দুই-অপশন শর্তের জন্য টার্নারি অপারেটর (`? :`) ব্যবহার করুন +- প্রথমে শর্ত লিখুন, তারপর `?`, তারপর সত্য ফলাফল, তারপর `:`, তারপর মিথ্যা ফলাফল +- যখন শর্ত অনুসারে মান বরাদ্দ করতে হয় এই প্যাটার্ন ব্যবহার করুন ```javascript -// Step 4: Handling multiple specific cases +// ধাপ ৪: একাধিক নির্দিষ্ট ক্ষেত্রে পরিচালনা করা const dayOfWeek = "Tuesday"; switch (dayOfWeek) { @@ -411,58 +446,57 @@ switch (dayOfWeek) { console.log("Invalid day of the week"); } ``` + +**এই কোড যা করে:** +- ভেরিয়েবল মান একাধিক নির্দিষ্ট কেসের সাথে মেলে কিনা পরীক্ষা করে +- সমমনোনীত কেসগুলো একত্রিত করে (সাপ্তাহিক দিনের জন্য এবং উইকএন্ডের জন্য) +- মিলে গেলে উপযুক্ত কোড ব্লক চালায় +- অপ্রত্যাশিত মানের জন্য একটি `default` কেস অন্তর্ভুক্ত করে +- পরবর্তী কেসে যাওয়া আটকাতে `break` স্টেটমেন্ট ব্যবহার করে -**এই কোডটি যা অর্জন করে:** -- **মিল** করে ভেরিয়েবল মান একাধিক নির্দিষ্ট কেসের সাথে -- **গ্রুপ** করে অনুরূপ কেস একসাথে (সপ্তাহের দিন বনাম সপ্তাহান্ত) -- **সম্পাদন** করে উপযুক্ত কোড ব্লক যখন একটি মিল পাওয়া যায় -- **অন্তর্ভুক্ত** করে একটি `default` কেস অপ্রত্যাশিত মানগুলি হ্যান্ডেল করতে -- **ব্যবহার** করে `break` স্টেটমেন্ট পরবর্তী কেসে কোড চালিয়ে যাওয়া বন্ধ করতে - -> 💡 **বাস্তব জীবনের উদাহরণ**: কন্ট্রোল ফ্লোকে ভাবুন বিশ্বের সবচেয়ে ধৈর্যশীল জিপিএসের মতো যা আপনাকে নির্দেশনা দেয়। এটি বলতে পারে "যদি মেইন স্ট্রিটে ট্রাফিক থাকে, তাহলে হাইওয়ে নিন। যদি হাইওয়েতে নির্মাণ কাজ চলতে থাকে, তাহলে সুন্দর রাস্তা ধরুন।" প্রোগ্রামগুলি ঠিক একই ধরনের শর্তযুক্ত যুক্তি ব্যবহার করে বিভিন্ন পরিস্থিতিতে বুদ্ধিমত্তার সাথে প্রতিক্রিয়া জানাতে এবং ব্যবহারকারীদের সর্বোত্তম অভিজ্ঞতা দিতে। +> 💡 **বাস্তব জীবনের উপমা**: কন্ট্রোল ফ্লোকে ভাবুন সবচেয়ে ধৈর্যশীল GPS এর দিকনির্দেশনার মতো। এটি বলতে পারে “যদি মেইন স্ট্রিটে ট্রাফিক থাকে, তাহলে হাইওয়ে নাও। যদি হাইওয়ে নির্মাণে বন্ধ থাকে, তাহলে দৃশ্যমান রুট নাও।” প্রোগ্রামগুলো এই একই ধরণের শর্তাদি লজিক ব্যবহার করে বুদ্ধিমত্তার সাথে বিভিন্ন পরিস্থিতিতে সাড়া দেয় এবং সবসময় ব্যবহারকারীদের জন্য সেরা অভিজ্ঞতা দেয়। -### 🎯 **ধারণা যাচাই: ভিত্তি আয়ত্ত করা** +### 🎯 **ধারণা যাচাই: মৌলিক উপাদান দক্ষতা** -**চলুন দেখি আপনি মৌলিক বিষয়গুলি নিয়ে কেমন করছেন:** -- আপনি কি নিজের ভাষায় একটি ভেরিয়েবল এবং একটি স্টেটমেন্টের মধ্যে পার্থক্য ব্যাখ্যা করতে পারেন? -- এমন একটি বাস্তব জীবনের পরিস্থিতি ভাবুন যেখানে আপনি একটি if-then সিদ্ধান্ত ব্যবহার করবেন (যেমন আমাদের ভোট দেওয়ার উদাহরণ) -- প্রোগ্রামিং যুক্তি সম্পর্কে এমন একটি বিষয় কী যা আপনাকে অবাক করেছে? +**চলুন দেখি আপনি মৌলিক বিষয়গুলো কতটা বুঝতে পেরেছেন:** +- আপনি কি নিজের ভাষায় ভেরিয়েবল এবং বাক্যের পার্থক্য ব্যাখ্যা করতে পারেন? +- একটি বাস্তব জীবনের উদাহরণ ভাবুন যেখানে if-then সিদ্ধান্ত ব্যবহার করবেন (যেমন আমাদের ভোটাধিকারের উদাহরণ) +- প্রোগ্রামিং যুক্তির কোন একটি বিষয় যা আপনাকে অবাক করেছে? -**দ্রুত আত্মবিশ্বাস বাড়ানোর টিপস:** +**দ্রুত আত্মবিশ্বাস বৃদ্ধিকারক:** ```mermaid flowchart LR - A["📝 Statements
(Instructions)"] --> B["📦 Variables
(Storage)"] --> C["🔀 Control Flow
(Decisions)"] --> D["🎉 Working Program!"] + A["📝 বিবৃতি
(নির্দেশনা)"] --> B["📦 ভেরিয়েবলস
(সংগ্রহস্থল)"] --> C["🔀 নিয়ন্ত্রণ প্রবাহ
(সিদ্ধান্ত)"] --> D["🎉 কার্যকর প্রোগ্রাম!"] style A fill:#ffeb3b style B fill:#4caf50 style C fill:#2196f3 style D fill:#ff4081 -``` - -✅ **পরবর্তী কী আসছে**: আমরা এই অসাধারণ যাত্রায় একসাথে এই ধারণাগুলির গভীরে আরও মজা করতে যাচ্ছি! এখন, শুধু সমস্ত আশ্চর্যজনক সম্ভাবনার জন্য উত্তেজনা অনুভব করার উপর মনোযোগ দিন। নির্দিষ্ট দক্ষতা এবং কৌশলগুলি স্বাভাবিকভাবেই অনুশীলনের সাথে লেগে থাকবে – আমি প্রতিশ্রুতি দিচ্ছি এটি আপনার প্রত্যাশার চেয়ে অনেক বেশি মজার হবে! +``` +✅ **পরবর্তী পর্যায়ে যা আসছে**: আমরা এই ধারণাগুলো আরও গভীরভাবে অন্বেষণ করে প্রচুর মজা করব! এখনই শুধু এই উত্তেজনা অনুভব করুন আপনার সামনে থাকা অসাধারণ সম্ভাবনাগুলোর জন্য। নির্দিষ্ট দক্ষতা ও কৌশলগুলো আমাদের একসাথে অনুশীলনে স্বাভাবিকভাবেই বসবে – আমি গ্যারান্টি দিচ্ছি এটি আপনি যেকোনো বিষয়ের তুলনায় অনেক বেশি মজার হবে! -## কাজের সরঞ্জাম +## বাণিজ্যের সরঞ্জাম -ঠিক আছে, এটি এমন একটি বিষয় যা আমাকে এতটাই উত্তেজিত করে তোলে যে আমি নিজেকে সামলাতে পারি না! 🚀 আমরা সেই অসাধারণ সরঞ্জামগুলি সম্পর্কে কথা বলতে যাচ্ছি যা আপনাকে মনে করাবে যে আপনি একটি ডিজিটাল স্পেসশিপের চাবি পেয়েছেন। +ঠিক আছে, এটিই এমন একটা জায়গা যেখানে আমি এত উত্তেজিত হই যে নিজেকে ধরে রাখতে পারি না! 🚀 আমরা সেই অবিশ্বাস্য সরঞ্জামগুলো নিয়ে কথা বলব যা আপনাকে ডিজিটাল মহাকাশযানের চাবি হাতে পেয়েছেন এমন অনুভূতি দেবে। -আপনি জানেন একজন শেফের সেই নিখুঁতভাবে ভারসাম্যপূর্ণ ছুরি থাকে যা তাদের হাতের এক্সটেনশনের মতো অনুভূত হয়? অথবা একজন সংগীতশিল্পীর সেই একটি গিটার থাকে যা তারা স্পর্শ করলেই গান গায়? ঠিক তেমনি, ডেভেলপারদেরও আমাদের নিজস্ব এই জাদুকরী সরঞ্জাম রয়েছে, এবং এখানে যা আপনাকে অবাক করবে – এর বেশিরভাগই সম্পূর্ণ বিনামূল্যে! +আপনি জানেন কিভাবে একজন শেফের সেই নিখুঁত ভারসাম্যপূর্ণ ছুরি থাকে যা তাদের হাতের বিস্তার মনে হয়? অথবা একজন সঙ্গীতশিল্পীর সেই গিটার যা স্পর্শ করলেই গান গায়? ঠিক তেমনই, ডেভেলপারদেরও এমন ম্যাজিক্যাল সরঞ্জাম আছে, এবং এখানে এমন কিছু আছে যা আপনার বুদ্ধি ধামাকা করে দেবে – অধিকাংশই সম্পূর্ণ ফ্রি! -আমি আপনাকে এগুলি শেয়ার করার জন্য এতটাই উত্তেজিত যে আমি প্রায় চেয়ারে লাফিয়ে উঠছি কারণ এগুলি আমাদের সফটওয়্যার তৈরির পদ্ধতিকে সম্পূর্ণভাবে বিপ্লব করেছে। আমরা কথা বলছি AI-চালিত কোডিং সহকারী যারা আপনার কোড লিখতে সাহায্য করতে পারে (আমি মজা করছি না!), ক্লাউড পরিবেশ যেখানে আপনি যেকোনো জায়গা থেকে Wi-Fi সহ পুরো অ্যাপ্লিকেশন তৈরি করতে পারেন, এবং ডিবাগিং সরঞ্জামগুলি এতটাই উন্নত যে তারা আপনার প্রোগ্রামের জন্য এক্স-রে ভিশনের মতো। +আমি আসলে চেয়ারে লাফাচ্ছি এইগুলো আপনার সাথে ভাগ করে নিতে because এর ফলে সফটওয়্যার তৈরি করার পদ্ধতি সম্পূর্ণ পরিপুর্ণ পরিবর্তিত হয়েছে। আমরা কথা বলছি AI চালিত কোডিং সহকারী নিয়ে, যারা আপনার কোড লেখায় সাহায্য করে (আমি চুটিয়ে বলছি না!), ক্লাউড এনভায়রনমেন্টের যেখানে আপনি Wi-Fi সহ যেকোনো জায়গা থেকে পুরো অ্যাপ্লিকেশন তৈরি করতে পারেন, এবং এমন ডিবাগিং সরঞ্জাম যা আপনার প্রোগ্রামের জন্য X-ray দৃষ্টি দেয়। -এবং এখানে এমন একটি অংশ রয়েছে যা এখনও আমাকে শিহরিত করে: এগুলি "শুরু করার সরঞ্জাম" নয় যা আপনি পরে ছেড়ে দেবেন। এগুলি ঠিক একই পেশাদার-গ্রেডের সরঞ্জাম যা গুগল, নেটফ্লিক্স এবং আপনার প্রিয় ইন্ডি অ্যাপ স্টুডিওর ডেভেলপাররা এই মুহূর্তে ব্যবহার করছে। এগুলি ব্যবহার করে আপনি সত্যিই একজন পেশাদারের মতো অনুভব করবেন! +এবং এখানে এমন একটি অংশ আছে যা এখনও আমাকে কেঁপে দেয়: এগুলো "শিখনার্থীদের সরঞ্জাম" নয় যা আপনি তাড়াতাড়ি বড় হয়ে ফেলবেন না। এগুলোই একই পেশাদার মানের সরঞ্জাম যা গুগল, নেটফ্লিক্স এবং আপনার প্রিয় ইন্ডি অ্যাপ স্টুডিওর ডেভেলপাররা এ মুহূর্তে ব্যবহার করছে। এগুলো ব্যবহার করে আপনি নিজেকে একজন পেশাদারই মনে করবেন! ```mermaid graph TD - A["💡 Your Idea"] --> B["⌨️ Code Editor
(VS Code)"] - B --> C["🌐 Browser DevTools
(Testing & Debugging)"] - C --> D["⚡ Command Line
(Automation & Tools)"] - D --> E["📚 Documentation
(Learning & Reference)"] - E --> F["🚀 Amazing Web App!"] + A["💡 আপনার ধারণা"] --> B["⌨️ কোড সম্পাদক
(VS কোড)"] + B --> C["🌐 ব্রাউজার ডেভটুলস
(পরীক্ষা ও ডিবাগিং)"] + C --> D["⚡ কমান্ড লাইন
(স্বয়ংক্রিয়করণ ও সরঞ্জাম)"] + D --> E["📚 ডকুমেন্টেশন
(শিখন ও রেফারেন্স)"] + E --> F["🚀 দুর্দান্ত ওয়েব অ্যাপ!"] - B -.-> G["🤖 AI Assistant
(GitHub Copilot)"] - C -.-> H["📱 Device Testing
(Responsive Design)"] - D -.-> I["📦 Package Managers
(npm, yarn)"] - E -.-> J["👥 Community
(Stack Overflow)"] + B -.-> G["🤖 এআই সহকারী
(GitHub Copilot)"] + C -.-> H["📱 ডিভাইস পরীক্ষা
(রেসপনসিভ ডিজাইন)"] + D -.-> I["📦 প্যাকেজ ম্যানেজারস
(npm, yarn)"] + E -.-> J["👥 কমিউনিটি
(Stack Overflow)"] style A fill:#fff59d style F fill:#c8e6c9 @@ -470,322 +504,352 @@ graph TD style H fill:#f3e5f5 style I fill:#ffccbc style J fill:#e8eaf6 -``` - -### কোড এডিটর এবং IDE: আপনার নতুন ডিজিটাল সঙ্গী +``` +### কোড এডিটর এবং IDE: আপনার নতুন ডিজিটাল সর্বশেষ সঙ্গী -চলুন কোড এডিটর সম্পর্কে কথা বলি – এগুলি সত্যিই আপনার নতুন প্রিয় জায়গা হতে চলেছে! এগুলিকে আপনার ব্যক্তিগত কোডিং অভয়ারণ্য হিসাবে ভাবুন যেখানে আপনি আপনার ডিজিটাল সৃষ্টিগুলি তৈরি এবং নিখুঁত করতে বেশিরভাগ সময় ব্যয় করবেন। +আসুন কথা বলি কোড এডিটর নিয়ে – এগুলো শীঘ্রই আপনার প্রিয় স্থান হয়ে উঠবে! এগুলো এমন একটি ব্যক্তিগত কোডিং আশ্রম, যেখানে আপনি আপনার অধিকাংশ সময় কাটিয়ে ডিজিটাল সৃজনশীলতা গড়ে তুলবেন এবং নিখুঁত করবেন। -কিন্তু এখানে যা একেবারে জাদুকরী তা হল আধুনিক এডিটরগুলি শুধুমাত্র ফ্যান্সি টেক্সট এডিটর নয়। এগুলি এমন একটি উজ্জ্বল, সহায়ক কোডিং পরামর্শদাতা থাকার মতো যা ২৪/৭ আপনার পাশে বসে থাকে। তারা আপনার টাইপো ধরবে আপনি লক্ষ্য করার আগেই, এমন উন্নতির পরামর্শ দেবে যা আপনাকে একজন প্রতিভা মনে করাবে, আপনাকে সাহায্য করবে প্রতিটি কোডের অংশ কী করে তা বুঝতে, এবং কিছু এমনকি আপনার টাইপ করার আগে আপনার চিন্তা অনুমান করতে পারে এবং আপনার চিন্তা শেষ করতে সাহায্য করবে! +কিন্তু আধুনিক এডিটরগুলোর ব্যাপারে যা জাদুকরী তা হলো: এরা শুধু ফ্যান্সি টেক্সট এডিটর নয়। এরা অধিকন্তু সবচেয়ে মেধাবী, সহায়ক কোডিং মেন্টর যারা ২৪/৭ আপনার পাশে বসে থাকে। তারা টাইপ করার আগেই ভুল ধরিয়ে দেয়, উন্নতির পরামর্শ দেয় যা আপনাকে জিনিয়াস করে তোলে, কোডের প্রতিটি অংশের কাজ বুঝতে সাহায্য করে, এবং অনেকে এমনকি আপনি যা টাইপ করতে যাচ্ছেন সেটা পূর্বাভাস দিয়ে শেষ করার প্রস্তাব দেয়! -আমি যখন প্রথম অটো-কমপ্লিশন আবিষ্কার করেছিলাম তখন আমি সত্যিই মনে করেছিলাম যে আমি ভবিষ্যতে বাস করছি। আপনি কিছু টাইপ করা শুরু করেন, এবং আপনার এডিটর বলে, "আরে, আপনি কি এই ফাংশনটি ভাবছেন যা ঠিক আপনার প্রয়োজন?" এটি একটি মনের পাঠক থাকার মতো আপনার কোডিং সঙ্গী! +আমি মনে করি যখন প্রথমবার অটো-কাম্পলিশন আবিষ্কার করেছিলাম – সত্যিই মনে হচ্ছিল আমি ভবিষ্যতে বসবাস করছি। আপনি কিছু টাইপ শুরু করলে, আপনার এডিটর বলে, "এই, আপনি কি এই ফাংশনের কথা ভাবছিলেন যেটা ঠিক আপনার দরকার অনুযায়ী কাজ করে?" এটা ঠিক যেন আপনার কোডিং বন্ধু একজন মাইন্ড রিডার! -**এই এডিটরগুলি এত অসাধারণ কী করে তোলে?** +**এই এডিটরগুলো কেন এত অসাধারণ?** -আধুনিক কোড এডিটরগুলি আপনার উৎপাদনশীলতা বাড়ানোর জন্য চমকপ্রদ বৈশিষ্ট্যগুলির একটি অ্যারে অফার করে: +আধুনিক কোড এডিটর অনেক ফিচারের বিস্ময়কর সংগ্রহ অফার করে যা আপনার উৎপাদনশীলতা বাড়ায়: -| বৈশিষ্ট্য | এটি কী করে | এটি কেন সাহায্য করে | +| ফিচার | যা করে | সাহায্যের কারণ | |---------|--------------|--------------| -| **সিনট্যাক্স হাইলাইটিং** | আপনার কোডের বিভিন্ন অংশ রঙিন করে | কোড পড়া সহজ করে এবং ভুলগুলি খুঁজে পেতে সাহায্য করে | -| **অটো-কমপ্লিশন** | টাইপ করার সময় কোডের পরামর্শ দেয় | কোডিং দ্রুত করে এবং টাইপো কমায় | -| **ডিবাগিং টুলস** | আপনাকে ভুল খুঁজে এবং ঠিক করতে সাহায্য করে | সমস্যার সমাধানে সময় বাঁচায় | -| **এক্সটেনশন** | বিশেষায়িত বৈশিষ্ট্য যোগ করে | আপনার এডিটরকে যেকোনো প্রযুক্তির জন্য কাস্টমাইজ করুন | -| **AI সহকারী** | কোড এবং ব্যাখ্যা পরামর্শ দেয় | শেখা এবং উৎপাদনশীলতা ত্বরান্বিত করে | +| **সিনট্যাক্স হাইলাইটিং** | আপনার কোডের বিভিন্ন অংশ রঙিন করে | কোড পড়া সহজ করে এবং ভুল ধরতে সাহায্য করে | +| **অটো-কাম্পলিশন** | টাইপ করার সময় কোড প্রস্তাব করে | কোডিং দ্রুত হয় এবং টাইপিং ভুল কমে যায় | +| **ডিবাগিং টুলস** | ভুল খুঁজে বের করা এবং ঠিক করতে সাহায্য করে | সমস্যা সমাধানে ঘন্টা বাঁচায় | +| **এক্সটেনশনস** | বিশেষায়িত ফিচার যুক্ত করে | আপনার এডিটরকে যেকোনো প্রযুক্তির জন্য কাস্টমাইজ করে | +| **AI সহকারী** | কোড এবং ব্যাখ্যা প্রস্তাব করে | শেখা এবং উৎপাদনশীলতা দ্রুততর করে | -> 🎥 **ভিডিও রিসোর্স**: এই সরঞ্জামগুলি কার্যকরভাবে দেখতে চান? এই [Tools of the Trade ভিডিও](https://youtube.com/watch?v=69WJeXGBdxg) দেখুন একটি বিস্তৃত ওভারভিউর জন্য। +> 🎥 **ভিডিও রিসোর্স**: এই সরঞ্জামগুলো কর্মরত দেখতে চান? দেখুন এই [Tools of the Trade ভিডিও](https://youtube.com/watch?v=69WJeXGBdxg) ব্যাপক পর্যালোচনার জন্য। #### ওয়েব ডেভেলপমেন্টের জন্য সুপারিশকৃত এডিটর -**[Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon)** (বিনামূল্যে) -- ওয়েব ডেভেলপারদের মধ্যে সবচেয়ে জনপ্রিয় -- চমৎকার এক্সটেনশন ইকোসিস্টেম -- বিল্ট-ইন টার্মিনাল এবং Git ইন্টিগ্রেশন -- **অবশ্যই থাকা এক্সটেনশন**: - - [GitHub Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot) - AI-চালিত কোড পরামর্শ - - [Live Share](https://marketplace.visualstudio.com/items?itemName=MS-vsliveshare.vsliveshare) - রিয়েল-টাইম সহযোগিতা - - [Prettier](https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode) - স্বয়ংক্রিয় কোড ফরম্যাটিং - - [Code Spell Checker](https://marketplace.visualstudio.com/items?itemName=streetsidesoftware.code-spell-checker) - কোডে টাইপো ধরুন +**[Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon)** (ফ্রি) +- ওয়েব ডেভেলপারদের মধ্যে সবচেয়ে জনপ্রিয় +- চমৎকার এক্সটেনশন ইকোসিস্টেম +- বিল্ট-ইন টার্মিনাল এবং Git ইন্টিগ্রেশন +- **অত্যাবশ্যক এক্সটেনশনস**: + - [GitHub Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot) - AI চালিত কোড প্রস্তাব + - [Live Share](https://marketplace.visualstudio.com/items?itemName=MS-vsliveshare.vsliveshare) - রিয়েল-টাইম সহযোগিতা + - [Prettier](https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode) - স্বয়ংক্রিয় কোড ফরম্যাটিং + - [Code Spell Checker](https://marketplace.visualstudio.com/items?itemName=streetsidesoftware.code-spell-checker) - আপনার কোডে টাইপো ধরার জন্য + +**[JetBrains WebStorm](https://www.jetbrains.com/webstorm/)** (পেইড, ছাত্রদের জন্য ফ্রি) +- উন্নত ডিবাগিং এবং টেস্টিং টুলস +- বুদ্ধিমান কোড সম্পূরক +- বিল্ট-ইন সংস্করণ নিয়ন্ত্রণ -**[JetBrains WebStorm](https://www.jetbrains.com/webstorm/)** (পেইড, শিক্ষার্থীদের জন্য বিনামূল্যে) -- উন্নত ডিবাগিং এবং টেস্টিং টুলস -- বুদ্ধিমান কোড কমপ্লিশন -- বিল্ট-ইন ভার্সন কন্ট্রোল +**ক্লাউড-ভিত্তিক IDEs** (বিভিন্ন মূল্য) +- [GitHub Codespaces](https://github.com/features/codespaces) - আপনার ব্রাউজারে পূর্ণ VS Code +- [Replit](https://replit.com/) - শেখা এবং কোড শেয়ার করার জন্য চমৎকার +- [StackBlitz](https://stackblitz.com/) - তাৎক্ষণিক, পূর্ণ-স্ট্যাক ওয়েব ডেভেলপমেন্ট -**ক্লাউড-ভিত্তিক IDEs** (বিভিন্ন মূল্য -যখন প্রথমবার কেউ আমাকে ব্রাউজার ডেভটুলস দেখিয়েছিল, আমি প্রায় তিন ঘণ্টা শুধু ক্লিক করেই কাটিয়েছি এবং বলেছি, "অপেক্ষা করুন, এটা কি এটাও করতে পারে?!" আপনি বাস্তব সময়ে যেকোনো ওয়েবসাইট সম্পাদনা করতে পারেন, ঠিক কত দ্রুত সবকিছু লোড হয় তা দেখতে পারেন, বিভিন্ন ডিভাইসে আপনার সাইট কেমন দেখায় তা পরীক্ষা করতে পারেন, এবং এমনকি একজন পেশাদারের মতো জাভাস্ক্রিপ্ট ডিবাগ করতে পারেন। এটা একেবারে অবিশ্বাস্য! +> 💡 **শুরুর টিপ**: Visual Studio Code দিয়ে শুরু করুন – এটি ফ্রি, শিল্পে ব্যাপক ব্যবহৃত, এবং একটি বিশাল কমিউনিটি সহায়ক টিউটোরিয়াল এবং এক্সটেনশন তৈরি করে। -**ব্রাউজার কেন আপনার গোপন অস্ত্র:** +### ওয়েব ব্রাউজার: আপনার গোপন উন্নয়ন ল্যাবরেটরি -যখন আপনি একটি ওয়েবসাইট বা ওয়েব অ্যাপ্লিকেশন তৈরি করেন, তখন আপনাকে দেখতে হবে এটি বাস্তব জগতে কেমন দেখায় এবং কাজ করে। ব্রাউজার শুধু আপনার কাজ প্রদর্শন করে না, বরং পারফরম্যান্স, অ্যাক্সেসিবিলিটি এবং সম্ভাব্য সমস্যাগুলির বিষয়ে বিস্তারিত প্রতিক্রিয়া প্রদান করে। +ঠিক আছে, প্রস্তুত হন পুরোপুরি অবাক হতে! আপনি জানেন কিভাবে সোশ্যাল মিডিয়া স্ক্রোল করা এবং ভিডিও দেখা জন্য ব্রাউজার ব্যবহার করেছেন? আসলে তারা এই পুরো সময়টা অবিশ্বাস্য গোপন ডেভেলপার ল্যাবরেটরি লুকিয়ে রেখেছিল, শুধু আপনার আবিষ্কারের জন্য অপেক্ষা করছিল! -#### ব্রাউজার ডেভেলপার টুলস (ডেভটুলস) +প্রতিবার যখন আপনি একটি ওয়েবপেজে রাইট-ক্লিক করে "Inspect Element" নির্বাচন করেন, আপনি এমন একটি গোপন বিশ্বের দরজা খুলছেন যা সত্যি বলতে আমার আগে শত শত ডলার খরচ করে কেনা সফটওয়্যারের থেকেও অনেক বেশি শক্তিশালী। এটা ঠিক যেন আপনার সাধারণ রান্নাঘরের একটি সিক্রেট প্যানেলের পেছনে একজন পেশাদার শেফের গবেষণাগৃহ লুকিয়ে ছিল! +প্রথমবার কেউ আমাকে ব্রাউজার DevTools দেখিয়েছিল, আমি প্রায় তিন ঘন্টা কেবল ক্লিক করতে করতে এবং বলছিলাম "রুসি, এটা এটাও করতে পারে?!" আপনি আদৌ যেকোনো ওয়েবসাইট রিয়েল-টাইমে সম্পাদনা করতে পারেন, ঠিক কেমন দ্রুত সবকিছু লোড হচ্ছে তা দেখতে পারেন, বিভিন্ন ডিভাইসে আপনার সাইট কেমন দেখায় পরীক্ষা করতে পারেন, এমনকি জাভাস্ক্রিপ্ট ডিবাগ করতে পারেন পাশাঠ মতো। এটা পুরোপুরি চমকপ্রদ! -আধুনিক ব্রাউজারগুলিতে বিস্তৃত ডেভেলপমেন্ট স্যুট অন্তর্ভুক্ত রয়েছে: +**এটাই কারণ ব্রাউজারগুলি আপনার গোপন অস্ত্র:** -| টুলের বিভাগ | এটি কী করে | উদাহরণ ব্যবহার | -|-------------|------------|----------------| -| **এলিমেন্ট ইন্সপেক্টর** | HTML/CSS বাস্তব সময়ে দেখুন এবং সম্পাদনা করুন | স্টাইলিং সামঞ্জস্য করুন এবং তাৎক্ষণিক ফলাফল দেখুন | -| **কনসোল** | ত্রুটি বার্তা দেখুন এবং জাভাস্ক্রিপ্ট পরীক্ষা করুন | সমস্যা ডিবাগ করুন এবং কোড নিয়ে পরীক্ষা করুন | -| **নেটওয়ার্ক মনিটর** | রিসোর্স লোড কেমন হচ্ছে তা ট্র্যাক করুন | পারফরম্যান্স এবং লোডিং টাইম অপ্টিমাইজ করুন | -| **অ্যাক্সেসিবিলিটি চেকার** | অন্তর্ভুক্তিমূলক ডিজাইন পরীক্ষা করুন | নিশ্চিত করুন যে আপনার সাইট সব ব্যবহারকারীর জন্য কাজ করে | -| **ডিভাইস সিমুলেটর** | বিভিন্ন স্ক্রিন সাইজে প্রিভিউ দেখুন | একাধিক ডিভাইস ছাড়াই রেসপন্সিভ ডিজাইন পরীক্ষা করুন | +যখন আপনি একটি ওয়েবসাইট বা ওয়েব অ্যাপ তৈরি করেন, আপনাকে দেখতে হয় এটা বাস্তব জগতে কেমন দেখায় এবং কিভাবে কাজ করে। ব্রাউজার শুধু আপনার কাজ প্রদর্শন করে না, বরং কার্যক্ষমতা, প্রবেশগম্যতা, এবং সম্ভাব্য সমস্যাগুলি সম্পর্কে বিস্তারিত প্রতিক্রিয়াও দেয়। -#### ডেভেলপমেন্টের জন্য সুপারিশকৃত ব্রাউজার +#### ব্রাউজার ডেভেলপার সরঞ্জাম (DevTools) -- **[Chrome](https://developers.google.com/web/tools/chrome-devtools/)** - শিল্প-মান DevTools সহ বিস্তৃত ডকুমেন্টেশন -- **[Firefox](https://developer.mozilla.org/docs/Tools)** - চমৎকার CSS Grid এবং অ্যাক্সেসিবিলিটি টুলস -- **[Edge](https://docs.microsoft.com/microsoft-edge/devtools-guide-chromium/?WT.mc_id=academic-77807-sagibbon)** - Chromium ভিত্তিক, Microsoft's ডেভেলপার রিসোর্স সহ +আধুনিক ব্রাউজারগুলি বিস্তৃত ডেভেলপমেন্ট স্যুট অন্তর্ভুক্ত করে: -> ⚠️ **গুরুত্বপূর্ণ পরীক্ষার টিপস**: আপনার ওয়েবসাইটগুলি সবসময় একাধিক ব্রাউজারে পরীক্ষা করুন! Chrome-এ যা পুরোপুরি কাজ করে তা Safari বা Firefox-এ ভিন্ন দেখাতে পারে। পেশাদার ডেভেলপাররা সমস্ত প্রধান ব্রাউজারে পরীক্ষা করেন যাতে ব্যবহারকারীর অভিজ্ঞতা সঙ্গতিপূর্ণ হয়। +| টুল ক্যাটাগরি | এটি কী করে | উদাহরণ ব্যবহারিক | +|---------------|--------------|------------------| +| **এলিমেন্ট ইন্সপেক্টর** | রিয়েল-টাইমে HTML/CSS দেখা এবং সম্পাদনা করা | স্টাইলিং সামঞ্জস্য করে তাৎক্ষণিক ফলাফল দেখা | +| **কন্সোলে** | ত্রুটি বার্তা দেখা ও জাভাস্ক্রিপ্ট টেস্ট করা | সমস্যা ডিবাগ করা এবং কোড নিয়ে পরীক্ষা-নিরীক্ষা করা | +| **নেটওয়ার্ক মনিটর** | রিসোর্স কিভাবে লোড হচ্ছে তা ট্র্যাক করা | কার্যক্ষমতা ও লোডিং সময় উন্নত করা | +| **অ্যাক্সেসিবিলিটি চেকার** | অন্তর্ভুক্ত ডিজাইনের জন্য টেস্ট করা | নিশ্চিত করা আপনার সাইট সব ব্যবহারকারীর জন্য কাজ করে | +| **ডিভাইস সিমুলেটর** | বিভিন্ন স্ক্রিন সাইজে প্রিভিউ | একাধিক ডিভাইস ছাড়াই রেসপনসিভ ডিজাইন পরীক্ষা করা | -### কমান্ড লাইন টুলস: ডেভেলপার সুপারপাওয়ারসের গেটওয়ে +#### বিকাশের জন্য সুপারিশকৃত ব্রাউজার -ঠিক আছে, এখানে কমান্ড লাইন সম্পর্কে সম্পূর্ণ সৎ মুহূর্তের কথা বলি, কারণ আমি চাই আপনি এটা এমন কারো কাছ থেকে শুনুন যে সত্যিই এটা বোঝে। যখন আমি প্রথম এটি দেখেছিলাম – শুধু এই ভয়ঙ্কর কালো স্ক্রিনটি যা টেক্সট ব্লিঙ্ক করছিল – আমি সত্যিই ভেবেছিলাম, "না, একদম না! এটা তো ১৯৮০ এর দশকের কোনো হ্যাকার মুভির মতো দেখাচ্ছে, এবং আমি অবশ্যই এর জন্য যথেষ্ট স্মার্ট নই!" 😅 +- **[Chrome](https://developers.google.com/web/tools/chrome-devtools/)** - শিল্প মানের DevTools বিস্তৃত ডকুমেন্টেশন সহ +- **[Firefox](https://developer.mozilla.org/docs/Tools)** - চমৎকার CSS গ্রিড এবং অ্যাক্সেসিবিলিটি টুলস +- **[Edge](https://docs.microsoft.com/microsoft-edge/devtools-guide-chromium/?WT.mc_id=academic-77807-sagibbon)** - ক্রোমিয়ামে ভিত্তি করে মাইক্রোসফটের ডেভেলপার রিসোর্সস সহ -কিন্তু আমি যা চাইতাম কেউ আমাকে তখন বলুক, এবং যা আমি এখন আপনাকে বলছি: কমান্ড লাইন ভীতিকর নয় – এটি আসলে আপনার কম্পিউটারের সাথে সরাসরি কথোপকথনের মতো। এটা এমন, যেমন আপনি একটি ফ্যান্সি অ্যাপ দিয়ে খাবার অর্ডার করছেন যেখানে ছবি এবং মেনু রয়েছে (যা সুন্দর এবং সহজ) বনাম আপনার প্রিয় স্থানীয় রেস্টুরেন্টে হাঁটছেন যেখানে শেফ ঠিক জানেন আপনি কী পছন্দ করেন এবং আপনি শুধু বলছেন "আমাকে কিছু অসাধারণ দিয়ে চমকে দিন।" +> ⚠️ **গুরুত্বপূর্ণ টেস্টিং টিপ**: সর্বদা আপনার ওয়েবসাইটগুলি একাধিক ব্রাউজারে পরীক্ষা করুন! যা ক্রোমে নিখুঁত কাজ করে তা সাফারি বা ফায়ারফক্সে ভিন্ন দেখাতে পারে। পেশাদার ডেভেলপাররা সব প্রধান ব্রাউজারে পরীক্ষা করে নিশ্চিত হন ব্যবহারকারীর অভিজ্ঞতা সঙ্গতিপূর্ণ থাকে। -কমান্ড লাইন এমন জায়গা যেখানে ডেভেলপাররা যায় যেন তারা সম্পূর্ণ জাদুকর। আপনি কয়েকটি জাদুকরী শব্দ টাইপ করেন (ঠিক আছে, তারা শুধু কমান্ড, কিন্তু তারা জাদুকরী মনে হয়!), এন্টার চাপুন, এবং বুম – আপনি পুরো প্রকল্পের কাঠামো তৈরি করেছেন, বিশ্বজুড়ে শক্তিশালী টুল ইনস্টল করেছেন, অথবা আপনার অ্যাপ ইন্টারনেটে প্রকাশ করেছেন যাতে লক্ষ লক্ষ মানুষ এটি দেখতে পারে। একবার আপনি সেই ক্ষমতার স্বাদ পেয়ে গেলে, এটি সত্যিই বেশ নেশাজনক! -**কমান্ড লাইন কেন আপনার প্রিয় টুল হয়ে উঠবে:** +### কমান্ড লাইন টুলস: আপনার ডেভেলপার স্সুপারপাওয়ারের প্রবেশদ্বার -গ্রাফিকাল ইন্টারফেস অনেক কাজের জন্য দুর্দান্ত, তবে কমান্ড লাইন অটোমেশন, নির্ভুলতা এবং গতিতে শ্রেষ্ঠ। অনেক ডেভেলপমেন্ট টুল মূলত কমান্ড লাইন ইন্টারফেসের মাধ্যমে কাজ করে, এবং সেগুলি দক্ষতার সাথে ব্যবহার করা শিখলে আপনার উৎপাদনশীলতা নাটকীয়ভাবে উন্নত হতে পারে। +আচ্ছা, কমান্ড লাইন সম্পর্কে সম্পূর্ণ সৎ মুহূর্ত নেওয়া যাক, কারণ আমি চাই আপনি এটা এমন একজন থেকে শুনুন যিনি সত্যিই এটা বোঝেন। যখন আমি প্রথম এটাকে দেখেছিলাম – কেবল এই ভয়ঙ্কর কালো স্ক্রীন যা টিপটিপ করে লেখা দেখাচ্ছিল – আমি সত্যিই ভাবছিলাম, “না, একদম না! এটা যেন ১৯৮০-এর দশকের হ্যাকার সিনেমার কিছু, আর আমি নিশ্চিত এটা করার জন্য যথেষ্ট বুদ্ধিমান নই!” 😅 + +কিন্তু এখানেই আমি চাই কেউ আমাকে তখন বলত, আর আমি এখন আপনাকে বলছি: কমান্ড লাইন ভয়ঙ্কর নয় – এটা আসলে আপনার কম্পিউটারের সাথে সরাসরি কথোপকথনের মতো। ভাবুন এটা যেমন একটি ফ্যান্সি অ্যাপ থেকে ছবি আর মেনু সহ খাবার অর্ডার করার মতো (যা ভালো এবং সহজ), তার তুলনায় আপনার প্রিয় স্থানীয় রেস্টুরেন্টে হাঁটার মতো, যেখানে শেফ ঠিক জানে আপনি কি পছন্দ করেন এবং আপনি শুধু বললেই “দয়াকরে মুগ্ধকর কিছু সারপ্রাইজ দিন” সঙ্গে অসাধারণ কিছু রান্না করতে পারে। + +কমান্ড লাইন হলো সেই জায়গা যেখানে ডেভেলপাররা পুরোপুরি যাদুকর হিসাবে অনুভব করে। আপনি কয়েকটি দেখতে জাদুকরী শব্দ টাইপ করেন (ঠিক আছে, এগুলো কমান্ড মাত্র, কিন্তু জাদুকরী মনে হয়!), এন্টার চাপেন, আর হঠাৎ – আপনি পুরো প্রকল্পের গঠন তৈরি করেছেন, শক্তিশালী সরঞ্জাম বিশ্বের বিভিন্ন স্থান থেকে ইন্সটল করেছেন, বা আপনার অ্যাপ ইন্টারনেটে মাইলিয়ন মানুষের দেখার জন্য ডিপ্লয় করেছেন। একবার আপনি এই ক্ষমতার স্বাদ পেয়ে গেলে, সত্যিই এটি আসক্তিকর হয়ে যায়! + +**কেন কমান্ড লাইন আপনার প্রিয় সরঞ্জাম হবে:** + +যদিও গ্রাফিক্যাল ইন্টারফেস অনেক কাজের জন্য দুর্দান্ত, কমান্ড লাইন স্বয়ংক্রিয়তা, নিখুঁততা এবং গতি নিয়ে ছাড়িয়ে যায়। অনেক ডেভেলপমেন্ট টুলস প্রধানত কমান্ড লাইন ইন্টারফেস ব্যবহার করে কাজ করে, এবং দক্ষতার সঙ্গে এগুলো ব্যবহার শেখা আপনার উৎপাদনশীলতা নাটকীয়ভাবে বাড়াতে পারে। ```bash -# Step 1: Create and navigate to project directory +# ধাপ ১: প্রকল্প ডিরেক্টরি তৈরি করুন এবং সেখানে যান mkdir my-awesome-website cd my-awesome-website ``` **এই কোডটি কী করে:** -- **নতুন ডিরেক্টরি তৈরি করুন** "my-awesome-website" নামে আপনার প্রকল্পের জন্য -- **নেভিগেট করুন** নতুন তৈরি ডিরেক্টরিতে কাজ শুরু করতে +- **নতুন ডিরেক্টরি তৈরি করে** যার নাম "my-awesome-website" আপনার প্রকল্পের জন্য +- **নতুন তৈরি ডিরেক্টরিতে প্রবেশ করে** কাজ শুরু করার জন্য ```bash -# Step 2: Initialize project with package.json +# ধাপ ২: package.json দিয়ে প্রকল্প শুরু করুন npm init -y -# Install modern development tools +# আধুনিক উন্নয়ন সরঞ্জাম ইনস্টল করুন npm install --save-dev vite prettier eslint npm install --save-dev @eslint/js ``` -**ধাপে ধাপে যা ঘটছে:** -- **নোড.জেএস প্রকল্প ইনিশিয়ালাইজ করুন** ডিফল্ট সেটিংস সহ `npm init -y` ব্যবহার করে -- **Vite ইনস্টল করুন** দ্রুত ডেভেলপমেন্ট এবং প্রোডাকশন বিল্ডের জন্য একটি আধুনিক বিল্ড টুল হিসেবে -- **Prettier যোগ করুন** স্বয়ংক্রিয় কোড ফরম্যাটিংয়ের জন্য এবং ESLint কোডের গুণমান পরীক্ষা করার জন্য -- **`--save-dev` ফ্ল্যাগ ব্যবহার করুন** এগুলিকে শুধুমাত্র ডেভেলপমেন্ট-সম্পর্কিত ডিপেনডেন্সি হিসেবে চিহ্নিত করতে +**ক্রমানুসারে, যা ঘটছে তা হলো:** +- `npm init -y` ব্যবহার করে ডিফল্ট সেটিংস সহ নতুন Node.js প্রকল্প আরম্ভ করা +- দ্রুত উন্নয়ন ও প্রোডাকশন বিল্ডের জন্য আধুনিক বিল্ড টুল Vite ইন্সটল করা +- স্বয়ংক্রিয় কোড ফরম্যাটিং এর জন্য Prettier এবং কোড গুণগত মান পরীক্ষা করার জন্য ESLint যোগ করা +- `--save-dev` ফ্ল্যাগ ব্যবহার করে এগুলোকে শুধুমাত্র ডেভেলপমেন্ট নির্ভরশীল হিসেবে চিহ্নিত করা ```bash -# Step 3: Create project structure and files +# ধাপ ৩: প্রকল্পের কাঠামো এবং ফাইল তৈরি করুন mkdir src assets echo 'My Site

Hello World

' > index.html -# Start development server +# ডেভেলপমেন্ট সার্ভার শুরু করুন npx vite ``` -**উপরের কোডে আমরা:** -- **প্রকল্প সংগঠিত করেছি** সোর্স কোড এবং অ্যাসেটের জন্য আলাদা ফোল্ডার তৈরি করে -- **একটি বেসিক HTML ফাইল তৈরি করেছি** সঠিক ডকুমেন্ট স্ট্রাকচারের সাথে -- **Vite ডেভেলপমেন্ট সার্ভার শুরু করেছি** লাইভ রিলোডিং এবং হট মডিউল রিপ্লেসমেন্টের জন্য +**উপরোক্ত ক্ষেত্রে, আমরা:** +- আলাদা সোর্স কোড ও এসেট ফোল্ডার তৈরি করে প্রকল্প সংগঠিত করেছি +- সঠিক ডকুমেন্ট স্ট্রাকচার সহ একটি বেসিক HTML ফাইল তৈরি করেছি +- লাইভ রিলোড এবং হট মডিউল রিপ্লেসমেন্টের জন্য Vite ডেভেলপমেন্ট সার্ভার শুরু করেছি -#### ওয়েব ডেভেলপমেন্টের জন্য প্রয়োজনীয় কমান্ড লাইন টুলস +#### ওয়েব উন্নয়নের জন্য অপরিহার্য কমান্ড লাইন টুলস -| টুল | উদ্দেশ্য | কেন এটি দরকার | -|-----|----------|----------------| -| **[Git](https://git-scm.com/)** | ভার্সন কন্ট্রোল | পরিবর্তন ট্র্যাক করুন, অন্যদের সাথে সহযোগিতা করুন, আপনার কাজ ব্যাকআপ করুন | -| **[Node.js & npm](https://nodejs.org/)** | জাভাস্ক্রিপ্ট রানটাইম এবং প্যাকেজ ম্যানেজমেন্ট | ব্রাউজারের বাইরে জাভাস্ক্রিপ্ট চালান, আধুনিক ডেভেলপমেন্ট টুল ইনস্টল করুন | -| **[Vite](https://vitejs.dev/)** | বিল্ড টুল এবং ডেভ সার্ভার | হট মডিউল রিপ্লেসমেন্ট সহ দ্রুত ডেভেলপমেন্ট | -| **[ESLint](https://eslint.org/)** | কোডের গুণমান | আপনার জাভাস্ক্রিপ্টে সমস্যা স্বয়ংক্রিয়ভাবে খুঁজে বের করুন এবং ঠিক করুন | -| **[Prettier](https://prettier.io/)** | কোড ফরম্যাটিং | আপনার কোডকে ধারাবাহিকভাবে ফরম্যাট এবং পাঠযোগ্য রাখুন | +| টুল | উদ্দেশ্য | কেন দরকার | +|------|---------|-----------------| +| **[Git](https://git-scm.com/)** | ভার্সন কন্ট্রোল | পরিবর্তন ট্র্যাক করা, সাথে কাজ করা, ব্যাকআপ রাখা | +| **[Node.js & npm](https://nodejs.org/)** | জাভাস্ক্রিপ্ট রানটাইম ও প্যাকেজ ম্যানেজমেন্ট | ব্রাউজারের বাইরে জাভাস্ক্রিপ্ট চালানো, আধুনিক ডেভেলপমেন্ট টুল ইনস্টল করা | +| **[Vite](https://vitejs.dev/)** | বিল্ড টুল ও ডেভ সার্ভার | অত্যন্ত দ্রুত উন্নয়ন হট মডিউল রিপ্লেসমেন্ট সহ | +| **[ESLint](https://eslint.org/)** | কোড গুণমান | স্বয়ংক্রিয়ভাবে জাভাস্ক্রিপ্ট কোডের সমস্যা খুঁজে বের করা ও ঠিক করা | +| **[Prettier](https://prettier.io/)** | কোড ফরম্যাটিং | আপনার কোড নিয়মিত ফরম্যাটেড ও পাঠযোগ্য রাখা | #### প্ল্যাটফর্ম-নির্দিষ্ট অপশন **Windows:** -- **[Windows Terminal](https://docs.microsoft.com/windows/terminal/?WT.mc_id=academic-77807-sagibbon)** - আধুনিক, ফিচার-সমৃদ্ধ টার্মিনাল -- **[PowerShell](https://docs.microsoft.com/powershell/?WT.mc_id=academic-77807-sagibbon)** 💻 - শক্তিশালী স্ক্রিপ্টিং পরিবেশ -- **[Command Prompt](https://docs.microsoft.com/windows-server/administration/windows-commands/?WT.mc_id=academic-77807-sagibbon)** 💻 - ঐতিহ্যবাহী Windows কমান্ড লাইন +- **[Windows Terminal](https://docs.microsoft.com/windows/terminal/?WT.mc_id=academic-77807-sagibbon)** – আধুনিক, বৈশিষ্ট্যসম্পন্ন টার্মিনাল +- **[PowerShell](https://docs.microsoft.com/powershell/?WT.mc_id=academic-77807-sagibbon)** 💻 – শক্তিশালী স্ক্রিপ্টিং পরিবেশ +- **[Command Prompt](https://docs.microsoft.com/windows-server/administration/windows-commands/?WT.mc_id=academic-77807-sagibbon)** 💻 – ঐতিহ্যবাহী উইন্ডোজ কমান্ড লাইন **macOS:** -- **[Terminal](https://support.apple.com/guide/terminal/)** 💻 - বিল্ট-ইন টার্মিনাল অ্যাপ্লিকেশন -- **[iTerm2](https://iterm2.com/)** - উন্নত টার্মিনাল উন্নত বৈশিষ্ট্য সহ +- **[Terminal](https://support.apple.com/guide/terminal/)** 💻 – বিল্ট-ইন টার্মিনাল অ্যাপ্লিকেশন +- **[iTerm2](https://iterm2.com/)** – উন্নত বৈশিষ্ট্যসহ টার্মিনাল **Linux:** -- **[Bash](https://www.gnu.org/software/bash/)** 💻 - স্ট্যান্ডার্ড Linux শেল -- **[KDE Konsole](https://docs.kde.org/trunk5/en/konsole/konsole/index.html)** - উন্নত টার্মিনাল এমুলেটর +- **[Bash](https://www.gnu.org/software/bash/)** 💻 – স্ট্যান্ডার্ড লিনাক্স শেল +- **[KDE Konsole](https://docs.kde.org/trunk5/en/konsole/konsole/index.html)** – উন্নত টার্মিনাল এমুলেটর > 💻 = অপারেটিং সিস্টেমে প্রি-ইনস্টল করা -> 🎯 **শেখার পথ**: `cd` (ডিরেক্টরি পরিবর্তন), `ls` বা `dir` (ফাইল তালিকা), এবং `mkdir` (ফোল্ডার তৈরি) এর মতো মৌলিক কমান্ড দিয়ে শুরু করুন। `npm install`, `git status`, এবং `code .` (বর্তমান ডিরেক্টরি VS Code-এ খুলুন) এর মতো আধুনিক ওয়ার্কফ্লো কমান্ড দিয়ে অনুশীলন করুন। আপনি যত বেশি স্বাচ্ছন্দ্য বোধ করবেন, ততই আপনি আরও উন্নত কমান্ড এবং অটোমেশন কৌশলগুলি শিখবেন। +> 🎯 **শেখার পথ**: মৌলিক কমান্ড যেমন `cd` (ডিরেক্টরি পরিবর্তন), `ls` বা `dir` (ফাইল তালিকা), এবং `mkdir` (ফোল্ডার তৈরি) দিয়ে শুরু করুন। আধুনিক ওয়ার্কফ্লো কমান্ড যেমন `npm install`, `git status`, এবং `code .` (বর্তমান ডিরেক্টরিতে VS Code খুলে) দিয়ে অনুশীলন করুন। আরামদায়ক হওয়ার সাথে সাথেই আপনি স্বাভাবিকভাবেই আরও উন্নত কমান্ড এবং স্বয়ংক্রিয়করণ কৌশল শিখবেন। + -### ডকুমেন্টেশন: আপনার সর্বদা-উপলব্ধ শেখার মেন্টর +### ডকুমেন্টেশন: আপনার সর্বদা উপলব্ধ শেখার উপদেশক -ঠিক আছে, আমি একটি ছোট গোপন কথা শেয়ার করতে চাই যা আপনাকে একজন শিক্ষানবিশ হিসেবে আরও ভালো অনুভব করতে সাহায্য করবে: এমনকি সবচেয়ে অভিজ্ঞ ডেভেলপাররাও তাদের সময়ের একটি বড় অংশ ডকুমেন্টেশন পড়তে ব্যয় করেন। এবং এটি এই কারণে নয় যে তারা জানে না তারা কী করছে – এটি আসলে জ্ঞানের একটি চিহ্ন! +আচ্ছা, আমি একটি ছোট গোপন কথা শেয়ার করব যা আপনাকে শুরুতে অনেক ভালো লাগবে: সবচেয়ে অভিজ্ঞ ডেভেলপাররাও তাদের সময়ের একটা বিশাল অংশ ডকুমেন্টেশন পড়তে ব্যয় করেন। এবং এটা এই কারণে নয় যে তারা জানেন না কী করছেন – বরং এটা প্রজ্ঞার পরিচয়! -ডকুমেন্টেশনকে এমন বিশ্বের সবচেয়ে ধৈর্যশীল, জ্ঞানী শিক্ষকদের অ্যাক্সেস করার মতো মনে করুন যারা ২৪/৭ উপলব্ধ। রাত ২টায় কোনো সমস্যায় আটকে গেছেন? ডকুমেন্টেশন সেখানে একটি উষ্ণ ভার্চুয়াল আলিঙ্গন এবং ঠিক আপনার প্রয়োজনীয় উত্তর নিয়ে। সবাই যে নতুন বৈশিষ্ট্যটি নিয়ে কথা বলছে তা সম্পর্কে জানতে চান? ডকুমেন্টেশন আপনার পাশে রয়েছে ধাপে ধাপে উদাহরণ সহ। কিছু কেন কাজ করে তা বোঝার চেষ্টা করছেন? আপনি অনুমান করেছেন – ডকুমেন্টেশন এটি ব্যাখ্যা করতে প্রস্তুত এমনভাবে যা অবশেষে এটিকে ক্লিক করে তোলে! +ডকুমেন্টেশন ভাবুন বিশ্বজুড়ে সবচেয়ে ধৈর্যশীল, জ্ঞানশালী শিক্ষকদের প্রবেশাধিকার হিসেবে যারা ২৪/৭ উপলব্ধ। দুপুর ২টায় কোনো সমস্যায় আটকা? ডকুমেন্টেশন আপনাকে একটি উষ্ণ ভার্চুয়াল আলিঙ্গন ও সঠিক উত্তর সরবরাহ করে। কেউ নতুন কোনো শীতল ফিচার সম্পর্কে জানতে চায় যা সবাই আলোচনা করছে? ডকুমেন্টেশন আপনার পিঠ দেয় পর্যায়ক্রমিক উদাহরণ দিয়ে। কেন কিছু নিয়ে কাজ করে সে রীতিটি বুঝতে চান? অনুমান করুন – ডকুমেন্টেশন বুঝিয়ে দিতে প্রস্তুত যাতে আপনি অবশেষে তা বুঝতে পারেন! -এখানে এমন কিছু আছে যা আমার দৃষ্টিভঙ্গি সম্পূর্ণরূপে পরিবর্তন করেছে: ওয়েব ডেভেলপমেন্ট বিশ্বটি অবিশ্বাস্যভাবে দ্রুত চলে, এবং কেউ (আমি বলতে চাই, একেবারে কেউই!) সবকিছু মনে রাখে না। আমি ১৫+ বছরের অভিজ্ঞতা সম্পন্ন সিনিয়র ডেভেলপারদের দেখেছি মৌলিক সিনট্যাক্স খুঁজে বের করতে, এবং আপনি জানেন কি? এটি লজ্জাজনক নয় – এটি বুদ্ধিমানের কাজ! এটি নিখুঁত স্মৃতি থাকার বিষয়ে নয়; এটি দ্রুত নির্ভরযোগ্য উত্তরগুলি কোথায় খুঁজে পাওয়া যায় তা জানার এবং সেগুলি কীভাবে প্রয়োগ করতে হয় তা বোঝার বিষয়ে। +এটা এমন কিছু যা আমার দৃষ্টিভঙ্গি পুরোপুরি বদলে দিয়েছিল: ওয়েব ডেভেলপমেন্ট জগতটি দ্রুত এগিয়ে চলে, এবং কেউই (আমি বলছি একদম কেউই নয়!) সবকিছু মুখস্থ রাখে না। আমি ১৫+ বছরের অভিজ্ঞতা সম্পন্ন সিনিয়র ডেভেলপারদের মৌলিক সিনট্যাক্স খুঁজে দেখার ঘটনা দেখেছি, এবং জানেন কি? এটা লজ্জাজনক নয় – এটা বুদ্ধিমানের কাজ! নিখুঁত স্মৃতির ব্যাপারে নয়; বরং এটি দ্রুত নির্ভরযোগ্য উত্তর খুঁজে পেতে এবং প্রয়োগ করার কৌশল জানা। -**এখানে আসল জাদু ঘটে:** +**এখানেই আসল জাদু ঘটে:** -পেশাদার ডেভেলপাররা তাদের সময়ের একটি উল্লেখযোগ্য অংশ ডকুমেন্টেশন পড়তে ব্যয় করেন – কারণ তারা জানে যে ওয়েব ডেভেলপমেন্টের ল্যান্ডস্কেপ এত দ্রুত বিকশিত হয় যে বর্তমান থাকতে হলে ক্রমাগত শেখার প্রয়োজন। চমৎকার ডকুমেন্টেশন আপনাকে শুধু *কীভাবে* কিছু ব্যবহার করতে হয় তা বুঝতে সাহায্য করে না, বরং *কেন* এবং *কখন* এটি ব্যবহার করতে হয় তাও বুঝতে সাহায্য করে। +পেশাদার ডেভেলপাররা বড় অংশ ডকুমেন্টেশন পড়েন – এটা তাদের অজ্ঞতা নয়, বরং ওয়েব ডেভেলপমেন্ট দ্রুত পরিবর্তনশীল হওয়ার কারণে তারা সর্বদা নতুন কিছু শিখতে থাকে। অসাধারণ ডকুমেন্টেশন শুধু শেখায় *কিভাবে* কিছু ব্যবহার করবেন না, বরং *কেন* এবং *কবে* ব্যবহার করবেন। -#### প্রয়োজনীয় ডকুমেন্টেশন রিসোর্স +#### অপরিহার্য ডকুমেন্টেশন রিসোর্সেস **[Mozilla Developer Network (MDN)](https://developer.mozilla.org/docs/Web)** -- ওয়েব প্রযুক্তি ডকুমেন্টেশনের জন্য সেরা মান -- HTML, CSS, এবং জাভাস্ক্রিপ্টের জন্য বিস্তৃত গাইড -- ব্রাউজার সামঞ্জস্যতার তথ্য অন্তর্ভুক্ত -- ব্যবহারিক উদাহরণ এবং ইন্টারঅ্যাকটিভ ডেমো বৈশিষ্ট্যযুক্ত +- ওয়েব প্রযুক্তির স্বর্ণ মানের ডকুমেন্টেশন +- HTML, CSS, এবং জাভাস্ক্রিপ্টের বিস্তৃত গাইড +- ব্রাউজার সামঞ্জস্যতা তথ্য অন্তর্ভুক্ত +- ব্যবহারিক উদাহরণ এবং ইন্টারেক্টিভ ডেমো -**[Web.dev](https://web.dev)** (গুগলের দ্বারা) -- আধুনিক ওয়েব ডেভেলপমেন্টের সেরা অনুশীলন -- পারফরম্যান্স অপ্টিমাইজেশন গাইড -- অ্যাক্সেসিবিলিটি এবং অন্তর্ভুক্তিমূলক ডিজাইনের নীতিমালা -- বাস্তব প্রকল্পের কেস স্টাডি +**[Web.dev](https://web.dev)** (গুগল দ্বারা) +- আধুনিক ওয়েব উন্নয়নের সেরা অনুশীলন +- কার্যক্ষমতা অপ্টিমাইজেশন গাইড +- প্রবেশগম্যতা ও অন্তর্ভুক্ত ডিজাইন নীতি +- বাস্তব প্রকল্প থেকে কেস স্টাডি **[Microsoft Developer Documentation](https://docs.microsoft.com/microsoft-edge/#microsoft-edge-for-developers)** -- Edge ব্রাউজার ডেভেলপমেন্ট রিসোর্স -- প্রগ্রেসিভ ওয়েব অ্যাপ গাইড -- ক্রস-প্ল্যাটফর্ম ডেভেলপমেন্ট ইনসাইট +- Edge ব্রাউজার উন্নয়ন রিসোর্স +- প্রোগ্রেসিভ ওয়েব অ্যাপ গাইড +- ক্রস-প্ল্যাটফর্ম ডেভেলপমেন্ট অন্তর্দৃষ্টি **[Frontend Masters Learning Paths](https://frontendmasters.com/learn/)** -- গঠনমূলক শেখার পাঠ্যক্রম +- কাঠামোবদ্ধ শেখার পাঠ্যক্রম - শিল্প বিশেষজ্ঞদের ভিডিও কোর্স - হাতে-কলমে কোডিং অনুশীলন -> 📚 **অধ্যয়নের কৌশল**: ডকুমেন্টেশন মুখস্থ করার চেষ্টা করবেন না – বরং এটি দক্ষতার সাথে নেভিগেট করতে শিখুন। প্রায়ই ব্যবহৃত রেফারেন্সগুলি বুকমার্ক করুন এবং নির্দিষ্ট তথ্য দ্রুত খুঁজে পেতে অনুসন্ধান ফাংশনগুলি ব্যবহার করার অনুশীলন করুন। +> 📚 **অধ্যয়ন কৌশল**: ডকুমেন্টেশন মুখস্থ করার চেষ্টা করবেন না – বরং কিভাবে দক্ষতার সঙ্গে চালনা করবেন তা শিখুন। প্রায়শই ব্যবহৃত রেফারেন্স বুকমার্ক করুন এবং নির্দিষ্ট তথ্য দ্রুত খুঁজে পেতে সার্চ ফাংশন ব্যবহৃতার চর্চা করুন। -### 🔧 **টুল মাস্টারি চেক: আপনার সাথে কী অনুরণিত হয়?** +### 🔧 **টুল দক্ষতা যাচাই: আপনার সাথে কী অনুরণিত হয়?** -**এক মুহূর্ত সময় নিয়ে ভাবুন:** -- কোন টুলটি আপনি প্রথমে চেষ্টা করতে সবচেয়ে বেশি আগ্রহী? (এখানে ভুল উত্তর নেই!) -- কমান্ড লাইন কি এখনও ভীতিকর মনে হয়, নাকি আপনি এটি সম্পর্কে কৌতূহলী? -- আপনি কি আপনার প্রিয় ওয়েবসাইটগুলির পর্দার পিছনে উঁকি দিতে ব্রাউজার ডেভটুলস ব্যবহার করার কথা ভাবতে পারেন? +**একটু সময় নিয়ে ভাবুন:** +- কোন টুল প্রথমে চেষ্টা করতে সবচেয়ে আগ্রহী? (ভুল উত্তর নেই!) +- কমান্ড লাইন কি এখনও ভয়ানক মনে হয়, নাকি আপনি এতে কৌতূহলী? +- আপনি কি ব্রাউজার DevTools ব্যবহার করে আপনার প্রিয় ওয়েবসাইটগুলোর পেছনের পর্দা দেখতে কল্পনা করতে পারেন? ```mermaid -pie title "Developer Time Spent With Tools" - "Code Editor" : 40 - "Browser Testing" : 25 - "Command Line" : 15 - "Reading Docs" : 15 - "Debugging" : 5 +pie title "টুলস এর সাথে ডেভেলপার সময় ব্যয়" + "কোড এডিটর" : 40 + "ব্রাউজার টেস্টিং" : 25 + "কমান্ড লাইন" : 15 + "ডকুমেন্ট পড়া" : 15 + "ডিবাগিং" : 5 ``` +> **মজার অন্তর্দৃষ্টি**: অধিকাংশ ডেভেলপার তার সময়ের প্রায় ৪০% কোড সম্পাদকেই ব্যয় করে, কিন্তু লক্ষ করুন কত সময় যায় পরীক্ষা, শেখা, এবং সমস্যা সমাধানে। প্রোগ্রামিং কেবল কোড লেখা নয় – এটা অভিজ্ঞতা তৈরি! -> **মজার তথ্য**: বেশিরভাগ ডেভেলপার তাদের সময়ের প্রায় ৪০% তাদের কোড এডিটরে ব্যয় করেন, তবে লক্ষ্য করুন যে কতটা সময় পরীক্ষার, শেখার এবং সমস্যা সমাধানের জন্য যায়। প্রোগ্রামিং শুধু কোড লেখার বিষয়ে নয় – এটি অভিজ্ঞতা তৈরি করার বিষয়ে! +✅ **চিন্তার জন্য খাবার**: এখানে ভাবার জন্য কিছু মজার বিষয় – আপনি কী ভাবে ভাবেন, ওয়েবসাইট তৈরি করার টুল (ডেভেলপমেন্ট) এবং ডিজাইন সংক্রান্ত টুলগুলোর মধ্যে পার্থক্য কী? এটা ঠিক যেমন একজন স্থপতি সুন্দর বাড়ি ডিজাইন করেন আর ঠিকাদার সেই বাড়ি বাস্তবায়ন করেন। দুটোই গুরুত্বপূর্ণ, কিন্তু তাদের আলাদা আলাদা সরঞ্জাম বাক্স লাগে! এই ধরনের চিন্তা আপনাকে ওয়েবসাইট তৈরি হওয়ার বড় দিকগুলো দেখতে সাহায্য করবে। -✅ **চিন্তার খোরাক**: এখানে একটি আকর্ষণীয় বিষয় নিয়ে ভাবুন – ওয়েবসাইট তৈরি করার (ডেভেলপমেন্ট) টুলগুলি কীভাবে ওয়েবসাইটের চেহারা ডিজাইন করার (ডিজাইন) টুলগুলির থেকে আলাদা হতে পারে? এটি এমন, যেমন একজন স্থপতি একটি সুন্দর বাড়ি ডিজাইন করছেন এবং ঠিকাদার এটি তৈরি করছেন। উভয়ই গুরুত্বপূর্ণ, তবে তাদের আলাদা টুলবক্স দরকার! এই ধরনের চিন্তাভাবনা সত্যিই আপনাকে ওয়েবসাইটগুলি কীভাবে জীবন্ত হয়ে ওঠে তার বড় চিত্রটি দেখতে সাহায্য করবে। +## GitHub Copilot Agent চ্যালেঞ্জ 🚀 -## GitHub Copilot Agent Challenge 🚀 +Agent মোড ব্যবহার করে নিম্নলিখিত চ্যালেঞ্জ সম্পন্ন করুন: -Agent মোড ব্যবহার করে নিম্নলিখিত চ্যালেঞ্জটি সম্পূর্ণ করুন: +**বর্ণনা:** আধুনিক কোড সম্পাদক বা IDE এর বৈশিষ্ট্যগুলি অন্বেষণ করুন এবং দেখান কিভাবে এটি একজন ওয়েব ডেভেলপার হিসেবে আপনার ওয়ার্কফ্লো উন্নত করতে পারে। -**বর্ণনা:** একটি আধুনিক কোড এডিটর বা IDE-এর বৈশিষ্ট্যগুলি অন্বেষণ করুন এবং দেখান কীভাবে এটি একজন ওয়েব ডেভেলপারের কাজের প্রবাহ উন্নত করতে পারে। - -**প্রম্পট:** একটি কোড এডিটর বা IDE (যেমন Visual Studio Code, WebStorm, বা একটি ক্লাউড-ভিত্তিক IDE) নির্বাচন করুন। তিনটি বৈশিষ্ট্য বা এক্সটেনশন তালিকাভুক্ত করুন যা আপনাকে কোড লিখতে, ডিবাগ করতে বা আরও দক্ষতার সাথে রক্ষণাবেক্ষণ করতে সাহায্য করে। প্রতিটির জন্য, এটি কীভাবে আপনার কাজের প্রবাহে উপকার করে তার একটি সংক্ষিপ্ত ব্যাখ্যা দিন। +**প্রম্পট:** একটি কোড সম্পাদক অথবা IDE নির্বাচন করুন (যেমন Visual Studio Code, WebStorm, বা ক্লাউড-ভিত্তিক IDE)। এমন তিনটি বৈশিষ্ট্য বা এক্সটেনশন তালিকাভুক্ত করুন যা কোড লেখা, ডিবাগ করা, বা রক্ষণাবেক্ষণে সাহায্য করে। প্রতিটির জন্য সংক্ষিপ্ত ব্যাখ্যা দিন কিভাবে এটি আপনার কাজের গতি বৃদ্ধি করে। --- ## 🚀 চ্যালেঞ্জ -**ঠিক আছে, গোয়েন্দা, আপনার প্রথম কেসের জন্য প্রস্তুত?** +**ঠিক আছে ডিটেকটিভ, আপনার প্রথম মামলার জন্য প্রস্তুত?** + +এখন যেহেতু আপনার এই চমৎকার ভিত্তি গড়ে উঠেছে, আমি এক অভিযান দিচ্ছি যা আপনাকে দেখাবে কতটা বৈচিত্র্যময় ও আকর্ষণীয় প্রোগ্রামিং জগৎ আসলেই। আর শুনুন – এটা এখনও কোড লেখার ব্যাপার নয়, তাই চাপ নেই! নিজেকে ভাবুন প্রথম উত্তেজনাপূর্ণ মামলায় প্রোগ্রামিং ভাষার গোয়েন্দা হিসেবে! + +**আপনার মিশন, যদি আপনি গ্রহণ করতে চান:** +1. **ভাষার অনুসন্ধানী হন**: পুরোপুরি ভিন্ন তিনটি প্রোগ্রামিং ভাষা বাছুন – হয়তো একটি ওয়েবসাইট তৈরি করে, একটি মোবাইল অ্যাপ তৈরি করে, আরেকটি বিজ্ঞানীদের জন্য ডেটা বিশ্লেষণ করে। প্রতিটি ভাষায় একই সহজ কাজের উদাহরণ খুঁজে বের করুন। আমি আশ্বস্ত করছি, আপনি মুগ্ধ হবেন কীভাবে একেবারে ভিন্ন দেখতে হলেও একটিও কাজ একই রকম করে! + +2. **তাদের উত্স গল্প খুঁজে বের করুন**: প্রতিটি ভাষাকে বিশেষ করে তোলে কী? একটি মজার ঘটনা – প্রতিটি প্রোগ্রামিং ভাষা তৈরি হয়েছিল কারো মনে "আমি ভাবছি, এই নির্দিষ্ট সমস্যা সমাধানের একটা ভালো উপায় হওয়া উচিত" বলে। আপনি কি সেই সমস্যাগুলো বের করতে পারবেন? কিছু গল্প সত্যিই অসাধারণ! + +3. **কমিউনিটি চিনুন**: দেখুন প্রতিটি ভাষার কমিউনিটি কতটা বন্ধুত্বপূর্ণ ও উদ্দীপনাপূর্ণ। কিছু কমিউনিটিতে লাখ লাখ ডেভেলপার জ্ঞ্যান শেয়ার এবং সাহায্য করে, অন্যগুলি ছোট কিন্তু অতি-সংহত এবং সহায়ক। আপনি দেখতে পাবেন কিভাবে বিভিন্ন ব্যক্তিত্ব এই কমিউনিটিগুলোকে প্রাণবন্ত করে তোলে! + +4. **নিজের অনুভূতি অনুসরণ করুন**: কোন ভাষাটি এখন সবচেয়ে গ্রহণযোগ্য মনে হচ্ছে? “সঠিক” নির্বাচন নিয়ে চিন্তা করবেন না – শুধু আপনার অন্তর জিজ্ঞাসা শুনুন! এখানে ভুল উত্তর নেই, এবং পরে আপনি অন্য ভাষাগুলোও অন্বেষণ করতে পারেন। -এখন যেহেতু আপনার এই অসাধারণ ভিত্তি রয়েছে, আমার কাছে একটি অ্যাডভেঞ্চার রয়েছে যা আপনাকে দেখাবে প্রোগ্রামিং জগতটি কতটা বৈচিত্র্যময় এবং আকর্ষণীয়। এবং শুনুন – এটি এখনও কোড লেখার বিষয়ে নয়, তাই এখানে কোনো চাপ নেই! নিজেকে একজন প্রোগ্রামিং ভাষার গোয়েন্দা মনে করুন আপনার প্রথম উত্তেজনাপূর্ণ কেসে! +**বোনাস গোয়েন্দা কাজ**: দেখতে পারেন কোন প্রধান ওয়েবসাইট বা অ্যাপ কোন ভাষা দিয়ে তৈরি। আমি নিশ্চিত আপনি অবাক হবেন কীভাবে Instagram, Netflix, বা আপনি যে মোবাইল গেমটি খেলতে থামাতে পারেন না, সেগুলো কী দিয়ে চালানো হয়! -**আপনার মিশন, যদি আপনি এটি গ্রহণ করতে চান:** -1. **একজন ভাষা অনুসন্ধানকারী হয়ে উঠুন**: সম্পূর্ণ ভিন্ন জগতের তিনটি প্রোগ্রামিং ভাষা বেছে নিন – হয়তো একটি যা ওয়েবসাইট তৈরি করে, একটি যা মোবাইল অ্যাপ তৈরি করে, এবং একটি যা বিজ্ঞানীদের জন্য ডেটা বিশ্লেষণ করে। প্রতিটি ভাষায় লেখা একই সাধারণ কাজের উদাহরণ খুঁজুন। আমি প্রতিশ্রুতি দিচ্ছি আপনি অবাক হবেন যে তারা একই কাজ করতে কতটা ভিন্ন দেখাতে পারে -## পর্যালোচনা ও স্ব-অধ্যয়ন +> 💡 **মনে রাখবেন**: আজকে আপনি কোন ভাষায় বিশেষজ্ঞ হতে চাইছেন না। আপনি শুধু আশেপাশের এলাকা চিন্তা করছেন যেখান থেকে আপনি ব্যবসা শুরু করবেন। ধীরে ধীরে, মজা করুন, এবং আপনার কৌতূহলকে পথপ্রদর্শক করুন! -**সময় নিয়ে অন্বেষণ করুন এবং মজা করুন!** +## চলুন উদযাপন করি আপনি যা আবিষ্কার করেছেন! -আজ আপনি অনেক কিছু শিখেছেন, এবং এটি নিয়ে গর্বিত হওয়া উচিত! এখন মজার অংশ শুরু – সেই বিষয়গুলো অন্বেষণ করা যা আপনার কৌতূহল জাগিয়েছে। মনে রাখবেন, এটি কোনো হোমওয়ার্ক নয় – এটি একটি অভিযান! +ওহ মাই, আজ আপনি অসাধারণ অনেক তথ্য গ্রহণ করেছেন! আমি সত্যিই উন্মুখ দেখতে যে এই চমৎকার যাত্রার কতটুকু আপনার মনে গেঁথে গেছে। এবং মনে রাখবেন – এটা কোনো পরীক্ষা নয় যে আপনাকে সবকিছু নিখুঁত করতে হবে। এটা একটা উদযাপন আপনার শেখা সব দুর্দান্ত বিষয়ের! -**যে বিষয়গুলো আপনাকে উত্তেজিত করে তার গভীরে যান:** +[পোস্ট-লেসন কুইজ দিন](https://ff-quizzes.netlify.app/web/) -**প্রোগ্রামিং ভাষার সাথে হাতে-কলমে কাজ করুন:** -- ২-৩টি ভাষার অফিসিয়াল ওয়েবসাইটে যান যা আপনার আগ্রহ জাগিয়েছে। প্রতিটি ভাষার নিজস্ব ব্যক্তিত্ব এবং গল্প রয়েছে! -- [CodePen](https://codepen.io/), [JSFiddle](https://jsfiddle.net/), বা [Replit](https://replit.com/) এর মতো অনলাইন কোডিং প্ল্যাটফর্মে চেষ্টা করুন। পরীক্ষা করতে ভয় পাবেন না – কিছুই ভাঙবে না! -- আপনার প্রিয় ভাষার উৎপত্তি সম্পর্কে পড়ুন। সত্যি বলতে, কিছু ভাষার গল্প খুবই আকর্ষণীয় এবং এটি আপনাকে বুঝতে সাহায্য করবে কেন ভাষাগুলো এভাবে কাজ করে। +## পর্যালোচনা ও স্ব-অধ্যয়ন -**আপনার নতুন টুলগুলোর সাথে পরিচিত হন:** -- Visual Studio Code ডাউনলোড করুন যদি এখনও না করে থাকেন – এটি বিনামূল্যে এবং আপনি এটি পছন্দ করবেন! -- Extensions মার্কেটপ্লেসে কয়েক মিনিট সময় কাটান। এটি আপনার কোড এডিটরের জন্য একটি অ্যাপ স্টোরের মতো! -- আপনার ব্রাউজারের Developer Tools খুলুন এবং ক্লিক করুন। সবকিছু বুঝতে না পারলেও চিন্তা করবেন না – শুধু পরিচিত হওয়ার চেষ্টা করুন। +**সময় নিয়ে অন্বেষণ করুন এবং উপভোগ করুন!** +আপনি আজ অনেক কিছু শিখেছেন, এবং এটা নিয়ে গর্ব করার মত বিষয়! এখন মজার সময় এসেছে – সেই বিষয়গুলো অন্বেষণ করার যেগুলো আপনার কৌতূহল উসকে দিয়েছে। মনে রাখবেন, এটা কোনো হোমওয়ার্ক নয় – এটা এক ধরনের অভিযান! + +**আপনাকে কি উত্তেজিত করে তা আরও গভীরভাবে জানুন:** + +**প্রোগ্রামিং ভাষাগুলোর সাথে হাতেকলমে পরিচিত হোন:** +- ২-৩টি ভাষার অফিসিয়াল ওয়েবসাইট দেখুন যেগুলো আপনার নজর কেড়েছে। প্রত্যেকটির আলাদা আলাদা ব্যক্তিত্ব এবং গল্প আছে! +- [CodePen](https://codepen.io/), [JSFiddle](https://jsfiddle.net/), অথবা [Replit](https://replit.com/) এর মত কিছু অনলাইন কোডিং প্লেগ্রাউন্ডে চেষ্টা করুন। ভয় পাবেন না পরিক্ষা করতে – আপনি কিছু ভাঙতে পারবেন না! +- আপনার পছন্দের ভাষা কিভাবে তৈরি হলো সে সম্পর্কে পড়ুন। সত্যি বলছি, এই ভাষাগুলোর উৎপত্তি গল্পগুলো আকর্ষণীয় এবং এগুলো আপনাকে বুঝতে সাহায্য করবে কেন ভাষাগুলো এমন কাজ করে যেভাবে করে। + +**আপনার নতুন টুলগুলোর সাথে স্বাচ্ছন্দ্য বোধ করুন:** +- যদি এখনও ডাউনলোড না করে থাকেন, তবে Visual Studio Code ডাউনলোড করুন – এটা বিনামূল্যে এবং আপনি এটি পছন্দ করবেন! +- কয়েক মিনিট নিন Extension মার্কেটপ্লেস দেখতে। এটি আপনার কোড এডিটরের জন্য একটি অ্যাপ স্টোরের মত! +- আপনার ব্রাউজারের Developer Tools খুলুন এবং শুধু ক্লিক করে দেখুন। সবকিছু বুঝতে হবে না – শুধু যা আছে তা নিয়ে পরিচিত হন। **কমিউনিটিতে যোগ দিন:** -- [Dev.to](https://dev.to/), [Stack Overflow](https://stackoverflow.com/), বা [GitHub](https://github.com/) এ কিছু ডেভেলপার কমিউনিটি অনুসরণ করুন। প্রোগ্রামিং কমিউনিটি নতুনদের জন্য অত্যন্ত স্বাগতপূর্ণ! -- YouTube-এ কিছু নতুনদের জন্য বানানো কোডিং ভিডিও দেখুন। অনেক চমৎকার ক্রিয়েটর আছেন যারা নতুনদের জন্য সহজ করে বোঝান। -- স্থানীয় মিটআপ বা অনলাইন কমিউনিটিতে যোগ দেওয়ার কথা ভাবুন। বিশ্বাস করুন, ডেভেলপাররা নতুনদের সাহায্য করতে ভালোবাসে! +- [Dev.to](https://dev.to/), [Stack Overflow](https://stackoverflow.com/), অথবা [GitHub](https://github.com/) এর মত ডেভেলপার কমিউনিটিগুলো অনুসরণ করুন। প্রোগ্রামিং কমিউনিটি নতুনদের অনেক আন্তরিক! +- YouTube এ কিছু শিখনযোগ্য কোডিং ভিডিও দেখুন। অনেক চমৎকার নির্মাতা আছেন যারা জানেন নতুন শুরু করার অনুভূতি কেমন। +- স্থানীয় মিটআপ বা অনলাইন কমিউনিটিতে যোগ দেওয়ার কথা ভাবুন। বিশ্বাস করুন, ডেভেলপাররা নতুনদের সাহায্য করতে ভালোবাসে! + +> 🎯 **সাবধান, আমি যা বলব মনে রাখবেন**: আপনি রাতারাতি কোডিং জাদুকর হয়ে যাবেন এমন প্রত্যাশা নেই! এখন আপনি শুধু এই আশ্চর্য নতুন জগতের সাথে পরিচিত হচ্ছেন যার অংশ হতে যাচ্ছেন। সময় নিন, যাত্রা উপভোগ করুন, এবং মনে রাখবেন – আপনি যে প্রতিটি ডেভেলপারকে শ্রদ্ধা করেন তারা একসময় ঠিক আপনার মতোই বসে ছিলেন, উত্তেজিত ও হয়তো কিছুটা নগণ্য বোধ করছিলেন। এটা সম্পূর্ণ স্বাভাবিক, এবং এর মানে আপনি সঠিক পথে আছেন! + -> 🎯 **শুনুন, আমি যা চাই তা মনে রাখুন**: আপনাকে রাতারাতি কোডিং উইজার্ড হয়ে উঠতে হবে না! এখন আপনি এই অসাধারণ নতুন জগতের সাথে পরিচিত হচ্ছেন যা আপনি শীঘ্রই অংশ হতে চলেছেন। সময় নিন, যাত্রাটি উপভোগ করুন, এবং মনে রাখুন – আপনি যেসব ডেভেলপারকে প্রশংসা করেন তারা একসময় ঠিক আপনার মতোই ছিলেন, উত্তেজিত এবং হয়তো কিছুটা বিভ্রান্ত। এটি সম্পূর্ণ স্বাভাবিক, এবং এর মানে আপনি সঠিক পথে আছেন। ## অ্যাসাইনমেন্ট [Reading the Docs](assignment.md) -> 💡 **আপনার অ্যাসাইনমেন্টের জন্য একটি ছোট্ট ইঙ্গিত**: আমি সত্যিই চাই আপনি এমন কিছু টুল অন্বেষণ করুন যা আমরা এখনও আলোচনা করিনি! আমরা ইতিমধ্যে আলোচনা করা এডিটর, ব্রাউজার, এবং কমান্ড লাইন টুলগুলো বাদ দিন – সেখানে অসাধারণ ডেভেলপমেন্ট টুলের একটি বিশাল জগৎ রয়েছে যা আবিষ্কারের অপেক্ষায় রয়েছে। এমন টুল খুঁজুন যা সক্রিয়ভাবে রক্ষণাবেক্ষণ করা হয় এবং যেখানে প্রাণবন্ত, সহায়ক কমিউনিটি রয়েছে (এগুলো সাধারণত সেরা টিউটোরিয়াল এবং সহায়ক মানুষদের নিয়ে থাকে যখন আপনি আটকে যান এবং সাহায্যের প্রয়োজন হয়)। +> 💡 **আপনার অ্যাসাইনমেন্টের জন্য একটি ছোট টিপস**: আমি সত্যিই দেখতে চাই আপনি কিছু নতুন টুল অন্বেষণ করছেন যেগুলো আমরা এখনও আলোচনা করিনি! যেই এডিটর, ব্রাউজার এবং কমান্ড লাইন টুলগুলো আমরা শিখেছি সেগুলো বাদ দিন – এই বিশাল অসাধারণ ডেভেলপমেন্ট টুলসের জগত আছে অপেক্ষা করছে আবিষ্কারের জন্য। এমন গুলো খুঁজুন যেগুলো নিয়মিত আপডেট হয় এবং সুন্দর, সাহায্যকারী কমিউনিটি আছে (এই গুলোই সাধারণত সেরা টিউটোরিয়াল এবং সর্বাধিক সমর্থন পায় যখন আপনি আটকে যান এবং সাহায্যের প্রয়োজন হয়)। --- ## 🚀 আপনার প্রোগ্রামিং যাত্রার টাইমলাইন ### ⚡ **পরবর্তী ৫ মিনিটে আপনি যা করতে পারেন** -- [ ] ২-৩টি প্রোগ্রামিং ভাষার ওয়েবসাইট বুকমার্ক করুন যা আপনার আগ্রহ জাগিয়েছে -- [ ] Visual Studio Code ডাউনলোড করুন যদি এখনও না করে থাকেন -- [ ] আপনার ব্রাউজারের DevTools (F12) খুলুন এবং যেকোনো ওয়েবসাইটে ক্লিক করুন -- [ ] একটি প্রোগ্রামিং কমিউনিটিতে যোগ দিন (Dev.to, Reddit r/webdev, বা Stack Overflow) - -### ⏰ **এই ঘণ্টায় আপনি যা অর্জন করতে পারেন** -- [ ] লেসন-পরবর্তী কুইজ সম্পন্ন করুন এবং আপনার উত্তরগুলো নিয়ে চিন্তা করুন -- [ ] GitHub Copilot এক্সটেনশন দিয়ে VS Code সেটআপ করুন -- [ ] অনলাইনে ২টি ভিন্ন প্রোগ্রামিং ভাষায় "Hello World" উদাহরণ চেষ্টা করুন -- [ ] YouTube-এ "Day in the Life of a Developer" ভিডিও দেখুন -- [ ] আপনার প্রোগ্রামিং ভাষার গোয়েন্দাগিরি শুরু করুন (চ্যালেঞ্জ থেকে) +- [ ] ২-৩টি প্রোগ্রামিং ভাষার ওয়েবসাইট বুকমার্ক করুন যেগুলো নজর কেড়েছে +- [ ] যদি এখনও না করে থাকেন Visual Studio Code ডাউনলোড করুন +- [ ] আপনার ব্রাউজারের DevTools (F12) খুলে যেকোনো ওয়েবসাইটে ক্লিক করে দেখুন +- [ ] একটি প্রোগ্রামিং কমিউনিটিতে যোগদান করুন (Dev.to, Reddit r/webdev, অথবা Stack Overflow) + +### ⏰ **এই ঘণ্টায় আপনি যা অর্জন করতে পারেন** +- [ ] পোস্ট-লেসন কুইজ সম্পন্ন করুন এবং আপনার উত্তর নিয়ে প্রতিফলন করুন +- [ ] VS Code এ GitHub Copilot এক্সটেনশন সেটআপ করুন +- [ ] ২টি ভিন্ন প্রোগ্রামিং ভাষায় অনলাইনে "হ্যালো ওয়ার্ল্ড" উদাহরণ চেষ্টা করুন +- [ ] YouTube এ "একজন ডেভেলাপারের জীবনের এক দিন" ভিডিও দেখুন +- [ ] আপনার প্রোগ্রামিং ভাষার গোয়েন্দা কাজ শুরু করুন (চ্যালেঞ্জ থেকে) ### 📅 **আপনার সপ্তাহব্যাপী অভিযান** -- [ ] অ্যাসাইনমেন্ট সম্পন্ন করুন এবং ৩টি নতুন ডেভেলপমেন্ট টুল অন্বেষণ করুন -- [ ] সোশ্যাল মিডিয়ায় ৫ জন ডেভেলপার বা প্রোগ্রামিং অ্যাকাউন্ট অনুসরণ করুন -- [ ] CodePen বা Replit-এ কিছু ছোট্ট তৈরি করার চেষ্টা করুন (এমনকি "Hello, [আপনার নাম]!" হলেও!) -- [ ] কারো কোডিং যাত্রা নিয়ে একটি ডেভেলপার ব্লগ পোস্ট পড়ুন -- [ ] একটি ভার্চুয়াল মিটআপে যোগ দিন বা একটি প্রোগ্রামিং টক দেখুন -- [ ] অনলাইন টিউটোরিয়াল দিয়ে আপনার পছন্দের ভাষা শেখা শুরু করুন +- [ ] অ্যাসাইনমেন্ট সম্পন্ন করুন এবং ৩টি নতুন ডেভেলপমেন্ট টুল পড়ুন +- [ ] ৫ জন ডেভেলপার বা প্রোগ্রামিং অ্যাকাউন্ট সোশ্যাল মিডিয়ায় অনুসরণ করুন +- [ ] CodePen অথবা Replit এ কিছু ছোট্ট কিছু তৈরি করে দেখুন (যেমন "Hello, [Your Name]!") +- [ ] কারো কোডিং যাত্রা সম্পর্কে একটি ডেভেলপার ব্লগ পোস্ট পড়ুন +- [ ] একটি ভার্চুয়াল মিটআপে যোগ দিন বা প্রোগ্রামিং টক দেখুন +- [ ] অনলাইন টিউটোরিয়াল দিয়ে আপনার পছন্দের ভাষা শেখা শুরু করুন ### 🗓️ **আপনার মাসব্যাপী রূপান্তর** -- [ ] আপনার প্রথম ছোট প্রকল্প তৈরি করুন (এমনকি একটি সাধারণ ওয়েবপেজ হলেও!) -- [ ] একটি ওপেন-সোর্স প্রকল্পে অবদান রাখুন (ডকুমেন্টেশন সংশোধন দিয়ে শুরু করুন) -- [ ] এমন কাউকে মেন্টর করুন যে তার প্রোগ্রামিং যাত্রা শুরু করেছে -- [ ] আপনার ডেভেলপার পোর্টফোলিও ওয়েবসাইট তৈরি করুন -- [ ] স্থানীয় ডেভেলপার কমিউনিটি বা স্টাডি গ্রুপের সাথে সংযুক্ত হন -- [ ] আপনার পরবর্তী শেখার মাইলস্টোন পরিকল্পনা শুরু করুন +- [ ] আপনার প্রথম ছোট প্রকল্প তৈরি করুন (এমনকি একটি সাধারণ ওয়েবপেজও চলে!) +- [ ] একটি ওপেন-সোর্স প্রকল্পে অবদান রাখুন (ডকুমেন্টেশন থেকে শুরু করুন) +- [ ] যাঁরা নতুন শুরু করেছেন তাদের মেন্টর হন +- [ ] আপনার ডেভেলপার পোর্টফোলিওয়েবসাইট তৈরি করুন +- [ ] স্থানীয় ডেভেলপার কমিউনিটি বা স্টাডি গ্রুপের সাথে সংযোগ করুন +- [ ] আপনার পরবর্তী শেখার মাইলস্টোন প্ল্যান করা শুরু করুন -### 🎯 **চূড়ান্ত প্রতিফলন চেক-ইন** +### 🎯 **চূড়ান্ত প্রতিফলন পরীক্ষা** -**আগে আপনি এগিয়ে যান, একটি মুহূর্ত নিয়ে উদযাপন করুন:** -- প্রোগ্রামিং সম্পর্কে আজ আপনাকে উত্তেজিত করেছে এমন একটি বিষয় কী? +**আগে এগিয়ে যাওয়ার আগে এক মুহূর্ত উদযাপন করুন:** +- আজ কোডিং সম্পর্কে কোন বিষয়টি আপনার সবচেয়ে বেশি উত্তেজিত করেছে? - কোন টুল বা ধারণা আপনি প্রথমে অন্বেষণ করতে চান? -- এই প্রোগ্রামিং যাত্রা শুরু করার ব্যাপারে আপনি কেমন অনুভব করছেন? -- একজন ডেভেলপারকে আপনি এখন কী প্রশ্ন করতে চান? +- এই প্রোগ্রামিং যাত্রা শুরু করতে কেমন অনুভব করছেন? +- এখনই কোন প্রশ্ন আপনি একটি ডেভেলপারকে জিজ্ঞাসা করতে চান? ```mermaid journey - title Your Confidence Building Journey - section Today - Curious: 3: You - Overwhelmed: 4: You - Excited: 5: You - section This Week - Exploring: 4: You - Learning: 5: You - Connecting: 4: You - section Next Month - Building: 5: You - Confident: 5: You - Helping Others: 5: You + title আপনার আত্মবিশ্বাস গড়ার যাত্রা + section আজ + উৎসাহী: 3: You + অতিপ্রশস্ত: 4: You + উন্মুখ: 5: You + section এই সপ্তাহে + অনুসন্ধান করা: 4: You + শেখা: 5: You + সংযোগ করা: 4: You + section পরবর্তী মাস + নির্মাণ করা: 5: You + আত্মবিশ্বাসী: 5: You + অন্যদের সাহায্য করা: 5: You ``` - -> 🌟 **মনে রাখবেন**: প্রতিটি বিশেষজ্ঞ একসময় একজন শিক্ষার্থী ছিলেন। প্রতিটি সিনিয়র ডেভেলপার একসময় ঠিক আপনার মতোই অনুভব করেছিলেন – উত্তেজিত, হয়তো কিছুটা বিভ্রান্ত, এবং অবশ্যই সম্ভাবনার প্রতি কৌতূহলী। আপনি অসাধারণ সঙ্গতে আছেন, এবং এই যাত্রা অবিশ্বাস্য হতে চলেছে। প্রোগ্রামিংয়ের চমৎকার জগতে আপনাকে স্বাগতম! 🎉 +> 🌟 **মনে রাখবেন**: প্রত্যেক বিশেষজ্ঞ একজন নবীন ছিলেন। প্রত্যেক সিনিয়র ডেভেলপার ঠিক আপনার মতো অনুভব করতেন – উত্তেজিত, হয়তো একটু হতবাক, এবং নিশ্চয়ই আগ্রহী কী সম্ভব। আপনি অসাধারণ কোম্পানিতে আছেন, এবং এই যাত্রা অসাধারণ হবে। প্রোগ্রামিংয়ের আশ্চর্যজনক জগতে স্বাগতম! 🎉 --- + **অস্বীকৃতি**: -এই নথিটি AI অনুবাদ পরিষেবা [Co-op Translator](https://github.com/Azure/co-op-translator) ব্যবহার করে অনুবাদ করা হয়েছে। আমরা যথাসাধ্য সঠিকতার জন্য চেষ্টা করি, তবে অনুগ্রহ করে মনে রাখবেন যে স্বয়ংক্রিয় অনুবাদে ত্রুটি বা অসঙ্গতি থাকতে পারে। এর মূল ভাষায় থাকা নথিটিকে প্রামাণিক উৎস হিসেবে বিবেচনা করা উচিত। গুরুত্বপূর্ণ তথ্যের জন্য, পেশাদার মানব অনুবাদ সুপারিশ করা হয়। এই অনুবাদ ব্যবহারের ফলে কোনো ভুল বোঝাবুঝি বা ভুল ব্যাখ্যার জন্য আমরা দায়ী থাকব না। \ No newline at end of file +এই নথিটি AI অনুবাদ সেবা [Co-op Translator](https://github.com/Azure/co-op-translator) ব্যবহার করে অনূদিত হয়েছে। আমরা যথাসম্ভব সঠিকতার চেষ্টা করি, তবে স্বয়ংক্রিয় অনুবাদে ভুল বা অসম্পূর্ণতা থাকতে পারে তা ভালো করে বুঝে নেয়া উচিত। মূল নথিটি তার নিজস্ব ভাষায় কর্তৃপক্ষপূর্ণ উৎস হিসেবে বিবেচনা করা উচিত। গুরুত্বপূর্ণ তথ্যের জন্য পেশাদার মানব অনুবাদ গ্রহণ করা উত্তম। এই অনুবাদের ব্যবহারে সৃষ্টি হওয়া কোনো ভুল বোঝাবুঝি বা ভুল ব্যাখ্যার জন্য আমরা দায়ী নই। + \ No newline at end of file diff --git a/translations/bn/AGENTS.md b/translations/bn/AGENTS.md index 0c2209ea9..32cb471e2 100644 --- a/translations/bn/AGENTS.md +++ b/translations/bn/AGENTS.md @@ -2,56 +2,56 @@ ## প্রকল্পের ওভারভিউ -এটি শিক্ষামূলক কারিকুলাম রিপোজিটরি যা ওয়েব ডেভেলপমেন্টের মৌলিক বিষয়গুলো শুরু থেকে শেখানোর জন্য তৈরি। কারিকুলামটি একটি ব্যাপক ১২ সপ্তাহের কোর্স, যা Microsoft Cloud Advocates দ্বারা উন্নয়ন করা হয়েছে, এতে JavaScript, CSS, এবং HTML বিষয়ক ২৪টি হাতে-কলমে শেখার পাঠ অন্তর্ভুক্ত। +এটি শিক্ষামূলক পাঠক্রমের রেপোজিটরি, যা শুরু থেকেই ওয়েব ডেভেলপমেন্টের মৌলিক বিষয়গুলি শেখানোর জন্য তৈরি। এই পাঠক্রমটি একটি ব্যাপক ১২ সপ্তাহের কোর্স, যা Microsoft Cloud Advocates দ্বারা উন্নত করা হয়েছে, এবং এতে জাভাস্ক্রিপ্ট, CSS, এবং HTML এর উপর ভিত্তি করে ২৪টি হ্যান্ডস-অন লেসন রয়েছে। ### মূল উপাদানসমূহ -- **শিক্ষামূলক বিষয়বস্তু**: প্রকল্প-ভিত্তিক মডিউলগুলোতে সাজানো ২৪টি গঠনবদ্ধ পাঠ -- **প্র্যাকটিক্যাল প্রকল্পসমূহ**: টেরারিয়াম, টাইপিং গেম, ব্রাউজার এক্সটেনশন, স্পেস গেম, ব্যাংকিং অ্যাপ, কোড এডিটর, এবং AI চ্যাট সহকারী -- **ইন্টারঅ্যাকটিভ কুইজ**: প্রতিটি ৩টি প্রশ্নসহ ৪৮টি কুইজ (পাঠের পূর্ব ও পরবর্তী মূল্যায়ন) -- **বহুভাষা সহায়তা**: GitHub Actions এর মাধ্যমে ৫০+ ভাষায় স্বয়ংক্রিয় অনুবাদ -- **প্রযুক্তিসমূহ**: HTML, CSS, JavaScript, Vue.js 3, Vite, Node.js, Express, Python (AI প্রকল্পের জন্য) +- **শিক্ষামূলক বিষয়বস্তু**: ২৪টি কাঠামোবদ্ধ লেসন, প্রজেক্ট-ভিত্তিক মডিউলে সংগঠিত +- **ব্যবহারিক প্রজেক্ট**: টেরারিয়াম, টাইপিং গেম, ব্রাউজার এক্সটেনশন, স্পেস গেম, ব্যাংকিং অ্যাপ, কোড এডিটর, এবং AI চ্যাট অ্যাসিস্ট্যান্ট +- **ইন্টারেক্টিভ কুইজ**: ৪৮টি কুইজ, প্রত্যেকটির মধ্যে ৩টি প্রশ্ন (পূর্ব এবং পরবর্তী লেসন মূল্যায়ন) +- **মাল্টি-ভাষা সমর্থন**: GitHub Actions ব্যবহার করে ৫০+ ভাষায় স্বয়ংক্রিয় অনুবাদ +- **প্রযুক্তি**: HTML, CSS, JavaScript, Vue.js 3, Vite, Node.js, Express, Python (AI প্রকল্পের জন্য) ### স্থাপত্য -- পাঠভিত্তিক কাঠামোর শিক্ষামূলক রিপোজিটরি -- প্রতিটি পাঠের ফোল্ডারে README, কোড উদাহরণ, এবং সমাধানাদি থাকে -- স্বতন্ত্র প্রকল্পগুলি আলাদা ডিরেক্টরিতে (quiz-app, বিভিন্ন পাঠ প্রকল্প) -- GitHub Actions (co-op-translator) ব্যবহার করে অনুবাদ সিস্টেম -- Docsify এর মাধ্যমে ডকুমেন্টেশন পরিবেশিত এবং PDF ফরম্যাটে উপলব্ধ +- লেসন-ভিত্তিক কাঠামোসহ শিক্ষামূলক রেপোজিটরি +- প্রতিটি লেসন ফোল্ডারে README, কোড উদাহরণ, এবং সমাধান রয়েছে +- পৃথক ডিরেক্টরিতে স্ট্যান্ডঅ্যালোন প্রজেক্ট (quiz-app, বিভিন্ন লেসন প্রজেক্ট) +- GitHub Actions দ্বারা পরিচালিত অনুবাদ ব্যবস্থা (co-op-translator) +- Docsify এর মাধ্যমে ডকুমেন্টেশন পরিবেশন এবং PDF আকারে পাওয়া যায় -## সেটআপ কমান্ডসমূহ +## সেটআপ কমান্ড -এই রিপোজিটরি মূলত শিক্ষামূলক বিষয়বস্তু ব্যবহারের জন্য। নির্দিষ্ট প্রকল্পে কাজের জন্য: +এই রেপোজিটরি প্রধানত শিক্ষামূলক বিষয়বস্তু ব্যবহারের জন্য। নির্দিষ্ট প্রজেক্ট নিয়ে কাজ করার জন্য: -### মূল রিপোজিটরি সেটআপ +### প্রধান রেপোজিটরি সেটআপ ```bash git clone https://github.com/microsoft/Web-Dev-For-Beginners.git cd Web-Dev-For-Beginners ``` -### Quiz App সেটআপ (Vue 3 + Vite) +### কুইজ অ্যাপ সেটআপ (Vue 3 + Vite) ```bash cd quiz-app npm install -npm run dev # ডেভেলপমেন্ট সার্ভার শুরু করুন -npm run build # প্রোডাকশনের জন্য বিল্ড করুন +npm run dev # উন্নয়ন সার্ভার শুরু করুন +npm run build # উৎপাদনের জন্য বিল্ড করুন npm run lint # ESLint চালান ``` -### Bank Project API (Node.js + Express) +### ব্যাংক প্রজেক্ট API (Node.js + Express) ```bash cd 7-bank-project/api npm install -npm start # API সার্ভার শুরু করুন +npm start # এপিআই সার্ভার শুরু করুন npm run lint # ESLint চালান npm run format # Prettier দিয়ে ফরম্যাট করুন ``` -### Browser Extension প্রকল্পসমূহ +### ব্রাউজার এক্সটেনশন প্রজেক্টসমূহ ```bash cd 5-browser-extension/solution @@ -59,139 +59,139 @@ npm install # ব্রাউজার-নির্দিষ্ট এক্সটেনশন লোডিং নির্দেশাবলী অনুসরণ করুন ``` -### Space Game প্রকল্পসমূহ +### স্পেস গেম প্রজেক্টসমূহ ```bash cd 6-space-game/solution npm install -# ব্রাউজারে index.html খুলুন বা Live Server ব্যবহার করুন +# ব্রাউজারে index.html খুলুন অথবা লাইভ সার্ভার ব্যবহার করুন ``` -### Chat প্রকল্প (Python Backend) +### চ্যাট প্রজেক্ট (Python ব্যাকেন্ড) ```bash cd 9-chat-project/solution/backend/python pip install openai -# GITHUB_TOKEN পরিবেশ পরিবর্তনশীল সেট করুন +# GITHUB_TOKEN পরিবেশ ভেরিয়েবল সেট করুন python api.py ``` -## ডেভেলপমেন্ট ওয়ার্কফ্লো +## ডেভেলপমেন্ট ওয়ার্কফ্লো -### বিষয়বস্তু অবদানকারীদের জন্য +### বিষয়বস্তু অবদানকারীদের জন্য -1. **রিপোজিটরি ফর্ক করুন** আপনার GitHub অ্যাকাউন্টে -2. **লোকাল ক্লোন করুন** আপনার ফর্কটি -3. **নতুন ব্রাঞ্চ তৈরি করুন** আপনার পরিবর্তনের জন্য -4. পাঠের বিষয় বা কোড উদাহরণে পরিবর্তন করুন -5. সংশ্লিষ্ট প্রকল্প ডিরেক্টরিতে কোড পরিবর্তন পরীক্ষণ করুন -6. অবদান নির্দেশিকা অনুযায়ী পুল রিকোয়েস্ট জমা দিন +1. আপনার GitHub অ্যাকাউন্টে **রেপোজিটরি ফর্ক করুন** +2. **আপনার ফর্ক লোকালি ক্লোন করুন** +3. আপনার পরিবর্তনের জন্য একটি **নতুন ব্রাঞ্চ তৈরি করুন** +4. লেসন বিষয়বস্তু বা কোড উদাহরণে পরিবর্তন করুন +5. সংশ্লিষ্ট প্রজেক্ট ডিরেক্টরিতে যেকোনো কোড পরিবর্তন পরীক্ষা করুন +6. অবদান নির্দেশিকা অনুসরণ করে পুল রিকোয়েস্ট জমা দিন ### শিক্ষার্থীদের জন্য -1. রিপোজিটরি ফর্ক বা ক্লোন করুন -2. ক্রমানুসারে পাঠের ডিরেক্টরিতে যান -3. প্রতিটি পাঠের README পড়ুন -4. https://ff-quizzes.netlify.app/web/ এ পূর্ব-পাঠ কুইজ সম্পন্ন করুন -5. পাঠ ফোল্ডারে কোড উদাহরণে কাজ করুন -6. অ্যাসাইনমেন্ট এবং চ্যালেঞ্জ সমাধান করুন -7. পরবর্তী-পাঠের কুইজ নিন +1. রেপোজিটরি ফর্ক বা ক্লোন করুন +2. ধারাবাহিকভাবে লেসন ডিরেক্টরিতে নেভিগেট করুন +3. প্রতিটি লেসনের README ফাইল পড়ুন +4. https://ff-quizzes.netlify.app/web/ এ প্রি-লেসন কুইজ সম্পন্ন করুন +5. লেসন ফোল্ডারে কোড উদাহরণ কাজ করুন +6. অ্যাসাইনমেন্ট ও চ্যালেঞ্জ সম্পন্ন করুন +7. পোস্ট-লেসন কুইজ নিন ### লাইভ ডেভেলপমেন্ট -- **ডকুমেন্টেশন**: রুটে `docsify serve` চালান (পোর্ট ৩০০০) -- **Quiz App**: quiz-app ডিরেক্টরিতে `npm run dev` চালান -- **প্রকল্পসমূহ**: HTML প্রকল্পের জন্য VS Code Live Server এক্সটেনশন ব্যবহার করুন -- **API প্রকল্প**: সংশ্লিষ্ট API ডিরেক্টরিতে `npm start` চালান +- **ডকুমেন্টেশন**: মূল ফোল্ডারে `docsify serve` চালান (পোর্ট ৩০০০) +- **কুইজ অ্যাপ**: quiz-app ডিরেক্টরিতে `npm run dev` চালান +- **প্রজেক্টসমূহ**: HTML প্রজেক্টের জন্য VS Code লাইভ সার্ভার এক্সটেনশন ব্যবহার করুন +- **API প্রজেক্টসমূহ**: সংশ্লিষ্ট API ডিরেক্টরিতে `npm start` চালান -## টেস্টিং নির্দেশাবলি +## পরীক্ষার নির্দেশাবলী -### Quiz App টেস্টিং +### কুইজ অ্যাপ টেস্টিং ```bash cd quiz-app -npm run lint # কোড স্টাইল সমস্যাগুলি পরীক্ষা করুন -npm run build # বিল্ড সফল হয়েছে কি না যাচাই করুন +npm run lint # কোড স্টাইল সমস্যা পরীক্ষা করুন +npm run build # বিল্ড সফল হয় কি না যাচাই করুন ``` -### Bank API টেস্টিং +### ব্যাংক API টেস্টিং ```bash cd 7-bank-project/api npm run lint # কোড স্টাইল সমস্যাগুলি পরীক্ষা করুন -node server.js # সার্ভার ত্রুটি ছাড়াই শুরু হয় কিনা যাচাই করুন +node server.js # সার্ভার ত্রুটি ছাড়া শুরু হচ্ছে কিনা যাচাই করুন ``` -### সাধারণ টেস্টিং পদ্ধতি +### সাধারণ পরীক্ষার পদ্ধতি -- এটি একটি শিক্ষামূলক রিপোজিটরি, ব্যাপক স্বয়ংক্রিয় টেস্ট নেই -- ম্যানুয়াল টেস্টিং মূলত: - - কোড উদাহরণ ত্রুটিমুক্ত চালানো - - ডকুমেন্টেশনের লিঙ্ক সঠিক কাজ করা - - প্রকল্পের বিল্ড সফলভাবে সম্পন্ন হওয়া - - উদাহরণসমূহ সেরা চর্চানুযায়ী হতে হবে +- এটি একটি শিক্ষামূলক রেপোজিটরি, পূর্ণাঙ্গ স্বয়ংক্রিয় টেস্ট নেই +- হাতে পরীক্ষার জোর দেওয়া হয়: + - কোড উদাহরণ ভুল ছাড়াই চলা + - ডকুমেন্টেশনে লিঙ্ক সঠিক কাজ + - প্রজেক্ট বিল্ড সাফল্যের সাথে সম্পন্ন হওয়া + - উদাহরণসমূহ সর্বোত্তম অনুশীলন অনুসরণ করে ### সাবমিশনের আগে যাচাই -- যেখানে package.json আছে ঐ ডিরেক্টরিতে `npm run lint` চালান -- মার্কডাউন লিঙ্ক যাচাই করুন -- ব্রাউজার বা Node.js এ কোড উদাহরণ পরীক্ষা করুন -- অনুবাদগুলি সঠিক কাঠামো বজায় রাখছে কিনা দেখুন +- যেখানে package.json আছে, সেখানগুলোতে `npm run lint` চালান +- মার্কডাউন লিঙ্কগুলি বৈধ কিনা যাচাই করুন +- কোড উদাহরণ ব্রাউজার বা Node.js এ পরীক্ষা করুন +- অনুবাদ সঠিক কাঠামো বজায় রাখে কিনা পরীক্ষা করুন -## কোড স্টাইল নির্দেশিকা +## কোড স্টাইল গাইডলাইনস -### JavaScript +### জাভাস্ক্রিপ্ট - আধুনিক ES6+ সিনট্যাক্স ব্যবহার করুন -- প্রকল্পে প্রদত্ত standard ESLint কনফিগারেশন অনুসরণ করুন -- শিক্ষার স্বচ্ছতার জন্য অর্থবহ ভ্যারিয়েবল ও ফাংশন নাম ব্যবহার করুন -- শিক্ষার্থীদের জন্য ধারণা ব্যাখ্যা করে মন্তব্য যোগ করুন -- যেখানে প্রয়োজন Prettier ব্যবহার করে ফরম্যাট করুন +- প্রজেক্টের ESLint কনফিগারেশন অনুসরণ করুন +- শিক্ষার্থীদের জন্য অর্থপূর্ণ ভ্যারিয়েবল ও ফাংশন নাম ব্যবহার করুন +- শিক্ষার্থীদের বোঝার জন্য ব্যাখ্যামূলক কমেন্ট যুক্ত করুন +- যেখানে প্রিসেট আছে সেখানে Prettier দ্বারা ফরম্যাট করুন ### HTML/CSS -- সেমান্টিক HTML5 এলিমেন্ট ব্যবহার করুন -- প্রতিক্রিয়াশীল ডিজাইন নীতিমালা অনুসরণ করুন -- স্পষ্ট ক্লাস নামকরণ রীতিনীতি -- শিক্ষার্থীদের জন্য CSS কৌশল ব্যাখ্যা করে মন্তব্য দিন +- সেম্যান্টিক HTML5 উপাদান ব্যবহার করুন +- প্রতিক্রিয়াশীল ডিজাইন নীতিমালা অনুসরণ করুন +- স্পষ্ট ক্লাস নামকরণ পদ্ধতি +- CSS কৌশলগুলো শিক্ষার্থীদের জন্য ব্যাখ্যা সহ কমেন্ট করুন -### Python +### পাইথন - PEP 8 স্টাইল গাইডলাইন অনুসরণ করুন -- পরিষ্কার, শিক্ষামূলক কোড উদাহরণ দিন -- শেখার জন্য প্রয়োজনীয় জায়গায় টাইপ হিন্ট যোগ করুন +- স্পষ্ট, শিক্ষামূলক কোড উদাহরণ দিন +- শেখার জন্য যেখানে দরকার, টাইপ হিন্ট যুক্ত করুন -### Markdown ডকুমেন্টেশন +### মার্কডাউন ডকুমেন্টেশন -- স্পষ্ট শিরোনামের শ্রেণিবিন্যাস -- ল্যাঙ্গুয়েজ স্পেসিফিকেশনসহ কোড ব্লক -- অতিরিক্ত রিসোর্সের লিঙ্ক -- `images/` ডিরেক্টরিতে স্ক্রিনশট ও ছবি -- প্রবেশগম্যতার জন্য ছবির জন্য Alt টেক্সট +- স্পষ্ট হেডিং হায়ারার্কি বজায় রাখুন +- ভাষা নির্দিষ্ট করে কোড ব্লক ব্যবহার করুন +- অতিরিক্ত রিসোর্সের লিঙ্ক দিন +- `images/` ফোল্ডারে স্ক্রীনশট এবং ছবি সংরক্ষণ করুন +- প্রাপ্যতায় ছবির জন্য Alt টেক্সট দিন -### ফাইল এরঙগেইজেশন +### ফাইল সংগঠন -- পাঠগুলো ক্রমানুসারে নম্বরকৃত (1-getting-started-lessons, 2-js-basics, ইত্যাদি) -- প্রতিটি প্রকল্পে `solution/` এবং প্রায়ই `start/` বা `your-work/` ডিরেক্টরি থাকে -- ছবিগুলো পাঠ-নির্দিষ্ট `images/` ফোল্ডারে সংরক্ষিত -- অনুবাদসমূহ `translations/{language-code}/` কাঠামোয় +- লেসন নম্বর ধারাবাহিকভাবে (1-getting-started-lessons, 2-js-basics ইত্যাদি) +- প্রতিটি প্রজেক্টের `solution/` এবং প্রায়শই `start/` বা `your-work/` ডিরেক্টরি থাকে +- লেসন-নির্দিষ্ট `images/` ফোল্ডারে ছবি সংরক্ষণ +- অনুবাদ থাকে `translations/{language-code}/` কাঠামোতে ## বিল্ড এবং ডিপ্লয়মেন্ট -### Quiz App ডিপ্লয়মেন্ট (Azure Static Web Apps) +### কুইজ অ্যাপ ডিপ্লয়মেন্ট (Azure Static Web Apps) -quiz-app Azure Static Web Apps ডিপ্লয়মেন্টের জন্য কনফিগার করা: +quiz-app Azure Static Web Apps এ ডিপ্লয়মেন্টের জন্য কনফিগার করা হয়েছে: ```bash cd quiz-app npm run build # dist/ ফোল্ডার তৈরি করে -# মেইন ব্রাঞ্চে পুশ করার সময় GitHub Actions ওয়ার্কফ্লো দ্বারা ডিপ্লয় করে +# main-এ push করার সময় GitHub Actions ওয়ার্কফ্লোর মাধ্যমে ডিপ্লয় করে ``` Azure Static Web Apps কনফিগারেশন: -- **অ্যাপ লোকেশন**: `/quiz-app` -- **আউটপুট লোকেশন**: `dist` -- **ওয়ার্কফ্লো**: `.github/workflows/azure-static-web-apps-ashy-river-0debb7803.yml` +- **অ্যাপ অবস্থান**: `/quiz-app` +- **আউটপুট অবস্থান**: `dist` +- **ওয়ার্কফ্লো**: `.github/workflows/azure-static-web-apps-ashy-river-0debb7803.yml` ### ডকুমেন্টেশন PDF তৈরি @@ -203,80 +203,80 @@ npm run convert # ডক্স থেকে পিডিএফ ত ### Docsify ডকুমেন্টেশন ```bash -npm install -g docsify-cli # ডকসিফাই বৈশ্বিকভাবে ইনস্টল করুন -docsify serve # লোকালহোস্ট:3000-এ সার্ভ করুন +npm install -g docsify-cli # গ্লোবালি Docsify ইনস্টল করুন +docsify serve # লোকালহোস্ট:3000 এ পরিবেশন করুন ``` -### প্রকল্প-নির্দিষ্ট বিল্ডসমূহ +### প্রজেক্ট-নির্দিষ্ট বিল্ড -প্রতিটি প্রকল্পের নিজস্ব বিল্ড প্রক্রিয়া থাকতে পারে: -- Vue প্রকল্প: `npm run build` প্রোডাকশন বান্ডেল তৈরি করে -- স্ট্যাটিক প্রকল্প: বিল্ড ধাপ নেই, সরাসরি ফাইল পরিবেশন +প্রতিটি প্রজেক্ট ডিরেক্টরির নিজস্ব বিল্ড প্রক্রিয়া থাকতে পারে: +- Vue প্রজেক্ট: `npm run build` প্রোডাকশন বান্ডেল তৈরি করে +- স্ট্যাটিক প্রজেক্ট: বিল্ড ধাপ নেই, সরাসরি ফাইল পরিবেশন -## পুল রিকোয়েস্ট নির্দেশিকা +## পুল রিকোয়েস্ট গাইডলাইন ### শিরোনাম ফরম্যাট -পরিবর্তনের ক্ষেত্র নির্দিষ্ট স্পষ্ট, বর্ণনামূলক শিরোনাম ব্যবহার করুন: +পরিবর্তনের ক্ষেত্র স্পষ্টভাবে উল্লেখ করে স্পষ্ট ও বর্ণনামূলক শিরোনাম ব্যবহার করুন: - `[Quiz-app] Add new quiz for lesson X` - `[Lesson-3] Fix typo in terrarium project` - `[Translation] Add Spanish translation for lesson 5` - `[Docs] Update setup instructions` -### প্রয়োজনীয় যাচাই +### প্রয়োজনীয় যাচাই -PR জমার আগে: +PR জমা দেওয়ার আগে: -1. **কোড কোয়ালিটি**: - - প্রভাবিত প্রকল্প ডিরেক্টরিতে `npm run lint` চালান - - সব লিন্ট ত্রুটি ও সতর্কতা ঠিক করুন +1. **কোড মান**: + - প্রভাবিত প্রজেক্ট ডিরেক্টরিতে `npm run lint` চালান + - সব লিন্টিং ত্রুটি ও সতর্কতা ঠিক করুন 2. **বিল্ড যাচাই**: - - প্রয়োজনে `npm run build` চালান - - কোন বিল্ড ত্রুটি নেই নিশ্চিত করুন + - যেখানে প্রযোজ্য, `npm run build` চালান + - কোন বিল্ড ত্রুটি নেই তা নিশ্চিত করুন -3. **লিঙ্ক ভ্যালিডেশন**: +3. **লিঙ্ক যাচাই**: - সব মার্কডাউন লিঙ্ক পরীক্ষা করুন - - ইমেজ রেফারেন্স কাজ করছে নিশ্চিত করুন + - ইমেজ রেফারেন্সগুলো কাজ করছে কিনা যাচাই করুন -4. **বিষয়বস্তু পর্যালোচনা**: - - বানান ও ব্যাকরণ ঠিক আছে কিনা দেখুন - - কোড উদাহরণ সঠিক ও শিক্ষণীয় কিনা যাচাই করুন - - অনুবাদ মূল অর্থ ধরে রেখেছে কিনা নিশ্চিত করুন +4. **বিষয়বস্তু পর্যালোচনা**: + - বানান ও ব্যাকরণ পরীক্ষা করুন + - কোড উদাহরণ সঠিক এবং শিক্ষামূলক কিনা নিশ্চিত করুন + - অনুবাদগুলি প্রাথমিক অর্থ বজায় রাখে কিনা যাচাই করুন -### অবদান রাখার শর্তাবলী +### অবদান দেওয়ার শর্ত -- Microsoft CLA-তে সম্মতি (প্রথম PR এ স্বয়ংক্রিয় যাচাই) +- Microsoft CLA (প্রথম PR এ স্বয়ংক্রিয় যাচাই) - [Microsoft Open Source Code of Conduct](https://opensource.microsoft.com/codeofconduct/) অনুসরণ করুন -- বিস্তারিত গাইডলাইনের জন্য [CONTRIBUTING.md](./CONTRIBUTING.md) দেখুন -- প্রয়োজনে PR বর্ণনায় ইস্যু নম্বর উল্লেখ করুন +- বিস্তারিত নির্দেশের জন্য [CONTRIBUTING.md](./CONTRIBUTING.md) দেখুন +- প্রযোজ্য হলে PR বর্ণনায় ইস্যু নম্বর উল্লেখ করুন -### পর্যালোচনা প্রক্রিয়া +### পর্যালোচনা প্রক্রিয়া -- PR-গুলো মেইনটেনার ও কমিউনিটির দ্বারা পর্যালোচনা হয় -- শিক্ষাগত স্পষ্টতা অগ্রাধিকার পায় -- কোড উদাহরণ বর্তমান সেরা চর্চা অনুসরণ করবে -- অনুবাদ সঠিকতা ও সাংস্কৃতিক প্রাসঙ্গিকতার জন্য পর্যালোচনা হয় +- PR গুলো রক্ষণাবেক্ষক ও কমিউনিটি দ্বারা পর্যালোচনা করা হয় +- শিক্ষামূলক স্পষ্টতা অগ্রাধিকার পায় +- কোড উদাহরণ সর্বোত্তম অনুশীলন অনুসরণ করে +- অনুবাদ যথাযথতা ও সাংস্কৃতিক মানানসই কিনা যাচাই করা হয় -## অনুবাদ সিস্টেম +## অনুবাদ ব্যবস্থা -### স্বয়ংক্রিয় অনুবাদ +### স্বয়ংক্রিয় অনুবাদ -- GitHub Actions co-op-translator ওয়ার্কফ্লো ব্যবহার করে -- ৫০+ ভাষায় স্বয়ংক্রিয় অনুবাদ করে -- মূল ফাইলগুলো মেইন ডিরেক্টরিতে থাকে -- অনূদিত ফাইল `translations/{language-code}/` ডিরেক্টরিতে থাকে +- GitHub Actions এ co-op-translator ওয়ার্কফ্লো ব্যবহার করে +- ৫০+ ভাষায় স্বয়ংক্রিয় অনুবাদ +- মূল ফাইল প্রধান ডিরেক্টরিতে থাকে +- অনুবাদ ফাইল থাকে `translations/{language-code}/` ডিরেক্টরিতে -### ম্যানুয়াল অনুবাদ উন্নয়ন যুক্ত করা +### ম্যানুয়াল অনুবাদ উন্নতি যোগ করা -1. `translations/{language-code}/` এ ফাইল খুঁজুন -2. কাঠামো বজায় রেখে উন্নতি করুন -3. কোড উদাহরণ কার্যকরী রাখুন -4. কোন লোকালাইজড কুইজ কনটেন্ট থাকলে পরীক্ষা করুন +1. `translations/{language-code}/` ফোল্ডারে ফাইল অবস্থান করুন +2. কাঠামো বজায় রেখে উন্নতি করুন +3. কোড উদাহরণগুলি কার্যকর থাকবে নিশ্চিত করুন +4. স্থানীয়কৃত কুইজ বিষয়বস্তু পরীক্ষা করুন -### অনুবাদের মেটাডেটা +### অনুবাদ মেটাডেটা -অনূদিত ফাইলগুলোতে মেটাডেটা হেডার থাকে: +অনুবাদকৃত ফাইলগুলোতে মেটাডেটা হেডার থাকে: ```markdown ``` -## ডিবাগিং এবং সমস্যা সমাধান +## ডিবাগিং ও সমস্যার সমাধান -### সাধারণ সমস্যাসমূহ +### সাধারণ সমস্যা -**Quiz app শুরু হয় না**: -- Node.js সংস্করণ পরীক্ষা করুন (v14+ সুপারিশকৃত) -- `node_modules` এবং `package-lock.json` মুছুন, পুনরায় `npm install` চালান -- পোর্ট সংঘাত আছে কিনা দেখুন (ডিফল্ট: Vite পোর্ট 5173) +**কুইজ অ্যাপ স্টার্ট হয় না**: +- Node.js ভার্সন পরীক্ষা করুন (v14+ সুপারিশকৃত) +- `node_modules` ও `package-lock.json` মুছে পুনরায় `npm install` চালান +- পোর্ট সংঘর্ষ আছে কিনা দেখুন (ডিফল্ট: Vite পোর্ট ৫১৭৩) -**API সার্ভার শুরু হয় না**: +**API সার্ভার স্টার্ট হয় না**: - Node.js সংস্করণ ন্যূনতম (node >=10) নিশ্চিত করুন -- পোর্ট ইতোমধ্যে ব্যবহৃত হচ্ছে কি না দেখুন -- সব ডিপেন্ডেন্সি `npm install` দিয়ে ইনস্টল হয়েছে কি না যাচাই করুন +- পোর্ট ইতিমধ্যে অন্যত্র ব্যবহৃত কিনা দেখুন +- সব নির্ভরশীলতা `npm install` দিয়ে ইনস্টল করুন -**ব্রাউজার এক্সটেনশন লোড হয় না**: -- manifest.json সঠিক ফরম্যাটে আছে কি না পরীক্ষা করুন -- ব্রাউজার কনসোলে ত্রুটি দেখুন -- ব্রাউজার নির্দিষ্ট এক্সটেনশন ইনস্টলেশন নির্দেশিকা অনুসরণ করুন +**ব্রাউজার এক্সটেনশন লোড হয় না**: +- manifest.json সঠিক ফরম্যাটে আছে কিনা যাচাই করুন +- ব্রাউজার কনসোলে ত্রুটি আছে কিনা দেখুন +- ব্রাউজার-নির্দিষ্ট এক্সটেনশন ইনস্টলেশন নির্দেশিকা অনুসরণ করুন -**Python চ্যাট প্রকল্প সমস্যা**: -- OpenAI প্যাকেজ ইনস্টল করুন: `pip install openai` -- GITHUB_TOKEN পরিবেশ ভেরিয়েবল সেট আছে নিশ্চিত করুন -- GitHub Models অ্যাক্সেস অনুমতি পরীক্ষা করুন +**পাইথন চ্যাট প্রজেক্ট সমস্যা**: +- OpenAI প্যাকেজ ইনস্টল আছে কিনা নিশ্চিত করুন: `pip install openai` +- GITHUB_TOKEN পরিবেশ পরিবর্তনশীল সেট আছে কিনা দেখুন +- GitHub Models অ্যাক্সেস অনুমতি যাচাই করুন -**Docsify ডক সার্ভ করেনা**: +**Docsify ডকস পরিবেশন করছে না**: - গ্লোবালি docsify-cli ইনস্টল করুন: `npm install -g docsify-cli` -- রিপোজিটরি রুট ডিরেক্টরি থেকে চালান -- `docs/_sidebar.md` আছে কিনা দেখুন +- রেপোজিটরি রুট থেকে চালান +- `docs/_sidebar.md` আছে কিনা চেক করুন -### ডেভেলপমেন্ট এনভায়রনমেন্ট টিপস +### ডেভেলপমেন্ট পরিবেশ টিপস -- HTML প্রকল্পে VS Code এর Live Server এক্সটেনশন ব্যবহার করুন -- সামঞ্জস্যপূর্ণ ফরম্যাটিংয়ের জন্য ESLint ও Prettier এক্সটেনশন ইনস্টল করুন -- JavaScript ডিবাগিংয়ের জন্য ব্রাউজার DevTools ব্যবহার করুন -- Vue প্রকল্পে Vue DevTools ব্রাউজার এক্সটেনশন ইনস্টল করুন +- HTML প্রজেক্টের জন্য VS Code লাইভ সার্ভার এক্সটেনশন ব্যবহার করুন +- ESLint এবং Prettier এক্সটেনশন ইনস্টল করুন সামঞ্জস্যপূর্ণ ফরম্যাটিংয়ের জন্য +- জাভাস্ক্রিপ্ট ডিবাগ করার জন্য ব্রাউজার DevTools ব্যবহার করুন +- Vue প্রজেক্টের জন্য Vue DevTools ব্রাউজার এক্সটেনশন ইনস্টল করুন -### পারফরমেন্স বিবেচনা +### কর্মক্ষমতার বিবেচনা -- অনুবাদের বড় সংখ্যা (৫০+ ভাষা) মানে সম্পূর্ণ ক্লোন বড় হয় -- কেবল বিষয়বস্তু নিয়ে কাজ করলে শ্যালো ক্লোন ব্যবহার করুন: `git clone --depth 1` -- ইংরেজি কাজ করার সময় অনুবাদ খোঁজ থেকে বাদ দিন -- বিল্ড প্রক্রিয়া প্রথমবার ধীর হতে পারে (npm install, Vite build) +- অনুবাদের সংখ্যা অনেক বেশি (৫০+ ভাষা), তাই সম্পূর্ণ ক্লোন বড় হয় +- শুধুমাত্র বিষয়বস্তুতে কাজ করলে shallow clone ব্যবহার করুন: `git clone --depth 1` +- ইংরেজি বিষয়বস্তুতে কাজ করার সময় অনুবাদগুলি অনুসন্ধান থেকে বাদ দিন +- প্রথম রান-এ বিল্ড প্রক্রিয়া ধীর হতে পারে (npm install, Vite build) -## নিরাপত্তা বিষয়সমূহ +## নিরাপত্তা বিবেচনা -### পরিবেশ ভেরিয়েবল +### পরিবেশ পরিবর্তনশীল -- API কী কখনো রিপোজিটরিতে কমিট করবেন না -- `.env` ফাইল ব্যবহার করুন (আগেই `.gitignore` এ আছে) -- প্রয়োজনীয় পরিবেশ ভেরিয়েবল প্রকল্প README-তে ডকুমেন্ট করুন +- API কী কখনো রেপোজিটরিতে কমিট করবেন না +- `.env` ফাইল ব্যবহার করুন (যা `.gitignore` তে রয়েছে) +- প্রয়োজনীয় পরিবেশ পরিবর্তনশীল প্রকল্প README তে ডকুমেন্ট করুন -### Python প্রকল্পসমূহ +### পাইথন প্রজেক্টসমূহ -- ভার্চুয়াল এনভায়রনমেন্ট ব্যবহার করুন: `python -m venv venv` -- ডিপেন্ডেন্সি আপডেট রাখুন -- GitHub টোকেনগুলোর ন্যূনতম প্রয়োজনীয় অনুমতি থাকা উচিত +- ভার্চুয়াল এনভায়রনমেন্ট ব্যবহার করুন: `python -m venv venv` +- নির্ভরশীলতা আপডেট রাখুন +- GitHub টোকেনের জন্য ন্যূনতম অনুমতি দিন -### GitHub Models অ্যাক্সেস +### GitHub মডেল অ্যাক্সেস -- GitHub Models ব্যবহারের জন্য Personal Access Tokens (PAT) প্রয়োজন -- টোকেনগুলো পরিবেশ ভেরিয়েবল হিসেবে সংরক্ষণ করুন -- টোকেন বা ক্রেডেনশিয়াল কখনো কমিট করবেন না +- GitHub মডেলের জন্য পার্সোনাল অ্যাক্সেস টোকেন (PAT) প্রয়োজন +- টোকেন পরিবেশ পরিবর্তনশীল হিসেবে সংরক্ষণ করুন +- কখনো টোকেন বা ক্রেডেনশিয়াল কমিট করবেন না ## অতিরিক্ত নোট ### লক্ষ্য শ্রোতা -- সম্পূর্ণ নবীনদের জন্য যারা ওয়েব ডেভেলপমেন্ট শুরু করছেন -- শিক্ষার্থী ও স্বশিক্ষার্থীরা -- শ্রেণিকক্ষে কারিকুলাম ব্যবহারকারী শিক্ষকরা -- প্রবেশগম্যতা এবং ধাপে ধাপে দক্ষতা অর্জনের জন্য ডিজাইন করা বিষয়বস্তু +- সম্পূর্ণ শুরু থেকে ওয়েব ডেভেলপমেন্ট শিখতে ইচ্ছুক +- ছাত্র ও স্ব-শিক্ষার্থী +- শ্রেণিকক্ষে পাঠক্রম ব্যবহারকারী শিক্ষকগণ +- বিষয়বস্তুটি অ্যাক্সেসিবিলিটি এবং ধাপে ধাপে দক্ষতা গড়ে তোলার জন্য ডিজাইন করা হয়েছে -### শিক্ষাদর্শন +### শিক্ষামূলক দার্শনিকতা -- প্রকল্প-ভিত্তিক শেখার পদ্ধতি -- ঘন ঘন জ্ঞান যাচাই (কুইজ) -- হাতে-কলমে কোডিং অনুশীলন -- বাস্তব জীবনের প্রয়োগের উদাহরণ -- ফ্রেমওয়ার্কের আগে মৌলিক বিষয়গুলোর উপর কেন্দ্রিত +- প্রজেক্ট-ভিত্তিক শিক্ষা পদ্ধতি +- নিয়মিত জ্ঞান যাচাই (কুইজ) +- হাতে কোডিং অনুশীলন +- বাস্তব-জগতের প্রয়োগ উদাহরণ +- ফ্রেমওয়ার্কের আগে মৌলিক বিষয়গুলিতে ফোকাস -### রিপোজিটরি রক্ষণাবেক্ষণ +### রেপোজিটরি রক্ষণাবেক্ষণ -- সক্রিয় শিক্ষার্থী এবং অবদানকারীদের কমিউনিটি -- ডিপেন্ডেন্সি ও বিষয়বস্তু নিয়মিত আপডেট হয় -- ইস্যু ও আলোচনা মেইনটেনার দ্বারা পর্যবেক্ষণ করা হয় -- অনুবাদ আপডেটগুলো GitHub Actions দ্বারা স্বয়ংক্রিয় +- সক্রিয় শিক্ষার্থী ও অবদানকারীদের কমিউনিটি +- নির্ভরশীলতা ও বিষয়বস্তু নিয়মিত আপডেট +- রক্ষণাবেক্ষক দ্বারা সমস্যা ও আলোচনা মনিটর করা হয় +- অনুবাদের আপডেট স্বয়ংক্রিয়ভাবে GitHub Actions ব্যবহার করে -### সম্পর্কিত রিসোর্স +### সংশ্লিষ্ট রিসোর্স -- [Microsoft Learn modules](https://docs.microsoft.com/learn/) -- [Student Hub resources](https://docs.microsoft.com/learn/student-hub/) -- শিক্ষার্থীদের জন্য সুপারিশকৃত [GitHub Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot) -- অতিরিক্ত কোর্সসমূহ: জেনারেটিভ AI, ডেটা সায়েন্স, এমএল, IoT কারিকুলাম উপলব্ধ +- [Microsoft Learn মডিউলস](https://docs.microsoft.com/learn/) +- [Student Hub রিসোর্স](https://docs.microsoft.com/learn/student-hub/) +- শিক্ষার্থীদের জন্য প্রস্তাবিত [GitHub Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot) +- অতিরিক্ত কোর্স: Generative AI, Data Science, ML, IoT পাঠক্রম উপলব্ধ -### নির্দিষ্ট প্রকল্পে কাজ করা +### নির্দিষ্ট প্রজেক্টের সাথে কাজ -বিভিন্ন প্রকল্পের বিস্তারিত নির্দেশনার জন্য সংশ্লিষ্ট README ফাইল দেখুন: -- `quiz-app/README.md` - Vue 3 কুইজ অ্যাপ্লিকেশন -- `7-bank-project/README.md` - অথেনটিকেশনসহ ব্যাংকিং অ্যাপ্লিকেশন +বিস্তারিত নির্দেশনার জন্য প্রতিটি প্রজেক্টের README ফাইল দেখুন: +- `quiz-app/README.md` - Vue 3 কুইজ অ্যাপ +- `7-bank-project/README.md` - প্রমাণীকরণসহ ব্যাংকিং অ্যাপ্লিকেশন - `5-browser-extension/README.md` - ব্রাউজার এক্সটেনশন ডেভেলপমেন্ট - `6-space-game/README.md` - ক্যানভাস-ভিত্তিক গেম ডেভেলপমেন্ট -- `9-chat-project/README.md` - AI চ্যাট সহকারী প্রকল্প +- `9-chat-project/README.md` - AI চ্যাট অ্যাসিস্ট্যান্ট প্রজেক্ট -### মনোরিপো কাঠামো +### মনোরেপো স্ট্রাকচার -যদিও এটি একটি প্রচলিত মনোরিপো নয়, এই রিপোজিটরিতে একাধিক স্বতন্ত্র প্রকল্প আছে: -- প্রতিটি পাঠ নিজস্ব সম্পূর্ণ -- প্রকল্পগুলো ডিপেন্ডেন্সি শেয়ার করে না -- একাধিক প্রকল্প একই সাথে প্রভাবিত না করে কাজ করা যায় -- পুরো কারিকুলামের জন্য রিপো সম্পূর্ণ ক্লোন করুন +এটি প্রচলিত মনোরেপো না হলেও, এই রেপোজিটরিতে একাধিক স্বাধীন প্রজেক্ট রয়েছে: +- প্রতিটি লেসন স্বতন্ত্র +- প্রজেক্টগুলি নির্ভরশীলতা শেয়ার করে না +- একক প্রজেক্টে কাজ করুন অন্যদের প্রভাব না ফেলেই +- সম্পূর্ণ পাঠক্রম অভিজ্ঞতার জন্য পুরো রেপো ক্লোন করুন --- -**অস্বীকৃতি**: -এই ডকুমেন্টটি AI অনুবাদ সেবা [Co-op Translator](https://github.com/Azure/co-op-translator) ব্যবহার করে অনূদিত হয়েছে। আমরা যথাসাধ্য সঠিকতা বজায় রাখতে চেষ্টা করলেও, স্বয়ংক্রিয় অনুবাদে ত্রুটি বা অসঙ্গতি থাকতে পারে। মূল নথি তার নিজস্ব ভাষায়ই প্রামাণিক উৎস হিসেবে বিবেচিত হওয়া উচিত। জরুরি বা গুরুত্বপূর্ণ তথ্যের জন্য পেশাদার মানব অনুবাদ সুপারিশ করা হয়। এই অনুবাদের ব্যবহারে সৃষ্ট কোন ভুল বোঝাবুঝি বা ভুল ব্যাখ্যার জন্য আমরা দায়ী নই। +**ডিসক্লেইমার**: +এই ডকুমেন্টটি এআই অনুবাদ সেবা [Co-op Translator](https://github.com/Azure/co-op-translator) ব্যবহার করে অনূদিত হয়েছে। যদিও আমরা যথাসাধ্য সঠিকতার জন্য চেষ্টা করি, স্বয়ংক্রিয় অনুবাদে ত্রুটি বা অসঙ্গতি থাকতে পারে তা অনুগ্রহ করে বিবেচনা করুন। মুল নথিটি তার নিজস্ব ভাষায় সর্বসম্মতিকৃত উৎস হিসাবে বিবেচিত হওয়া উচিত। গুরুত্বপূর্ণ তথ্যের জন্য পেশাদার মানুষের করা অনুবাদের সুপারিশ করা হয়। এই অনুবাদের ব্যবহারে কোনও ভুল বোঝাবুঝি বা ভুল ব্যাখ্যার জন্য আমরা দায়ী নই। \ No newline at end of file diff --git a/translations/bn/README.md b/translations/bn/README.md index 3a48f7745..3c2d3d349 100644 --- a/translations/bn/README.md +++ b/translations/bn/README.md @@ -10,204 +10,210 @@ [![Microsoft Foundry Discord](https://dcbadge.limes.pink/api/server/nTYy5BXMWG)](https://discord.gg/nTYy5BXMWG) -# নবীনদের জন্য ওয়েব ডেভেলপমেন্ট - একটি পাঠ্যক্রম +# বেগিনার্সের জন্য ওয়েব ডেভেলপমেন্ট - একটি শিক্ষাক্রম -মাইক্রোসফট ক্লাউড অ্যাডভোকেটদের দ্বারা প্রণীত ১২-সপ্তাহের সমগ্র কোর্সের মাধ্যমে ওয়েব ডেভেলপমেন্টের মৌলিক বিষয়গুলি শিখুন। ২৪টি পাঠে জাভাস্ক্রিপ্ট, CSS, এবং HTML হাতেকলমে প্রকল্প যেমন টেরারিয়াম, ব্রাউজার এক্সটেনশান এবং স্পেস গেমের মাধ্যমে বিস্তারিত আলোচনা করা হয়েছে। কুইজ, আলোচনা এবং ব্যবহারিক নিয়োগ সংযুক্ত রয়েছে। আমাদের কার্যকর প্রকল্পভিত্তিক শেখার পদ্ধতির মাধ্যমে আপনার দক্ষতা বৃদ্ধি করুন এবং জ্ঞান ধারণ ক্ষমতা উন্নত করুন। আজই আপনার কোডিং যাত্রা শুরু করুন! +Microsoft Cloud Advocates দ্বারা পরিচালিত ১২ সপ্তাহের বিস্তৃত কোর্সের মাধ্যমে ওয়েব ডেভেলপমেন্টের মৌলিক বিষয় শিখুন। ২৪টি পাঠের প্রতিটির মধ্যে JavaScript, CSS, এবং HTML নিয়ে অন্তর্ভুক্ত রয়েছে হাতে-কলমে প্রকল্প যেমন টেরারিয়াম, ব্রাউজার এক্সটেনশন এবং স্পেস গেমস। কুইজ, আলোচনা, এবং ব্যবহারিক অ্যাসাইনমেন্টে অংশগ্রহণ করুন। আমাদের কার্যকর প্রকল্প-ভিত্তিক শিক্ষা পদ্ধতির মাধ্যমে দক্ষতা বাড়ান এবং আপনার জ্ঞানের ধারণক্ষমতা উন্নত করুন। আজই আপনার কোডিং যাত্রা শুরু করুন! Azure AI Foundry Discord কমিউনিটিতে যোগ দিন [![Microsoft Foundry Discord](https://dcbadge.limes.pink/api/server/nTYy5BXMWG)](https://discord.gg/nTYy5BXMWG) -এই সম্পদগুলি ব্যবহার শুরু করতে এই ধাপগুলি অনুসরণ করুন: -1. **রিপোজিটরি ফর্ক করুন**: ক্লিক করুন [![GitHub forks](https://img.shields.io/github/forks/microsoft/Web-Dev-For-beginners.svg?style=social&label=Fork)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/fork) +এনিয়ে কাজ শুরু করতে নিম্নলিখিত ধাপগুলি অনুসরণ করুন: +1. **রিপোজিটরি ফোর্ক করুন**: [![GitHub forks](https://img.shields.io/github/forks/microsoft/Web-Dev-For-beginners.svg?style=social&label=Fork)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/fork) এ ক্লিক করুন 2. **রিপোজিটরি ক্লোন করুন**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git` -3. [**Azure AI Foundry Discord এ যোগ দিন এবং বিশেষজ্ঞ ও সহকর্মী ডেভেলপারদের সাথে পরিচিত হন**](https://discord.com/invite/ByRwuEEgH4) +3. [**Azure AI Foundry Discord এ যোগ দিন এবং বিশেষজ্ঞ ও সহকর্মী ডেভেলপারদের সঙ্গে পরিচিত হন**](https://discord.com/invite/ByRwuEEgH4) -### 🌐 মাল্টি-ল্যাঙ্গুয়েজ সাপোর্ট +### 🌐 বহু-ভাষা সমর্থন -#### GitHub Action দ্বারা সমর্থিত (স্বয়ংক্রিয় এবং সর্বদা আপডেট থাকে) +#### GitHub Action দ্বারা সমর্থিত (স্বয়ংক্রিয় এবং সর্বদা আপ-টু-ডেট) [Arabic](../ar/README.md) | [Bengali](./README.md) | [Bulgarian](../bg/README.md) | [Burmese (Myanmar)](../my/README.md) | [Chinese (Simplified)](../zh-CN/README.md) | [Chinese (Traditional, Hong Kong)](../zh-HK/README.md) | [Chinese (Traditional, Macau)](../zh-MO/README.md) | [Chinese (Traditional, Taiwan)](../zh-TW/README.md) | [Croatian](../hr/README.md) | [Czech](../cs/README.md) | [Danish](../da/README.md) | [Dutch](../nl/README.md) | [Estonian](../et/README.md) | [Finnish](../fi/README.md) | [French](../fr/README.md) | [German](../de/README.md) | [Greek](../el/README.md) | [Hebrew](../he/README.md) | [Hindi](../hi/README.md) | [Hungarian](../hu/README.md) | [Indonesian](../id/README.md) | [Italian](../it/README.md) | [Japanese](../ja/README.md) | [Kannada](../kn/README.md) | [Korean](../ko/README.md) | [Lithuanian](../lt/README.md) | [Malay](../ms/README.md) | [Malayalam](../ml/README.md) | [Marathi](../mr/README.md) | [Nepali](../ne/README.md) | [Nigerian Pidgin](../pcm/README.md) | [Norwegian](../no/README.md) | [Persian (Farsi)](../fa/README.md) | [Polish](../pl/README.md) | [Portuguese (Brazil)](../pt-BR/README.md) | [Portuguese (Portugal)](../pt-PT/README.md) | [Punjabi (Gurmukhi)](../pa/README.md) | [Romanian](../ro/README.md) | [Russian](../ru/README.md) | [Serbian (Cyrillic)](../sr/README.md) | [Slovak](../sk/README.md) | [Slovenian](../sl/README.md) | [Spanish](../es/README.md) | [Swahili](../sw/README.md) | [Swedish](../sv/README.md) | [Tagalog (Filipino)](../tl/README.md) | [Tamil](../ta/README.md) | [Telugu](../te/README.md) | [Thai](../th/README.md) | [Turkish](../tr/README.md) | [Ukrainian](../uk/README.md) | [Urdu](../ur/README.md) | [Vietnamese](../vi/README.md) -> **লোকালি ক্লোন করতে চান?** - -> এই রিপোজিটরিতে ৫০+ ভাষার অনুবাদ অন্তর্ভুক্ত যা ডাউনলোডের আকার অনেক বৃদ্ধি করে। অনুবাদ ছাড়া ক্লোন করতে sparse checkout ব্যবহার করুন: +> **লোকালিতে ক্লোন করতে ইচ্ছুক?** +> +> এই রিপোজিটরিটিতে ৫০+ ভাষায় অনুবাদ অন্তর্ভুক্ত রয়েছে যা ডাউনলোড সাইজ উল্লেখযোগ্যভাবে বৃদ্ধি করে। অনুবাদ ছাড়া ক্লোন করতে স্পার্স চেকআউট ব্যবহার করুন: +> +> **Bash / macOS / Linux:** > ```bash > git clone --filter=blob:none --sparse https://github.com/microsoft/Web-Dev-For-Beginners.git > cd Web-Dev-For-Beginners > git sparse-checkout set --no-cone '/*' '!translations' '!translated_images' > ``` -> এটি আপনাকে কোর্স সম্পন্ন করার জন্য যা প্রয়োজন তা দ্রুত ডাউনলোড সহ দেবে। +> +> **CMD (Windows):** +> ```cmd +> git clone --filter=blob:none --sparse https://github.com/microsoft/Web-Dev-For-Beginners.git +> cd Web-Dev-For-Beginners +> git sparse-checkout set --no-cone "/*" "!translations" "!translated_images" +> ``` +> +> এভাবে আপনি খুব দ্রুত ডাউনলোডের মাধ্যমে পুরো কোর্স সম্পন্ন করতে যা যা প্রয়োজন তা পাবেন। -**আপনি যদি অতিরিক্ত ভাষার সমর্থন চান তবে সেগুলি [এখানে](https://github.com/Azure/co-op-translator/blob/main/getting_started/supported-languages.md) তালিকাভুক্ত।** +**আপনি যদি অতিরিক্ত অনুবাদ ভাষাসমূহ চাইতে চান, তারা [এখানে](https://github.com/Azure/co-op-translator/blob/main/getting_started/supported-languages.md) তালিকাভুক্ত আছে** [![Open in Visual Studio Code](https://img.shields.io/static/v1?logo=visualstudiocode&label=&message=Open%20in%20Visual%20Studio%20Code&labelColor=2c2c32&color=007acc&logoColor=007acc)](https://open.vscode.dev/microsoft/Web-Dev-For-Beginners) -#### 🧑‍🎓 _আপনি কি একজন ছাত্র?_ +#### 🧑‍🎓 _আপনি কি ছাত্র?_ -[**Student Hub পেইজে যান**](https://docs.microsoft.com/learn/student-hub/?WT.mc_id=academic-77807-sagibbon) যেখানে আপনি নবীনদের জন্য সম্পদ, শিক্ষার্থী প্যাক এবং এমনকি একটি ফ্রি সার্টিফিকেট ভাউচারের উপায় পাবেন। এটি এমন একটি পৃষ্ঠা যা আপনি বুকমার্ক করে মাঝে মাঝে দেখতে পারেন কারণ আমরা প্রতি মাসে সামগ্রী পরিবর্তন করি। +[**Student Hub পেজে যান**](https://docs.microsoft.com/learn/student-hub/?WT.mc_id=academic-77807-sagibbon) যেখানে আপনি মূল বিষয়, ছাত্রদের জন্য প্যাক এবং এমনকি একটি ফ্রি সার্টিফিকেট ভাউচার পাওয়ার উপায় পাবেন। এটি এমন একটি পেজ যা আপনি বুকমার্ক করে মাঝে মাঝে দেখতে চাইবেন কারণ আমরা মাসিক ভিত্তিতে বিষয়বস্তু পরিবর্তন করি। -### 📣 ঘোষণা - নতুন GitHub Copilot Agent মোড চ্যালেঞ্জগুলি সম্পন্ন করার জন্য! +### 📣 ঘোষণা - নতুন GitHub Copilot Agent মোড চ্যালেঞ্জ সম্পূর্ণ করুন! -নতুন চ্যালেঞ্জ যুক্ত হয়েছে, বেশিরভাগ অধ্যায়ে "GitHub Copilot Agent Challenge 🚀" দেখুন। এটি GitHub Copilot এবং Agent মোড ব্যবহার করে সম্পন্ন করার জন্য একটি নতুন চ্যালেঞ্জ। আপনি যদি আগে Agent মোড ব্যবহার না করে থাকেন, এটি শুধুমাত্র টেক্সট তৈরি করে না, ফাইল তৈরি ও সম্পাদনা, কমান্ড চালাতে এবং আরও অনেক কাজ করতে সক্ষম। +নতুন চ্যালেঞ্জ যুক্ত হয়েছে, বেশিরভাগ অধ্যায়ে "GitHub Copilot Agent Challenge 🚀" খুঁজুন। এটি আপনাদের জন্য GitHub Copilot এবং Agent মোড ব্যবহার করে নতুন একটি চ্যালেঞ্জ। যদি আগে Agent মোড ব্যবহার না করে থাকেন, এটি কেবল টেক্সট তৈরি করে না, এছাড়াও ফাইল তৈরি ও সম্পাদনা করতে, কমান্ড রান করতে এবং আরও অনেক কিছু করতে সক্ষম। -### 📣 ঘোষণা - _Generative AI ব্যবহার করে নতুন প্রকল্প তৈরি_ +### 📣 ঘোষণা - _Generative AI ব্যবহার করে নতুন প্রকল্প তৈরি করুন_ -নতুন AI Assistant প্রকল্প যুক্ত হয়েছে, এটি দেখুন [প্রকল্প](./9-chat-project/README.md) +নতুন AI অ্যাসিস্ট্যান্ট প্রকল্প যোগ করা হয়েছে, দেখে নিন [প্রকল্প](./9-chat-project/README.md) -### 📣 ঘোষণা - _Generative AI এর জন্য নতুন কোর্স_ সম্প্রতি প্রকাশিত হয়েছে +### 📣 ঘোষণা - _Generative AI_ জন্য জাভাস্ক্রিপ্টের নতুন শিক্ষাক্রম প্রকাশিত হয়েছে -আমাদের নতুন Generative AI কোর্স মিস করবেন না! +আমাদের নতুন Generative AI শিক্ষাক্রম মিস করবেন না! -শুরু করতে ভিজিট করুন [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) ! +শুরু করতে যান [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) ![Background](../../translated_images/bn/background.148a8d43afde5730.webp) -- মৌলিক থেকে RAG পর্যন্ত সবকিছুর পাঠ। -- GenAI এবং আমাদের সহচর অ্যাপ ব্যবহার করে ঐতিহাসিক চরিত্রদের সাথে ইন্টারঅ্যাক্ট করুন। -- মজার এবং আকর্ষণীয় বর্ণনা, আপনি সময় ভ্রমণ করবেন! +- বেসিক থেকে RAG পর্যন্ত সবকিছু কভার করে লেসন। +- GenAI এবং আমাদের কম্পানিয়ন অ্যাপ ব্যবহার করে ঐতিহাসিক চরিত্রদের সঙ্গে যোগাযোগ করুন। +- মজার এবং আকর্ষণীয় বর্ণনা, আপনি টাইম ট্রাভেল করবেন! ![character](../../translated_images/bn/character.5c0dd8e067ffd693.webp) -প্রতিটি পাঠে একটি অ্যাসাইনমেন্ট, একটি জ্ঞান যাচাই এবং একটি চ্যালেঞ্জ অন্তর্ভুক্ত রয়েছে যা আপনাকে শেখার বিষয়গুলিতে গাইড করবে যেমন: -- প্রম্পটিং এবং প্রম্পট ইঞ্জিনিয়ারিং -- টেক্সট এবং ইমেজ অ্যাপ জেনারেশন +প্রতিটি লেসনে থাকে একটি অ্যাসাইনমেন্ট, একটি জ্ঞান যাচাইকরণ এবং একটি চ্যালেঞ্জ যা আপনাকে এই বিষয়গুলো শেখার জন্য গাইড করবে: +- প্রোম্পটিং এবং প্রোম্পট ইঞ্জিনিয়ারিং +- টেক্সট এবং চিত্র অ্যাপ তৈরী - সার্চ অ্যাপস -শুরু করতে [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) এ যান! +শুরু করতে যান [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) ## 🌱 শুরু করা -> **শিক্ষকবৃন্দ**, আমরা [কিছু পরামর্শ যোগ করেছি](for-teachers.md) কীভাবে এই পাঠ্যক্রম ব্যবহার করবেন তা নিয়ে। আপনার মতামত আমরা অবশ্যই চাই [আমাদের আলোচনা ফোরামে](https://github.com/microsoft/Web-Dev-For-Beginners/discussions/categories/teacher-corner)। +> **শিক্ষকবৃন্দ**, আমরা [কিছু সুপারিশ](for-teachers.md) অন্তর্ভুক্ত করেছি কিভাবে এই শিক্ষাক্রম ব্যবহার করবেন। আপনার মতামত দিতে অনুগ্রহ করে আমাদের [আলোচনা ফোরামে](https://github.com/microsoft/Web-Dev-For-Beginners/discussions/categories/teacher-corner) যোগ দিন! -**[শিক্ষার্থী](https://aka.ms/student-page/?WT.mc_id=academic-77807-sagibbon)**, প্রতিটি পাঠের জন্য, একটি প্রি-লেকচার কুইজ দিয়ে শুরু করুন এবং লেকচার ম্যাটিরিয়াল পড়ুন, বিভিন্ন কার্যকলাপ সম্পন্ন করুন এবং পোস্ট-লেকচার কুইজ দিয়ে আপনার বোঝাপড়া পরীক্ষা করুন। +**[শিক্ষানবিসগণ](https://aka.ms/student-page/?WT.mc_id=academic-77807-sagibbon)**, প্রতিটি লেসনের জন্য, একটি প্রি-লেকচার কুইজ দিয়ে শুরু করুন এবং পড়ুন লেকচারের উপকরণ, নানা কার্যক্রম সম্পন্ন করুন এবং পোস্ট-লেকচার কুইজের মাধ্যমে আপনার বোঝাপড়া যাচাই করুন। -আপনার শেখার অভিজ্ঞতা বাড়াতে, আপনার সহপাঠীদের সাথে একসাথে প্রকল্পগুলো নিয়ে কাজ করতে সংযুক্ত হোন! আলোচনা করার জন্য আমাদের [আলোচনা ফোরাম](https://github.com/microsoft/Web-Dev-For-Beginners/discussions) এ উৎসাহিত করা হয় যেখানে আমাদের মডারেটর টিম আপনার প্রশ্নের উত্তর দিতে থাকবে। +আপনার শেখার অভিজ্ঞতা উন্নত করতে, আপনার সহপাঠীদের সঙ্গে সংযুক্ত হোন এবং একসাথে প্রকল্পে কাজ করুন! আমাদের [আলোচনা ফোরামে](https://github.com/microsoft/Web-Dev-For-Beginners/discussions) আলোচনা উৎসাহিত করা হয় যেখানে আমাদের মধ্যস্থতাকারীদের একটি দল থাকবে যারা আপনার প্রশ্নের উত্তর দেবেন। -আপনার শিক্ষাকে আরো বাড়ানোর জন্য, আমরা অত্যন্ত সুপারিশ করি [Microsoft Learn](https://learn.microsoft.com/users/wirelesslife/collections/p1ddcy5jwy0jkm?WT.mc_id=academic-77807-sagibbon) এ অতিরিক্ত অধ্যয়ন সামগ্রী অন্বেষণ করতে। +আপনার শিক্ষাকে আরো বাড়াতে, আমরা অত্যন্ত সুপারিশ করছি [Microsoft Learn](https://learn.microsoft.com/users/wirelesslife/collections/p1ddcy5jwy0jkm?WT.mc_id=academic-77807-sagibbon) পর্যালোচনা করার জন্য অতিরিক্ত অধ্যয়ন উপকরণ। ### 📋 আপনার পরিবেশ সেটআপ করা -এই পাঠ্যক্রমের একটি ডেভেলপমেন্ট পরিবেশ প্রস্তুত রয়েছে! আপনি শুরু করার সময় আপনি এই পাঠ্যক্রম [Codespace](https://github.com/features/codespaces/) (_একটি ব্রাউজার-ভিত্তিক, কোনও ইনস্টলেশন ছাড়াই পরিবেশ_) বা আপনার কম্পিউটারে [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) এর মত একটি টেক্সট এডিটর ব্যবহার করে চালাতে পারেন। +এই শিক্ষাক্রমের জন্য একটি ডেভেলপমেন্ট পরিবেশ প্রস্তুত আছে! আপনি শুরু করার সময় আপনি অবশ্যই [Codespace](https://github.com/features/codespaces/) (_ব্রাউজার ভিত্তিক, ইনস্টলেশন ছাড়াই পরিবেশ_), অথবা আপনার নিজের কম্পিউটারে একটি টেক্সট এডিটর যেমন [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) ব্যবহার করে চালাতে পারেন। #### আপনার রিপোজিটরি তৈরি করুন -আপনার কাজ সহজে সংরক্ষণ করার জন্য, আপনার নিজস্ব একটি কপি এই রিপোজিটরির তৈরি করা সুপারিশ করা হয়। এটি করতে আপনি পৃষ্ঠার উপরের দিকের **Use this template** বোতামে ক্লিক করতে পারেন। এতে আপনার GitHub অ্যাকাউন্টে পাঠ্যক্রমের একটি অনুলিপি সহ নতুন রিপোজিটরি তৈরি হবে। +আপনার কাজ সহজে সংরক্ষণের জন্য, এটি সুপারিশ করা হয় যে আপনি এই রিপোজিটরির একটি কপি তৈরি করুন। এটি করতে পারেন পেইজের উপরের দিকের **Use this template** বাটনে ক্লিক করে। এটি আপনার GitHub অ্যাকাউন্টে শিক্ষাক্রমের একটি কপি সহ একটি নতুন রিপোজিটরি তৈরি করবে। -এই ধাপগুলি অনুসরণ করুন: -1. **রিপোজিটরি ফর্ক করুন**: এই পৃষ্ঠার উপরের ডানদিকে কোণে "Fork" বোতামে ক্লিক করুন। +নিম্নলিখিত ধাপ অনুসরণ করুন: +1. **রিপোজিটরি ফোর্ক করুন**: পেইজের উপরের-ডান কোণে "Fork" বাটনে ক্লিক করুন। 2. **রিপোজিটরি ক্লোন করুন**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git` -#### Codespace এ পাঠ্যক্রম চালানো +#### Codespace এ শিক্ষাক্রম চালানো -আপনি যে রিপোজিটরির কপি তৈরি করেছেন সেখানে **Code** বোতামে ক্লিক করুন এবং **Open with Codespaces** নির্বাচন করুন। এটি আপনার কাজের জন্য একটি নতুন Codespace তৈরি করবে। +আপনি যে কপি তৈরি করেছেন সেখান থেকে **Code** বাটনে ক্লিক করুন এবং **Open with Codespaces** নির্বাচন করুন। এটি আপনার কাজের জন্য একটি নতুন Codespace তৈরি করবে। ![Codespace](../../translated_images/bn/createcodespace.0238bbf4d7a8d955.webp) -#### আপনার কম্পিউটারে লোকালি পাঠ্যক্রম চালানো +#### আপনার কম্পিউটারে লোকালি শিক্ষাক্রম চালানো -আপনার কম্পিউটারে লোকালি পাঠ্যক্রম চালাতে, আপনার একটি টেক্সট এডিটর, একটি ব্রাউজার এবং একটি কমান্ড লাইন টুল প্রয়োজন। আমাদের প্রথম পাঠ, [Introduction to Programming Languages and Tools of the Trade](../../1-getting-started-lessons/1-intro-to-programming-languages), আপনাকে প্রতিটি সরঞ্জামের বিভিন্ন অপশন সম্পর্কে পথ দেখাবে যেন আপনি নিজের জন্য সেরা নির্বাচন করতে পারেন। +আপনার কম্পিউটারে লোকালি শিক্ষাক্রম চালানোর জন্য একটি টেক্সট এডিটর, একটি ব্রাউজার এবং একটি কমান্ড লাইন টুল দরকার। আমাদের প্রথম লেসন, [প্রোগ্রামিং ভাষা ও ট্রেডের সরঞ্জাম পরিচিতি](../../1-getting-started-lessons/1-intro-to-programming-languages), আপনাকে বিভিন্ন বিকল্প নিয়ে গাইড করবে যাতে আপনি যা সবচেয়ে ভালো মনে করেন তা নির্বাচন করতে পারবেন। -আমাদের সুপারিশ হল [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) ব্যবহার করা, যেটিতে একটি অন্তর্নির্মিত [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) রয়েছে। আপনি Visual Studio Code [এখানে](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) থেকে ডাউনলোড করতে পারেন। - - -1. আপনার রিপোজিটরিটি আপনার কম্পিউটারে ক্লোন করুন। এটি করতে আপনি **Code** বোতামে ক্লিক করে URL কপি করতে পারেন: +আমাদের সুপারিশ হলো [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) ব্যবহার করা, যা একটি বিল্ট-ইন [টার্মিনাল](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) অফার করে। Visual Studio Code ডাউনলোড করতে পারেন [এখানে](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon)। +1. আপনার রিপোজিটরি আপনার কম্পিউটারে ক্লোন করুন। আপনি এটি করতে পারেন **Code** বোতামে ক্লিক করে এবং URL কপি করে: [CodeSpace](./images/createcodespace.png) -তাহলে, [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) এর ভিতরে [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) খুলুন এবং নিম্নলিখিত কমান্ডটি চালান, যেখানে `` আপনি যেই URLটি কপি করেছেন সেটির সাথে প্রতিস্থাপন করবেন: + + তারপর, [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) এর ভিতরে [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) খুলুন এবং নিম্নলিখিত কমান্ডটি চালান, `` এর জায়গায় আপনি যেই URL কপি করেছেন তা বসান: ```bash git clone ``` -2. Visual Studio Code এ ফোল্ডারটি খুলুন। আপনি এটি করতে পারেন **File** > **Open Folder** ক্লিক করে এবং আপনি যেই ফোল্ডারটি ক্লোন করেছেন সেটি নির্বাচন করে। - +2. Visual Studio Code এ ফোল্ডারটি খুলুন। আপনি এটি করতে পারেন **File** > **Open Folder** ক্লিক করে এবং যেই ফোল্ডারটি আপনি ক্লোন করেছেন তা নির্বাচন করে। -> সুপারিশকৃত Visual Studio Code এক্সটেনশনসমূহ: +> নির্দেশিত Visual Studio Code এক্সটেনশনসমূহ: > -> * [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer&WT.mc_id=academic-77807-sagibbon) - Visual Studio Code এর ভিতরে HTML পেজের পূর্বরূপ দেখতে -> * [Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot&WT.mc_id=academic-77807-sagibbon) - দ্রুত কোড লেখার জন্য সাহায্য করতে +> * [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer&WT.mc_id=academic-77807-sagibbon) - Visual Studio Code এর ভিতরে HTML পেজ প্রিভিউ করতে +> * [Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot&WT.mc_id=academic-77807-sagibbon) - কোড লেখার গতি বাড়াতে সাহায্য করার জন্য ## 📂 প্রতিটি পাঠ অন্তর্ভুক্ত করে: - ঐচ্ছিক স্কেচনোট -- ঐচ্ছিক সহায়ক ভিডিও -- পাঠের আগে ওয়ার্মআপ কুইজ +- ঐচ্ছিক পরিপূরক ভিডিও +- পূর্ব-পাঠ ওয়ার্মআপ কুইজ - লিখিত পাঠ -- প্রকল্প-ভিত্তিক পাঠগুলোর জন্য, প্রকল্প নির্মাণের ধাপে ধাপে নির্দেশিকা -- জ্ঞান পরীক্ষা +- প্রকল্প-ভিত্তিক পাঠের জন্য, ধাপে ধাপে গাইড যে প্রকল্পটি কীভাবে তৈরি করতে হয় +- জ্ঞান যাচাই - একটি চ্যালেঞ্জ -- সহায়ক পাঠ্য -- নিয়োগ -- [পাঠোত্তপর কুইজ](https://ff-quizzes.netlify.app/web/) +- পরিপূরক পাঠ +- অ্যাসাইনমেন্ট +- [পোস্ট-পাঠ কুইজ](https://ff-quizzes.netlify.app/web/) -> **কুইজ সম্পর্কিত একটি নোট**: সমস্ত কুইজ Quiz-app ফোল্ডারে রয়েছে, মোট ৪৮টি কুইজ প্রতিটিতে তিনটি প্রশ্ন। সেগুলি পাওয়া যাবে [এখানে](https://ff-quizzes.netlify.app/web/), কুইজ অ্যাপটি স্থানীয়ভাবে চালানো যায় অথবা Azure এ ডিপ্লয় করা যায়; এর জন্য `quiz-app` ফোল্ডারে নির্দেশিকা অনুসরণ করুন। +> **কুইজ সম্পর্কে একটি নোট**: সব কুইজ `Quiz-app` ফোল্ডারে আছে, মোট ৪৮টি কুইজ যাদের প্রত্যেকটি তিনটি প্রশ্ন নিয়ে গঠিত। এগুলো [এখানে](https://ff-quizzes.netlify.app/web/) পাওয়া যায় এবং কুইজ অ্যাপটি লোকালি চালানো যেতে পারে অথবা Azure তে ডেপ্লয় করা যেতে পারে; `quiz-app` ফোল্ডারের মধ্যে নির্দেশনা অনুসরণ করুন। ## 🗃️ পাঠসমূহ -| | প্রকল্পের নাম | শেখানো বিষয়সমূহ | শেখার উদ্দেশ্য | সংশ্লিষ্ট পাঠ | লেখক | -| :-: | :------------------------------------------------------: | :--------------------------------------------------------------------: | ------------------------------------------------------------------------------------------------------------------------------ | :----------------------------------------------------------------------------------------------------------------------------: | :---------------------: | -| 01 | শুরু করা হচ্ছে | প্রোগ্রামিং পরিচিতি এবং সরঞ্জামের আলোচনা | অধিকাংশ প্রোগ্রামিং ভাষার মৌলিক ভিত্তি এবং পেশাদার ডেভেলপারদের কাজ সহজ করতে ব্যবহৃত সফটওয়্যার সম্পর্কে শেখা | [Intro to Programming Languages and Tools of the Trade](./1-getting-started-lessons/1-intro-to-programming-languages/README.md) | Jasmine | -| 02 | শুরু করা হচ্ছে | গিটহাবের বুনিয়াদি, টিমের সাথে কাজ করা অন্তর্ভুক্ত | আপনার প্রকল্পে গিটহাব ব্যবহার করা, কীভাবে কোডবেইজে অন্যদের সাথে সহযোগিতা করবেন শেখা | [Intro to GitHub](./1-getting-started-lessons/2-github-basics/README.md) | Floor | -| 03 | শুরু করা হচ্ছে | প্রবেশযোগ্যতা | ওয়েব প্রবেশযোগ্যতার মৌলিক বিষয়গুলি শেখা | [Accessibility Fundamentals](./1-getting-started-lessons/3-accessibility/README.md) | Christopher | -| 04 | JS বেসিকস | JavaScript ডেটা টাইপসমূহ | JavaScript ডেটা টাইপের মৌলিক বিষয়গুলি | [Data Types](./2-js-basics/1-data-types/README.md) | Jasmine | -| 05 | JS বেসিকস | ফাংশন এবং মেথডসমূহ | একটি অ্যাপ্লিকেশনের লজিক ফ্লো পরিচালনার জন্য ফাংশন এবং মেথড সম্পর্কে শেখা | [Functions and Methods](./2-js-basics/2-functions-methods/README.md) | Jasmine এবং Christopher | -| 06 | JS বেসিকস | JS দিয়ে সিদ্ধান্ত নেওয়া | কিভাবে আপনার কোডে শর্ত তৈরি করবেন সিদ্ধান্ত গ্রহণ পদ্ধতি ব্যবহার করে শেখা | [Making Decisions](./2-js-basics/3-making-decisions/README.md) | Jasmine | -| 07 | JS বেসিকস | অ্যারে এবং লুপ | JavaScript এ অ্যারে এবং লুপ ব্যবহার করে ডেটার সাথে কাজ করা | [Arrays and Loops](./2-js-basics/4-arrays-loops/README.md) | Jasmine | -| 08 | [টেরারিয়াম](./3-terrarium/solution/README.md) | HTML অনুশীলনে | অনলাইন টেরারিয়াম তৈরির জন্য HTML নির্মাণ, বিন্যাস নির্মাণে গুরুত্ব দেওয়া | [Introduction to HTML](./3-terrarium/1-intro-to-html/README.md) | Jen | -| 09 | [টেরারিয়াম](./3-terrarium/solution/README.md) | CSS অনুশীলনে | অনলাইন টেরারিয়ামের স্টাইল করার জন্য CSS তৈরি, CSS এর মৌলিক বিষয় এবং পেজ রেসপনসিভ করা শেখা | [Introduction to CSS](./3-terrarium/2-intro-to-css/README.md) | Jen | -| 10 | [টেরারিয়াম](./3-terrarium/solution/README.md) | JavaScript ক্লোজার, DOM ম্যানিপুলেশন | টেরারিয়ামকে ড্র্যাগ/ড্রপ ইন্টারফেস হিসেবে কাজ করানোর জন্য JavaScript নির্মাণ, ক্লোজার এবং DOM ম্যানিপুলেশনে গুরুত্ব দেওয়া | [JavaScript Closures, DOM manipulation](./3-terrarium/3-intro-to-DOM-and-closures/README.md) | Jen | -| 11 | [টাইপিং গেম](./4-typing-game/solution/README.md) | একটি টাইপিং গেম তৈরি | কিবোর্ড ইভেন্ট ব্যবহার করে কিভাবে আপনার JavaScript অ্যাপের লজিক চালানো হয় শিখুন | [Event-Driven Programming](./4-typing-game/typing-game/README.md) | Christopher | -| 12 | [গ্রিন ব্রাউজার এক্সটেনশন](./5-browser-extension/solution/README.md) | ব্রাউজারের সাথে কাজ | ব্রাউজার কিভাবে কাজ করে, তার ইতিহাস এবং ব্রাউজার এক্সটেনশনের প্রথম উপাদান তৈরি করা শেখা | [About Browsers](./5-browser-extension/1-about-browsers/README.md) | Jen | -| 13 | [গ্রিন ব্রাউজার এক্সটেনশন](./5-browser-extension/solution/README.md) | ফর্ম তৈরি, API কল এবং স্থানীয় স্টোরেজে ভেরিয়েবল সংরক্ষণ | API কল করার জন্য আপনার ব্রাউজার এক্সটেনশনের JavaScript উপাদান তৈরি করুন, স্থানীয় স্টোরেজে সংরক্ষিত ভেরিয়েবল ব্যবহার করে | [APIs, Forms, and Local Storage](./5-browser-extension/2-forms-browsers-local-storage/README.md) | Jen | -| 14 | [গ্রিন ব্রাউজার এক্সটেনশন](./5-browser-extension/solution/README.md) | ব্রাউজারের ব্যাকগ্রাউন্ড প্রসেস, ওয়েব পারফরমেন্স | এক্সটেনশনের আইকন পরিচালনার জন্য ব্রাউজারের ব্যাকগ্রাউন্ড প্রসেস ব্যবহার করুন; ওয়েব পারফরমেন্স এবং কিছু অপ্টিমাইজেশন সম্পর্কে শেখা | [Background Tasks and Performance](./5-browser-extension/3-background-tasks-and-performance/README.md) | Jen | -| 15 | [স্পেস গেম](./6-space-game/solution/README.md) | JavaScript দিয়ে আরও উন্নত গেম ডেভেলপমেন্ট | ক্লাস এবং কম্পোজিশন উভয় ব্যবহার করে ইনহেরিটেন্স এবং পাব/সাব প্যাটার্ন শেখা, একটি গেম নির্মাণের জন্য প্রস্তুতি | [Introduction to Advanced Game Development](./6-space-game/1-introduction/README.md) | Chris | -| 16 | [স্পেস গেম](./6-space-game/solution/README.md) | ক্যানভাসে ড্রয়িং | স্ক্রীনে এলিমেন্ট আঁকার জন্য ব্যবহৃত Canvas API সম্পর্কে শেখা | [Drawing to Canvas](./6-space-game/2-drawing-to-canvas/README.md) | Chris | -| 17 | [স্পেস গেম](./6-space-game/solution/README.md) | স্ক্রীনের চারপাশে এলিমেন্ট সরানো | কিভাবে কার্তেসিয়ান কোঅর্ডিনেট এবং Canvas API ব্যবহার করে এলিমেন্টগুলোকে মুভ করানো যায় শেখা | [Moving Elements Around](./6-space-game/3-moving-elements-around/README.md) | Chris | -| 18 | [স্পেস গেম](./6-space-game/solution/README.md) | সংঘর্ষ শনাক্তকরণ | কীপ্রেস ব্যবহার করে এলিমেন্টগুলোকে সংঘর্ষ করানো এবং একে অপরের প্রতি প্রতিক্রিয়া দেখানো; গেমের পারফরমেন্স নিশ্চিত করতে কুলডাউন ফাংশন ব্যবহার করা | [Collision Detection](./6-space-game/4-collision-detection/README.md) | Chris | -| 19 | [স্পেস গেম](./6-space-game/solution/README.md) | স্কোর রাখা | গেমের পরিস্থিতি ও পারফরমেন্সের ওপর ভিত্তি করে গণিতের হিসাব-নিকাশ করা | [Keeping Score](./6-space-game/5-keeping-score/README.md) | Chris | -| 20 | [স্পেস গেম](./6-space-game/solution/README.md) | গেম শেষ করা এবং পুনরায় শুরু করা | গেম শেষ করা এবং পুনরায় শুরু করার বিষয়ে শেখা, সম্পদ পরিষ্কার করা এবং ভেরিয়েবলের মান রিসেট করা | [The Ending Condition](./6-space-game/6-end-condition/README.md) | Chris | -| 21 | [ব্যাংকিং অ্যাপ](./7-bank-project/solution/README.md) | ওয়েব অ্যাপে HTML টেমপ্লেট এবং রাউটসমূহ | মাল্টিপেজ ওয়েবসাইট আর্কিটেকচারের স্ক্যাফোল্ড তৈরি করা শিখুন রাউটিং এবং HTML টেমপ্লেট ব্যবহার করে | [HTML Templates and Routes](./7-bank-project/1-template-route/README.md) | Yohan | -| 22 | [ব্যাংকিং অ্যাপ](./7-bank-project/solution/README.md) | লগইন এবং রেজিস্ট্রেশন ফর্ম তৈরি | ফর্ম তৈরি এবং যাচাইকরণ পদ্ধতি সম্পর্কে শেখা | [Forms](./7-bank-project/2-forms/README.md) | Yohan | -| 23 | [ব্যাংকিং অ্যাপ](./7-bank-project/solution/README.md) | ডেটা সংগ্রহ এবং ব্যবহারের পদ্ধতি | আপনার অ্যাপের ভিতরে ও বাইরে ডেটার প্রবাহ, কিভাবে তা সংগ্রহ, সংরক্ষণ এবং মুছে ফেলা যায় শিখুন | [Data](./7-bank-project/3-data/README.md) | Yohan | -| 24 | [ব্যাংকিং অ্যাপ](./7-bank-project/solution/README.md) | স্টেট ম্যানেজমেন্ট ধারণা | আপনার অ্যাপ কিভাবে অবস্থা ধরে রাখে এবং প্রোগ্রাম্যাটিকভাবে তা কিভাবে পরিচালনা করবেন শেখা | [State Management](./7-bank-project/4-state-management/README.md) | Yohan | -| 25 | [ব্রাউজার/VScode কোড](../../8-code-editor) | VScode এর সাথে কাজ করা | কোড এডিটর ব্যবহার শিখুন | [Use VScode Code Editor](./8-code-editor/1-using-a-code-editor/README.md) | Chris | -| 26 | [AI সহকারী](./9-chat-project/README.md) | AI এর সাথে কাজ করা | নিজের AI সহকারী তৈরি শেখা | [AI Assistant project](./9-chat-project/README.md) | Chris | - -## 🏫 শিক্ষণশাস্ত্র - -আমাদের পাঠ্যক্রম দুইটি মূল শিক্ষণ নীতির ভিত্তিতে ডিজাইন করা হয়েছে: -* প্রকল্প-ভিত্তিক শিক্ষা -* ঘন ঘন কুইজ পরীক্ষা - -এই প্রোগ্রামটি JavaScript, HTML এবং CSS এর মৌলিক বিষয় শেখায়, পাশাপাশি বর্তমান ওয়েব ডেভেলপাররা যেসব সরঞ্জাম ও প্রযুক্তি ব্যবহার করে তা শেখায়। ছাত্ররা টাইপিং গেম, ভার্চুয়াল টেরারিয়াম, পরিবেশবান্ধব ব্রাউজার এক্সটেনশন, স্পেস ইনভেডার ধরণের গেম এবং ব্যবসার জন্য একটি ব্যাংকিং অ্যাপ তৈরি করে হাতে কলমে অভিজ্ঞতা অর্জনের সুযোগ পাবে। সিরিজের শেষে, শিক্ষার্থীরা ওয়েব ডেভেলপমেন্ট সম্পর্কে একটি শক্তিশালী ধারণা লাভ করবে। - -> 🎓 আপনি এই পাঠ্যক্রমের প্রথম কয়েকটি পাঠ Microsoft Learn এ একটি [Learn Path](https://docs.microsoft.com/learn/paths/web-development-101/?WT.mc_id=academic-77807-sagibbon) হিসেবে নিতে পারেন! - -বিষয়বস্তু প্রকল্পের সাথে সামঞ্জস্যপূর্ণ করার মাধ্যমে, শিক্ষার্থীদের জন্য প্রক্রিয়াটি আরও আকর্ষণীয় হয় এবং ধারণাগুলোর স্মরণীয়তা বৃদ্ধি পায়। আমরা JavaScript বেসিকসের কয়েকটি প্রাথমিক পাঠও লিখেছি ধারণাগুলো পরিচয় করানোর জন্য, "[Beginners Series to: JavaScript](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript/?WT.mc_id=academic-77807-sagibbon)" ভিডিও টিউটোরিয়াল সংগ্রহ থেকে একটি ভিডিওসহ, যাদের মধ্যে কিছু লেখক এই পাঠ্যক্রমে অবদান রেখেছেন। - -তদুপরি, একটি ক্লাসের আগে হালকা স্তরের কুইজ শিক্ষার্থীর শেখার প্রতিশ্রুতি স্থাপন করে, এবং ক্লাসের পর একটি দ্বিতীয় কুইজ আরও স্মরণীয়তা নিশ্চিত করে। এই পাঠ্যক্রমটি নমনীয় এবং মজাদার করার জন্য ডিজাইন করা হয়েছে এবং সম্পূর্ণ অথবা আংশিক অংশগ্রহণ করা যায়। প্রকল্পগুলো ছোট থেকে শুরু করে ১২ সপ্তাহের চক্র শেষে ক্রমশ জটিল হয়ে ওঠে। - -যেহেতু আমরা সচেতনভাবে JavaScript ফ্রেমওয়ার্ক পরিচিতি এড়িয়েছি যাতে ওয়েব ডেভেলপার হিসেবে মৌলিক দক্ষতা অর্জনে মনোযোগ দিতে পারি ফ্রেমওয়ার্ক গৃহীত করার আগে, তাই এই পাঠ্যক্রম শেষ করার পর পরবর্তী ভালো পদক্ষেপ হতে পারে Node.js সম্পর্কে শেখা, অন্য একটি ভিডিও সংগ্রহের মাধ্যমে: "[Beginner Series to: Node.js](https://channel9.msdn.com/Series/Beginners-Series-to-Nodejs/?WT.mc_id=academic-77807-sagibbon)". - -> আমাদের [আচরণবিধি](CODE_OF_CONDUCT.md) এবং [অবদান](CONTRIBUTING.md) নির্দেশিকা দেখুন। আমরা আপনার গঠনমূলক প্রতিক্রিয়াকে স্বাগত জানাই! - +| | প্রকল্পের নাম | শেখানো ধারণাসমূহ | শেখার উদ্দেশ্য | লিঙ্ক করা পাঠ | লেখক | +| :-: | :------------------------------------------------------: | :--------------------------------------------------------------------: | ---------------------------------------------------------------------------------------------------------------------------------- | :----------------------------------------------------------------------------------------------------------------------------: | :-------------------: | +| 01 | শুরু করা | প্রোগ্রামিং এবং ট্রেড টুলসের পরিচিতি | অধিকাংশ প্রোগ্রামিং ভাষার মৌলিক ধারণা এবং সফটওয়্যার সম্পর্কে জানুন যা পেশাদার ডেভেলপারদের কাজে সাহায্য করে | [Intro to Programming Languages and Tools of the Trade](./1-getting-started-lessons/1-intro-to-programming-languages/README.md) | Jasmine | +| 02 | শুরু করা | GitHub এর মৌলিক বিষয়, একটি টিমের সাথে কাজ করা | GitHub আপনার প্রকল্পে কীভাবে ব্যবহার করবেন, এবং কিভাবে অন্যদের সাথে কোড বেসে সহযোগিতা করবেন | [Intro to GitHub](./1-getting-started-lessons/2-github-basics/README.md) | Floor | +| 03 | শুরু করা | অ্যাকসেসিবিলিটি | ওয়েব অ্যাক্সেসিবিলিটির মৌলিক বিষয় শিখুন | [Accessibility Fundamentals](./1-getting-started-lessons/3-accessibility/README.md) | Christopher | +| 04 | JS মৌলিক | JavaScript ডেটা টাইপ | JavaScript ডেটা টাইপের মৌলিক বিষয় | [Data Types](./2-js-basics/1-data-types/README.md) | Jasmine | +| 05 | JS মৌলিক | ফাংশন এবং মেথড | অ্যাপ্লিকেশনের লজিক নিয়ন্ত্রণ করার জন্য ফাংশন এবং মেথড সম্পর্কে শিখুন | [Functions and Methods](./2-js-basics/2-functions-methods/README.md) | Jasmine and Christopher | +| 06 | JS মৌলিক | JS দিয়ে সিদ্ধান্ত গ্রহণ | কোডে শর্ত তৈরি করার জন্য সিদ্ধান্ত গ্রহণ পদ্ধতি সম্পর্কে শিখুন | [Making Decisions](./2-js-basics/3-making-decisions/README.md) | Jasmine | +| 07 | JS মৌলিক | অ্যারে এবং লুপস | JavaScript এ অ্যারে এবং লুপ ব্যবহার করে ডেটার উপর কাজ করুন | [Arrays and Loops](./2-js-basics/4-arrays-loops/README.md) | Jasmine | +| 08 | [Terrarium](./3-terrarium/solution/README.md) | HTML অনুশীলন | একটি অনলাইন টেরারিয়াম তৈরি করতে HTML তৈরি করুন, মূলত লেআউট তৈরি করার উপর ফোকাস করুন | [Introduction to HTML](./3-terrarium/1-intro-to-html/README.md) | Jen | +| 09 | [Terrarium](./3-terrarium/solution/README.md) | CSS অনুশীলন | অনলাইন টেরারিয়ামের CSS তৈরি করুন, CSS এর মৌলিক বিষয় এবং পেজকে রেসপন্সিভ করার উপরে ফোকাস করুন | [Introduction to CSS](./3-terrarium/2-intro-to-css/README.md) | Jen | +| 10 | [Terrarium](./3-terrarium/solution/README.md) | JavaScript ক্লোজার, DOM ম্যানিপুলেশন | টেরারিয়ামকে ড্র্যাগ/ড্রপ ইন্টারফেস হিসেবে কাজ করানোর জন্য JavaScript তৈরি করুন, ক্লোজার এবং DOM ম্যানিপুলেশনের উপর ফোকাস করুন | [JavaScript Closures, DOM manipulation](./3-terrarium/3-intro-to-DOM-and-closures/README.md) | Jen | +| 11 | [টাইপিং গেম](./4-typing-game/solution/README.md) | টাইপিং গেম তৈরি | কী-বোর্ড ইভেন্ট ব্যবহার করে JavaScript অ্যাপের লজিক ড্রাইভ করা শিখুন | [Event-Driven Programming](./4-typing-game/typing-game/README.md) | Christopher | +| 12 | [গ্রিন ব্রাউজার এক্সটেনশন](./5-browser-extension/solution/README.md) | ব্রাউজারের কাজ | ব্রাউজার কিভাবে কাজ করে, এর ইতিহাস এবং ব্রাউজার এক্সটেনশনের প্রথম উপাদানগুলো স্ক্যাফোল্ড করা শিখুন | [About Browsers](./5-browser-extension/1-about-browsers/README.md) | Jen | +| 13 | [গ্রিন ব্রাউজার এক্সটেনশন](./5-browser-extension/solution/README.md) | ফর্ম তৈরি, API কল এবং লোকাল স্টোরেজে ভেরিয়েবল সংরক্ষণ | API কল করার জন্য ব্রাউজার এক্সটেনশনের JavaScript উপাদান তৈরি করুন যা লোকাল স্টোরেজে সঞ্চিত ভেরিয়েবল ব্যবহার করে | [APIs, Forms, and Local Storage](./5-browser-extension/2-forms-browsers-local-storage/README.md) | Jen | +| 14 | [গ্রিন ব্রাউজার এক্সটেনশন](./5-browser-extension/solution/README.md) | ব্রাউজারের ব্যাকগ্রাউন্ড প্রসেস, ওয়েব পারফরম্যান্স | এক্সটেনশনের আইকন ম্যানেজ করার জন্য ব্রাউজারের ব্যাকগ্রাউন্ড প্রসেস ব্যবহার করুন; ওয়েব পারফরম্যান্স এবং কিছু অপ্টিমাইজেশন শিখুন | [Background Tasks and Performance](./5-browser-extension/3-background-tasks-and-performance/README.md) | Jen | +| 15 | [স্পেস গেম](./6-space-game/solution/README.md) | জাভাস্ক্রিপ্ট দিয়ে উন্নত গেম ডেভেলপমেন্ট | ক্লাস এবং কম্পোজিশন ব্যবহার করে ইনহেরিটেন্স এবং পাব/সাব প্যাটার্ন সম্পর্কে শিখুন, গেম তৈরির প্রস্তুতিতে | [Introduction to Advanced Game Development](./6-space-game/1-introduction/README.md) | Chris | +| 16 | [স্পেস গেম](./6-space-game/solution/README.md) | ক্যানভাসে আঁকা | ক্যানভাস API সম্পর্কে জানুন, যা স্ক্রিনে এলিমেন্ট আঁকার জন্য ব্যবহৃত হয় | [Drawing to Canvas](./6-space-game/2-drawing-to-canvas/README.md) | Chris | +| 17 | [স্পেস গেম](./6-space-game/solution/README.md) | স্ক্রিনে এলিমেন্টগুলি সরানো | কিভাবে কার্টেসিয়ান কোঅর্ডিনেট এবং ক্যানভাস API ব্যবহার করে এলিমেন্টগুলি গতি লাভ করতে পারে তা আবিষ্কার করুন | [Moving Elements Around](./6-space-game/3-moving-elements-around/README.md) | Chris | +| 18 | [স্পেস গেম](./6-space-game/solution/README.md) | সংঘর্ষ সনাক্তকরণ | কীপ্রেস ব্যবহার করে এলিমেন্টগুলিকে সংঘর্ষ করতে এবং একে অপরের সাথে প্রতিক্রিয়া করতে দিন এবং গেমের পারফরম্যান্স নিশ্চিত করতে কুলডাউন ফাংশন দিন | [Collision Detection](./6-space-game/4-collision-detection/README.md) | Chris | +| 19 | [স্পেস গেম](./6-space-game/solution/README.md) | স্কোর রাখা | গেমের অবস্থা এবং পারফরম্যান্সের উপর ভিত্তি করে গাণিতিক হিসাব নির্ণয় করুন | [Keeping Score](./6-space-game/5-keeping-score/README.md) | Chris | +| 20 | [স্পেস গেম](./6-space-game/solution/README.md) | গেম শেষ করা এবং পুনরায় শুরু করা | গেম শেষ করা এবং পুনরায় শুরু করার সম্পর্কে শিখুন, যার মধ্যে রয়েছে অ্যাসেট পরিষ্কার করা এবং ভেরিয়েবল মান রিসেট করা | [The Ending Condition](./6-space-game/6-end-condition/README.md) | Chris | +| 21 | [ব্যাংকিং অ্যাপ](./7-bank-project/solution/README.md) | ওয়েব অ্যাপে HTML টেমপ্লেট এবং রাউট | রাউটিং এবং HTML টেমপ্লেট ব্যবহার করে একটি মাল্টিপেজ ওয়েবসাইটের স্থাপত্য তৈরি করতে শিখুন | [HTML Templates and Routes](./7-bank-project/1-template-route/README.md) | Yohan | +| 22 | [ব্যাংকিং অ্যাপ](./7-bank-project/solution/README.md) | লগইন এবং রেজিস্ট্রেশন ফর্ম তৈরি | ফর্ম তৈরি এবং ভ্যালিডেশন রুটিন হ্যান্ডল করার ব্যাপারে শিখুন | [Forms](./7-bank-project/2-forms/README.md) | Yohan | +| 23 | [ব্যাংকিং অ্যাপ](./7-bank-project/solution/README.md) | ডেটা পাওয়া এবং ব্যবহার করার পদ্ধতি | অ্যাপে কীভাবে ডেটা প্রবাহিত হয়, কীভাবে এটি আনা, সংরক্ষণ এবং নিষ্কাশন করা হয় সে সম্পর্কে জানুন | [Data](./7-bank-project/3-data/README.md) | Yohan | +| 24 | [ব্যাংকিং অ্যাপ](./7-bank-project/solution/README.md) | স্টেট ম্যানেজমেন্টের ধারণা | কীভাবে আপনার অ্যাপ স্টেট ধরে রাখে এবং কীভাবে প্রোগ্রাম্যাটিকভাবে তা নিয়ন্ত্রণ করে সে সম্পর্কে শিখুন | [State Management](./7-bank-project/4-state-management/README.md) | Yohan | +| 25 | [Browser/VScode Code](../../8-code-editor) | VScode এর সাথে কাজ করা | একটি কোড এডিটর ব্যবহার করা শিখুন| [Use VScode Code Editor](./8-code-editor/1-using-a-code-editor/README.md) | Chris | +| 26 | [AI Assistants](./9-chat-project/README.md) | AI এর সাথে কাজ করা | আপনার নিজস্ব AI সহকারী তৈরি করা শিখুন | [AI Assistant project](./9-chat-project/README.md) | Chris | + +## 🏫 পেডাগজি + +আমাদের কারিকুলাম দুটি মূল শিক্ষাগত নীতির উপর ভিত্তি করে ডিজাইন করা হয়েছে: +* প্রকল্প-ভিত্তিক শেখা +* ঘন ঘন কুইজ + +এই প্রোগ্রামটি JavaScript, HTML, এবং CSS এর মৌলিক বিষয়গুলি শেখায়, পাশাপাশি আজকের ওয়েব ডেভেলপারদের ব্যবহৃত সর্বশেষ টুল এবং প্রযুক্তি। শিক্ষার্থীরা একটি টাইপিং গেম, ভার্চুয়াল টেরারিয়াম, ইকো-ফ্রেন্ডলি ব্রাউজার এক্সটেনশন, স্পেস-ইনভেডার-স্টাইল গেম এবং ব্যবসায়ের জন্য একটি ব্যাংকিং অ্যাপ তৈরি করে হাতে কলমে অভিজ্ঞতা অর্জনের সুযোগ পাবে। সিরিজের শেষে শিক্ষার্থীরা ওয়েব ডেভেলপমেন্টের একটি দৃঢ় ধারণা অর্জন করবে। + +> 🎓 আপনি এই কারিকুলামের প্রথম কিছু পাঠ Microsoft Learn এ একটি [Learn Path](https://docs.microsoft.com/learn/paths/web-development-101/?WT.mc_id=academic-77807-sagibbon) হিসেবে নিতে পারেন! + +কন্টেন্ট প্রকল্পের সাথে সামঞ্জস্যপূর্ণ করার মাধ্যমে, প্রক্রিয়াটি শিক্ষার্থীদের জন্য আরও আকর্ষণীয় হয় এবং ধারণাগুলোর ধারণক্ষমতা বাড়ে। আমরা JavaScript এর মৌলিক বিষয়গুলিতে কয়েকটি স্টার্টার পাঠ লিখেছি ধারণাগুলো পরিচয় করানোর জন্য, একটি ভিডিও "[Beginners Series to: JavaScript](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript/?WT.mc_id=academic-77807-sagibbon)" কালেকশনের সাথে জোড়া দিয়েছি, যার কিছু লেখক এই কারিকুলামেও অবদান রেখেছেন। + +অতিরিক্তভাবে, একটি ক্লাসের আগে একটি নিম্ন-দাবি কুইজ শিক্ষার্থীর শেখার উদ্দেশ্য স্থির করে, আর ক্লাসের পরে দ্বিতীয় কুইজ আরও ভালো ধারণার অধিকার নিশ্চিত করে। এই কারিকুলামটি নমনীয় এবং মজাদার হওয়ার জন্য ডিজাইন করা হয়েছে এবং পুরো বা আংশিকভাবে নেওয়া যেতে পারে। প্রকল্পসমূহ ছোট থেকে শুরু করে ১২-সপ্তাহের চক্র শেষে ক্রমশ জটিল হবে। + +আমরা ইচ্ছাকৃতভাবে JavaScript ফ্রেমওয়ার্কগুলো প্রবর্তন করা থেকে বিরত রয়েছি যাতে ওয়েব ডেভেলপার হিসেবে মৌলিক দক্ষতা অর্জনের প্রতি ফোকাস রাখা যায়, পরে একটি ভালো পরবর্তী ধাপ হবে Node.js সম্পর্কে শেখা "[Beginner Series to: Node.js](https://channel9.msdn.com/Series/Beginners-Series-to-Nodejs/?WT.mc_id=academic-77807-sagibbon)" ভিডিও কালেকশনের মাধ্যমে। + +> আমাদের [আচারসংহিতা](CODE_OF_CONDUCT.md) এবং [অবদান Guidelines](CONTRIBUTING.md) দেখুন। আপনার গঠনমূলক প্রতিক্রিয়া আমরা স্বাগত জানাই! ## 🧭 অফলাইন অ্যাক্সেস -[Docsify](https://docsify.js.org/#/) ব্যবহার করে আপনি এই ডকুমেন্টেশনটি অফলাইনে চালাতে পারবেন। এই রিপোজিটরিটি ফর্ক করুন, [Docsify ইনস্টল করুন](https://docsify.js.org/#/quickstart) আপনার লোকাল মেশিনে, তারপর এই রিপোজিটরির মূল ফোল্ডারে যান এবং টাইপ করুন `docsify serve`। ওয়েবসাইটটি আপনার লোকালহোস্টে ৩০০০ পোর্টে সার্ভ হবে: `localhost:3000`। +আপনি [Docsify](https://docsify.js.org/#/) ব্যবহার করে এই ডকুমেন্টেশন অফলাইনে চালাতে পারেন। এই রিপোটি Fork করুন, আপনার লোকাল মেশিনে [Docsify ইনস্টল করুন](https://docsify.js.org/#/quickstart), তারপর এই রিপোর রুট ফোল্ডারে `docsify serve` টাইপ করুন। ওয়েবসাইটটি আপনার লোকালহোস্টের ৩০০০ পোর্টে চালিত হবে: `localhost:3000`। ## 📘 পিডিএফ - -সমস্ত পাঠের একটি পিডিএফ [এখানে](https://microsoft.github.io/Web-Dev-For-Beginners/pdf/readme.pdf) পাওয়া যাবে। - +সমস্ত পাঠের একটি পিডিএফ এখানে পাওয়া যেতে পারে [here](https://microsoft.github.io/Web-Dev-For-Beginners/pdf/readme.pdf)। ## 🎒 অন্যান্য কোর্সসমূহ -আমাদের দল অন্যান্য কোর্স তৈরি করে! দেখুন: + +আমাদের দল অন্যান্য কোর্সও তৈরি করে! দেখে নিন: ### LangChain @@ -232,7 +238,7 @@ Azure AI Foundry Discord কমিউনিটিতে যোগ দিন --- -### Core Learning +### মূল শিক্ষা [![ML for Beginners](https://img.shields.io/badge/ML%20for%20Beginners-22C55E?style=for-the-badge&labelColor=E5E7EB&color=22C55E)](https://aka.ms/ml-beginners?WT.mc_id=academic-105485-koreyst) [![Data Science for Beginners](https://img.shields.io/badge/Data%20Science%20for%20Beginners-84CC16?style=for-the-badge&labelColor=E5E7EB&color=84CC16)](https://aka.ms/datascience-beginners?WT.mc_id=academic-105485-koreyst) [![AI for Beginners](https://img.shields.io/badge/AI%20for%20Beginners-A3E635?style=for-the-badge&labelColor=E5E7EB&color=A3E635)](https://aka.ms/ai-beginners?WT.mc_id=academic-105485-koreyst) @@ -243,7 +249,7 @@ Azure AI Foundry Discord কমিউনিটিতে যোগ দিন --- -### Copilot Series +### কপিলট সিরিজ [![Copilot for AI Paired Programming](https://img.shields.io/badge/Copilot%20for%20AI%20Paired%20Programming-FACC15?style=for-the-badge&labelColor=E5E7EB&color=FACC15)](https://aka.ms/GitHubCopilotAI?WT.mc_id=academic-105485-koreyst) [![Copilot for C#/.NET](https://img.shields.io/badge/Copilot%20for%20C%23/.NET-FBBF24?style=for-the-badge&labelColor=E5E7EB&color=FBBF24)](https://github.com/microsoft/mastering-github-copilot-for-dotnet-csharp-developers?WT.mc_id=academic-105485-koreyst) [![Copilot Adventure](https://img.shields.io/badge/Copilot%20Adventure-FDE68A?style=for-the-badge&labelColor=E5E7EB&color=FDE68A)](https://github.com/microsoft/CopilotAdventures?WT.mc_id=academic-105485-koreyst) @@ -251,21 +257,21 @@ Azure AI Foundry Discord কমিউনিটিতে যোগ দিন ## সাহায্য নেওয়া -যদি আপনি আটকে যান বা AI অ্যাপ নির্মাণ সম্পর্কে কোনো প্রশ্ন থাকে। MCP নিয়ে আলোচনা করতে সহশিক্ষার্থী এবং অভিজ্ঞ ডেভেলপারদের সাথে যোগ দিন। এটি একটি সহায়ক সম্প্রদায় যেখানে প্রশ্ন歓迎 এবং জ্ঞান বিনামূল্যে ভাগ করা হয়। +যদি আপনি আটকে যান বা AI অ্যাপ তৈরি করার বিষয়ে কোনো প্রশ্ন থাকে। MCP সম্পর্কে আলোচনা করতে সহকর্মী শিক্ষার্থী ও অভিজ্ঞ ডেভেলপারদের সাথে যোগ দিন। এটি একটি সহায়ক সম্প্রদায় যেখানে প্রশ্ন গ্রহণযোগ্য এবং জ্ঞান বিনিময় করা হয়। [![Microsoft Foundry Discord](https://dcbadge.limes.pink/api/server/nTYy5BXMWG)](https://discord.gg/nTYy5BXMWG) -যদি আপনার পণ্যের প্রতিক্রিয়া বা ত্রুটি থাকে নির্মাণের সময় নিম্নলিখিত লিঙ্কে যান: +যদি আপনার পণ্য প্রতিক্রিয়া বা নির্মাণের সময় কোনো ত্রুটি থাকে, তাহলে দেখুন: [![Microsoft Foundry Developer Forum](https://img.shields.io/badge/GitHub-Microsoft_Foundry_Developer_Forum-blue?style=for-the-badge&logo=github&color=000000&logoColor=fff)](https://aka.ms/foundry/forum) ## লাইসেন্স -এই রিপজিটরি MIT লাইসেন্সের অধীনে লাইসেন্সকৃত। আরও তথ্যের জন্য দেখুন [LICENSE](../../LICENSE) ফাইল। +এই রেপোজিটরিটি MIT লাইসেন্সের অধীনে অনুমোদিত। আরও তথ্যের জন্য দেখুন [LICENSE](../../LICENSE) ফাইল। --- -**দায়িত্ব সীমা**: -এই নথিটি AI অনুবাদ সেবা [Co-op Translator](https://github.com/Azure/co-op-translator) ব্যবহার করে অনূদিত হয়েছে। আমরা যথাসাধ্য সঠিকতার জন্য চেষ্টা করি, তবে कृপয়া মনে রাখবেন যে স্বয়ংক্রিয় অনুবাদে ত্রুটি বা ভুল থাকতে পারে। মূল নথিটি তার নিজ ভাষায় সর্বাধিক গ্রহণযোগ্য উৎস হিসেবে বিবেচিত হওয়া উচিত। গুরুত্বপূর্ণ তথ্যের জন্য পেশাদার মানব অনুবাদ পরামর্শ দেওয়া হয়। এই অনুবাদের ব্যবহার থেকে উদ্ভূত কোনও ভুল বোঝাবুঝি বা ভ্রান্তির জন্য আমরা দায়ী নই। +**অস্বীকারোক্তি**: +এই ডকুমেন্টটি AI অনুবাদ সেবা [Co-op Translator](https://github.com/Azure/co-op-translator) ব্যবহার করে অনূদিত হয়েছে। আমরা যথাসাধ্য সঠিকতার জন্য চেষ্টা করি, তবুও দয়া করে মনে রাখবেন যে স্বয়ংক্রিয় অনুবাদে ত্রুটি বা অসঙ্গতি থাকতে পারে। মূল নথি তার স্বতন্ত্র ভাষায়ই কর্তৃপক্ষসুত্র হিসেবে বিবেচিত হওয়া উচিত। গুরুত্বপূর্ণ তথ্যের জন্য পেশাদার মানব অনুবাদের পরামর্শ দেওয়া হয়। এই অনুবাদের ব্যবহারে সৃষ্ট কোনো ভুলবোঝা বা ভুল ব্যাখ্যার জন্য আমরা দায়ী নই। \ No newline at end of file diff --git a/translations/mr/.co-op-translator.json b/translations/mr/.co-op-translator.json index 82982a580..527f6fa89 100644 --- a/translations/mr/.co-op-translator.json +++ b/translations/mr/.co-op-translator.json @@ -1,7 +1,7 @@ { "1-getting-started-lessons/1-intro-to-programming-languages/README.md": { - "original_hash": "d45ddcc54eb9232a76d08328b09d792e", - "translation_date": "2025-11-03T14:20:19+00:00", + "original_hash": "bec5e35642176d9e483552bfc82996d8", + "translation_date": "2026-03-06T17:35:28+00:00", "source_file": "1-getting-started-lessons/1-intro-to-programming-languages/README.md", "language_code": "mr" }, @@ -493,7 +493,7 @@ }, "AGENTS.md": { "original_hash": "a362efd06d64d4134a0cfe8515a86d34", - "translation_date": "2026-02-06T16:46:36+00:00", + "translation_date": "2026-03-06T17:44:47+00:00", "source_file": "AGENTS.md", "language_code": "mr" }, @@ -516,8 +516,8 @@ "language_code": "mr" }, "README.md": { - "original_hash": "6d6385fd098088cb2d690fb0a6cdaedc", - "translation_date": "2026-02-06T16:40:23+00:00", + "original_hash": "a2c9eed480687319517c08a6319e5536", + "translation_date": "2026-03-06T17:31:44+00:00", "source_file": "README.md", "language_code": "mr" }, diff --git a/translations/mr/1-getting-started-lessons/1-intro-to-programming-languages/README.md b/translations/mr/1-getting-started-lessons/1-intro-to-programming-languages/README.md index b99b61ebd..3375b696a 100644 --- a/translations/mr/1-getting-started-lessons/1-intro-to-programming-languages/README.md +++ b/translations/mr/1-getting-started-lessons/1-intro-to-programming-languages/README.md @@ -1,292 +1,382 @@ -# प्रोग्रामिंग भाषा आणि आधुनिक डेव्हलपर टूल्सची ओळख +# प्रोग्रामिंग भाषा आणि आधुनिक डेव्हलपर साधनांची ओळख -नमस्कार, भविष्यातील डेव्हलपर! 👋 तुम्हाला एक गोष्ट सांगू का जी मला रोज रोमांचित करते? तुम्ही आता शोध घेणार आहात की प्रोग्रामिंग ही फक्त संगणकांबद्दल नाही, तर तुमच्या सर्वात वेड्या कल्पना प्रत्यक्षात आणण्यासाठी सुपरपॉवर्स मिळवण्याबद्दल आहे! +हाय, भावी डेव्हलपर! 👋 मला तुला काहीतरी सांगू का जे मला दररोज थरकापून टाकते? तुला लवकरच कळेल की प्रोग्रामिंग हे फक्त संगणकांबद्दल नाही – तर ही खरी सुपरपॉवर आहे ज्यामुळे तू आपल्या कल्पनांना जिवंत करू शकतोस! -तुम्हाला तो क्षण आठवतो का जेव्हा तुम्ही तुमचा आवडता अ‍ॅप वापरत असता आणि सगळं अगदी परफेक्ट वाटतं? जेव्हा तुम्ही एखाद्या बटणावर टॅप करता आणि काहीतरी जादूई घडतं ज्यामुळे तुम्हाला वाटतं "अरे वा, त्यांनी हे कसं केलं?" तर, तुमच्यासारखाच कोणी तरी – कदाचित रात्री २ वाजता त्यांच्या आवडत्या कॉफी शॉपमध्ये तिसऱ्या एस्प्रेसोसोबत बसून – त्या जादूची निर्मिती करणारा कोड लिहिला. आणि आता तुम्हाला आश्चर्य वाटेल: या धड्याच्या शेवटी, तुम्हाला केवळ त्यांनी हे कसे केले ते समजेलच नाही तर तुम्हाला स्वतःच ते करण्याची इच्छा होईल! +तू जेव्हा तुझा आवडता अ‍ॅप वापरत असतोस आणि सर्व काही परफेक्ट बसते तेव्हा तुला तो क्षण आठवतो का? जेव्हा तू एखाद्या बटणावर टॅप करतोस आणि एखादी जादू घडते जिचं तू विचार करतोस "वा, त्यांनी ते कसं केलं?" बरं, त्या जादूचा कोड मी किंवा तूसारखा कोणीतरी लिहिला आहे – कदाचित २ वाजता कॉफी शॉपमध्ये बसून तिसर्‍या एस्प्रेसो सोबत! आणि हेच गमतीदार आहे: या धड्याच्या शेवटी तू फक्त समजून घेणार नाहीस की त्यांनी कसं केलं, तर स्वतः प्रयत्न करण्याची तीव्र इच्छा होईल! -पहा, जर तुम्हाला प्रोग्रामिंग सध्या थोडं कठीण वाटत असेल तर ते मी पूर्णपणे समजू शकतो. जेव्हा मी सुरुवात केली, तेव्हा मला खरंच वाटलं की तुम्हाला काही प्रकारचा गणिताचा तज्ज्ञ असायला हवा किंवा तुम्ही पाच वर्षांचे असल्यापासून कोडिंग करत असायला हवे. पण माझं मत पूर्णपणे बदललं तेव्हा मला समजलं की प्रोग्रामिंग ही नवीन भाषा शिकण्यासारखीच आहे. तुम्ही "नमस्कार" आणि "धन्यवाद" पासून सुरुवात करता, मग कॉफी ऑर्डर करण्यापर्यंत पोहोचता, आणि नंतर तुम्ही गहन तत्त्वज्ञानात्मक चर्चा करू लागता! फक्त या बाबतीत, तुम्ही संगणकांशी संवाद साधत आहात, आणि प्रामाणिकपणे? ते सर्वात संयमी संवाद भागीदार आहेत – ते तुमच्या चुका कधीच न्याय करत नाहीत आणि ते नेहमी पुन्हा प्रयत्न करण्यास उत्सुक असतात! +बघ, मला माहिती आहे, प्रोग्रामिंग सध्या अवघड वाटत असेल. मी जेव्हा सुरुवात केली तेव्हा मला वाटायचं की गणितात मस्तच तज्ञ असावा किंवा पाच वर्षांच्या वयापासूनच कोडिंग करत असावं लागेल. पण काहीतरी बदललं: प्रोग्रामिंग म्हणजे नवीन भाषा शिकण्यासारखं आहे. तू "हॅलो" आणि "थँक यू" पासून सुरुवात करतोस, मग कॉफी कशी मागायची यावर येतोस, आणि लवकरच गप्पा मोठ्या खोलवर चालायला लागतात! इथे तू संगणकांशी संवाद करतोस, आणि ते खूप धीर धरून ऐकणारे असतात – कुठल्याही चुका पाहून कधीही रागवत नाहीत आणि नेहमी पुन्हा प्रयत्न करायला तयार असतात! -आज, आपण आधुनिक वेब डेव्हलपमेंट शक्य होण्यासाठी आणि गंभीरपणे व्यसनाधीन होण्यासाठी अविश्वसनीय टूल्स एक्सप्लोर करणार आहोत. मी ज्या एडिटर्स, ब्राउझर्स आणि वर्कफ्लोजबद्दल बोलतोय, तेच टूल्स Netflix, Spotify आणि तुमच्या आवडत्या इंडी अ‍ॅप स्टुडिओचे डेव्हलपर्स दररोज वापरतात. आणि आता तुम्हाला आनंदाने नाचायला लावणारा भाग: या व्यावसायिक-ग्रेड, उद्योग-मानक टूल्सपैकी बहुतेक पूर्णपणे मोफत आहेत! +आज आपण आधुनिक वेब डेव्हलपमेंट सुलभ आणि अत्यंत आकर्षक बनणार्‍या अविश्वसनीय साधनांचा अभ्यास करणार आहोत. मी म्हणतोय नेमके असेच एडिटर्स, ब्राउझर्स आणि कार्यप्रवाह ज्यांचा वापर Netflix, Spotify आणि तुझ्या आवडत्या इंडी अ‍ॅप स्टुडिओमध्ये दररोज केला जातो. आणि ही बाब तुला आनंदाने नाचायला लावणार आहे: बहुतेक व्यावसायिक दर्जाच्या औद्योगिक प्रमाणित साधनांवर संपूर्णपणे मोफत उपलब्ध आहेत! -![प्रोग्रामिंगची ओळख](../../../../translated_images/mr/webdev101-programming.d6e3f98e61ac4bff.webp) -> स्केच नोट [Tomomi Imura](https://twitter.com/girlie_mac) यांनी तयार केले आहे +![Intro Programming](../../../../translated_images/mr/webdev101-programming.d6e3f98e61ac4bff.webp) +> स्केच नोट [टोमोमी इमुरा](https://twitter.com/girlie_mac) यांनी ```mermaid journey - title Your Programming Journey Today - section Discover - What is Programming: 5: You - Programming Languages: 4: You - Tools Overview: 5: You - section Explore - Code Editors: 4: You - Browsers & DevTools: 5: You - Command Line: 3: You - section Practice - Language Detective: 4: You - Tool Exploration: 5: You - Community Connection: 5: You + title तुमचा प्रोग्रामिंग प्रवास आज + section शोधा + प्रोग्रामिंग म्हणजे काय: 5: You + प्रोग्रामिंग भाषा: 4: You + उपकरणांचा आढावा: 5: You + section अन्वेषण करा + कोड संपादक: 4: You + ब्राउझर आणि डेव्हटूल्स: 5: You + कमांड लाइन: 3: You + section सराव करा + भाषा शोधक: 4: You + उपकरणांचा अन्वेषण: 5: You + समुदाय कनेक्शन: 5: You ``` +## चला पाहूया, तुला आधीपासून काय माहित आहे! -## पाहूया तुम्हाला आधीच काय माहित आहे! +मजेशीर गोष्टींकडे उडी मारण्याआधी, मला कुतूहल आहे – तुला या प्रोग्रामिंग जगाबद्दल आधीपासून काय माहित आहे? आणि ऐका, जर तुला या प्रश्नांकडे बघत "मला याबद्दल खरंच काहीच कल्पना नाही," असं वाटत असेल, तर ते बिलकुल ठीक आहे, अगदी परफेक्ट आहे! म्हणजे तू नक्कीच योग्य ठिकाणी आहेस. या क्विझला व्यायामापूर्वीच्या स्ट्रेचिंगसारखं समजा – आपण केवळ आपल्या मेंदूच्या स्नायूंना गरम करत आहोत! -मजेदार गोष्टींमध्ये उडी मारण्यापूर्वी, मला उत्सुकता आहे – तुम्हाला या प्रोग्रामिंग जगाबद्दल आधीच काय माहित आहे? आणि ऐका, जर तुम्ही या प्रश्नांकडे पाहत असाल आणि विचार करत असाल "मला याबद्दल काहीच माहिती नाही," तर ते फक्त ठीकच नाही, तर परफेक्ट आहे! याचा अर्थ तुम्ही अगदी योग्य ठिकाणी आहात. या क्विझला वर्कआउटच्या आधी स्ट्रेचिंगसारखे समजा – आपण फक्त त्या मेंदूच्या स्नायूंना गरम करत आहोत! +[प्रि-लेसन क्विझ घ्या](https://ff-quizzes.netlify.app/web/) -[प्री-लेसन क्विझ घ्या](https://forms.office.com/r/dru4TE0U9n?origin=lprLink) +## आपण एकत्र जाणार आहोत अशी साहसी यात्रा +ठीक आहे, मी खरोखरच उत्सुक आहे आपण आज काय शिकणार आहोत याबद्दल! खरंच, तुला आश्चर्य वाटेल जेव्हा काही संकल्पना तुझ्या मनात बसतील तेव्हा तुझा चेहरा कसा दिसेल. आपण एकत्र जाणार आहोत अशा अद्भुत प्रवासात: -## आपण एकत्र जाणार असलेल्या साहसाची झलक +- **प्रोग्रामिंग म्हणजे काय खरं तर (आणि हे का अतिशय छान आहे!)** – आपण शोधणार आहोत की कोड हे खरंच न दिसणं जादूचं सार आहे, जे तुझ्या आजूबाजूच्या प्रत्येक गोष्टींना ऊर्जा देतं, त्या अलार्मपासून ज्याला कळतं सोमवार आहे, तेथून ते अल्गोरिदमपर्यंत जो थेट तुझ्या Netflix शिफारशी अचूक बनवतो +- **प्रोग्रामिंग भाषा आणि त्यांची अद्भुत वैयक्तिक वैशिष्ट्ये** – एक पार्टीसमोर उभे राहण्यासारखं, जिथे प्रत्येक व्यक्तीकडे वेगळ्या प्रकारच्या सुपरपॉवर्स आणि समस्यांना सोडवण्याच्या पद्धती असतात. प्रोग्रामिंग भाषांचा एक असाच जग आहे, आणि तू त्यांच्याशी भेटायला तयार राह! +- **डिजिटल जादू घडवणारे मूलभूत घटक** – हे एका अतिशय क्रिएटिव्ह LEGO सेटसारखे आहेत. जेव्हा तुला कळेल की ही तुकडे कसे जुळवायचे, तेव्हा तू खरंच काहीही बांधू शकतोस जो तुझ्या कल्पनेत आला! +- **प्रोफेशनल टूल्स जे तुला जणू काही जादूगाराची छडी हातात दिल्यासारखा अनुभव देतील** – मी दृश्यमानपणे ड्रॅमॅटिक नाही आहे – ही साधने खरंच तुला सुपरपॉवरसारखा वाटतील, आणि तीच भारी गोष्ट आहे की हेच टूल्स प्रोफेशनल्स वापरतात! -ठीक आहे, मी आज आपण एक्सप्लोर करणार आहोत याबद्दल खरोखर उत्साहाने उडत आहे! खरंच, मला तुमचा चेहरा पाहायला आवडेल जेव्हा काही संकल्पना क्लिक होतील. आपण एकत्र घेत असलेल्या अविश्वसनीय प्रवासाची झलक येथे आहे: +> 💡 **महत्त्वाचं:** आज सगळं लक्षात ठेवण्याचा विचार करूही नकोस! सध्या, मला तुला फक्त शक्यतांचा उत्साह वाटावा एव्हा हवं आहे. तपशील नैसर्गिकपणे चिकटतील जेव्हा आपण एकत्र सराव करू – तसंच खरी शिकवण होते! -- **प्रोग्रामिंग म्हणजे काय (आणि ते का सर्वात थंड गोष्ट आहे!)** – आपण शोधणार आहोत की कोड हा अक्षरशः अदृश्य जादू आहे जो तुमच्याभोवती सर्वकाही चालवतो, त्या अलार्मपासून जो कसा तरी जाणतो की सोमवार सकाळ आहे ते Netflix वर तुमच्यासाठी परिपूर्ण शिफारसी तयार करणाऱ्या अल्गोरिदमपर्यंत -- **प्रोग्रामिंग भाषा आणि त्यांचे अद्भुत व्यक्तिमत्त्व** – कल्पना करा की तुम्ही अशा पार्टीत प्रवेश करत आहात जिथे प्रत्येक व्यक्तीला पूर्णपणे वेगळ्या सुपरपॉवर्स आणि समस्या सोडवण्याचे मार्ग आहेत. प्रोग्रामिंग भाषा जग असेच आहे, आणि तुम्हाला त्यांना भेटायला आवडेल! -- **डिजिटल जादू घडवणारे मूलभूत घटक** – यांना अंतिम क्रिएटिव्ह LEGO सेट समजा. एकदा तुम्हाला हे तुकडे कसे एकत्र बसतात हे समजले की तुम्हाला कळेल की तुम्ही अक्षरशः तुमच्या कल्पनेने स्वप्न पाहिलेली कोणतीही गोष्ट तयार करू शकता -- **व्यावसायिक टूल्स जे तुम्हाला जादूगाराचा जादूई काठी मिळाल्यासारखे वाटतील** – मी नाट्यमय होत नाही – ही टूल्स तुम्हाला खरोखर सुपरपॉवर्स असल्यासारखे वाटतील, आणि सर्वात चांगली गोष्ट? तीच टूल्स प्रोफेशनल्स वापरतात! +> हा धडा [Microsoft Learn](https://learn.microsoft.com/en-us/learn/modules/web-development-101/introduction-programming/?WT.mc_id=academic-77807-sagibbon) वरही घेऊ शकतो! -> 💡 **एक गोष्ट लक्षात ठेवा**: आज सर्वकाही लक्षात ठेवण्याचा प्रयत्न करू नका! सध्या, मला फक्त तुम्हाला काय शक्य आहे याबद्दल उत्साह वाटावा अशी इच्छा आहे. आपण एकत्र सराव करत असताना तपशील नैसर्गिकरित्या चिकटतील – खरी शिकवण अशीच होते! +## मग प्रोग्रामिंग म्हणजे काय? -> तुम्ही हा धडा [Microsoft Learn](https://docs.microsoft.com/learn/modules/web-development-101/introduction-programming/?WT.mc_id=academic-77807-sagibbon) वर घेऊ शकता! +बरं, चला हा लाखो डॉलर्सचा प्रश्न सोडवूया: प्रोग्रामिंग खरतर काय आहे? -## तर प्रोग्रामिंग नेमकं *काय* आहे? +मी एक गोष्ट सांगतो ज्यामुळे माझं याबद्दलचं विचार पूर्णपणे बदलला. गेल्या आठवड्यात मी माझ्या आईला आमच्या नवीन स्मार्ट टीव्ही रिमोट वापरायला सांगायचं प्रयत्न करत होतो. मी स्वतःला म्हणत होतो "लाल बटण दाब, पण मोठं लाल बटण नाही, डावीकडील छोटं लाल बटण... नाही, तुझा दुसरा डावा... ठीक आहे, आता ते दोन सेकंद धर, एक नाही, तीन नाही..." तुला हे सवयिनसारखं वाटलं का? 😅 -ठीक आहे, आपण लाखो डॉलरचा प्रश्न सोडवूया: प्रोग्रामिंग म्हणजे नेमकं काय? +तेच आहे प्रोग्रामिंग! अतिशय तपशीलवार, चरण-दर-चरण सूचनांचा कला, जे खूप सामर्थ्यशाली असलेल्या घटकाला दिल्या जातात पण सगळं अचूक लिहावं लागतं. आईला सांगण्याऐवजी (जी विचारू शकते "कोणतं लाल बटन?!"), आपण संगणकाला सांगतो (जो फक्त तेच करतो जे आपण सांगतो, जरी ते कदाचित आपण म्हणाल ते नसेल तरी). -मी तुम्हाला एक कथा सांगतो जी माझा विचार पूर्णपणे बदलून टाकली. गेल्या आठवड्यात, मी माझ्या आईला आमच्या नवीन स्मार्ट टीव्ही रिमोटचा वापर कसा करायचा ते समजावून सांगण्याचा प्रयत्न करत होतो. मी असे म्हणताना स्वतःला पकडले, "लाल बटण दाबा, पण मोठे लाल बटण नाही, डाव्या बाजूला असलेले छोटे लाल बटण... नाही, तुमचा दुसरा डावा... ठीक आहे, आता दोन सेकंदांसाठी धरून ठेवा, एक नाही, तीन नाही..." ओळखीच वाटतंय ना? 😅 +जेव्हा मी हे प्रथम शिकलो तेव्हा मला खरंच भास झालं: संगणक其实 बेसिकली फार सोपे असतात. ते फक्त दोन गोष्टी समजतात – १ आणि ०, म्हणजे "हो" आणि "नाही" किंवा "ऑन" आणि "ऑफ". इतकंच! पण जादू येथे सुरू होते – आम्हाला १ आणि ० मध्ये बोलायची गरज नाही जणू आपण मेट्रिक्समध्ये आहोत. या ठिकाणी **प्रोग्रामिंग भाषा** मदतीला येतात. त्या जणू असा जगातील सर्वोत्तम भाषांतरकार आहेत जे आपले मानवी विचार संगणकांच्या भाषेत रूपांतरित करतात. -हेच प्रोग्रामिंग आहे! ही एक कला आहे ज्यामध्ये तुम्ही अत्यंत तपशीलवार, पायरी-पायरीने सूचना देत असता अशा गोष्टीला जी खूप शक्तिशाली आहे पण तिला सर्वकाही परिपूर्णपणे सांगितले गेले पाहिजे. फक्त तुमच्या आईला समजावून सांगण्याऐवजी (जी विचारू शकते "कोणते लाल बटण?!"), तुम्ही संगणकाला समजावून सांगत असता (जो फक्त तुम्ही सांगितले तेच करतो, जरी तुम्ही जे सांगितले ते नेमके तुम्हाला म्हणायचे होते ते नसले तरी). +आणि ही गोष्ट जी दररोज सकाळी मला थरकत राहते: तुझ्या आयुष्यातील सर्व डिजिटल गोष्टी नेमक्या तुझ्यासारख्या कोणीतरी कोडिंग करत बनवल्या. तो Instagram फिल्टर जो तुला फॉललेस बनवतो? कोणी तो कोड केलेला. ती शिफारस जी तुला तुझा आवडता नवीन गाण्याकडे नेते? एक डेव्हलपरने ती अल्गोरिदम तयार केली. जी अ‍ॅप ज्यामुळे मित्रांमध्ये जेवणाचे बिल वाटायला मदत होते? होय, कोणीतरी विचार केला "हे कंटाळवाणं आहे, मी नक्की याला ठीक करू शकतो" आणि मग... त्यांनी काय केलं! -जेव्हा मी हे प्रथम शिकले तेव्हा मला जेव्हा कळले तेव्हा माझे मन उडाले: संगणक प्रत्यक्षात त्यांच्या मुळात खूप सोपे आहेत. त्यांना अक्षरशः फक्त दोन गोष्टी समजतात – 1 आणि 0, जे मूलत: "होय" आणि "नाही" किंवा "चालू" आणि "बंद" आहे. एवढंच! पण जिथे जादू होते तिथे – आपल्याला 1s आणि 0s मध्ये बोलण्याची गरज नाही जणू आपण The Matrix मध्ये आहोत. तिथे **प्रोग्रामिंग भाषा** मदतीला येतात. त्या तुमच्या सामान्य मानवी विचारांना संगणकाच्या भाषेत रूपांतरित करणारा जगातील सर्वोत्तम अनुवादक असल्यासारखे आहेत. +जेव्हा तू प्रोग्रामिंग शिकतोस, तू फक्त एक नवीन कौशल्य घेत नाहीस – तू या भव्य समस्यांवर मात करण्याऱ्या समुदायाचा भाग बनतोस ज्यांचे दिवस "जर मी काहीतरी तयार केला तर एखाद्याचा दिवस थोडासा अधिक उजळ होईल का?" म्हणून विचार करत जातात. खरंच, यापेक्षा छान काही असू शकतं का? -आणि येथे एक गोष्ट जी मला दररोज सकाळी उठल्यावर खरोखर रोमांचित करते: तुमच्या जीवनातील अक्षरशः *सर्वकाही* डिजिटल एखाद्या तुमच्यासारख्या व्यक्तीने सुरू केले, कदाचित त्यांच्या पायजामामध्ये कॉफीचा कप घेऊन, त्यांच्या लॅपटॉपवर कोड टाइप करत. तो Instagram फिल्टर जो तुम्हाला निर्दोष दिसायला लावतो? कोणीतरी तो कोड केला. ती शिफारस जी तुम्हाला तुमचा नवीन आवडता गाणं ऐकायला लावते? एखाद्या डेव्हलपरने तो अल्गोरिदम तयार केला. तो अ‍ॅप जो तुम्हाला मित्रांसोबत डिनर बिल्स विभाजित करण्यात मदत करतो? होय, कोणीतरी विचार केला "हे त्रासदायक आहे, मी हे ठीक करू शकतो" आणि मग... त्यांनी ते केले! +✅ **मजेशीर साचणी शोध:** जेव्हा तुला काही वेळ मिळेल तेव्हा ही गोष्ट शोध – जगातील पहिला संगणक प्रोग्रामर कोण होता? मी तुला एक हिन्ट देतो: तो कदाचित तुझ्या अपेक्षेप्रमाणे नसेल! त्या व्यक्तीचा कथानक खूप रोचक आहे आणि दाखवतो की प्रोग्रामिंग नेहमीच सर्जनशील समस्या सोडवण्याविषयी आणि वेगळ्या दृष्टीकोनातून विचार करण्याविषयी आहे. -जेव्हा तुम्ही प्रोग्रामिंग शिकता, तेव्हा तुम्ही फक्त नवीन कौशल्य मिळवत नाही – तुम्ही समस्या सोडवणाऱ्या या अविश्वसनीय समुदायाचा भाग बनत आहात जो त्यांचा दिवस "मी काहीतरी तयार करू शकतो का जे एखाद्याचा दिवस थोडा चांगला बनवेल?" विचार करण्यात घालवतो. प्रामाणिकपणे, त्यापेक्षा थंड काही आहे का? +### 🧠 **चेक-इन वेळ: तू कसा/कशी वाटत आहेस?** -✅ **मजेदार तथ्य शोधा**: तुम्हाला मोकळ्या वेळेत शोधण्यासाठी काहीतरी खूप छान सांगतो – तुम्हाला कोण वाटतं जगातील पहिला संगणक प्रोग्रामर होता? मी तुम्हाला एक हिंट देतो: ते तुम्ही अपेक्षित करत असाल असे नाही! या व्यक्तीमागील कथा अत्यंत आकर्षक आहे आणि दाखवते की प्रोग्रामिंग नेहमीच सर्जनशील समस्या सोडवणे आणि बॉक्सच्या बाहेर विचार करणे याबद्दल आहे. +**काही वेळ स्वतःशी विचार कर:** +- "संगणकांना सूचना देणे" ही कल्पना आता तुला समजते का? +- दिवसेंदिवस करावयाचे कोणते काम तुझ्या दृष्टीने प्रोग्रामिंगने स्वयंचलित करता येईल का? +- या संपूर्ण प्रोग्रामिंग विषयावर तुला काय प्रश्न मनात येत आहेत? -### 🧠 **चेक-इन वेळ: तुम्हाला कसे वाटते?** +> **लक्षात ठेव:** काही संकल्पना सध्या अस्पष्ट वाटणे अगदी सामान्य आहे. प्रोग्रामिंग शिकणं म्हणजे नवीन भाषा शिकण्यासारखं आहे – तुझे मेंदू त्या न्यूरल मार्गांना तयार करण्यासाठी वेळ घेतो. तू मस्त करत आहेस! -**थोडा वेळ घ्या आणि विचार करा:** -- "संगणकांना सूचना देणे" ही कल्पना आता तुम्हाला समजते का? -- तुम्ही प्रोग्रामिंगसह स्वयंचलित करू इच्छित असलेल्या दैनंदिन कामाचा विचार करू शकता का? -- या संपूर्ण प्रोग्रामिंग गोष्टीबद्दल तुमच्या मनात कोणते प्रश्न आहेत? +## प्रोग्रामिंग भाषा म्हणजे वेगवेगळ्या प्रकारच्या जादू सारख्या आहेत -> **लक्षात ठेवा**: काही संकल्पना सध्या अस्पष्ट वाटणे पूर्णपणे सामान्य आहे. प्रोग्रामिंग शिकणे ही नवीन भाषा शिकण्यासारखी आहे – तुमच्या मेंदूला त्या न्यूरल पथ तयार करण्यासाठी वेळ लागतो. तुम्ही उत्तम करत आहात! +ठीक आहे, हे थोडं वेगळं वाटेल पण माझ्या सोबत राहा – प्रोग्रामिंग भाषा म्हणजे वेगवेगळ्या प्रकारच्या संगीतासारखं आहे. विचार कर: तुझ्याकडे जाझ आहे, जी मृदू आणि तात्काळ संगीत स्वरूपाची आहे, रॉक जी शक्तिशाली आणि सरळ असते, क्लासिकल जी सुंदर आणि रचित आहे, आणि हिप-हॉप जी क्रिएटिव्ह आणि अभिव्यक्तीशील आहे. प्रत्येक शैलीची स्वतःची अदा, त्या समुदायातील चाहत्यांची पट्टी, आणि प्रत्येक काहीही भिन्न मूड किंवा प्रसंगी पूर्णपणे योग्य असते. -## प्रोग्रामिंग भाषा म्हणजे जादूचे वेगवेगळे स्वाद +प्रोग्रामिंग भाषा तसा कार्य करतात! एक वेगळी भाषा तेव्हा वापरली जाते जेव्हा तू मजेदार मोबाइल गेम बनवतोस आणि दुसरी भाषा मोठ्या प्रमाणातील हवामान डेटा प्रक्रिया करण्यासाठी वापरतोस, जसं आपल्याला योगा वर्गात डेथ मेटल बजवायचं नाही (बऱ्याच योगा वर्गांमध्ये तरी! 😄). -ठीक आहे, हे विचित्र वाटेल, पण माझ्यासोबत राहा – प्रोग्रामिंग भाषा वेगवेगळ्या प्रकारच्या संगीतासारख्या आहेत. विचार करा: तुम्हाला जाझ आहे, जे गुळगुळीत आणि इम्प्रोव्हायझेशनल आहे, रॉक जे शक्तिशाली आणि सरळ आहे, क्लासिकल जे मोहक आणि संरचित आहे, आणि हिप-हॉप जे सर्जनशील आणि अभिव्यक्त आहे. प्रत्येक शैलीला स्वतःचा मूड आहे, स्वतःचा उत्साही चाहत्यांचा समुदाय आहे, आणि प्रत्येक वेगवेगळ्या मूड्स आणि प्रसंगांसाठी परिपूर्ण आहे. - -प्रोग्रामिंग भाषा अगदी तशाच प्रकारे काम करतात! तुम्ही मोठ्या प्रमाणात हवामान डेटा क्रंच करण्यासाठी वापरलेली भाषा आणि मजेदार मोबाइल गेम तयार करण्यासाठी वापरलेली भाषा एकसारखी नसते, जसे तुम्ही योगा क्लासमध्ये डेथ मेटल वाजवणार नाही (ठीक आहे, बहुतेक योगा क्लासमध्ये तरी नाही! 😄). - -पण जेव्हा मी याबद्दल विचार करतो तेव्हा माझे मन पूर्णपणे उडते: या भाषा तुमच्यासोबत बसलेल्या जगातील सर्वात संयमी, प्रतिभावान दुभाष्यासारख्या आहेत. तुम्ही तुमच्या मानवी मेंदूसाठी नैसर्गिक वाटेल अशा प्रकारे तुमच्या कल्पना व्यक्त करू शकता, आणि ते सर्व अत्यंत जटिल काम हाताळतात जे संगणक प्रत्यक्षात बोलतात त्या 1s आणि 0s मध्ये अनुवादित करण्याचे आहे. हे असे आहे जणू तुमच्याजवळ एक मित्र आहे जो "मानवी सर्जनशीलता" आणि "संगणक तर्कशास्त्र" या दोन्ही गोष्टींमध्ये परिपूर्ण आहे – आणि त्यांना कधीच थकवा येत नाही, कधीच कॉफी ब्रेकची गरज नसते, आणि तुम्ही एकच प्रश्न दोनदा विचारल्याबद्दल कधीच न्याय करत नाहीत! +पण जेव्हा मी याबद्दल विचार करतो तेव्हा मला नेहमीच आश्चर्य वाटतं: या भाषा जणू सर्वात धीर धरून, प्रतिभावान अनुवादक अंगावर बसलेले आहेत. तू आपल्या नैसर्गिक मानवी मेंदूने विचार करू शकतोस आणि ते प्रचंड क्लिष्ट 1s आणि 0s मध्ये अनुवाद करतात जे संगणक स्पष्टपणे बोलतात. जणू तुझा सखा आहे जो दोन्ही "माणूस क्रिएटिव्हिटी" आणि "संगणकाचे तर्कशास्त्र" मध्ये पारंगत आहे – आणि तो/ती कधी थकते नाही, कधी कॉफी ब्रेक बाजूला ठेवत नाही आणि दोन वेळा विचारल्यावर कधीही तुझ्यावर खटाटोण करत नाही! ### लोकप्रिय प्रोग्रामिंग भाषा आणि त्यांचे उपयोग ```mermaid mindmap - root((Programming Languages)) - Web Development + root((प्रोग्रामिंग भाषा)) + वेब विकास JavaScript - Frontend Magic - Interactive Websites + फ्रंटेंड जादू + संवादात्मक वेबसाइट्स TypeScript - JavaScript + Types - Enterprise Apps - Data & AI + JavaScript + प्रकार + एंटरप्राइज अॅप्स + डेटा आणि AI Python - Data Science - Machine Learning - Automation + डेटा सायन्स + मशीन लर्निंग + ऑटोमेशन R - Statistics - Research - Mobile Apps + सांख्यिकी + संशोधन + मोबाइल अॅप्स Java - Android - Enterprise + अँड्रॉइड + एंटरप्राइज Swift iOS - Apple Ecosystem + ऍपल परिसंस्था Kotlin - Modern Android - Cross-platform - Systems & Performance + आधुनिक अँड्रॉइड + बहु-मंच + प्रणाली आणि कार्यक्षमता C++ - Games - Performance Critical + गेम्स + कार्यक्षमता महत्वाची Rust - Memory Safety - System Programming + स्मृती सुरक्षितता + प्रणाली प्रोग्रामिंग Go - Cloud Services - Scalable Backend + क्लाउड सेवा + प्रमाणक्षम बॅकएंड ``` +| भाषा | सर्वोत्तम वापर | का ही लोकप्रिय आहे | +|----------|---------------------|-------------------------| +| **JavaScript** | वेब डेव्हलपमेंट, वापरकर्ता इंटरफेस | ब्राउझरमध्ये चालतं आणि इंटरऍक्टिव्ह वेबसाईटना सामर्थ्य देतं | +| **Python** | डेटा सायन्स, ऑटोमेशन, AI | शिकायला आणि वाचायला सोपी, सामर्थ्यशाली लायब्ररी | +| **Java** | उद्योग अनुप्रयोग, अँड्रॉइड अ‍ॅप्स | प्लॅटफॉर्म-स्वतंत्र, मोठ्या सिस्टमसाठी मजबूत | +| **C#** | विंडोज अनुप्रयोग, गेम डेव्हलपमेंट | स्ट्रॉंग मायक्रोसॉफ्ट इकोसिस्टम सपोर्ट | +| **Go** | क्लाउड सेवा, बॅकएंड सिस्टम्स | जलद, साधी, आधुनिक संगणनासाठी डिझाइन केलेली | -| भाषा | सर्वोत्तम उपयोग | ती लोकप्रिय का आहे | -|------|----------------|--------------------| -| **JavaScript** | वेब डेव्हलपमेंट, युजर इंटरफेस | ब्राउझर्समध्ये चालते आणि इंटरॅक्टिव्ह वेबसाइट्स चालवते | -| **Python** | डेटा सायन्स, ऑटोमेशन, AI | वाचायला आणि शिकायला सोपी, शक्तिशाली लायब्ररी | -| **Java** | एंटरप्राइज अ‍ॅप्स, अँड्रॉइड अ‍ॅप्स | प्लॅटफॉर्म-स्वतंत्र, मोठ्या सिस्टमसाठी मजबूत | -| **C#** | विंडोज अ‍ॅप्स, गेम डेव्हलपमेंट | मजबूत Microsoft इकोसिस्टम सपोर्ट | -| **Go** | क्लाउड सर्व्हिसेस, बॅकएंड सिस्टम्स | वेगवान, सोपी, आधुनिक संगणनासाठी डिझाइन केलेली | +### उच्च-स्तरीय vs. नीच-स्तरीय भाषा -### उच्च-स्तरीय vs. निम्न-स्तरीय भाषा +ठीक आहे, हा खरंच मला एवढा गुंतवणारा विषय होता जेव्हा मी सुरुवात केली, म्हणून मी ती रूपक थोडक्यात शेअर करतो जी मला मग समजली – आणि मला आशा आहे ती तुलाही समजेल! -ठीक आहे, हे प्रामाणिकपणे ते संकल्पना होते ज्याने मला सुरुवातीला गोंधळात टाकले, म्हणून मी शेवटी मला समजलेली उपमा शेअर करतो – आणि मला खरोखर आशा आहे की ती तुम्हाला मदत करेल! +कल्पना कर की तू एका देशात आहेस जिथे भाषा तुझी नाही आणि तुला गर्दीतली जवळची शौचालय शोधायचं आहे (आपण सगळ्यांनी कधीतरी असं अनुभवलंय, बरोबर ना? 😅): -कल्पना करा की तुम्ही अशा देशात भेट देत आहात जिथे तुम्हाला भाषा बोलता येत नाही, आणि तुम्हाला अत्यंत गरजेने जवळचा बाथरूम शोधायचा आहे (आपण सर्व तिथे गेलो आहोत, बरोबर? 😅): +- **नीच-स्तरीय प्रोग्रामिंग** म्हणजे त्या देशातील स्थानिक बोली इतकी चांगली शिकणे की तिथल्या आजीला फळ विकणाऱ्या लोकांशी सांस्कृतिक संदर्भ, स्थानिक बोल चाल आणि त्यांचं खास विनोद वापरून गप्पा मारायला हरकत नाही. खूप प्रभावी आणि कार्यक्षम... जर तुला ती भाषा येत असेल तर! पण शौचालय शोधायचं होतं तर फारच भयंकर वाटेल. -- **निम्न-स्तरीय प्रोग्रामिंग** म्हणजे स्थानिक बोलीभाषा इतकी चांगली शिकणे की तुम्ही कोपऱ्यावर फळ विकणाऱ्या आजीशी सांस्कृतिक संदर्भ, स्थानिक शब्द आणि फक्त तेथे वाढलेल्या व्यक्तीला समजतील अशा अंतर्गत विनोदांचा वापर करून गप्पा मारू शकता. खूप प्रभावी आणि अविश्वसनीयपणे कार्यक्षम... जर तुम्ही प्रवाही असाल तर! पण तुम्ही फक्त बाथरूम शोधण्याचा प्रयत्न करत असाल तर खूपच गोंधळात टाकणारे. +- **उच्च-स्तरीय प्रोग्रामिंग** म्हणजे तो उत्तम स्थानिक मित्र ज्याला फक्त तुला हवं ते समजतं. तू "मला लगेच शौचालय हवं आहे" इंग्रजीत बोलतोस आणि तो सर्व सांस्कृतिक अनुवाद करतो आणि तुला मार्गदर्शन सोप्या भाषेत करतो. -- **उच्च-स्तरीय प्रोग्रामिंग** म्हणजे तुमच्याकडे तो अद्भुत स्थानिक मित्र आहे जो तुम्हाला फक्त समजतो. तुम्ही "मला खरोखर बाथरूम शोधायचा आहे" असे साध्या इंग्रजीत सांगू शकता, आणि ते सर्व सांस्कृतिक अनुवाद हाताळतात आणि तुम्हाला अशा प्रकारे दिशा देतात जी तुमच्या गैर-स्थानिक मेंदूसाठी परिपूर्ण अर्थ देतात. +प्रोग्रामिंग टर्म्समध्ये: +- **नीच-स्तरीय भाषा** (Assembly किंवा C सारखी) तुला संगणकाच्या हार्डवेअरशी अत्यंत तपशीलवार संवाद साधू देतात, पण तुला मशीनसारखं विचार करणं लागतं, जे... बरं, मोठा मेंदूचा बदल आहे! +- **उच्च-स्तरीय भाषा** (JavaScript, Python, किंवा C# सारख्या) तुला माणूस म्हणून विचार करायला देतात आणि तो संगणकांचा कान आणि आवाज होतात. तसेच, यांच्याकडे सध्या अनुभव नसलेल्या लोकांना मदत करण्यासाठी आनंदी समुदाय असतो ज्याला माहित असतं नवख्या असण्याचा अनुभव कसा असतो! -प्रोग्रामिंगच्या दृष्टीने: -- **निम्न-स्तरीय भाषा** (जसे Assembly किंवा C) तुम्हाला संगणकाच्या वास्तविक हार्डवेअरशी अविश्वसनीय तपशीलवार संवाद साधू देतात, पण तुम्हाला मशीनसारखे विचार करावे लागते, जे... ठीक आहे, आपण फक्त म्हणूया की ते एक मोठे मानसिक बदल आहे! -- **उच्च-स्तरीय भाषा** (जसे JavaScript, Python, किंवा C#) तुम्हाला मानवी विचार करण्यास परवानगी देतात तर ते सर्व मशीन-स्पीक मागे हाताळतात. याशिवाय, त्यांच्याकडे अशा अविश्वसनीय स्वागतार्ह समुदाय आहेत जे नवीन असण्याचा अनुभव लक्षात ठेवतात आणि खरोखर मदत करू इच्छितात! - -तुम्ही कोणत्या भाषांपासून सुरुवात करावी असे मी सुचवणार आहे? 😉 उच्च-स्तरीय भाषा म्हणजे प्रशिक्षण चाकांसारखे आहेत जे तुम्हाला कधीच काढून टाकायचे वाटत नाही कारण ते संपूर्ण अनुभव खूपच आनंददायक बनवतात! +काय वाटतं, मी तुला कोणत्या भाषांसह सुरुवात करण्याचा सल्ला देणार? 😉 उच्च-स्तरीय भाषा जणू ट्रेनींग व्हील्स प्रमाणे आहेत जे तू कधीही काढायचं इच्छित नाहीस कारण ते संपूर्ण अनुभव खूप मजेशीर करतात! ```mermaid flowchart TB - A["👤 Human Thought:
'I want to calculate Fibonacci numbers'"] --> B{Choose Language Level} + A["👤 मानवी विचार:
'मला फिबोनाची संख्या मोजायची आहे'"] --> B{भाषा पातळी निवडा} - B -->|High-Level| C["🌟 JavaScript/Python
Easy to read and write"] - B -->|Low-Level| D["⚙️ Assembly/C
Direct hardware control"] + B -->|उच्च-स्तरीय| C["🌟 JavaScript/Python
वाचायला आणि लिहायला सोपे"] + B -->|खालचा स्तर| D["⚙️ Assembly/C
थेट हार्डवेअर नियंत्रण"] - C --> E["📝 Write: fibonacci(10)"] - D --> F["📝 Write: mov r0,#00
sub r0,r0,#01"] + C --> E["📝 लिहा: fibonacci(10)"] + D --> F["📝 लिहा: mov r0,#00
sub r0,r0,#01"] - E --> G["🤖 Computer Understanding:
Translator handles complexity"] + E --> G["🤖 संगणक समज:
भाषांतरक गुंतागुंत हाताळतो"] F --> G - G --> H["💻 Same Result:
0, 1, 1, 2, 3, 5, 8, 13..."] + G --> H["💻 समान निकाल:
0, 1, 1, 2, 3, 5, 8, 13..."] style C fill:#e1f5fe style D fill:#fff3e0 style H fill:#e8f5e8 ``` +### तुला दाखवतो की उच्च-स्तरीय भाषा का जास्त स्नेही आहेत -### उच्च-स्तरीय भाषा अधिक मैत्रीपूर्ण का आहेत हे मी तुम्हाला दाखवतो +ठीक आहे, मी तुला काही दाखवणार आहे जे मला उच्च-स्तरीय भाषा का आवडल्या हे समजावेल, पण आधी एक वचन दे – जेव्हा तुझा पहिला कोड्स हे दाखवेल, घाबरू नकोस! हे थोडं भयंकर दिसावं असं मला वाटतं आणि हेच मुद्दा आहे! -ठीक आहे, मी तुम्हाला काहीतरी दाखवणार आहे जे उच्च-स्तरीय भाषांवर प्रेम करण्याचे कारण परिपूर्णपणे दर्शवते, पण आधी – मला तुमच्याकडून काहीतरी वचन हवे आहे. जेव्हा तुम्ही पहिला कोड उदाहरण पाहता, तेव्हा घाबरू नका! ते घ -- **टिप्पण्या**: उच्च-स्तरीय प्रोग्रामिंग भाषांमध्ये स्पष्ट स्पष्टीकरण देणाऱ्या टिप्पण्या लिहिण्याचा प्रोत्साहन दिला जातो, ज्यामुळे कोड स्वतःच दस्तऐवजीकरणासारखा वाटतो. -- **रचना**: JavaScript चा तर्कशुद्ध प्रवाह मानवी विचारसरणीशी जुळतो, जसे समस्या चरण-दर-चरण सोडवणे. -- **देखभाल**: वेगवेगळ्या गरजांसाठी JavaScript ची आवृत्ती अपडेट करणे सोपे आणि स्पष्ट आहे. +आपण दोन वेगळ्या शैलींमध्ये लिहिलेला तोच फिबोनाची अनुक्रम पाहणार आहोत – तो एक सुंदर गणितीय क्रम आहे जिथे प्रत्येक संख्या मागच्या दोन संख्यांचा योग आहे: 0, 1, 1, 2, 3, 5, 8, 13... (मजेशीर गोष्ट: तू हा क्रम निसर्गात सर्वत्र पाहशील – सूर्यफुलाच्या बिया, कंसाच्या नमुन्यात, अगदी आकाशगंगांच्या निर्मितीतही!) -✅ **फिबोनाची अनुक्रमाबद्दल**: हा अप्रतिम संख्यात्मक नमुना (जिथे प्रत्येक संख्या मागील दोन संख्यांच्या बेरीजसारखी असते: 0, 1, 1, 2, 3, 5, 8...) अक्षरशः *निसर्गात सर्वत्र* दिसतो! तुम्हाला तो सूर्यफुलांच्या वर्तुळांमध्ये, पाइनकोनच्या नमुन्यांमध्ये, नॉटिलस शंखाच्या वक्रांमध्ये, आणि झाडांच्या फांद्या कशा वाढतात यामध्येही सापडेल. गणित आणि कोड कसे निसर्गाच्या सौंदर्य निर्माण करण्याच्या नमुन्यांना समजून घेण्यास आणि पुन्हा तयार करण्यास मदत करू शकतात हे खरोखर आश्चर्यकारक आहे! +तयार आहेस फरक पाहायला? चल! -## जादू घडवणारे मूलभूत घटक +**उच्च-स्तरीय भाषा (JavaScript) – माणसासाठी सुलभ:** -ठीक आहे, आता तुम्ही प्रोग्रामिंग भाषांचे प्रत्यक्षात कसे दिसते ते पाहिले आहे, चला प्रत्येक प्रोग्राममध्ये असलेल्या मूलभूत तुकड्यांचे विश्लेषण करूया. यांना तुमच्या आवडत्या रेसिपीच्या आवश्यक घटकांसारखे समजा – एकदा तुम्हाला प्रत्येकाचा उपयोग समजला की, तुम्ही कोणत्याही भाषेत कोड वाचू आणि लिहू शकता! +```javascript +// टप्पा 1: मूलभूत फिबोनॅची सेटअप +const fibonacciCount = 10; +let current = 0; +let next = 1; -हे प्रोग्रामिंगच्या व्याकरणासारखे आहे. शाळेत तुम्ही नाम, क्रियापद, आणि वाक्य कसे तयार करायचे ते शिकले होते का? प्रोग्रामिंगचे स्वतःचे व्याकरण आहे, आणि प्रामाणिकपणे सांगायचे तर, इंग्रजी व्याकरणापेक्षा ते अधिक तर्कसंगत आणि सोपे आहे! 😄 +console.log('Fibonacci sequence:'); +``` -### स्टेटमेंट्स: चरण-दर-चरण सूचना +**हा कोड काय करतो:** +- **घोषणा** करतो की आपल्याला किती फिबोनाची संख्या तयार करायच्या आहेत +- **दोन व्हेरिएबल्स** सुरू करतो जे चालू आणि पुढच्या संख्यांवर लक्ष ठेवतात +- **सुरुवातीच्या मूल्यांना सेट** करतो (0 आणि 1) जे फिबोनाची पॅटर्न निश्चित करतात +- **हेडर संदेश** प्रदर्शित करतो जे आपल्या आउटपुटची ओळख पटवतो -चला **स्टेटमेंट्स** पासून सुरुवात करूया – हे तुमच्या संगणकाशी संवादातील वैयक्तिक वाक्यांसारखे आहेत. प्रत्येक स्टेटमेंट संगणकाला एक विशिष्ट गोष्ट करण्यास सांगते, जसे की दिशा देणे: "इथे डावीकडे वळा," "लाल दिव्यावर थांबा," "त्या जागेत पार्क करा." +```javascript +// टप्पा 2: लूपसह अनुक्रम तयार करा +for (let i = 0; i < fibonacciCount; i++) { + console.log(`Position ${i + 1}: ${current}`); + + // अनुक्रमातील पुढचा क्रमांक गणना करा + const sum = current + next; + current = next; + next = sum; +} +``` -स्टेटमेंट्सबद्दल मला आवडते ते म्हणजे ते सहसा वाचण्यास सोपे असतात. हे पहा: +**येथे काय घडत आहे याचे विश्लेषण:** +- `for` लूप वापरून अनुक्रमातील प्रत्येक स्थानावर फेरफटका मारतो +- टेम्प्लेट लिटरल फॉरमॅटिंगने प्रत्येक संख्या त्याच्या स्थानासहित दर्शवितो +- चालू आणि पुढच्या मूल्यांच्या बेरीजने पुढची फिबोनाची संख्या गणना करतो +- आपले ट्रॅकिंग व्हेरिएबल्स पुढील फेरफटक्यासाठी अपडेट करतो ```javascript -// Basic statements that perform single actions +// पाऊल 3: आधुनिक कार्यात्मक पध्दत +const generateFibonacci = (count) => { + const sequence = [0, 1]; + + for (let i = 2; i < count; i++) { + sequence[i] = sequence[i - 1] + sequence[i - 2]; + } + + return sequence; +}; + +// वापराचे उदाहरण +const fibSequence = generateFibonacci(10); +console.log(fibSequence); +``` + +**वर उल्लेखलेल्या मध्ये आपण:** +- आधुनिक अ‍ॅरो फंक्शन सिंटॅक्स वापरून पुनर्वापर करण्यार्‍या फंक्शनची निर्मिती केली +- संपूर्ण अनुक्रम साठवण्यासाठी एक ऍरे तयार केला, एकेका नंबरला वेगळं प्रदर्शित न करता +- मागील मूल्यांचा वापर करून प्रत्येक नवीन नंबर गणकासाठी ऍरे इंडेक्सिंग केली +- आमच्या प्रोग्रामच्या इतर भागांत लवचिक वापरासाठी संपूर्ण अनुक्रम परत केला + +**नीच-स्तरीय भाषा (ARM Assembly) – संगणकासाठी सुसंगत:** + +```assembly + area ascen,code,readonly + entry + code32 + adr r0,thumb+1 + bx r0 + code16 +thumb + mov r0,#00 + sub r0,r0,#01 + mov r1,#01 + mov r4,#10 + ldr r2,=0x40000000 +back add r0,r1 + str r0,[r2] + add r2,#04 + mov r3,r0 + mov r0,r1 + mov r1,r3 + sub r4,#01 + cmp r4,#00 + bne back + end +``` + +पाहा, JavaScript आवृत्ती जवळजवळ इंग्रजी निर्देशांसारखी वाचते, तर Assembly आवृत्तीमध्ये गूढ आज्ञा आहेत ज्या थेट संगणकाच्या प्रोसेसरवर नियंत्रण ठेवतात. दोन्ही एकच काम करतात, पण उच्च-स्तरीय भाषा मानवी समजण्यासाठी, लिहिण्यासाठी आणि राखण्या साठी सोपी आहे. + +**मुख्य फरक जे तुला लक्षात येतील:** +- **वाचनीयता**: JavaScript मध्ये सारखे नाव `fibonacciCount` वापरले जाते, तर Assembly मध्ये गूढ टॅग्ज जसे `r0`, `r1` वापरले जातात +- **टिप्पण्या**: उच्च-स्तरीय भाषा स्पष्टीकरणात्मक टिप्पणी प्रोत्साहित करतात ज्यामुळे कोड स्वतःचा दस्तऐवज बनतो +- **रचना**: JavaScript चे तर्कशास्त्रीय प्रवाह माणसांच्या विचारप्रक्रियेप्रमाणे क्रमवारीतल्या टप्यांनुसार जुळतो +- **देखभाल**: वेगवेगळ्या गरजांसाठी JavaScript आवृत्ती अद्यतन करणे सोपे आणि स्पष्ट असते + +✅ **फिबोनाची अनुक्रमाबद्दल**: हा अत्यंत सुंदर संख्या नमुना (जिथे प्रत्येक संख्या दोन मागील संख्या बेरीज असते: 0, 1, 1, 2, 3, 5, 8...) निसर्गात अक्षरशः *सर्वत्र* दिसतो! तुम्हाला तो सूर्यफूलांच्या वर्तुळात, देवदाराच्या कळीच्या नमुन्यात, नॉटिलस शंखाच्या वाकण्यात, आणि अगदी वृक्षांच्या फांद्यांच्या वाढीतही दिसेल. गणित आणि कोड कसे आपणास निसर्गात वापरलेल्या नमुन्यांना समजून घेण्यास आणि पुनरुज्जीवित करण्यास मदत करतात हे पाहणं खूप आश्चर्यकारक आहे! + +## जादू घडवणारे मूलभूत घटक + +ठीक आहे, आता तुम्ही प्रोग्रामिंग भाषा कसे दिसतात ते पाहिलात, तर चला अक्षरशः प्रत्येक कोडमध्ये असणाऱ्या मूलभूत तुकड्यांचा तफावत करुया. हे तुमच्या आवडत्या रेसिपीमधल्या आवश्यक घटकांसारखे समजा – जेव्हा तुम्हाला ते काय करतात हे समजेल, तेव्हा तुम्ही कुठल्याही भाषेमध्ये कोड वाचू आणि लिहू शकाल! + +हे प्रोग्रामिंगची व्याकरण शिकण्यासारखे आहे. आठवा शाळेत जेव्हा तुम्ही नाम, क्रियापद, आणि वाक्य कसे तयार करायचे ते शिकलात? प्रोग्रामिंगचेही स्वतःचे व्याकरण आहे, आणि खरंच ते इंग्रजी व्याकरणापेक्षा खूप अधिक तर्कशुद्ध आणि मोकळे आहे! 😄 + +### विधान: टप्प्यानुसार सूचना + +चला **विधानांपासून** सुरुवात करूया – हे तुमच्या संगणकाशी संवादातील वैयक्तिक वाक्यांसारखे आहेत. प्रत्येक विधान संगणकाला एक विशिष्ट काम करण्यास सांगते, जसे "येथे डावीकडे वळा," "लाल दिव्यावर थांबा," "त्या जागी पार्क करा." + +मला विधानांबद्दल जे आवडते ते म्हणजे त्यांची वाचनीयता. हा पहा: + +```javascript +// मूलभूत विधान जी एकल क्रिया करतात const userName = "Alex"; console.log("Hello, world!"); const sum = 5 + 3; ``` - -**या कोडने काय केले आहे:** -- **घोषणा करा**: वापरकर्त्याचे नाव साठवण्यासाठी स्थिर व्हेरिएबल तयार करा -- **प्रदर्शित करा**: कन्सोल आउटपुटवर अभिवादन संदेश -- **गणना करा**: गणितीय ऑपरेशनचा परिणाम साठवा + +**हा कोड काय करतो:** +- वापरकर्त्याचे नाव संग्रहित करण्यासाठी एक स्थिर चल जाहीर करा +- कन्सोल आउटपुटमध्ये अभिवादन संदेश दर्शवा +- एक गणितीय क्रिया करून निकाल संग्रहित करा ```javascript -// Statements that interact with web pages +// वेब पृष्ठांशी संवाद साधणारे स्टेटमेंट्स document.title = "My Awesome Website"; document.body.style.backgroundColor = "lightblue"; ``` + +**टप्प्यानुसार काय घडत आहे:** +- ब्राउझर टॅबमधील वेबपेज शीर्षक बदला +- संपूर्ण पृष्ठाच्या पार्श्वभूमीचा रंग बदला -**चरण-दर-चरण काय घडते:** -- **वेबपेजचे शीर्षक बदला** जे ब्राउझर टॅबमध्ये दिसते -- **पृष्ठाच्या पार्श्वभूमीचा रंग बदला** - -### व्हेरिएबल्स: तुमच्या प्रोग्रामचे मेमरी सिस्टम +### चल (Variables): तुमच्या प्रोग्रॅमची स्मृती प्रणाली -ठीक आहे, **व्हेरिएबल्स** शिकवणे माझ्या आवडत्या संकल्पनांपैकी एक आहे कारण ते तुम्ही दररोज वापरत असलेल्या गोष्टींसारखे आहेत! +ठीक आहे, **चल** हा माझ्या शिकवायच्या आवडत्या संकल्पनांपैकी एक आहे कारण ते रोज तुम्ही वापरत असलेल्या गोष्टींसारखे आहेत! -तुमच्या फोनच्या संपर्क यादीबद्दल विचार करा. तुम्ही प्रत्येकाचा फोन नंबर लक्षात ठेवत नाही – त्याऐवजी, तुम्ही "आई," "सर्वात चांगला मित्र," किंवा "पिझ्झा प्लेस जो रात्री २ वाजेपर्यंत डिलिव्हरी करतो" असे नाव सेव्ह करता आणि तुमचा फोन प्रत्यक्ष नंबर लक्षात ठेवतो. व्हेरिएबल्स अगदी तसेच काम करतात! ते लेबल असलेल्या कंटेनरसारखे आहेत जिथे तुमचा प्रोग्राम माहिती साठवू शकतो आणि नंतर अर्थपूर्ण नाव वापरून ती परत मिळवू शकतो. +तुमच्या फोनच्या संपर्क यादीबद्दल विचार करा. तुम्ही प्रत्येकाचा फोन नंबर लक्षात ठेवत नाही – त्याऐवजी "आई," "सर्वोत्तम मित्र," किंवा "रात्री २ वाजेपर्यंत पिझ्झा देणारे ठिकाण" अशी नावे संग्रहित करता आणि फोन वास्तविक नंबर लक्षात ठेवतो. चलही अगदी तसेच कार्य करतात! ते लेबल केलेले कंटेनरसारखे असतात जेथे तुमच्या प्रोग्रॅमला माहिती संग्रहित करता येते आणि नंतर नाव वापरून ती परत मिळवू शकतो. -यात खरोखर छान गोष्ट आहे: प्रोग्राम चालू असताना व्हेरिएबल्स बदलू शकतात (म्हणूनच त्यांना "व्हेरिएबल्स" म्हणतात – पाहा त्यांनी काय केले!). जसे तुम्ही त्या पिझ्झा प्लेसचा संपर्क अपडेट करू शकता जेव्हा तुम्हाला त्यापेक्षा चांगले ठिकाण सापडते, तसेच प्रोग्राम नवीन माहिती शिकत असताना किंवा परिस्थिती बदलत असताना व्हेरिएबल्स अपडेट होऊ शकतात! +हे खूपच छान आहे: चल प्रोग्रॅम चालू असताना बदलू शकतात (म्हणून त्यांना "variables" म्हणतात – समजले का?). जसे तुम्ही नवीन काहीतरी शोधल्यावर पिझ्झा पॅलेसचा संपर्क अपडेट करता तसेच, चल नवीन माहिती मिळाल्यावर किंवा परिस्थिती बदलल्यावर अपडेट होतील! -मला तुम्हाला हे किती सोपे असते ते दाखवू द्या: +हे कसे सोपे आणि सुंदर आहे ते दाखवू: ```javascript -// Step 1: Creating basic variables +// टप्पा 1: मूलभूत चल तयार करणे const siteName = "Weather Dashboard"; let currentWeather = "sunny"; let temperature = 75; let isRaining = false; ``` - -**या संकल्पना समजून घ्या:** -- **स्थिर मूल्ये साठवा** `const` व्हेरिएबल्समध्ये (जसे साइटचे नाव) -- **`let` वापरा** जेव्हा मूल्ये प्रोग्राममध्ये बदलू शकतात -- **वेगवेगळ्या डेटा प्रकारांना असाइन करा**: स्ट्रिंग्स (मजकूर), संख्या, आणि बूलियन (सत्य/असत्य) -- **वर्णनात्मक नावे निवडा** जी प्रत्येक व्हेरिएबलमध्ये काय आहे ते स्पष्ट करतात + +**ही संकल्पना समजून घ्या:** +- `const` मध्ये अपरिवर्तनीय मूल्य संग्रहित करा (जसे साइट नाव) +- जे बदलू शकतात अशा मूल्यांसाठी `let` वापरा +- भिन्न डेटा प्रकार सांगा: स्ट्रिंग (टेक्स्ट), संख्या, आणि बुलियन (खरे/खोटे) +- वर्णनात्मक नावे निवडा जी प्रत्येक चलात काय आहे ते स्पष्ट करतात ```javascript -// Step 2: Working with objects to group related data +// पाऊल 2: संबंधित डेटाला गटबद्ध करण्यासाठी ऑब्जेक्टसह काम करणे const weatherData = { location: "San Francisco", humidity: 65, windSpeed: 12 }; ``` - -**वरीलमध्ये आम्ही:** -- **ऑब्जेक्ट तयार केला** संबंधित हवामान माहिती एकत्रित करण्यासाठी -- **एकाच व्हेरिएबल नावाखाली** अनेक डेटा तुकडे व्यवस्थित केले -- **की-वॅल्यू जोड्या वापरल्या** प्रत्येक माहितीचा तुकडा स्पष्टपणे लेबल करण्यासाठी + +**वरील मध्ये, आम्ही:** +- संबंधित हवामान माहिती एकत्र करण्यासाठी एक ऑब्जेक्ट तयार केला +- अनेक डेटा तुकडे एका चलाखाली आयोजित केले +- प्रत्येक माहितीचा स्पष्ट लेबल करणारे की-वॅल्यू जोडले ```javascript -// Step 3: Using and updating variables +// टप्पा 3: बदलणाऱ्या चलांचा वापर आणि अद्यतन करणे console.log(`${siteName}: Today is ${currentWeather} and ${temperature}°F`); console.log(`Wind speed: ${weatherData.windSpeed} mph`); -// Updating changeable variables +// बदलण्यायोग्य चल अद्यतनित करणे currentWeather = "cloudy"; temperature = 68; ``` - -**प्रत्येक भाग समजून घेऊया:** -- **माहिती प्रदर्शित करा** टेम्पलेट लिटरल्स वापरून `${}` सिंटॅक्ससह -- **ऑब्जेक्ट प्रॉपर्टीज ऍक्सेस करा** डॉट नोटेशन (`weatherData.windSpeed`) वापरून -- **`let` ने घोषित केलेल्या व्हेरिएबल्स अपडेट करा** बदलत्या परिस्थितीचे प्रतिबिंबित करण्यासाठी -- **अनेक व्हेरिएबल्स एकत्र करा** अर्थपूर्ण संदेश तयार करण्यासाठी + +**प्रत्येक भाग समजून घेऊ:** +- `${}` टेम्पलेट लिटरल्स वापरून माहिती दर्शवा +- डॉट नोटेशन (`weatherData.windSpeed`) वापरून ऑब्जेक्टच्या गुणधर्मांपर्यंत पोहोचा +- `let` मध्ये जाहीर केलेले चल अद्यतनित करा जे बदलत्या परिस्थिती दर्शवते +- अनेक चल एकत्र करून अर्थपूर्ण संदेश तयार करा ```javascript -// Step 4: Modern destructuring for cleaner code +// चरण ४: स्वच्छ कोडसाठी आधुनिक विघटन const { location, humidity } = weatherData; console.log(`${location} humidity: ${humidity}%`); ``` + +**तुम्हाला काय माहिती असणे आवश्यक आहे:** +- ऑब्जेक्टमधून विशिष्ट गुणधर्म डेस्ट्रक्चरिंग असाइनमेंट वापरून काढा +- ऑब्जेक्ट कींसारखी नावे असणारे नवीन चल स्वयंचलितपणे तयार करा +- पुनरावृत्ती होणारे डॉट नोटेशन टाळून कोड सुलभ करा -**तुम्हाला काय माहित असणे आवश्यक आहे:** -- **ऑब्जेक्टमधून विशिष्ट प्रॉपर्टीज काढा** डीस्ट्रक्चरिंग असाइनमेंट वापरून -- **नवीन व्हेरिएबल्स आपोआप तयार करा** ऑब्जेक्ट कीसारख्या नावांसह -- **कोड सोपा करा** पुनरावृत्ती डॉट नोटेशन टाळून - -### कंट्रोल फ्लो: तुमच्या प्रोग्रामला विचार करायला शिकवा +### नियंत्रण प्रवाह: तुमच्या प्रोग्रामला विचार करायला शिकवा -ठीक आहे, इथे प्रोग्रामिंग खरोखर आश्चर्यकारक होते! **कंट्रोल फ्लो** म्हणजे तुमच्या प्रोग्रामला हुशार निर्णय घेण्यास शिकवणे, अगदी तुम्ही दररोज विचार न करता करत असलेल्या गोष्टींसारखे. +ठीक आहे, प्रोग्रामिंग खरोखरच आश्चर्यकारक ठरत आहे! **कंट्रोल फ्लो** म्हणजे तुमच्या प्रोग्रामला हुशार निर्णय घ्यायला शिकवणे, अगदी तुम्ही दिवसेंदिवस न विचारता जे करत असता तसंच. -कल्पना करा: आज सकाळी तुम्ही कदाचित असे काहीतरी केले असेल "जर पाऊस पडत असेल तर छत्री घेईन. जर थंडी असेल तर जॅकेट घालीन. जर उशीर होत असेल तर नाश्ता टाळीन आणि वाटेत कॉफी घेईन." तुमचा मेंदू नैसर्गिकरित्या ही if-then लॉजिक दररोज डझनभर वेळा अनुसरतो! +या कल्पनेचा विचार करा: आज सकाळी कदाचित तुम्ही "जर पाऊस येत असेल तर मी छत्री घेईन. जर थंडी असेल तर जॅकेट घालीन. जर उशीर झाला तर नाश्ता सोडून कॉफी घेईन" असं ठरवलं असेल. तुमचा मेंदू रोज शेकडो वेळा या if-then लॉजिकचा वापर करतो! -यामुळे प्रोग्राम्स हुशार आणि जिवंत वाटतात, फक्त काही कंटाळवाण्या, अंदाजानुसार स्क्रिप्टचे अनुसरण करण्याऐवजी. ते प्रत्यक्षात परिस्थिती पाहू शकतात, काय घडत आहे ते मूल्यांकन करू शकतात, आणि योग्य प्रतिसाद देऊ शकतात. हे तुमच्या प्रोग्रामला अनुकूल होण्यास आणि निवडी करण्यास मेंदू देण्यासारखे आहे! +हेच प्रोग्राम्सना हुशार आणि जिवंत वाटण्यास कारणीभूत ठरते, फक्त कंटाळवाणा, पूर्वकल्पित स्क्रिप्ट प्रमाणे नाही. ते प्रत्यक्षात परिस्थिती बघून, काय सुरू आहे ते मूल्यांकन करून, योग्य प्रतिसाद देतात. जणू एखाद्या मेंदूची भुमिका तुमच्या प्रोग्रामला दिली आहे जो परिस्थितीनुसार निर्णय घेतो! -हे किती सुंदरपणे कार्य करते ते पाहायचे आहे का? मला तुम्हाला दाखवू द्या: +हे कसे सुंदर काम करते ते बघूया: ```javascript -// Step 1: Basic conditional logic +// टप्पा 1: मूलभूत सशर्त तर्कशास्त्र const userAge = 17; if (userAge >= 18) { @@ -296,15 +386,15 @@ if (userAge >= 18) { console.log(`You'll be able to vote in ${yearsToWait} year(s).`); } ``` - -**या कोडने काय केले आहे:** -- **तपासा** की वापरकर्त्याचे वय मतदानाच्या अटींना पूर्ण करते का -- **वेगवेगळे कोड ब्लॉक्स चालवा** अटींच्या निकालावर आधारित -- **गणना करा** आणि मतदानाच्या पात्रतेसाठी किती वेळ बाकी आहे ते प्रदर्शित करा (जर वय १८ पेक्षा कमी असेल) -- **प्रत्येक परिस्थितीसाठी विशिष्ट, उपयुक्त अभिप्राय द्या** + +**हा कोड काय करतो:** +- वापरकर्त्याच्या वयाची मतदानासाठी पात्रता तपासा +- अटीच्या परिणामानुसार विविध कोड ब्लॉक्स चालवा +- १८ पेक्षा कमी असल्यास मतदान पात्र होईपर्यंत किती वेळ लागेल हे गणना करा आणि दर्शवा +- प्रत्येक परिस्थितीसाठी विशेष, उपयुक्त अभिप्राय द्या ```javascript -// Step 2: Multiple conditions with logical operators +// टप्पा 2: लॉजिकल ऑपरेटरसह अनेक अटी const userAge = 17; const hasPermission = true; @@ -316,26 +406,26 @@ if (userAge >= 18 && hasPermission) { console.log("Sorry, you must be at least 16 years old."); } ``` - -**इथे काय घडते ते समजून घ्या:** -- **अनेक अटी एकत्र करा** `&&` (आणि) ऑपरेटर वापरून -- **अटींची श्रेणी तयार करा** `else if` वापरून अनेक परिस्थितींसाठी -- **सर्व शक्य परिस्थिती हाताळा** अंतिम `else` स्टेटमेंटसह -- **प्रत्येक वेगळ्या परिस्थितीसाठी स्पष्ट, कृतीक्षम अभिप्राय द्या** + +**येथे काय घडते ते तपासूया:** +- `&&` (आणि) ऑपरेटर वापरून अनेक अटी एकत्र करा +- अनेक परिस्थितींसाठी `else if` ने अटींचे श्रेणीकरण करा +- अंतिम `else` विधानाद्वारे सर्व शक्य परिस्थिती हाताळा +- प्रत्येक वेगवेगळ्या परिस्थितीसाठी स्पष्ट आणि कृतीक्षम अभिप्राय द्या ```javascript -// Step 3: Concise conditional with ternary operator +// पाऊल 3: टर्नरी ऑपरेटरसह संक्षिप्त अटीसंगत विधान const votingStatus = userAge >= 18 ? "Can vote" : "Cannot vote yet"; console.log(`Status: ${votingStatus}`); ``` - -**तुम्हाला लक्षात ठेवायचे आहे:** -- **टर्नरी ऑपरेटर (`? :`) वापरा** सोप्या दोन-पर्याय अटींसाठी -- **अटी प्रथम लिहा**, त्यानंतर `?`, मग सत्य परिणाम, मग `:`, मग असत्य परिणाम -- **हा नमुना लागू करा** जेव्हा तुम्हाला अटींवर आधारित मूल्ये असाइन करायची असतात + +**लक्षात ठेवा:** +- सोप्या दोन पर्यायांसाठी टर्नरी ऑपरेटर (`? :`) वापरा +- प्रथम अट लिहा, त्यानंतर `?`, योग्य परिणाम, `:` आणि नकारात्मक परिणाम लिहा +- मूल्ये अटींवर आधारित असाइन करताना हा नमुना वापरा ```javascript -// Step 4: Handling multiple specific cases +// पाऊल ४: अनेक विशिष्ट प्रकरणांचे हाताळणी const dayOfWeek = "Tuesday"; switch (dayOfWeek) { @@ -354,58 +444,57 @@ switch (dayOfWeek) { console.log("Invalid day of the week"); } ``` + +**हा कोड काय साध्य करतो:** +- चल मूल्य अनेक विशिष्ट प्रकरणांशी जुळवा +- समान प्रकरणे (कार्यदिवस विरुद्ध विकेंड) एकत्र करा +- जुळणारी कोड ब्लॉक चालवा +- अनपेक्षित मूल्ये हाताळण्यासाठी `default` केस समाविष्ट करा +- पुढील प्रकरणाकडे जाण्यास `break` वापरा -**हा कोड खालील गोष्टी साध्य करतो:** -- **व्हेरिएबल मूल्य अनेक विशिष्ट प्रकरणांशी जुळवा** -- **समान प्रकरणे एकत्र करा** (सप्ताहाचे दिवस विरुद्ध शनिवार व रविवार) -- **जुळणारे कोड ब्लॉक चालवा** जेव्हा जुळणारे मूल्य सापडते -- **अप्रत्याशित मूल्ये हाताळण्यासाठी `default` केस समाविष्ट करा** -- **`break` स्टेटमेंट्स वापरा** पुढील प्रकरणाकडे जाणे टाळण्यासाठी +> 💡 **खरेदारी जीवनातील उपमा:** नियंत्रण प्रवाह म्हणजे जगातील आनंदी GPS जसे तुम्हाला दिशा सांगत असते. "जर मेन स्ट्रीटवर ट्राफिक असेल तर महामार्ग घ्या. जर रस्त्यावरील बांधकामामुळे महामार्ग आवरला असेल तर नयनरम्य मार्ग वापरा." प्रोग्राम्सही याच प्रकारची अटींची लॉजिक वापरतात वेगवेगळ्या परिस्थितींसाठी हुशार प्रतिसाद देण्यासाठी आणि वापरकर्त्यांना सर्वोत्तम अनुभव देण्यासाठी. -> 💡 **वास्तविक जीवनातील उपमा**: कंट्रोल फ्लोला जगातील सर्वात संयमी जीपीएससारखे समजा जे तुम्हाला दिशा देत आहे. ते म्हणू शकते "जर मेन स्ट्रीटवर ट्रॅफिक असेल तर हायवे घ्या. जर हायवेवर बांधकाम चालू असेल तर सुंदर मार्गाने जा." प्रोग्राम्स अचूकपणे याच प्रकारच्या सशर्त लॉजिकचा वापर करतात, वेगवेगळ्या परिस्थितींना हुशारीने प्रतिसाद देण्यासाठी आणि नेहमी वापरकर्त्यांना सर्वोत्तम अनुभव देण्यासाठी. +### 🎯 **संकल्पना तपासणी: मूलभूत घटकांची प्रावीण्य** -### 🎯 **संकल्पना तपासणी: मूलभूत घटकांची पारंगतता** +**बघूया तुम्ही मूलभूत गोष्टी कशा करत आहात:** +- स्वतःच्या शब्दांत चल आणि विधान यातील फरक तुम्ही कसा स्पष्ट कराल? +- एक खरेदारी जीवनातील उदाहरण जोडा, जिथे तुम्ही if-then निर्णय वापराल (जसे मतदान उदाहरणात दिलेले) +- प्रोग्रामिंग लॉजिकमध्ये कोणती गोष्ट तुम्हाला आश्चर्यचकित केले? -**चला पाहूया की तुम्ही मूलभूत गोष्टींमध्ये कसे आहात:** -- तुम्ही तुमच्या स्वतःच्या शब्दांत व्हेरिएबल आणि स्टेटमेंटमधील फरक स्पष्ट करू शकता का? -- तुम्ही if-then निर्णय वापरण्यासाठी वास्तविक जीवनातील परिस्थिती विचार करू शकता का (जसे की आमचे मतदानाचे उदाहरण)? -- प्रोग्रामिंग लॉजिकबद्दल तुम्हाला आश्चर्य वाटलेली एक गोष्ट कोणती आहे? - -**जलद आत्मविश्वास वाढवणारा उपाय:** +**त्वरित आत्मविश्वास वाढवण्यासाठी:** ```mermaid flowchart LR - A["📝 Statements
(Instructions)"] --> B["📦 Variables
(Storage)"] --> C["🔀 Control Flow
(Decisions)"] --> D["🎉 Working Program!"] + A["📝 विधानं
(सूचना)"] --> B["📦 चल क
(साठवण)"] --> C["🔀 नियंत्रण प्रवाह
(निर्णय)"] --> D["🎉 कार्यरत प्रोग्राम!"] style A fill:#ffeb3b style B fill:#4caf50 style C fill:#2196f3 style D fill:#ff4081 -``` - -✅ **पुढे काय येत आहे**: आम्ही या संकल्पनांमध्ये अधिक खोलवर जाऊन एक अविश्वसनीय प्रवास सुरू ठेवणार आहोत! सध्या, फक्त तुमच्यातील उत्साहावर लक्ष केंद्रित करा आणि पुढे येणाऱ्या सर्व अद्भुत शक्यतांबद्दल विचार करा. विशिष्ट कौशल्ये आणि तंत्रे सराव करताना नैसर्गिकरित्या तुमच्या लक्षात राहतील – मी वचन देतो की हे अपेक्षेपेक्षा खूप मजेदार असेल! +``` +✅ **पुढे काय येणार आहे:** आपण या संकल्पनांमध्ये खोलवर जाऊन एक अप्रतिम सफर सुरू करणार आहोत! आत्ता फक्त या सर्व आश्चर्यजनक शक्यता पाहून उत्साहित व्हा. आम्ही एकत्र सराव केल्याने विशेष कौशल्ये आणि तंत्र आत्मसात होतील – मला विश्वास आहे की हे अपेक्षेपेक्षा खूपच मजेशीर ठरेल! -## व्यापाराचे साधन +## कामातील साधने -ठीक आहे, आता मी खूप उत्साहित आहे, मी स्वतःला थांबवू शकत नाही! 🚀 आपण अशा अविश्वसनीय साधनांबद्दल बोलणार आहोत ज्यामुळे तुम्हाला डिजिटल स्पेसशिपची चावी मिळाल्यासारखे वाटेल. +ठीक आहे, खरं म्हणजे इथे मला इतकी उत्सुकता होते की मी स्वतःला रोखू शकत नाही! 🚀 आपण त्या अद्भुत साधनांविषयी बोलणार आहोत जे तुम्हाला डिजिटल अंतराळयानाची चावी दिली गेली असल्याचा अनुभव देतील. -तुम्हाला माहित आहे का की शेफकडे त्या परिपूर्ण संतुलित सुरी असतात ज्या त्यांच्या हातांचा विस्तार वाटतात? किंवा संगीतकाराकडे ती एक गिटार असते जी ते स्पर्श करताच गाते? बरं, विकसकांकडे आमच्या स्वतःच्या जादुई साधनांचा एक प्रकार आहे, आणि येथे काय आहे जे तुमचे मन पूर्णपणे उडवून देईल – त्यापैकी बहुतेक पूर्णपणे मोफत आहेत! +तुम्हाला माहित आहे का, शेफकडे तशा परिपूर्ण संतुलित छुरी असतात ज्या त्यांच्या हातांची पुढील वाढ वाटतात? संगीतज्ञाकडे एक गिटार होत असतो जो स्पर्श करताच गाण्याची सुरुवात करतो? असंच काहीसे विकसकांकडे देखील आहे, आणि अजून काय इतर ज्ञानापेक्षा जास्त आहे — त्यातील बहुतेक पूर्णपणे मोफत! -मी तुम्हाला हे सांगण्यासाठी खूप उत्सुक आहे कारण त्यांनी सॉफ्टवेअर कसे तयार करायचे यामध्ये पूर्णपणे क्रांती केली आहे. आम्ही AI-संचालित कोडिंग सहाय्यकांबद्दल बोलत आहोत जे तुमचा कोड लिहिण्यास मदत करू शकतात (मी खोटे बोलत नाही!), क्लाउड वातावरण जिथे तुम्ही अक्षरशः कुठूनही Wi-Fi सह संपूर्ण अनुप्रयोग तयार करू शकता, आणि डिबगिंग टूल्स इतके परिष्कृत आहेत की ते तुमच्या प्रोग्रामसाठी एक्स-रे व्हिजनसारखे आहेत. +मी या साधने तुम्हाला सांगताना खूप उत्साहित आहे कारण त्यामुळे आपण सॉफ्टवेअर तयार करण्याचा मार्ग पूर्णपणे बदलला आहे. आपण AI-चालित कोडिंग सहाय्यकांबद्दल बोलत आहोत जे तुमचा कोड लिहण्यास मदत करतात (खरंच!), क्लाऊड वातावरणांमध्ये जिथून तुम्ही कुठूनही Wi-Fi वापरून संपूर्ण अनुप्रयोग तयार करू शकता, आणि तसेच इतक्या प्रगत डिबगिंग साधनांसारखे जे तुमच्या प्रोग्रामसाठी X-ray दृष्टी देतात. -आणि येथे एक भाग आहे जो अजूनही मला रोमांचित करतो: हे "नवशिक्या साधने" नाहीत जे तुम्ही वापरणे थांबवाल. Google, Netflix, आणि तुम्हाला आवडणाऱ्या इंडी अॅप स्टुडिओमध्ये विकसक सध्या वापरत आहेत तीच व्यावसायिक-ग्रेड साधने आहेत. तुम्हाला ती वापरताना खूप प्रोफेशनल वाटेल! +आणि हा भाग पण आहे जो अजूनही मला घाम घालतो: हे "नविन शिकणाऱ्यांचे" साधने नाहीत, जे तुम्ही लगेच सोडून द्याल. हे अगदी तेच व्यावसायिक दर्जाचे साधने आहेत जे Google, Netflix, आणि तुम्हाला आवडणाऱ्या त्या इंडी ऍप स्टुडिओमध्ये आताच वापरले जात आहेत. तुम्हाला हे वापरतांना एकदम प्रोसेसिंग अनुभव मिळेल! ```mermaid graph TD - A["💡 Your Idea"] --> B["⌨️ Code Editor
(VS Code)"] - B --> C["🌐 Browser DevTools
(Testing & Debugging)"] - C --> D["⚡ Command Line
(Automation & Tools)"] - D --> E["📚 Documentation
(Learning & Reference)"] - E --> F["🚀 Amazing Web App!"] + A["💡 तुमची संकल्पना"] --> B["⌨️ कोड संपादक
(VS Code)"] + B --> C["🌐 ब्राउझर डेव्हटूल्स
(चाचणी व डीबगिंग)"] + C --> D["⚡ कमांड लाइन
(स्वयंचलन व साधने)"] + D --> E["📚 दस्तऐवजीकरण
(शिक्षण व संदर्भ)"] + E --> F["🚀 अद्भुत वेब अॅप!"] - B -.-> G["🤖 AI Assistant
(GitHub Copilot)"] - C -.-> H["📱 Device Testing
(Responsive Design)"] - D -.-> I["📦 Package Managers
(npm, yarn)"] - E -.-> J["👥 Community
(Stack Overflow)"] + B -.-> G["🤖 AI सहाय्यक
(GitHub Copilot)"] + C -.-> H["📱 उपकरण चाचणी
(प्रतिक्रियाशील डिझाइन)"] + D -.-> I["📦 पॅकेज व्यवस्थापक
(npm, yarn)"] + E -.-> J["👥 समुदाय
(Stack Overflow)"] style A fill:#fff59d style F fill:#c8e6c9 @@ -413,133 +502,152 @@ graph TD style H fill:#f3e5f5 style I fill:#ffccbc style J fill:#e8eaf6 -``` +``` +### कोड संपादक आणि IDE: तुमचे नवीन डिजिटल मित्र + +आता आपण कोड संपादकांबद्दल बोलूया – हे खरंच तुमचे नवीन आवडते ठिकाण होणार आहेत! हे तुमचे खास कोडिंग मंदिर आहे जिथे तुम्ही तुमचे संपूर्ण वेळ घालवून तुमचे डिजिटल सर्जनशील काम तयार कराल आणि सुधाराल. + +पण आधुनिक संपादकांच्या अद्भुत बाबी हे की ते फक्त सुंदर टेक्स्ट एडिटर नाहीत. ते तुमच्या बाजूला असलेला एक हुशार, मदत करणारा कोडिंग गुरु सारखा आहेत जो २४×७ काम करत राहतो. ते तुमच्या टायपिंगच्या चुका आगाऊ पकडतात, सुचवतात ज्यामुळे तुम्ही एक प्रतिभाशाली दिसता, समजावून सांगतात की प्रत्येक कोडचा भाग काय करतो, आणि काही तर तुम्ही काय टाइप करणार आहात हे अगोदरच ओळखून तुमची मदत करतात! -### कोड एडिटर्स आणि IDEs: तुमचे नवीन डिजिटल मित्र +मला आठवतं जेव्हा मी पहिल्यांदा ऑटो-कम्प्लीशन सापडली – मला वाटले मी भल्या काळात आहे. तुम्ही काही टाइप करता आणि संपादक म्हणतो, "अरे, तुम्हाला ही फंक्शन हवी होती का? ती अगदी तुमच्या गरजेनुसार आहे." जणू तुम्हाला वाचणारं मन असलेला कोडिंग मित्र सोबत आहे! -चला कोड एडिटर्सबद्दल बोलूया – हे तुमचे नवीन आवडते ठिकाण बनणार आहेत! त्यांना तुमचे वैयक्तिक कोडिंग अभयारण्य समजा जिथे तुम्ही तुमची डिजिटल निर्मिती तयार करण्यात आणि परिपूर्ण करण्यात तुमचा जास्त वेळ घालवाल. +**हे संपादक इतके अद्भुत का आहेत?** -पण आधुनिक एडिटर्सबद्दल जे खरोखर जादुई आहे ते म्हणजे ते फक्त फॅन्सी टेक्स्ट एडिटर्स नाहीत. ते तुमच्याबरोबर २४/७ बसलेले सर्वात हुशार, सहायक कोडिंग मार्गदर्शक असतात. ते तुमच्या टायपोला तुम्हाला कळण्याआधीच पकडतात, सुधारणा सुचवतात ज्या तुम्हाला हुशार वाटतात, तुम्हाला प्रत्येक कोडचा तुकडा काय करतो ते समजून घेण्यास मदत करतात, आणि त्यापैकी काही तुमच्या विचारांवर अंदाज लावू शकतात आणि तुमचे विचार पूर्ण करण्याची ऑफर देतात! +आधुनिक कोड संपादक उत्पादनक्षमता वाढवण्यासाठी या वैशिष्ट्यांची श्रीमंती देतातः -मी पहिल्यांदा ऑटो-कम्प्लिशन शोधले तेव्हा मला अक्षरशः भविष्यामध्ये जगत असल्यासारखे वाटले. तुम्ही काहीतरी टाइप करायला सुरुवात करता, आणि तुमचा एडिटर म्हणतो, "अरे, तुम्ही नेमके काय हवे आहे ते करणाऱ्या फंक्शनबद्दल विचार करत होता का?" हे तुमच्या कोडिंग मित्रासारखे मन वाचणारे आहे! +| वैशिष्ट्य | काय करतो | कसे मदत करते | +|---------|--------------|--------------| +| **सिंटॅक्स हायलाइटिंग** | कोडच्या वेगवेगळ्या भागांना रंगवतो | कोड वाचायला आणि चुका शोधायला सोपे करते | +| **ऑटो-कंप्लीशन** | टाइपिंग दरम्यान कोड सुचवतो | कोडिंग गती वाढवतो आणि टायपो कमी करतो | +| **डिबगिंग साधने** | चुका शोधण्यात मदत करतात | समस्या सोडवण्यात वेळ वाचवतो | +| **एक्सटेंशन्स** | विशेष वैशिष्ट्ये वाढवतात | कोणत्याही तंत्रज्ञानासाठी संपादक सानुकूल करा | +| **AI सहाय्यक** | कोड आणि स्पष्टीकरणे सुचवतात | शिक्षण आणि उत्पादनक्षमता वेगाने वाढवतो | -**हे एडिटर्स इतके अविश्वसनीय का आहेत?** +> 🎥 **व्हिडिओ स्रोत**: हे साधने प्रत्यक्षात कशी कार्य करतात ते पाहायचे आहे का? या [Tools of the Trade व्हिडिओ](https://youtube.com/watch?v=69WJeXGBdxg) मध्ये संपूर्ण अवलोकन पहा. -आधुनिक कोड एडिटर्स उत्पादकता वाढवण्यासाठी प्रभावी वैशिष्ट्यांची श्रेणी देतात: +#### वेब विकासासाठी शिफारस केलेले संपादक -| वैशिष्ट्य | काय करते | कसे मदत करते | -|---------|--------------|--------------| -| **सिंटॅक्स हायलाइटिंग** | तुमच्या कोडचे वेगवेगळे भाग रंगीत करते | कोड वाचणे सोपे करते आणि चुका शोधणे सोपे करते | -| **ऑटो-कम्प्लिशन** | टाइप करताना कोड सुचवते | कोडिंग वेगवान करते आणि टायपो कमी करते | -| **डिबगिंग टूल्स** | चुका शोधण्यात आणि दुरुस्त करण्यात मदत करते | तासभर त्रुटी शोधण्याचा वेळ वाचवते | -| **एक्सटेंशन्स** | विशेष वैशिष्ट्ये जोडा | कोणत्याही तंत्रज्ञानासाठी तुमचा एडिटर सानुकूलित करा | -| **AI सहाय्यक** | कोड आणि स्पष्टीकरण सुचवते | शिक्षण आणि उत्पादकता वेगवान करते | +**[Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon)** (मुफत) +- वेब डेव्हलपर्समध्ये सर्वाधिक लोकप्रिय +- उत्कृष्ट एक्सटेंशन परिसंस्था +- अंगभूत टर्मिनल आणि Git समाकलन +- **आवश्यक एक्सटेंशन्स:** + - [GitHub Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot) - AI-चालित कोड सुचने + - [Live Share](https://marketplace.visualstudio.com/items?itemName=MS-vsliveshare.vsliveshare) - रिअल-टाइम सहकार्य + - [Prettier](https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode) - स्वयंचलित कोड फॉरमॅटिंग + - [Code Spell Checker](https://marketplace.visualstudio.com/items?itemName=streetsidesoftware.code-spell-checker) - तुमच्या कोडमधील टायपो पकडते -> 🎥 **व्हिडिओ संसाधन**: ही साधने कशी कार्य करतात ते पाहायचे आहे? [टूल्स ऑफ द ट्रेड व्हिडिओ](https://youtube.com/watch?v=69WJeXGBdxg) comprehensive overview साठी पहा. +**[JetBrains WebStorm](https://www.jetbrains.com/webstorm/)** (सशुल्क, विद्यार्थ्यांसाठी मोफत) +- प्रगत डिबगिंग आणि चाचणी साधने +- बुद्धिमान कोड पूर्णता +- अंगभूत आवृत्ती नियंत्रण -#### वेब डेव्हलपमेंटसाठी शिफारस केलेले एडिटर्स +**क्लाऊड-आधारित IDEs** (वेगवेगळी किंमती) +- [GitHub Codespaces](https://github.com/features/codespaces) - तुमच्या ब्राउझरमध्ये पूर्ण VS Code +- [Replit](https://replit.com/) - शिकण्यासाठी आणि कोड शेअर करण्यासाठी छान +- [StackBlitz](https://stackblitz.com/) - त्वरित, पूर्ण-स्टॅक वेब विकास -**[Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon)** (फ्री) -- वेब डेव्हलपर्समध्ये सर्वाधिक लोकप्रिय -- उत्कृष्ट एक्सटेंशन इकोसिस्टम -- बिल्ट-इन टर्मिनल आणि Git इंटिग्रेशन -- **मस्ट-हॅव एक्सटेंशन्स**: - - [GitHub Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot) - AI-संचालित कोड सुचवणारे - - [Live Share](https://marketplace.visualstudio.com/items?itemName=MS-vsliveshare.vsliveshare) - रिअल-टाइम सहयोग - - [Prettier](https://marketplace.visualstudio.com/items?itemName=es -पहिल्यांदा मला कोणीतरी ब्राउझर DevTools दाखवले, तेव्हा मी तीन तास फक्त क्लिक करत बसलो आणि म्हणत होतो, "थांबा, हे सुद्धा करू शकते?!" तुम्ही प्रत्यक्षात कोणतीही वेबसाइट रिअल-टाइममध्ये संपादित करू शकता, प्रत्येक गोष्ट किती वेगाने लोड होते ते पाहू शकता, तुमची साइट वेगवेगळ्या डिव्हाइसवर कशी दिसते ते तपासू शकता आणि अगदी प्रोफेशनलप्रमाणे JavaScript डिबग करू शकता. हे पूर्णपणे आश्चर्यकारक आहे! +> 💡 **प्रारंभ करण्याचा सल्ला:** Visual Studio Code पासून सुरुवात करा – हे मोफत आहे, उद्योगात खूप वापरले जाते, आणि मोठ्या प्रमाणात समुदाय उपयुक्त ट्युटोरियल आणि एक्सटेंशन्स तयार करतो. -**ब्राउझर का तुमचे गुप्त शस्त्र आहेत:** +### वेब ब्राउझर: तुमची गुप्त विकास प्रयोगशाळा -वेबसाइट किंवा वेब अॅप्लिकेशन तयार करताना, तुम्हाला ते वास्तविक जगात कसे दिसते आणि वागते ते पाहणे आवश्यक आहे. ब्राउझर तुमचे काम फक्त दाखवत नाहीत तर कार्यक्षमता, ऍक्सेसिबिलिटी आणि संभाव्य समस्यांबद्दल तपशीलवार फीडबॅक देखील देतात. +ठीक आहे, तयार व्हा तुमचे मन पूर्णपणे विस्मित होण्यासाठी! तुम्ही सोशल मिडिया ब्राउझ करण्यासाठी आणि व्हिडिओ पाहण्यासाठी ब्राउझर वापरत आहात हे समजतेच. पण ते इतकी जबरदस्त गुप्त विकास प्रयोगशाळा लपवून ठेवत होते की त्याचा तुम्हाला कधीच अंदाज नव्हता! + +प्रत्येकवेळी तुम्ही वेबपेजवर राईट-क्लिक करून "Inspect Element" निवडता, तुम्ही प्रत्यक्षात अशी विकासक साधने उघडत आहात जे काही महागड्या सॉफ्टवेअरपेक्षाही जास्त सामर्थ्यशाली आहेत ज्यासाठी मी पूर्वी शंभरोण्णची फी भरत होतो. जणू तुमच्या निमित्तानं तुमच्या जुन्या घरातील स्वयंपाकघराच्या मागे व्यावसायिक स्वयंपाकशाळा उघडली गेली आहे! +पहिल्यांदा कोणीतरी मला ब्राउझर DevTools दाखवले तेव्हा मी फक्त तीन तास क्लिक करत होतो आणि म्हणत होतो "थांब, हे पण करू शकतो का?!" तुम्ही प्रत्यक्षात कोणतीही वेबसाइट रिअल-टाइममध्ये एडिट करू शकता, अचूक पाहू शकता की सगळं किती वेगाने लोड होतंय, तुमची साइट वेगवेगळ्या उपकरणांवर कशी दिसते ते टेस्ट करू शकता, आणि अगदी प्रो प्रमाणे JavaScript देखील डीबग करू शकता. हे अगदीच दिमाखदारीचे आहे! + +**म्हणूनच ब्राउझर तुमचं गुपित अस्त्र आहेत:** + +जेव्हा तुम्ही वेबसाइट किंवा वेब अ‍ॅप्लिकेशन तयार करता, तेव्हा त्याचा रिअल वर्ल्ड मध्ये कसा दिसतो आणि कसा वागतो हे पाहणं गरजेचं असतं. ब्राउझर केवळ तुमचं काम दाखवत नाहीत तर कामगिरी, प्रवेशयोग्यता आणि संभाव्य समस्या यावर सखोल अभिप्राय देखील देतात. #### ब्राउझर डेव्हलपर टूल्स (DevTools) -आधुनिक ब्राउझरमध्ये व्यापक विकास साधनांचा समावेश आहे: +आधुनिक ब्राउझरमध्ये संपूर्ण विकास साधनसंच समाविष्ट असतात: -| टूल श्रेणी | काय करते | उदाहरण वापर केस | -|------------|-----------|------------------| -| **एलिमेंट इन्स्पेक्टर** | HTML/CSS रिअल-टाइममध्ये पाहा आणि संपादित करा | स्टाइलिंग समायोजित करा आणि त्वरित परिणाम पहा | -| **कन्सोल** | एरर मेसेजेस पाहा आणि JavaScript तपासा | समस्या डिबग करा आणि कोडवर प्रयोग करा | -| **नेटवर्क मॉनिटर** | संसाधने कशी लोड होतात ते ट्रॅक करा | कार्यक्षमता आणि लोडिंग वेळा ऑप्टिमाइझ करा | -| **ऍक्सेसिबिलिटी चेकर** | समावेशक डिझाइनसाठी चाचणी करा | तुमची साइट सर्व वापरकर्त्यांसाठी कार्य करते याची खात्री करा | -| **डिव्हाइस सिम्युलेटर** | वेगवेगळ्या स्क्रीन साइजवर प्रीव्ह्यू करा | अनेक डिव्हाइसशिवाय रिस्पॉन्सिव्ह डिझाइन तपासा | +| टूल श्रेणी | ते काय करतात | उदाहरण वापर प्रकरण | +|------------|--------------|--------------------| +| **एलिमेंट इन्स्पेक्टर** | HTML/CSS रिअल-टाइममध्ये पहा आणि संपादित करा | ताबडतोब परिणाम पाहण्यासाठी स्टाइलिंग समायोजित करा | +| **कन्सोल** | त्रुटी संदेश पहा आणि JavaScript टेस्ट करा | समस्या डीबग करा आणि कोडसह प्रयोग करा | +| **नेटवर्क मॉनिटर** | संसाधने कशी लोड होतात ते ट्रॅक करा | कामगिरी आणि लोडिंग वेळ ऑप्टिमाइझ करा | +| **अ‍ॅक्सेसिबिलिटी चेकर** | सर्वसमावेशक डिझाइनसाठी टेस्ट करा | तुमची साइट सर्व वापरकर्त्यांसाठी योग्य आहे ना याची खात्री करा | +| **डिवाइस सिम्मुलेटर** | वेगवेगळ्या स्क्रीन आकारांवर प्रिव्ह्यू करा | एकापेक्षा जास्त उपकरणे न वापरता प्रतिसादक डिझाइन टेस्ट करा | #### विकासासाठी शिफारस केलेले ब्राउझर -- **[Chrome](https://developers.google.com/web/tools/chrome-devtools/)** - विस्तृत दस्तऐवजीकरणासह उद्योग-मानक DevTools -- **[Firefox](https://developer.mozilla.org/docs/Tools)** - उत्कृष्ट CSS ग्रिड आणि ऍक्सेसिबिलिटी टूल्स -- **[Edge](https://docs.microsoft.com/microsoft-edge/devtools-guide-chromium/?WT.mc_id=academic-77807-sagibbon)** - Chromium वर आधारित Microsoft चे डेव्हलपर संसाधने +- **[Chrome](https://developers.google.com/web/tools/chrome-devtools/)** - उद्योगमानक DevTools विस्तृत दस्तऐवजीकरणासह +- **[Firefox](https://developer.mozilla.org/docs/Tools)** - उत्कृष्ट CSS ग्रिड आणि प्रवेशयोग्यता साधने +- **[Edge](https://docs.microsoft.com/microsoft-edge/devtools-guide-chromium/?WT.mc_id=academic-77807-sagibbon)** - Microsoft च्या डेव्हलपर संसाधनांसह Chromium आधारित + +> ⚠️ **महत्त्वाचा टेस्टिंग टीप**: नेहमी तुमच्या वेबसाइट्स अनेक ब्राउझरमध्ये टेस्ट करा! Chrome मध्ये ज्याप्रकारे काम करतं ते Safari किंवा Firefox मध्ये वेगळं दिसू शकतं. व्यावसायिक डेव्हलपर संपूर्ण मुख्य ब्राउझरवर टेस्ट करतात ज्यामुळे एकसारखा वापरकर्ता अनुभव मिळतो. -> ⚠️ **महत्त्वाची चाचणी टिप**: तुमच्या वेबसाइट्सची अनेक ब्राउझरमध्ये नेहमीच चाचणी करा! Chrome मध्ये उत्तम प्रकारे कार्य करणारे Safari किंवा Firefox मध्ये वेगळे दिसू शकते. व्यावसायिक डेव्हलपर्स सर्व प्रमुख ब्राउझरमध्ये चाचणी घेतात जेणेकरून वापरकर्त्यांचा अनुभव सुसंगत राहील. -### कमांड लाइन टूल्स: डेव्हलपर सुपरपॉवर्ससाठी तुमचा प्रवेशद्वार +### कमांड लाइन टूल्स: तुमच्या डेव्हलपर सुपरपॉवर्सचे प्रवेशद्वार -ठीक आहे, कमांड लाइनबद्दल प्रामाणिकपणे बोलूया, कारण मी तुम्हाला हे सांगू इच्छितो की मी हे पूर्णपणे समजतो. जेव्हा मी प्रथम ते पाहिले – फक्त एक भयानक काळा स्क्रीन आणि ब्लिंकिंग टेक्स्ट – मी अक्षरशः विचार केला, "नाही, अजिबात नाही! हे 1980 च्या हॅकर चित्रपटासारखे दिसते, आणि मी यासाठी पुरेसा हुशार नाही!" 😅 +ठीक आहे, आत्ता कमांड लाईनबद्दल पार प्रामाणिकपणे बोलूया, कारण मला तुझ्याकडून हे ऐकायचंय – ज्यांना खरोखरच समजतात त्यांच्या तोंडून. जेव्हा मी पहिल्यांदा ते पाहिलं – फक्त हा भयानक काळा स्क्रीन ज्यावर टप टपणारा मजकूर होता – मी खरंच विचारत होतो, "नाही, नक्की नाही! हे काही 1980 च्या दशकाच्या हॅकर चित्रपटातील भाग वाटतंय, आणि मी अजिबात त्यासाठी तयार नाही!" 😅 -पण मला तेव्हा कोणी सांगितले असते असे मला वाटते, आणि मी तुम्हाला आत्ता सांगत आहे: कमांड लाइन भीतीदायक नाही – प्रत्यक्षात तुमच्या संगणकाशी थेट संवाद साधण्यासारखे आहे. हे असे आहे की तुम्ही तुमच्या आवडत्या स्थानिक रेस्टॉरंटमध्ये जात आहात जिथे शेफला तुमच्या आवडीची अचूक माहिती आहे आणि तुम्ही फक्त "मला काहीतरी अप्रतिम सरप्राईज द्या" असे म्हणता तेव्हा तो काहीतरी परिपूर्ण बनवतो. +पण मला पाहिजे होतं की कोणीतरी त्या काळी मला सांगीतलं असतं, आणि आत्ता तुला सांगतोय: कमांड लाइन भयानक नाही – ती तुमच्या संगणकाशी थेट संवाद साधण्यासारखी आहे. कल्पना कर की जेवण ऑर्डर करण्यासाठी सुंदर चित्र आणि मेन्यू असलेल्या अ‍ॅपद्वारे करणे (जे सोपं आणि सुबक आहे) आणि दुसरे म्हणजे तुझ्या आवडत्या स्थानिक रेस्टॉरंटमध्ये जाणे जिथे शेफला तुझ्या आवडीनुसार नेमकं काय हवं ते माहिती असतं आणि तू फक्त "मला काही आश्चर्यकारक द्या" म्हणाल्यास तो त्वरित काहीतरी परफेक्ट बनवून देतो. -कमांड लाइन ही जागा आहे जिथे डेव्हलपर्स जादूगारासारखे वाटण्यासाठी जातात. तुम्ही काही जादूई शब्द टाइप करता (ठीक आहे, ते फक्त कमांड आहेत, पण ते जादूई वाटतात!), एंटर दाबा, आणि BOOM – तुम्ही संपूर्ण प्रोजेक्ट स्ट्रक्चर तयार केले आहे, जगभरातील शक्तिशाली टूल्स स्थापित केले आहेत, किंवा तुमचे अॅप इंटरनेटवर लाखो लोकांना पाहण्यासाठी तैनात केले आहे. तुम्हाला त्या शक्तीचा पहिला स्वाद मिळाल्यावर, ते खरोखरच व्यसनाधीन आहे! +कमांड लाइन ही जागा आहे जिथे डेव्हलपर पूर्ण जादूटोणा वाटण्यासाठी जातात. तुम्ही काही जादुई शब्दं टाइप करता (ठीक आहे, ते फक्त कमांड्स आहेत, पण जादूशीर वाटतात!), एंटर दाबता, आणि धडाम – तुम्ही संपूर्ण प्रोजेक्ट स्ट्रक्चर्स तयार केलेत, जगभरातून सामर्थ्यवान टूल्स इन्स्टॉल केलेत, किंवा तुमचं अॅप इंटरनेटवर अनेक लोकांसाठी डिप्लॉय केलंय. एकदा त्याचा स्वाद घेतल्यावर, खरंच वेड लावणारा अनुभव होतो! -**कमांड लाइन तुमचे आवडते टूल का बनेल:** +**कमांड लाइन तुमचं आवडतं टूल बनेल याचे कारण:** -ग्राफिकल इंटरफेस अनेक कार्यांसाठी उत्कृष्ट आहेत, परंतु कमांड लाइन ऑटोमेशन, अचूकता आणि वेगात उत्कृष्ट आहे. अनेक विकास साधने प्रामुख्याने कमांड लाइन इंटरफेसद्वारे कार्य करतात आणि त्यांचा कार्यक्षमतेने वापर करणे शिकणे तुमची उत्पादकता लक्षणीयरीत्या सुधारू शकते. +ग्राफिकल इंटरफेस बरेच कामे साठी छान असतात, पण कमांड लाइन स्वयंचलन, अचूकता आणि वेग यामध्ये उत्कृष्ट आहे. अनेक विकास साधने प्रामुख्याने कमांड लाइन इंटरफेसद्वारे काम करतात, आणि त्याचा प्रभावी वापर शिकल्याने तुमची उत्पादकता मोठ्या प्रमाणात वाढू शकते. ```bash -# Step 1: Create and navigate to project directory +# टप्पा 1: प्रकल्प संचिका तयार करा आणि त्यात जा mkdir my-awesome-website cd my-awesome-website ``` **हा कोड काय करतो:** -- **नवीन डिरेक्टरी तयार करा** "my-awesome-website" नावाची तुमच्या प्रोजेक्टसाठी -- **नेव्हिगेट करा** नव्याने तयार केलेल्या डिरेक्टरीमध्ये काम सुरू करण्यासाठी +- **"my-awesome-website" नावाचा नवीन निर्देशिका तयार करा** तुमच्या प्रोजेक्टसाठी +- **नवीन तयार केलेल्या निर्देशिकेत जा** आणि काम सुरू करा ```bash -# Step 2: Initialize project with package.json +# टप्पा 2: package.json सह प्रकल्प प्रारंभ करा npm init -y -# Install modern development tools +# आधुनिक विकास साधने स्थापित करा npm install --save-dev vite prettier eslint npm install --save-dev @eslint/js ``` -**पायरी-पायरीने, येथे काय घडत आहे:** -- **नवीन Node.js प्रोजेक्ट सुरू करा** `npm init -y` वापरून डिफॉल्ट सेटिंगसह -- **Vite इंस्टॉल करा** आधुनिक बिल्ड टूल म्हणून जलद विकास आणि उत्पादन बिल्डसाठी -- **Prettier जोडा** स्वयंचलित कोड फॉरमॅटिंगसाठी आणि ESLint कोड गुणवत्ता तपासण्यासाठी -- **`--save-dev` फ्लॅग वापरा** हे विकास-फक्त डिपेंडन्सी म्हणून चिन्हांकित करण्यासाठी +**टप्प्याटप्प्याने काय होत आहे:** +- `npm init -y` वापरून डिफॉल्ट सेटिंग्जनसह नवीन Node.js प्रोजेक्ट प्रारंभ करा +- वेगवान विकास आणि उत्पादन बिल्डसाठी Vite हे आधुनिक बिल्ड टूल इन्स्टॉल करा +- कोड फॉरमॅटिंगसाठी Prettier व कोड गुणवत्ता तपासणीसाठी ESLint जोडा +- `--save-dev` फ्लॅग वापरून हे डेव्हलपमेंट-ओनली अवलंबित्व म्हणून चिन्हांकित करा ```bash -# Step 3: Create project structure and files +# पाऊल 3: प्रकल्पाची रचना आणि फायली तयार करा mkdir src assets echo 'My Site

Hello World

' > index.html -# Start development server +# विकास सर्व्हर सुरू करा npx vite ``` -**वरीलमध्ये, आम्ही:** -- **आमचा प्रोजेक्ट व्यवस्थित केला** स्रोत कोड आणि अॅसेट्ससाठी स्वतंत्र फोल्डर्स तयार करून -- **मूलभूत HTML फाइल तयार केली** योग्य डॉक्युमेंट स्ट्रक्चरसह -- **Vite विकास सर्व्हर सुरू केला** लाइव्ह रीलोडिंग आणि हॉट मॉड्यूल रिप्लेसमेंटसाठी +**वरील मध्ये आपण:** +- स्त्रोत कोड व सामग्रीसाठी स्वतंत्र फोल्डर्स तयार करून प्रोजेक्ट आयोजित केला आहे +- योग्य डॉक्युमेंट स्ट्रक्चरसह एक मूलभूत HTML फाईल तयार केली आहे +- Vite विकास सर्व्हर सुरू केला आहे ज्यामुळे लाइव रीलोडिंग व हॉट मॉड्यूल रिप्लेसमेंट शक्य होते #### वेब विकासासाठी आवश्यक कमांड लाइन टूल्स -| टूल | उद्देश | तुम्हाला का आवश्यक आहे | -|-----|--------|-------------------------| -| **[Git](https://git-scm.com/)** | व्हर्जन कंट्रोल | बदल ट्रॅक करा, इतरांसोबत सहयोग करा, तुमचे काम बॅकअप करा | -| **[Node.js & npm](https://nodejs.org/)** | JavaScript रनटाइम आणि पॅकेज मॅनेजमेंट | ब्राउझरच्या बाहेर JavaScript चालवा, आधुनिक विकास साधने इंस्टॉल करा | -| **[Vite](https://vitejs.dev/)** | बिल्ड टूल आणि डेव्ह सर्व्हर | हॉट मॉड्यूल रिप्लेसमेंटसह जलद विकास | -| **[ESLint](https://eslint.org/)** | कोड गुणवत्ता | तुमच्या JavaScript मधील समस्या स्वयंचलितपणे शोधा आणि दुरुस्त करा | -| **[Prettier](https://prettier.io/)** | कोड फॉरमॅटिंग | तुमचा कोड सातत्यपूर्णपणे फॉरमॅटेड आणि वाचनीय ठेवा | +| टूल | उद्दिष्ट | का आवश्यक आहे | +|------|---------|-----------------| +| **[Git](https://git-scm.com/)** | आवृत्ती नियंत्रण | बदल ट्रॅक करा, सहकार्य करा, तुमचं काम बॅकअप ठेवा | +| **[Node.js & npm](https://nodejs.org/)** | JavaScript रनटाइम आणि पॅकेज व्यवस्थापन | ब्राउझर बाहेर JavaScript चालवा, आधुनिक विकास टूल्स इन्स्टॉल करा | +| **[Vite](https://vitejs.dev/)** | बिल्ड टूल आणि विकास सर्व्हर | खूपच वेगवान विकास हॉट मॉड्यूल रिप्लेसमेंटसह | +| **[ESLint](https://eslint.org/)** | कोड गुणवत्ता | तुमच्या JavaScript मधील समस्या स्वयंचलित शोधा व दुरुस्त करा | +| **[Prettier](https://prettier.io/)** | कोड फॉरमॅटिंग | तुमचा कोड नेहमी सुसंगत स्वरूपात आणि वाचनीय ठेवा | #### प्लॅटफॉर्म-विशिष्ट पर्याय **Windows:** -- **[Windows Terminal](https://docs.microsoft.com/windows/terminal/?WT.mc_id=academic-77807-sagibbon)** - आधुनिक, वैशिष्ट्यपूर्ण टर्मिनल -- **[PowerShell](https://docs.microsoft.com/powershell/?WT.mc_id=academic-77807-sagibbon)** 💻 - शक्तिशाली स्क्रिप्टिंग वातावरण -- **[Command Prompt](https://docs.microsoft.com/windows-server/administration/windows-commands/?WT.mc_id=academic-77807-sagibbon)** 💻 - पारंपरिक Windows कमांड लाइन +- **[Windows Terminal](https://docs.microsoft.com/windows/terminal/?WT.mc_id=academic-77807-sagibbon)** - आधुनिक, फिचर-समृद्ध टर्मिनल +- **[PowerShell](https://docs.microsoft.com/powershell/?WT.mc_id=academic-77807-sagibbon)** 💻 - सामर्थ्यशाली स्क्रिप्टिंग वातावरण +- **[Command Prompt](https://docs.microsoft.com/windows-server/administration/windows-commands/?WT.mc_id=academic-77807-sagibbon)** 💻 - पारंपारिक Windows कमांड लाइन **macOS:** - **[Terminal](https://support.apple.com/guide/terminal/)** 💻 - अंगभूत टर्मिनल अॅप्लिकेशन @@ -547,184 +655,196 @@ npx vite **Linux:** - **[Bash](https://www.gnu.org/software/bash/)** 💻 - मानक Linux शेल -- **[KDE Konsole](https://docs.kde.org/trunk5/en/konsole/konsole/index.html)** - प्रगत टर्मिनल एम्युलेटर +- **[KDE Konsole](https://docs.kde.org/trunk5/en/konsole/konsole/index.html)** - प्रगत टर्मिनल एमुलेटर -> 💻 = ऑपरेटिंग सिस्टमवर प्री-इंस्टॉल केलेले +> 💻 = ऑपरेटिंग सिस्टिमवर आधीच इन्स्टॉल केलेले -> 🎯 **शिकण्याचा मार्ग**: `cd` (डिरेक्टरी बदला), `ls` किंवा `dir` (फाइल्सची यादी), आणि `mkdir` (फोल्डर तयार करा) यासारख्या मूलभूत कमांड्ससह प्रारंभ करा. `npm install`, `git status`, आणि `code .` (VS Code मध्ये वर्तमान डिरेक्टरी उघडते) यासारख्या आधुनिक वर्कफ्लो कमांड्ससह सराव करा. तुम्ही अधिक आरामदायक झाल्यावर, तुम्ही नैसर्गिकरित्या अधिक प्रगत कमांड्स आणि ऑटोमेशन तंत्रे शिकाल. +> 🎯 **शिकण्याचा मार्ग**: `cd` (डिरेक्टरी बदला), `ls` किंवा `dir` (फायली यादी करा), आणि `mkdir` (फोल्डर तयार करा) सारख्या मूलभूत कमांडने सुरू करा. `npm install`, `git status`, आणि `code .` (सध्याच्या डिरेक्टरीतील VS Code उघडा) सारख्या आधुनिक वर्कफ्लो कमांड्सचे सराव करा. अधिक सोयीस्कर झाल्यावर, तुम्ही नैसर्गिकरित्या अधिक प्रगत कमांड्स आणि स्वयंचलन तंत्र शिकलात. -### दस्तऐवजीकरण: तुमचा नेहमी उपलब्ध असलेला शिकवणारा मार्गदर्शक +### डोक्युमेंटेशन: तुमचा सदैव उपलब्ध शिक्षण गुरु -ठीक आहे, मी तुम्हाला एक छोटासा गुपित सांगतो ज्यामुळे तुम्हाला सुरुवातीला असलेल्या भीतीबद्दल खूप चांगले वाटेल: सर्वात अनुभवी डेव्हलपर्स त्यांचा मोठा वेळ दस्तऐवजीकरण वाचण्यात घालवतात. आणि ते असे नाही की त्यांना काय करायचे आहे ते माहित नाही – प्रत्यक्षात ते शहाणपणाचे लक्षण आहे! +ठीक आहे, मला एक छोटीशी गुपित सांगू द्या जी तुम्हाला सुरुवातीस खूप मदत करेल: सर्वोत्तम अनुभवी डेव्हलपरदेखील त्यांचा बराच वेळ डोक्युमेंटेशन वाचण्यात घालवतात. आणि ते त्यांच्या न जाण्यामुळे नाही – हे शहाणपणाचं चिन्ह आहे! -दस्तऐवजीकरण म्हणजे जगातील सर्वात संयमी, ज्ञानवान शिक्षकांशी 24/7 प्रवेश असणे. रात्री 2 वाजता समस्येत अडकलात? दस्तऐवजीकरण तुमच्यासाठी आहे, गरज असलेले उत्तर देण्यासाठी. काही नवीन वैशिष्ट्य शिकायचे आहे का ज्याबद्दल प्रत्येकजण बोलत आहे? दस्तऐवजीकरण तुमच्या पाठीशी आहे, चरण-दर-चरण उदाहरणांसह. काहीतरी का कार्य करते ते समजून घेण्याचा प्रयत्न करत आहात? तुम्ही अंदाज लावला – दस्तऐवजीकरण ते स्पष्ट करण्यासाठी तयार आहे ज्यामुळे ते शेवटी क्लिक करते! +डोक्युमेंटेशन म्हणजे जगातील सर्वात संयमी, ज्ञानवान शिक्षकांकडे २४/७ प्रवेश असल्यासारखं आहे. सकाळी २ वाजता कुठल्या अडचणीत अडकला? डोक्युमेंटेशन थंडगार आभासी आलिंगन देत अचूक उत्तर देते. कुठल्या नवीन आणि छान वैशिष्ट्याबद्दल शिकायचंय का? डोक्युमेंटेशन ठोस उदाहरणांसह तुमचा पाठलाग करते. विशिष्ट गोष्ट का काम करते हे समजून घ्यायचंय का? डोक्युमेंटेशन तो एकदम सोप्या पद्धतीने समजावून सांगते! -**खऱ्या जादूचा भाग येथे आहे:** +माझा दृष्टीकोन पूर्णपणे बदलणारी गोष्ट: वेब विकासाचा जग फारच वेगाने बदलत असतो, आणि कुणीही (खरोखर कुणीही नाही!) सगळं लक्षात ठेऊन चालवत नाही. मी १५+ वर्षांच्या अनुभवी सिनिअर डेव्हलपरना मूलभूत सिंटॅक्स सर्च करताना पाहिलंय, आणि ठरवलंय का? हे लाजिरवाणं नाही – हे हुशारी आहे! हे अक्षरशः स्मृतीवर नव्हे, तर जलद आणि विश्वासार्ह उत्तरे कुठे शोधायची आणि कशा वापरायची हे जाणण्यात आहे. -व्यावसायिक डेव्हलपर्स त्यांचा मोठा वेळ दस्तऐवजीकरण वाचण्यात घालवतात – कारण त्यांना काय करायचे आहे ते माहित नाही म्हणून नाही, तर वेब विकासाचा परिसर इतक्या वेगाने विकसित होत आहे की अद्ययावत राहण्यासाठी सतत शिकणे आवश्यक आहे. उत्कृष्ट दस्तऐवजीकरण तुम्हाला काहीतरी कसे वापरायचे आहे हे समजून घेण्यास मदत करते, परंतु ते कधी आणि का वापरायचे आहे हे देखील समजून घेण्यास मदत करते. +**जिथे खरी जादू होते:** -#### आवश्यक दस्तऐवजीकरण संसाधने +व्यावसायिक डेव्हलपर बराच वेळ डोक्युमेंटेशन वाचण्यात घालवतात – कारण ते त्यांच्या कामातील सध्याच्या ट्रेंडसह राहण्यासाठी सातत्याने शिकत राहायचं आहे. उत्कृष्ट डोक्युमेंटेशन तुम्हाला फक्त *कसे* वापरायचं हेच नाही तर *का* आणि *केव्हा* वापरायचं हेही समजावून सांगते. + +#### आवश्यक डोक्युमेंटेशन संसाधने **[Mozilla Developer Network (MDN)](https://developer.mozilla.org/docs/Web)** -- वेब तंत्रज्ञान दस्तऐवजीकरणासाठी सुवर्ण मानक -- HTML, CSS, आणि JavaScript साठी व्यापक मार्गदर्शिका -- ब्राउझर सुसंगततेची माहिती समाविष्ट करते -- व्यावहारिक उदाहरणे आणि इंटरएक्टिव्ह डेमो वैशिष्ट्यीकृत +- वेब तंत्रज्ञानासाठी सुवर्ण मानक +- HTML, CSS, आणि JavaScript साठी सखोल मार्गदर्शक +- ब्राउझर सुसंगततेची माहिती समाविष्ट +- व्यावहारिक उदाहरणे आणि संवादात्मक डेमो -**[Web.dev](https://web.dev)** (Google द्वारे) -- आधुनिक वेब विकास सर्वोत्तम पद्धती -- कार्यक्षमता ऑप्टिमायझेशन मार्गदर्शिका -- ऍक्सेसिबिलिटी आणि समावेशक डिझाइन तत्त्वे -- वास्तविक प्रकल्पांमधील केस स्टडीज +**[Web.dev](https://web.dev)** (Google कडून) +- आधुनिक वेब विकास सर्वोत्तम सराव +- कामगिरी ऑप्टिमायझेशन मार्गदर्शक +- प्रवेशयोग्यता आणि समावेशक डिझाइन तत्त्वे +- खऱ्या प्रकल्पांवरील केस स्टडीज **[Microsoft Developer Documentation](https://docs.microsoft.com/microsoft-edge/#microsoft-edge-for-developers)** - Edge ब्राउझर विकास संसाधने -- प्रोग्रेसिव्ह वेब अॅप मार्गदर्शिका -- क्रॉस-प्लॅटफॉर्म विकास अंतर्दृष्टी +- प्रोग्रेसिव्ह वेब अ‍ॅप मार्गदर्शक +- मल्टी-प्लॅटफॉर्म विकास अंतर्दृष्टी **[Frontend Masters Learning Paths](https://frontendmasters.com/learn/)** - संरचित शिक्षण अभ्यासक्रम - उद्योग तज्ञांकडून व्हिडिओ कोर्सेस -- हाताळण्यायोग्य कोडिंग सराव +- हँड्स-ऑन कोडिंग सराव -> 📚 **अभ्यास धोरण**: दस्तऐवजीकरण लक्षात ठेवण्याचा प्रयत्न करू नका – त्याऐवजी, ते कार्यक्षमतेने नेव्हिगेट करणे शिका. वारंवार वापरल्या जाणाऱ्या संदर्भांचे बुकमार्क करा आणि विशिष्ट माहिती पटकन शोधण्यासाठी शोध फंक्शन्स वापरण्याचा सराव करा. +> 📚 **अभ्यास धोरण**: डोक्युमेंटेशन स्मृतिपटू होऊ नका – त्याऐवजी ती प्रभावीपणे कशी शोधायची ते शिका. वारंवार वापरल्या जाणाऱ्या संदर्भांना बुकमार्क करा आणि विशिष्ट माहिती पटकन शोधण्यासाठी सर्च फंक्शनचा सराव करा. -### 🔧 **टूल मास्टरी चेक: तुम्हाला काय आकर्षित करते?** +### 🔧 **टूल मास्टरी तपासणी: काय तुम्हाला भावलं?** -**थोडा वेळ घ्या विचार करण्यासाठी:** -- कोणते टूल तुम्हाला सर्वात आधी वापरून पाहण्याची उत्सुकता आहे? (यात चुकीचे उत्तर नाही!) -- कमांड लाइन अजूनही भीतीदायक वाटते का, की तुम्हाला त्याबद्दल उत्सुकता आहे? -- तुमच्या आवडत्या वेबसाइट्सच्या पडद्यामागे डोकावण्यासाठी ब्राउझर DevTools वापरण्याची कल्पना तुम्ही करू शकता का? +**एक मिनिट थांबा आणि विचार करा:** +- तुम्ही कोणत्या टूलला प्रथम वापरायला उत्सुक आहात? (चुकलेली उत्तरे नाहीत!) +- कमांड लाइन अजून भितीदायक वाटते का, की तुम्ही त्यात रस घेऊ लागलात? +- तुम्ही ब्राउझर DevTools वापरून तुमच्या आवडत्या वेबसाइटच्या आतल्या बाजूला जवळून पाहू शकता का? ```mermaid -pie title "Developer Time Spent With Tools" - "Code Editor" : 40 - "Browser Testing" : 25 - "Command Line" : 15 - "Reading Docs" : 15 - "Debugging" : 5 +pie title "विकसकाचा उपकरणांसह घालवलेला वेळ" + "कोड संपादक" : 40 + "ब्रााउझर चाचणी" : 25 + "कमांड लाइन" : 15 + "दस्तऐवज वाचन" : 15 + "डिबगिंग" : 5 ``` +> **मजेदार माहिती:** बहुतांश डेव्हलपर त्यांचा सुमारे ४०% वेळ कोड एडिटरमध्ये घालवतात, पण त्याला असं पाहिलं गेलं पाहिजे की किती वेळ टेस्टिंग, शिक्षण आणि समस्यांचे निराकरण करतात. प्रोग्रामिंग फक्त कोड लिहिण्याबाबत नाही – ते अनुभव तयार करण्याबाबत आहे! -> **मजेदार अंतर्दृष्टी**: बहुतेक डेव्हलपर्स त्यांचा सुमारे 40% वेळ त्यांच्या कोड एडिटरमध्ये घालवतात, परंतु लक्षात घ्या की चाचणी, शिकणे आणि समस्या सोडवण्यासाठी किती वेळ जातो. प्रोग्रामिंग फक्त कोड लिहिण्याबद्दल नाही – ते अनुभव तयार करण्याबद्दल आहे! - -✅ **विचार करण्यासाठी खाद्य**: येथे काही मनोरंजक विचार करण्यासारखे आहे – वेबसाइट्स तयार करण्यासाठी (विकास) साधने डिझाइन करण्यासाठी (डिझाइन) साधनांपेक्षा वेगळी कशी असतील असे तुम्हाला वाटते? हे सुंदर घर डिझाइन करणाऱ्या आर्किटेक्ट आणि प्रत्यक्षात ते बांधणाऱ्या कंत्राटदारामधील फरकासारखे आहे. दोन्ही महत्त्वाचे आहेत, परंतु त्यांना वेगवेगळ्या टूलबॉक्सची आवश्यकता आहे! वेबसाइट्स कशा जिवंत होतात याचे मोठे चित्र पाहण्यासाठी ही प्रकारची विचारसरणी तुम्हाला खरोखर मदत करेल. +✅ **विचार करण्यासाठी:** तुम्हाला काय वाटतं, वेबसाइट बांधण्यासाठी वापरल्या जाणाऱ्या टूल्स (विकास) आणि त्यांच्या देखावे कसे असावेत यासाठी वापरल्या जाणाऱ्या टूल्स (डिझाइन) यामध्ये काय फरक आहे? हे तसंच आहे म्हणून, ज्याने सुंदर घर डिझाइन केलं आणि जो कॉन्ट्रॅक्टर त्याला प्रत्यक्ष बांधतो त्यामध्ये फरक आहे. दोन्ही महत्त्वाचे आहेत, पण त्यांना वेगळ्या टूलबॉक्सची गरज आहे! असं विचार केल्याने तुम्हाला वेबसाईट तयार होण्याचा मोठा दृष्टीकोन मिळेल. ## GitHub Copilot Agent Challenge 🚀 -Agent मोड वापरून खालील आव्हान पूर्ण करा: +Agent मोड वापरून पुढील आव्हान पूर्ण करा: -**वर्णन:** आधुनिक कोड एडिटर किंवा IDE च्या वैशिष्ट्यांचा शोध घ्या आणि वेब डेव्हलपर म्हणून तुमच्या वर्कफ्लोमध्ये ते कसे सुधारणा करू शकतात ते दाखवा. +**वर्णन:** आधुनिक कोड एडिटर किंवा IDE ची वैशिष्ट्ये एक्सप्लोर करा आणि वेब डेव्हलपर म्हणून तुमचा वर्कफ्लो कसा सुधारेल हे दाखवा. -**प्रॉम्प्ट:** Visual Studio Code, WebStorm किंवा क्लाउड-आधारित IDE यासारखा कोड एडिटर किंवा IDE निवडा. तीन वैशिष्ट्ये किंवा एक्सटेंशन्स सूचीबद्ध करा जी तुम्हाला कोड लिहिणे, डिबग करणे किंवा अधिक कार्यक्षमतेने देखभाल करण्यात मदत करतात. प्रत्येकासाठी, ते तुमच्या वर्कफ्लोला कसे फायदेशीर ठरते याचे संक्षिप्त स्पष्टीकरण द्या. +**प्रॉम्प्ट:** कोणत्या तरी कोड एडिटर किंवा IDE (उदा. Visual Studio Code, WebStorm, किंवा क्लाउड-आधारित IDE) निवडा. तीन वैशिष्ट्ये किंवा एक्सटेंशन्स यादी करा ज्यामुळे तुम्हाला कोड लवकर लिहिता, डीबग करता किंवा मेंटेन करता येतो. प्रत्येकासाठी, तुमच्या वर्कफ्लोला कसा फायदा होतो याचे थोडक्यात स्पष्टीकरण द्या. --- ## 🚀 आव्हान -**ठीक आहे, डिटेक्टिव्ह, तुमच्या पहिल्या केससाठी तयार आहात का?** +**ठीक आहे, तपासणीसाठी तयार आहेस का?** -आता तुमच्याकडे हा अप्रतिम पाया आहे, माझ्याकडे एक साहस आहे जे तुम्हाला प्रोग्रामिंग जग किती विविध आणि आकर्षक आहे हे पाहण्यास मदत करेल. आणि ऐका – हे अजून कोड लिहिण्याबद्दल नाही, त्यामुळे त्याबद्दल कोणताही दबाव नाही! तुम्ही तुमच्या पहिल्या रोमांचक केसवर असलेल्या प्रोग्रामिंग भाषा डिटेक्टिव्हसारखे विचार करा! +आता जे जमलेले आहे ते वापरून मला एक साहस आहे जे तुम्हाला दाखवेल की प्रोग्रामिंग जग किती विविध आणि आकर्षक आहे. आणि ऐक – अजून कोड लिहायचं नाही आहे, त्यामुळे चिंता नाही! स्वतःला एक प्रोग्रामिंग भाषा तपासणी करणारा जण समजा ज्याचा पहिला सहजगत्या रोचक प्रकरण आहे! -**तुमचे मिशन, तुम्ही स्वीकारण्याचा निर्णय घेतल्यास:** -1. **भाषा एक्सप्लोरर बना**: पूर्णपणे वेगळ्या विश्वातील तीन प्रोग्रामिंग भाषा निवडा – कदाचित एक जी वेबसाइट्स तयार करते, एक जी मोबाइल अॅप्स तयार करते, आणि एक जी वैज्ञानिकांसाठी डेटा क्रंच करते. प्रत्येक भाषेत लिहिलेल्या समान सोप्या कार्याचे उदाहरण शोधा. मी वचन देतो की ते एकाच गोष्टीसाठी किती वेगळे दिसू शकते हे पाहून तुम्ही पूर्णपणे आश्चर्यचकित व्हाल! +**तुमची मोहिम, जर तुम्हाला स्वीकारायची असेल:** +1. **भाषा अन्वेषक बना**: पूर्ण वेगळ्या त्रिपक्षीय जगातून तीन प्रोग्रामिंग भाषा निवडा – कदाचित एक वेबसाइट बनवते, एक मोबाइल अ‍ॅप तयार करते, आणि एक वैज्ञानिकांसाठी डेटा प्रक्रिया करते. त्याच सोप्या टास्कचे प्रत्येक भाषेमध्ये उदाहरणं शोधा. मला खात्री आहे, तुम्हाला किती वेगळं कव्हर आहे हे पाहून आश्चर्य वाटेल! -2. **त्यांची उत्पत्ती कथा शोधा**: प्रत्येक भाषा विशेष का आहे? येथे एक छान तथ्य आहे – प्रत्येक प्रोग्रामिंग भाषा तयार केली गेली कारण कोणीतरी विचार केला, "तुम्हाला माहित आहे काय? हे विशिष्ट समस्या सोडवण्यासाठी चांगला मार्ग असला पाहिजे." तुम्ही त्या समस्यांचे काय होते ते शोधू शकता का? या कथांपैकी काही खरोखरच आकर्षक आहेत! +2. **त्यांच्या मूळ कथा शोधा**: प्रत्येक भाषा खास का आहे? एक छान तथ्य आहे – प्रत्येक प्रोग्रामिंग भाषा कोणीतरी म्हणाल्यामुळे तयार झाली की, "हो, ह्या विशिष्ट समस्येचं ठीक करण्याचा आणखी एक चांगला मार्ग असायला हवा." तुम्ही काय होतं हे ओळखू शकता का? काही कथा खरोखरच रोचक आहेत! -3. **समुदायांना भेटा**: प्रत्येक भाषेचा समुदाय किती स्वागतार्ह आणि उत्साही आहे ते पहा. काहींमध्ये लाखो डेव्हलपर्स आहेत जे ज्ञान सामायिक करतात आणि एकमेकांना मदत करतात, तर काही लहान आहेत पण अविश्वसनीयपणे घट्ट विणलेले आणि सहायक आहेत. तुम्हाला या समुदायांचे वेगवेगळे व्यक्त -## पुनरावलोकन आणि स्व-अभ्यास +3. **समुदायांना भेटा**: प्रत्येक भाषेचा समुदाय कसा स्वागतयोग्य आणि उत्साही आहे ते पहा. काही कडे लाखो डेव्हलपर ज्ञान वाटतात आणि मदत करतात, काही लहान पण अतिशय घट्ट आणि पाठबळ देणारे असतात. तुम्हाला विविध समुदायांचे व्यक्तिमत्त्वे पाहून खूप आनंद होईल! -**वेळ घ्या, शोधा आणि मजा करा!** +4. **आपल्या आतल्या भावना ऐका**: सध्या कोणती भाषा तुम्हाला सर्वात सुलभ वाटते? "परफेक्ट" निवड करण्याचा ताण घालू नका – फक्त तुमच्या अंतर्ज्ञानावर विश्वास ठेवा! खरंतर चुकलेला पर्याय नाही, आणि नंतर तुम्ही इतरही एक्सप्लोर करू शकता. -आज तुम्ही खूप काही शिकलेत, आणि त्याचा अभिमान बाळगा! आता मजेदार भाग सुरू होतो – ज्या विषयांनी तुमची उत्सुकता वाढवली त्यांचा शोध घ्या. लक्षात ठेवा, हे गृहपाठ नाही – ही एक साहस आहे! +**बोनस तपासणी काम:** पाहा, कोणत्या प्रमुख वेबसाइट्स किंवा अॅप्स कोणत्या भाषांमध्ये तयार आहेत. मला खात्री आहे की तुम्हाला आश्चर्य वाटेल Instagram, Netflix, किंवा तो मोबाइल गेम जो तुम्ही थांबवू शकत नाही, हे कुठल्या भाषेमुळे काम करते हे जाणून! -**तुमच्या आवडीच्या गोष्टींमध्ये खोलवर जा:** +> 💡 **लक्षात ठेवा:** तुम्ही आज कोणत्याही भाषेत तज्ञ होण्याचा प्रयत्न करत नाही. तुम्ही फक्त इतरत्र जाऊन स्टेशन लावण्यापूर्वी परिसर ओळखता आहात. वेळ घ्या, मजा करा, आणि तुमची कुतूहलता मार्गदर्शन करू दे! -**प्रोग्रामिंग भाषांमध्ये हाताळणी करा:** -- तुमच्या लक्षात आलेल्या 2-3 भाषांच्या अधिकृत वेबसाइट्सला भेट द्या. प्रत्येकाची स्वतःची शैली आणि कथा आहे! -- [CodePen](https://codepen.io/), [JSFiddle](https://jsfiddle.net/), किंवा [Replit](https://replit.com/) सारख्या ऑनलाइन कोडिंग प्लेग्राउंडवर प्रयत्न करा. प्रयोग करण्यास घाबरू नका – तुम्ही काहीही बिघडवू शकत नाही! -- तुमच्या आवडत्या भाषेची निर्मिती कशी झाली याबद्दल वाचा. खरंच, काही कथा खूपच रोचक आहेत आणि त्या तुम्हाला भाषांचा कार्यप्रणाली समजून घेण्यास मदत करतील. +## चला तुम्ही काय शोधलं त्याचं साजरा करूया! -**तुमच्या नवीन साधनांशी परिचित व्हा:** -- Visual Studio Code डाउनलोड करा जर तुम्ही अजून केले नसेल – ते मोफत आहे आणि तुम्हाला नक्कीच आवडेल! -- Extensions मार्केटप्लेसमध्ये काही मिनिटे ब्राउझ करा. हे तुमच्या कोड एडिटरसाठी अ‍ॅप स्टोअर सारखे आहे! -- तुमच्या ब्राउझरचे Developer Tools उघडा आणि फक्त क्लिक करा. सर्वकाही समजून घेण्याची चिंता करू नका – फक्त काय आहे ते ओळखून घ्या. +अरे वा, आज तू खूप आश्चर्यकारक माहिती आत्मसात केली आहेस! मला खरच उत्सुकता आहे की या अद्भुत प्रवासातले किती काही तुझ्या मनात राहिले. आणि लक्षात ठेव – ही परीक्षा नाही जिथे तुझं सगळं परिपूर्ण असावं लागेल. ही यात्रा आहे साजरी करण्याची, त्या साऱ्या छान गोष्टींची ज्यांच्याबद्दल तुम्ही शिकलात या रोचक जगात! -**समुदायात सामील व्हा:** -- [Dev.to](https://dev.to/), [Stack Overflow](https://stackoverflow.com/), किंवा [GitHub](https://github.com/) वर काही डेव्हलपर समुदायांचे अनुसरण करा. प्रोग्रामिंग समुदाय नवशिक्यांसाठी खूप स्वागतार्ह आहे! -- YouTube वर काही नवशिक्यांसाठी उपयुक्त कोडिंग व्हिडिओ पहा. खूप चांगले निर्माते आहेत जे सुरुवातीला कसे वाटते हे लक्षात ठेवतात. -- स्थानिक मीटअप्स किंवा ऑनलाइन समुदायांमध्ये सामील होण्याचा विचार करा. विश्वास ठेवा, डेव्हलपर्स नवशिक्यांना मदत करायला खूप आवडतात! +[पॉस्ट-लेसन क्विझ द्या](https://ff-quizzes.netlify.app/web/) -> 🎯 **ऐका, मला तुम्हाला हे लक्षात ठेवायला सांगायचं आहे**: तुम्हाला एका रात्रीत कोडिंग मास्टर बनण्याची अपेक्षा नाही! सध्या, तुम्ही फक्त या अद्भुत नवीन जगाशी परिचित होत आहात ज्याचा तुम्ही भाग होणार आहात. वेळ घ्या, प्रवासाचा आनंद घ्या, आणि लक्षात ठेवा – तुम्ही ज्या प्रत्येक डेव्हलपरचे कौतुक करता ते एकदा तुमच्यासारखेच होते, उत्साही आणि कदाचित थोडेसे गोंधळलेले. हे पूर्णपणे सामान्य आहे, आणि याचा अर्थ तुम्ही योग्य दिशेने जात आहात. +## पुनरावलोकन आणि स्वाध्याय +**तुमचा वेळ घेऊन एक्सप्लोर करा आणि मजा करा!** +आज तुम्ही खूप काही शिकलात, आणि त्याचा अभिमान असायला हवा! आता मजेदार टप्पा येतो – ज्या विषयांनी तुमची उत्सुकता वाढवली त्या विषयांचा शोध घेण्याचा. लक्षात ठेवा, हे गृहकार्य नाही – ही एक साहसकथा आहे! +**तुमचे आवडते विषय अधिक खोलवर जाणून घ्या:** -## असाइनमेंट +**प्रोग्रामिंग भाषांसोबत हाताळणी करा:** +- तुमचे लक्ष वेधून घेतलेल्या २-३ भाषांच्या अधिकृत वेबसाइट्सला भेट द्या. प्रत्येकाची वेगळी व्यक्तिमत्त्व आणि कथा आहे! +- [CodePen](https://codepen.io/), [JSFiddle](https://jsfiddle.net/), किंवा [Replit](https://replit.com/) सारख्या ऑनलाईन कोडिंग प्लेग्राउंड्सचा वापर करा. प्रयोग करण्यास घाबरू नका – काहीच खराब होणार नाही! +- तुमच्या आवडत्या भाषेची उगमकथा वाचा. खरंच, काही कथा खूप रोमांचक असतात आणि त्यातून तुम्हाला समजू शकते की भाषा का आणि कशी काम करतात. -[डॉक्स वाचा](assignment.md) +**तुमचे नवीन साधनं जाणून घ्या:** +- Visual Studio Code डाउनलोड करा, जर आधी केले नसेल तर – हे फ्री आहे आणि तुम्हाला नक्कीच आवडेल! +- एक्सटेंशन्स मार्केटप्लेस थोडा वेळ बघा. हे तुमच्या कोड एडिटरसाठी अ‍ॅप स्टोअर सारखं आहे! +- तुमच्या ब्राउझरचे Developer Tools उघडा आणि फक्त क्लिक करा. सर्वकाही समजून घेण्याची गरज नाही – फक्त तेथे काय आहे ते जाणून घ्या. -> 💡 **तुमच्या असाइनमेंटसाठी एक छोटीशी प्रेरणा**: मला खूप आवडेल की तुम्ही काही नवीन साधनांचा शोध घ्यावा ज्यांचा आपण अद्याप उल्लेख केला नाही! आपण आधीच चर्चा केलेल्या एडिटर्स, ब्राउझर्स आणि कमांड लाइन टूल्स वगळा – विकासाच्या अद्भुत साधनांचे एक संपूर्ण विश्व आहे जे शोधण्याची वाट पाहत आहे. सक्रियपणे देखभाल केली जाणारी आणि जिवंत, उपयुक्त समुदाय असलेली साधने शोधा (यामध्ये सर्वोत्तम ट्यूटोरियल्स आणि सर्वात सहायक लोक असतात जेव्हा तुम्हाला अडचण येते आणि मदतीसाठी एखाद्या मैत्रीपूर्ण व्यक्तीची गरज असते). +**समुदायात सामील व्हा:** +- [Dev.to](https://dev.to/), [Stack Overflow](https://stackoverflow.com/), किंवा [GitHub](https://github.com/) वरील काही डेव्हलपर समुदायांना फॉलो करा. प्रोग्रामिंग समुदाय नवखे सदस्यांना खूप स्वागत करतो! +- YouTube वर काही सुरुवातीच्या सोप्या कोडिंग व्हिडिओज पहा. अनेक छान क्रिएटर्स आहेत जे सुरुवातीला असतानाचा अनुभव लक्षात ठेवतात. +- स्थानिक मीटअप्स किंवा ऑनलाइन समुदायात सहभागी होण्याचा विचार करा. विश्वास ठेवा, डेव्हलपर नवख्या लोकांना मदत करणं आवडतात! + +> 🎯 **असं लक्षात ठेवा**: तुम्हाला एका रात्रीत कोडिंगचा तज्ञ व्हायचे अपेक्षित नाही! सध्या, तुम्ही फक्त या अद्भुत नव्या जगाशी ओळख होत आहात. वेळ घ्या, प्रवासाचा आनंद घ्या, आणि लक्षात ठेवा – प्रत्येक डेव्हलपर ज्याला तुम्ही कौतुक करता तोही एकवेळी तुमच्याच स्थितीत बसून उत्साहित आणि थोडा संभ्रमित झाला होता. हे पूर्णपणे सामान्य आहे, आणि याचा अर्थ तुम्ही बरोबर करत आहात! + +## Assignment + +[Reading the Docs](assignment.md) + +> 💡 **तुमच्या असाइनमेंटसाठी एक सूचक टिप**: आम्ही अजून न वापरलेली काही साधने तुम्ही एक्सप्लोर केलीत तर छान वाटेल! आधीच सांगितलेल्या एडिटर्स, ब्राउझर्स आणि कमांड लाइन साधनांपासून दूर राहा – विकासासाठी अशी एक विशाल आणि आश्चर्यकारक दुनिया आहे जिथे बर्‍याच अद्भुत साधने आहेत. अशा साधनांचा शोध घ्या ज्यांचा सतत देखभाल होतो आणि ज्यांच्या समुदायांमध्ये उत्साहपूर्ण लोक असतात (अशा समुदायांकडे चांगली ट्यूटोरियल्स आणि मदत करण्यासाठी लोक असतात जेव्हा तुम्हाला अडचण येते). --- -## 🚀 तुमचा प्रोग्रामिंग प्रवासाचा टाइमलाइन +## 🚀 तुमच्या प्रोग्रामिंग प्रवासाचा टाइमलाइन -### ⚡ **पुढील 5 मिनिटांत तुम्ही काय करू शकता** -- [ ] तुमच्या लक्षात आलेल्या 2-3 प्रोग्रामिंग भाषांच्या वेबसाइट्स बुकमार्क करा -- [ ] Visual Studio Code डाउनलोड करा जर तुम्ही अजून केले नसेल +### ⚡ **पुढील ५ मिनिटांत तुम्ही काय करू शकता** +- [ ] तुम्हाला आवडलेल्या २-३ प्रोग्रामिंग भाषांच्या वेबसाइट्स जतन करा +- [ ] Visual Studio Code डाउनलोड करा जर आधी केले नसेल तर - [ ] तुमच्या ब्राउझरचे DevTools (F12) उघडा आणि कोणत्याही वेबसाइटवर क्लिक करा - [ ] एक प्रोग्रामिंग समुदायात सामील व्हा (Dev.to, Reddit r/webdev, किंवा Stack Overflow) -### ⏰ **तुमच्या एका तासात तुम्ही काय साध्य करू शकता** -- [ ] पोस्ट-लेसन क्विझ पूर्ण करा आणि तुमच्या उत्तरांवर विचार करा +### ⏰ **या तासात तुम्ही काय साध्य करू शकता** +- [ ] पोस्ट-लेसन क्विझ पूर्ण करा आणि तुमच्या उत्तरांचा विचार करा - [ ] GitHub Copilot एक्सटेंशनसह VS Code सेट करा - [ ] दोन वेगवेगळ्या प्रोग्रामिंग भाषांमध्ये ऑनलाइन "Hello World" उदाहरण प्रयत्न करा -- [ ] YouTube वर "डे इन द लाइफ ऑफ अ डेव्हलपर" व्हिडिओ पहा -- [ ] तुमच्या प्रोग्रामिंग भाषेच्या शोधकार्याची सुरुवात करा (चॅलेंजमधून) - -### 📅 **तुमचा आठवडाभराचा प्रवास** -- [ ] असाइनमेंट पूर्ण करा आणि 3 नवीन विकास साधनांचा शोध घ्या -- [ ] सोशल मीडियावर 5 डेव्हलपर्स किंवा प्रोग्रामिंग अकाउंट्सचे अनुसरण करा -- [ ] CodePen किंवा Replit वर काही छोटेसे तयार करण्याचा प्रयत्न करा (जरी "Hello, [तुमचे नाव]!" असेल तरी!) -- [ ] एखाद्या डेव्हलपरच्या कोडिंग प्रवासाबद्दल एक ब्लॉग पोस्ट वाचा -- [ ] व्हर्च्युअल मीटअपमध्ये सामील व्हा किंवा प्रोग्रामिंग टॉक पहा -- [ ] तुमच्या निवडलेल्या भाषेचे ऑनलाइन ट्यूटोरियल्ससह शिकण्यास सुरुवात करा - -### 🗓️ **तुमचा महिनाभराचा परिवर्तन** -- [ ] तुमचा पहिला छोटा प्रोजेक्ट तयार करा (जरी एक साधा वेबपेज असला तरी!) -- [ ] ओपन-सोर्स प्रोजेक्टमध्ये योगदान द्या (डॉक्युमेंटेशन सुधारण्यापासून सुरुवात करा) -- [ ] एखाद्याला मार्गदर्शन करा जो फक्त त्याचा प्रोग्रामिंग प्रवास सुरू करत आहे -- [ ] तुमची डेव्हलपर पोर्टफोलिओ वेबसाइट तयार करा -- [ ] स्थानिक डेव्हलपर समुदाय किंवा अभ्यास गटांशी संपर्क साधा -- [ ] तुमच्या पुढील शिकण्याच्या टप्प्याचे नियोजन सुरू करा - -### 🎯 **अंतिम विचार तपासणी** - -**पुढे जाण्यापूर्वी, एक क्षण साजरा करा:** -- आज प्रोग्रामिंगबद्दल तुम्हाला काय उत्साहित वाटले? -- कोणते साधन किंवा संकल्पना तुम्ही प्रथम शोधू इच्छिता? -- तुम्हाला हा प्रोग्रामिंग प्रवास सुरू करण्याबद्दल कसे वाटते? -- तुम्ही सध्या एखाद्या डेव्हलपरला कोणता प्रश्न विचारू इच्छिता? +- [ ] YouTube वर "डे इन द लाइफ ऑफ अ डेव्हलपर" व्हिडिओ पाहा +- [ ] तुमचा प्रोग्रामिंग भाषा शोध कार्य सुरू करा (चॅलेंजमधून) + +### 📅 **तुमचा आठवडाभराचा साहस** +- [ ] असाइनमेंट पूर्ण करा आणि ३ नवीन विकास साधने एक्सप्लोर करा +- [ ] सोशल मीडियावर ५ डेव्हलपर किंवा प्रोग्रामिंग अकाउंट फॉलो करा +- [ ] CodePen किंवा Replit मध्ये काहीतरी छोटं तयार करा (फक्त "Hello, [तुमचं नाव]!" पण चालेल!) +- [ ] कोणत्याही डेव्हलपरच्या कोडिंग प्रवासावरील ब्लॉग पोस्ट वाचा +- [ ] एक व्हर्च्युअल मीटअप किंवा प्रोग्रामिंग टॉक पाहा +- [ ] ऑनलाईन ट्युटोरियल्ससोबत तुमची निवडलेली भाषा शिकायला सुरुवात करा + +### 🗓️ **तुमचा महिनाभराचा रूपांतर** +- [ ] तुमचा पहिला लहान प्रोजेक्ट तयार करा (सोप्या वेबपेजसुद्धा चालेल!) +- [ ] एखाद्या ओपन-सोर्स प्रोजेक्टमध्ये योगदान द्या (प्रारंभ डॉक्स सुधारण्याने करा) +- [ ] ज्याने सुरुवात केली आहे अशा कोणाला मेंटर करा +- [ ] तुमची डेव्हलपर पोर्टफोलिओ वेबसाईट तयार करा +- [ ] स्थानिक डेव्हलपर समुदाय किंवा अभ्यास गटांशी संपर्क करा +- [ ] पुढील शिक्षण टप्प्याचे नियोजन करा + +### 🎯 **अंतिम विचारमंथन तपासणी** + +**पुढे जाण्याआधी, थोडा वेळ साजरा करा:** +- आज प्रोग्रामिंगमध्ये काय गोष्ट तुम्हाला उत्साहित केली? +- कोणत्याही साधनाशी किंवा संकल्पनेस पहिल्यांदा अभ्यासायचे आहे? +- या प्रोग्रामिंग प्रवासाची सुरुवात करताना तुम्हाला कसा वाटतो? +- तुम्हाला सध्या कोणता प्रश्न एका डेव्हलपरला विचारायचा आहे? ```mermaid journey - title Your Confidence Building Journey - section Today - Curious: 3: You - Overwhelmed: 4: You - Excited: 5: You - section This Week - Exploring: 4: You - Learning: 5: You - Connecting: 4: You - section Next Month - Building: 5: You - Confident: 5: You - Helping Others: 5: You + title आपला आत्मविश्वास वाढीचा प्रवास + section आज + उत्सुक: 3: You + संभ्रमित: 4: You + उत्साही: 5: You + section हे आठवडा + शोधत आहे: 4: You + शिकत आहे: 5: You + जोडत आहे: 4: You + section पुढचा महिना + बांधत आहे: 5: You + आत्मविश्वासी: 5: You + इतरांना मदत करत आहे: 5: You ``` - -> 🌟 **लक्षात ठेवा**: प्रत्येक तज्ञ एकदा नवशिक्या होता. प्रत्येक वरिष्ठ डेव्हलपरने एकदा तुमच्यासारखेच वाटले – उत्साही, कदाचित थोडेसे गोंधळलेले, आणि काय शक्य आहे याबद्दल नक्कीच उत्सुक. तुम्ही अद्भुत कंपनीत आहात, आणि हा प्रवास अविश्वसनीय होणार आहे. प्रोग्रामिंगच्या अद्भुत जगात तुमचे स्वागत आहे! 🎉 +> 🌟 **लक्षात ठेवा**: प्रत्येक तज्ञ एक वेळेकाळी नवशिक्या होता. प्रत्येक जुन्या डेव्हलपरला सध्या तुमच्यासारखेच वाटत होते – उत्साहाने भरलेला, कदाचित थोडा संभ्रमित पण निश्चितच काय शक्य आहे याबद्दल उत्सुक. तुम्ही अद्भुत सेवेत आहात, आणि हा प्रवास अविश्वसनीय असेल. प्रोग्रामिंगच्या अद्भुत दुनियेत स्वागत आहे! 🎉 --- -**अस्वीकरण**: -हा दस्तऐवज AI भाषांतर सेवा [Co-op Translator](https://github.com/Azure/co-op-translator) वापरून भाषांतरित करण्यात आला आहे. आम्ही अचूकतेसाठी प्रयत्नशील असलो तरी, कृपयास लक्षात ठेवा की स्वयंचलित भाषांतरे त्रुटी किंवा अचूकतेच्या अभावाने युक्त असू शकतात. मूळ भाषेतील दस्तऐवज हा अधिकृत स्रोत मानला जावा. महत्त्वाच्या माहितीसाठी, व्यावसायिक मानवी भाषांतराची शिफारस केली जाते. या भाषांतराचा वापर करून उद्भवलेल्या कोणत्याही गैरसमज किंवा चुकीच्या अर्थासाठी आम्ही जबाबदार नाही. \ No newline at end of file + +**सूचना**: +हा दस्तऐवज AI अनुवाद सेवा [Co-op Translator](https://github.com/Azure/co-op-translator) वापरून अनुवादित केला आहे. आम्ही अचूकतेसाठी प्रयत्नशील असलो तरी, कृपया लक्षात ठेवा की स्वयंचलित अनुवादांमध्ये चुका किंवा अचूकतेत त्रुटी असू शकतात. मूळ दस्तऐवज त्याच्या मूळ भाषेत अधिकृत स्रोत म्हणून मानले पाहिजे. महत्त्वाची माहिती असल्यास, व्यावसायिक मानवी अनुवाद घेणे शिफारस केले आहे. या अनुवादाच्या वापरामुळे होणाऱ्या कोणत्याही गैरसमजुती किंवा चुकीच्या अर्थव्याप्तीसाठी आम्ही जबाबदार आहोत असे नाही. + \ No newline at end of file diff --git a/translations/mr/AGENTS.md b/translations/mr/AGENTS.md index 86d19bc0d..b9b2e34b7 100644 --- a/translations/mr/AGENTS.md +++ b/translations/mr/AGENTS.md @@ -1,57 +1,57 @@ # AGENTS.md -## प्रकल्प अवलोकन +## प्रकल्पाचा आढावा -हा वेब विकासाच्या मूलभूत गोष्टी शिकवण्यासाठी तयार केलेला शैक्षणिक अभ्यासक्रमाचा संग्रह आहे. हा अभ्यासक्रम Microsoft Cloud Advocates यांनी विकसित केलेला १२ आठवड्यांचा सर्वसमावेशक कोर्स आहे, ज्यात JavaScript, CSS, आणि HTML या विषयांवर २४ हस्तांतरित धडे आहेत. +ही सुरुवातीच्या लोकांसाठी वेब विकासाच्या मूलतत्त्वांवर शिकवण्यासाठी शैक्षणिक अभ्यासक्रमाची रेपॉजिटरी आहे. हा अभ्यासक्रम मायक्रोसॉफ्ट क्लाऊड अ‍ॅडवोकेट्सने विकसित केलेला व्याप्त 12 आठवड्यांचा कोर्स आहे, ज्यामध्ये JavaScript, CSS, आणि HTML यावर 24 प्रत्यक्ष हाताळणी असलेल्या धड्यांचा समावेश आहे. ### मुख्य घटक -- **शैक्षणिक सामग्री**: प्रकल्प-आधारित मोड्यूलमध्ये संघटित २४ रचलेल्या धड्यांचा समावेश -- **प्रायोगिक प्रकल्प**: Terrarium, Typing Game, Browser Extension, Space Game, Banking App, Code Editor, आणि AI Chat Assistant -- **परस्पर संवादात्मक क्विझ**: प्रत्येकी ३ प्रश्नांसह ४८ क्विझ (धड्यांच्या आधी/नंतर मूल्यांकन) -- **बहुभाषीय समर्थन**: GitHub Actions द्वारे ५०+ भाषांसाठी स्वयंचलित भाषांतर -- **तंत्रज्ञान**: HTML, CSS, JavaScript, Vue.js 3, Vite, Node.js, Express, Python (AI प्रकल्पांसाठी) +- **शैक्षणिक सामग्री**: प्रकल्प-आधारित माड्यूलमध्ये आयोजित 24 संरचित धडे +- **प्रायोगिक प्रकल्प**: टेररियम, टायपिंग गेम, ब्राउझर विस्तार, स्पेस गेम, बँकिंग अॅप, कोड संपादक, आणि एआय चॅट सहाय्यक +- **परस्पर संवादात्मक क्विझ**: प्रत्येकात 3 प्रश्न असलेल्या 48 क्विझेस (धडा आधी/नंतर मूल्यांकनासाठी) +- **बहुभाषिक समर्थन**: GitHub Actions च्या माध्यमातून 50+ भाषा स्वचालित भाषांतर +- **तंत्रज्ञान**: HTML, CSS, JavaScript, Vue.js 3, Vite, Node.js, Express, Python (एआय प्रकल्पांसाठी) ### आर्किटेक्चर -- धड्यांच्या आधारे शैक्षणिक संच -- प्रत्येक धड्याच्या फोल्डरमध्ये README, कोड उदाहरणे, आणि उपाय असतात -- स्वतंत्र प्रकल्प स्वतंत्र निर्देशिकांमध्ये (quiz-app, विविध धड्यांचे प्रकल्प) +- धड्यावर आधारित रचना असलेली शैक्षणिक रेपॉजिटरी +- प्रत्येक धडा फोल्डरमध्ये README, कोड उदाहरणे, आणि उपाययोजना आहेत +- स्वतंत्र प्रकल्प स्वतंत्र निर्देशिकांमध्ये (quiz-app, विविध धडा प्रकल्प) - GitHub Actions वापरून भाषांतर प्रणाली (co-op-translator) -- Docsify द्वारे दस्तऐवज प्रदान आणि PDF स्वरूपात उपलब्ध +- Docsify द्वारे दस्तऐवजीकरण सर्व्हर आणि PDF स्वरूपात उपलब्ध -## सेटअप कमांड्स +## सेटअप कमांड -हा संग्रह मुख्यत्वे शैक्षणिक सामग्री वापरासाठी आहे. विशिष्ट प्रकल्पांसाठी काम करण्यासाठी: +ही रेपॉजिटरी मुख्यतः शैक्षणिक सामग्री वापरासाठी आहे. विशिष्ट प्रकल्पांवर काम करण्यासाठी: -### मुख्य संच सेटअप +### मुख्य रेपॉजिटरी सेटअप ```bash git clone https://github.com/microsoft/Web-Dev-For-Beginners.git cd Web-Dev-For-Beginners ``` -### Quiz App सेटअप (Vue 3 + Vite) +### क्विझ अॅप सेटअप (Vue 3 + Vite) ```bash cd quiz-app npm install npm run dev # विकास सर्व्हर सुरू करा -npm run build # उत्पादनासाठी तयार करा +npm run build # उत्पादनासाठी बांधा npm run lint # ESLint चालवा ``` -### Bank Project API (Node.js + Express) +### बँक प्रकल्प API (Node.js + Express) ```bash cd 7-bank-project/api npm install npm start # API सर्व्हर सुरू करा npm run lint # ESLint चालवा -npm run format # Prettier ने स्वरूपित करा +npm run format # Prettier सह फॉरमॅट करा ``` -### Browser Extension प्रकल्प +### ब्राउझर विस्तार प्रकल्प ```bash cd 5-browser-extension/solution @@ -59,15 +59,15 @@ npm install # ब्राउझर-विशिष्ट विस्तार लोडिंग सूचना पाळा ``` -### Space Game प्रकल्प +### स्पेस गेम प्रकल्प ```bash cd 6-space-game/solution npm install -# index.html ब्राउझरमध्ये उघडा किंवा Live Server वापरा +# ब्राउझरमध्ये index.html उघडा किंवा Live Server वापरा ``` -### Chat Project (Python Backend) +### चॅट प्रकल्प (Python Backend) ```bash cd 9-chat-project/solution/backend/python @@ -80,118 +80,118 @@ python api.py ### सामग्री योगदानकर्त्यांसाठी -1. आपल्या GitHub खात्यात हा संग्रह Fork करा -2. आपला Fork स्थानिक संगणकावर Clone करा -3. आपल्या बदलांसाठी नवीन ब्रांच Create करा +1. **रेपॉजिटरी फोर्क करा** तुमच्या GitHub खात्यात +2. **तुमचा फोर्क स्थानिकरित्या क्लोन करा** +3. **तुमच्या बदलांसाठी नवीन शाखा तयार करा** 4. धड्यांच्या सामग्री किंवा कोड उदाहरणांमध्ये बदल करा -5. संबंधित प्रकल्प निर्देशिकांमध्ये कोणतेही कोड बदल तपासा -6. योगदान मार्गदर्शक तत्त्वांनुसार pull requests सबमिट करा +5. संबंधित प्रकल्प निर्देशिकांमध्ये कोणतेही कोड बदल चाचणी करा +6. योगदान मार्गदर्शक तत्वे पाळून पुल रिक्वेस्ट सबमिट करा ### शिकणाऱ्यांसाठी -1. संग्रह Fork किंवा Clone करा -2. एकेक धड्यांच्या निर्देशिकांमध्ये जा -3. प्रत्येक धड्याचे README फाइल वाचा -4. https://ff-quizzes.netlify.app/web/ वर प्री-लेसन क्विझ पूर्ण करा -5. धड्याच्या फोल्डरमधील कोड उदाहरणांवर काम करा -6. असाइंमेंट आणि आव्हाने पूर्ण करा -7. पोस्ट-लेसन क्विझ घ्या +1. रेपॉजिटरी फोर्क किंवा क्लोन करा +2. धडा निर्देशिकांमध्ये क्रमाने जा +3. प्रत्येक धड्यासाठी README फायली वाचा +4. https://ff-quizzes.netlify.app/web/ येथे पूर्व-धडा क्विझ पूर्ण करा +5. धडा फोल्डरमधील कोड उदाहरणांवर काम करा +6. कार्ये आणि आव्हाने पूर्ण करा +7. पाठ-धडा क्विझ घ्या ### थेट विकास -- **दस्तऐवज**: मुळ निर्देशिकेत `docsify serve` चालवा (पोर्ट 3000) -- **Quiz App**: quiz-app निर्देशिकेत `npm run dev` वापरा -- **प्रकल्प**: HTML प्रकल्पांसाठी VS Code Live Server विस्तार वापरा +- **दस्तऐवजीकरण**: मूळ निर्देशिकेत `docsify serve` चालवा (पोर्ट 3000) +- **क्विझ अॅप**: quiz-app निर्देशिकेत `npm run dev` चालवा +- **प्रकल्प**: HTML प्रकल्पांसाठी VS कोड Live Server विस्तार वापरा - **API प्रकल्प**: संबंधित API निर्देशिकांमध्ये `npm start` चालवा -## चाचणी सूचना +## तपासणी सूचना -### Quiz App चाचणी +### क्विझ अॅप तपासणी ```bash cd quiz-app -npm run lint # कोड शैली संबंधित समस्या तपासा -npm run build # बिल्ड यशस्वी झाले आहे का ते पडताळा +npm run lint # कोड शैलीच्या समस्या तपासा +npm run build # बिल्ड यशस्वी होते का ते पडताळा ``` -### Bank API चाचणी +### बँक API तपासणी ```bash cd 7-bank-project/api npm run lint # कोड शैलीच्या समस्यांसाठी तपासा -node server.js # सर्व्हर त्रुटीशिवाय सुरू होते का ते तपासा +node server.js # त्रुटीशिवाय सर्व्हर सुरु होतो का तपासा ``` -### सामान्य चाचणी दृष्टिकोन +### सामान्य तपासणी पद्धत -- हा शैक्षणिक संग्रह सर्वसमावेशक स्वयंचलित चाचण्या नसलेला आहे -- मॅन्युअल चाचणीवर लक्ष: - - कोड उदाहरणे त्रुटीशिवाय चालतील का - - दस्तऐवजात दुवे बरोबर आहेत का - - प्रकल्पाचे बिल्ड यशस्वी आहेत का - - उदाहरणे सर्वोत्तम पध्दतींनुसार आहेत का +- ही शैक्षणिक रेपॉजिटरी व्यापक स्वयंचलित चाचण्या नसलेली आहे +- मॅन्युअल चाचणीवर लक्ष केंद्रीत: + - कोड उदाहरणी त्रुटीशिवाय चालू होतील + - दस्तऐवजीकरणातील दुवे योग्यरीत्या कार्य करतात + - प्रकल्पांचे बिल्ड यशस्वी पूर्ण होतात + - उदाहरणे उत्तम पद्धती पालन करतात -### सादर करण्यापूर्वी तपासणी +### सबमिशनपूर्व तपासण्या -- package.json असलेल्या फोल्डरमध्ये `npm run lint` चालवा -- मार्कडाउन लिंक वैध आहेत का तपासा -- ब्राउझर किंवा Node.js मध्ये कोड उदाहरणे तपासा -- भाषांतर योग्य रचना राखतात याची खात्री करा +- package.json असलेल्या निर्देशिकांमध्ये `npm run lint` चालवा +- markdown दुवे वैध आहेत याची खात्री करा +- ब्राउझर किंवा Node.js मध्ये कोड उदाहरणे चाचणी करा +- भाषांतर संरचनेचे योग्य पालन करते याची तपासणी करा ## कोड शैली मार्गदर्शक ### JavaScript -- आधुनिक ES6+ सिंटॅक्स वापरा -- प्रकल्पांमध्ये दिलेल्या ESLint कॉन्फिगरेशनचे पालन करा -- शैक्षणिक स्पष्टतेसाठी अर्थपूर्ण व्हेरिएबल आणि फंक्शन नावे वापरा -- संकल्पना स्पष्ट करणाऱ्या टिप्पण्यांचा समावेश करा -- जेथे सेटअप केलेले आहे, तेथे Prettier वापरा +- आधुनिक ES6+ संकलन वापरा +- प्रकल्पांत दिलेली मानक ESLint संरचना पाळा +- शैक्षणिक स्पष्टतेसाठी अर्थपूर्ण चल आणि फंक्शन नावे वापरा +- शिकणाऱ्यांसाठी संकल्पना समजावणारे टिप्पणी जोडा +- जिथे कॉन्फिगर केले आहे तिथे Prettier वापरा ### HTML/CSS -- सैमान्टिक HTML5 घटक वापरा -- प्रतिसादी डिझाइन तत्त्वे वापरा -- क्लास नावे स्पष्ट व समजण्यास सोपी ठेवा -- CSS तंत्रांविषयी शिकणाऱ्यांसाठी टिप्पण्या ठेवा +- अर्थपूर्ण HTML5 घटक वापरा +- प्रतिसादक्षम डिझाइन तत्वे पाळा +- स्पष्ट वर्ग नावे वापरा +- CSS तंत्रांवर शिकणाऱ्यांसाठी टिप्पणी जोडा ### Python -- PEP 8 शैली मार्गदर्शकांचे पालन करा -- स्पष्ट, शैक्षणिक कोड उदाहरणे द्या -- शिकण्यासाठी उपयुक्त असे टाइप हिंट्स वापरा +- PEP 8 शैली मार्गदर्शक पाळा +- स्पष्ट, शैक्षणिक कोड उदाहरणे +- शिकण्यासाठी उपयुक्त असलेल्या ठिकाणी टाइप हिन्ट्स वापरा ### Markdown दस्तऐवजीकरण -- स्पष्ट शीर्षक आणि उपशीर्षक संरचना -- भाषेची निर्दिष्टीसह कोड ब्लॉक्स -- अतिरिक्त संसाधनांसाठी दुवे -- `images/` निर्देशिकांतील स्क्रीनशॉट आणि प्रतिमा -- पोचण्यासाठी प्रतिमांसाठी Alt टेक्स्ट द्या +- स्पष्ट शीर्षक श्रेणी +- भाषा निर्दिष्ट कोड ब्लॉक्स +- अतिरिक्त स्रोतांशी दुवे +- `images/` निर्देशिकेतील स्क्रीनशॉट्स आणि प्रतिमा +- प्रवेशयोग्यता साठी प्रतिमांसाठी Alt टेक्स्ट ### फाइल संघटना -- धडे क्रमांकानुसार (1-getting-started-lessons, 2-js-basics इत्यादी) -- प्रत्येक प्रकल्पात `solution/` आणि बहुतेकदा `start/` किंवा `your-work/` निर्देशिका -- विशिष्ट धड्यांच्या `images/` फोल्डरमध्ये प्रतिमा संग्रहित -- भाषांतर `translations/{language-code}/` संरचनात +- धडे क्रमाने क्रमांकित (1-getting-started-lessons, 2-js-basics, इ.) +- प्रत्येक प्रकल्पात `solution/` आणि बहुधा `start/` किंवा `your-work/` निर्देशिका +- धडा-विशिष्ट `images/` फोल्डरमध्ये प्रतिमा साठविल्या जातात +- भाषांतर `translations/{language-code}/` संरचनेत -## बिल्ड आणि डिप्लॉयमेंट +## बिल्ड आणि वितरण -### Quiz App डिप्लॉयमेंट (Azure Static Web Apps) +### क्विझ अॅप वितरण (Azure Static Web Apps) -quiz-app Azure Static Web Apps डिप्लॉयमेंटसाठी कॉन्फिगर केलेले आहे: +क्विझ-अॅप Azure Static Web Apps वितरणासाठी कॉन्फिगर केलेले आहे: ```bash cd quiz-app npm run build # dist/ फोल्डर तयार करतो -# मुख्य शाखेत पुश केल्यावर GitHub Actions वर्कफ्लोद्वारे डिप्लॉय करतो +# मुख्य शाखेत प्रेषणावर GitHub Actions कार्यप्रवाहाद्वारे तैनात करतो ``` Azure Static Web Apps कॉन्फिगरेशन: -- **App location**: `/quiz-app` -- **Output location**: `dist` -- **Workflow**: `.github/workflows/azure-static-web-apps-ashy-river-0debb7803.yml` +- **अॅप स्थान**: `/quiz-app` +- **आउटपुट स्थान**: `dist` +- **वर्कफ्लो**: `.github/workflows/azure-static-web-apps-ashy-river-0debb7803.yml` ### दस्तऐवज PDF निर्मिती @@ -200,83 +200,83 @@ npm install # docsify-to-pdf स्थापित करा npm run convert # docs मधून PDF तयार करा ``` -### Docsify दस्तऐवज +### Docsify दस्तऐवजीकरण ```bash -npm install -g docsify-cli # डॉक्सिफाय जागतिक पातळीवर स्थापित करा -docsify serve # localhost:3000 वर सेवा द्या +npm install -g docsify-cli # Docsify जागतिक पातळीवर इन्स्टॉल करा +docsify serve # localhost:3000 वर सर्व्ह करा ``` ### प्रकल्प-विशिष्ट बिल्ड्स -प्रत्येक प्रकल्प निर्देशिकेत स्वतःची बिल्ड प्रक्रिया असू शकते: -- Vue प्रकल्प: `npm run build` उत्पादन बंडल तयार करते -- स्थिर प्रकल्प: बिल्ड टप्पा नाही, फाईल्स थेट सर्व्ह करा +प्रत्येक प्रकल्प निर्देशिकेकडे स्वतःचा बिल्ड प्रक्रिया असू शकते: +- Vue प्रकल्प: `npm run build` उत्पादन बंडल तयार करतो +- स्थिर प्रकल्प: बिल्ड टप्पा नाही, फायली थेट सर्व्ह करा -## पुल विनंती मार्गदर्शक +## पुल रिक्वेस्ट मार्गदर्शक ### शीर्षक स्वरूप -बदलाचा भाग स्पष्ट करणारे स्पष्ट, वर्णनात्मक शीर्षक वापरा: -- `[Quiz-app] Add new quiz for lesson X` -- `[Lesson-3] Fix typo in terrarium project` -- `[Translation] Add Spanish translation for lesson 5` -- `[Docs] Update setup instructions` +बदलाच्या क्षेत्राचा स्पष्ट, वर्णनात्मक शीर्षक वापरा: +- `[Quiz-app] धडा X साठी नवीन क्विझ जोडा` +- `[Lesson-3] टेररियम प्रकल्पातील टायपो दुरुस्त करा` +- `[Translation] धडा 5 साठी स्पॅनिश भाषांतर जोडा` +- `[Docs] सेटअप सूचना अद्यतनित करा` ### आवश्यक तपासण्या -PR सबमिट करण्यापूर्वी: +पुल रिक्वेस्ट सबमिट करण्यापूर्वी: 1. **कोड गुणवत्ता**: - - प्रभावित प्रकल्प निर्देशिकेत `npm run lint` चालवा - - सर्व lint त्रुटी व इशारे दुरुस्त करा + - प्रभावित प्रकल्प निर्देशिकांमध्ये `npm run lint` चालवा + - सर्व लिंट त्रुटी आणि इशारे दुरुस्त करा -2. **बिल्ड पुष्टीकरण**: +2. **बिल्ड सत्यापन**: - लागू असल्यास `npm run build` चालवा - - कोणतीही बिल्ड त्रुटी नाहीत याची खात्री करा + - कोणतीही बिल्ड त्रुटी नसल्याची खात्री करा -3. **लिंक वैधता**: - - सर्व मार्कडाउन लिंक तपासा - - प्रतिमांचे संदर्भ कार्यरत आहेत का तपासा +3. **दुवा पडताळणी**: + - सर्व markdown दुवे तपासा + - प्रतिमा संदर्भ कार्यरत आहेत का ते तपासा 4. **सामग्री पुनरावलोकन**: - - स्पेलिंग आणि व्याकरण तपासा + - स्पेलिंग आणि व्याकरणासाठी प्रूफरीड करा - कोड उदाहरणे बरोबर आणि शैक्षणिक आहेत याची खात्री करा - - भाषांतर मूळ अर्थ राखते याची पुष्टी करा + - भाषांतरे मूळ अर्थ जपतात का तपासा -### योगदान अटी +### योगदान आवश्यकता -- Microsoft CLA सहमत व्हा (प्रथम PR वर स्वयंचलित तपासणी) -- [Microsoft Open Source Code of Conduct](https://opensource.microsoft.com/codeofconduct/) चे पालन करा -- तपशीलवार मार्गदर्शकांसाठी [CONTRIBUTING.md](./CONTRIBUTING.md) पहा -- लागू असल्यास PR वर्णनात इश्यू नंबर संदर्भित करा +- Microsoft CLA सह सहमती द्या (पहिल्या PR वर स्वयंचलित तपासणी) +- [Microsoft Open Source Code of Conduct](https://opensource.microsoft.com/codeofconduct/) पालन करा +- तपशीलवार मार्गदर्शनासाठी [CONTRIBUTING.md](./CONTRIBUTING.md) पाहा +- लागू असल्यास पुल रिक्वेस्ट वर्णनात समस्यांचे संख्या नमूद करा ### पुनरावलोकन प्रक्रिया -- PR मेंटेनर्स आणि समुदायाद्वारे पुनरावलोकन केले जातात -- शैक्षणिक स्पष्टतेवर भर दिला जातो -- कोड उदाहरणे वर्तमान सर्वोत्तम पद्धतींनुसार असावीत -- भाषांतर अचूक आणि सांस्कृतिकदृष्ट्या योग्य याची तपासणी केली जाते +- PR पालक आणि समुदायाकडून पुनरावलोकन केले जातात +- शैक्षणिक स्पष्टतेला प्राधान्य दिले जाते +- कोड उदाहरणे सध्याच्या सर्वोत्तम पद्धतींचे पालन करतात +- भाषांतर अचूकता आणि सांस्कृतिक योग्यतेसाठी पुनरावलोकित केले जाते ## भाषांतर प्रणाली ### स्वयंचलित भाषांतर -- co-op-translator कार्यप्रवाहासह GitHub Actions वापरतो -- ५०+ भाषांमध्ये स्वयंचलित भाषांतर -- मुख्य निर्देशिकांमधील स्त्रोत फाईल्स -- भाषांतर फाईल्स `translations/{language-code}/` मध्ये +- GitHub Actions सह co-op-translator वर्कफ्लो वापरते +- 50+ भाषांमध्ये स्वयंचलित भाषांतर करते +- मुख्य निर्देशिकांमध्ये स्त्रोत फाइल्स +- भाषांतरित फाइल्स `translations/{language-code}/` निर्देशिकांमध्ये ### मॅन्युअल भाषांतर सुधारणा जोडणे -1. `translations/{language-code}/` फाईल शोधा -2. संरचना राखून सुधारणा करा -3. कोड उदाहरण कार्यरत आहेत याची खात्री करा -4. स्थानिकृत क्विझ सामग्री तपासा +1. `translations/{language-code}/` मध्ये फाइल शोधा +2. रचना जपून सुधारणा करा +3. कोड उदाहरणे कार्यशील राहतील याची खात्री करा +4. स्थानिकृत क्विझ सामग्रीची चाचणी करा ### भाषांतर मेटाडेटा -भाषांतरित फाईल्समध्ये मेटाडेटा हेडर असतो: +भाषांतरित फाइल्समध्ये मेटाडेटा शीर्षलेख समाविष्ट: ```markdown ``` -## डिबगिंग आणि समस्यांवर उपाय +## डीबगिंग आणि समस्या निवारण -### सहसा आढळणाऱ्या समस्या +### सामान्य समस्या -**Quiz app च सुरू होत नाही**: -- Node.js ची आवृत्ती तपासा (v14+ शिफारसीय) -- `node_modules` आणि `package-lock.json` हटवा, पुन्हा `npm install` करा -- पोर्ट विवाद तपासा (डिफॉल्ट: Vite पोर्ट 5173 वापरतो) +**क्विझ अॅप सुरू होत नाही**: +- Node.js आवृत्ती तपासा (v14+ शिफारसीय) +- `node_modules` आणि `package-lock.json` हटवा, नंतर `npm install` पुन्हा करा +- पोर्ट वाद तपासा (मूलत: Vite `5173` पोर्ट वापरतो) **API सर्व्हर सुरू होत नाही**: -- Node.js आवृत्ती किमान (node >=10) असण्याची खात्री करा -- पोर्ट आधीच वापरात आहे का तपासा -- सर्व dependency इन्स्टॉल शिल्लक आहेत का पहा (`npm install`) +- Node.js ची किमान आवश्यकता पूर्ण आहे का तपासा (node >=10) +- पोर्ट आधीच वापरात नाही का ते पहा +- सर्व अवलंबित्वे `npm install` वापरून इन्स्टॉल केले आहेत का तपासा -**ब्राउझर एक्स्टेंशन लोड होत नाही**: -- manifest.json योग्यरित्या फॉरमॅट आहे का तपासा +**ब्राउझर विस्तार लोड होत नाही**: +- manifest.json योग्यरित्या फॉरमॅट केले आहे का तपासा - ब्राउझर कन्सोलमधील त्रुटी तपासा -- ब्राउझर-विशिष्ट एक्स्टेंशन इंस्टॉलेशन सूचना फॉलो करा +- ब्राउझर-विशिष्ट विस्तार इन्स्टॉलेशन सूचना पाळा -**Python chat प्रकल्प समस्या**: -- OpenAI पॅकेज इन्स्टॉल आहे का: `pip install openai` -- GITHUB_TOKEN पर्यावरण व्हेरिएबल सेट आहे का तपासा -- GitHub Models प्रवेश परवानग्या बघा +**Python चॅट प्रकल्प समस्या**: +- OpenAI पॅकेज इन्स्टॉल केले आहे का: `pip install openai` +- GITHUB_TOKEN पर्यावरण चल सेट आहे का तपासा +- GitHub मॉडेल्सचा प्रवेश परवानगी तपासा **Docsify दस्तऐवज सेवा करत नाही**: -- ग्लोबली docsify-cli इन्स्टॉल करा: `npm install -g docsify-cli` -- संग्रहाच्या मुळ फोल्डरमधून चालवा +- docsify-cli जागतिकरित्या इंस्टॉल करा: `npm install -g docsify-cli` +- रेपॉजिटरी मूळ निर्देशिकेतून चालवा - `docs/_sidebar.md` अस्तित्वात आहे का तपासा -### विकास पर्यावरण टिपा +### विकास पर्यावरण टिप्स - HTML प्रकल्पांसाठी VS Code Live Server विस्तार वापरा -- ESLint आणि Prettier विस्तार इन्स्टॉल करा सुसंगत स्वरूपासाठी -- JavaScript डिबग करण्यासाठी ब्राउझर DevTools वापरा -- Vue प्रकल्पांसाठी Vue DevTools ब्राउझर विस्तार इन्स्टॉल करा +- सुसंगत स्वरूपासाठी ESLint आणि Prettier विस्तार इन्स्टॉल करा +- JavaScript डीबगिंगसाठी ब्राउझर DevTools वापरा +- Vue प्रकल्पांसाठी, Vue DevTools ब्राउझर विस्तार इन्स्टॉल करा ### कामगिरी विचार -- ५०+ भाषांमधील बरेच भाषांतरित फाईल्स असल्याने संपूर्ण क्लोन मोठे असते -- फक्त सामग्रीसाठी काम करत असल्यास shallow clone वापरा: `git clone --depth 1` -- इंग्रजी सामग्रीवर काम करताना भाषांतर शोधांतून वगळा -- प्रथम वेळ npm install, Vite बिल्ड इत्यादीमुळे बिल्ड प्रक्रिया संथ असू शकतात +- भाषांतरित फाइल्सची मोठी संख्या (50+ भाषा) असल्यामुळे पुर्ण क्लोन मोठे असू शकतात +- फक्त सामग्रीवर काम करत असल्यास, `git clone --depth 1` वापरा +- इंग्रजी सामग्रीवर काम करताना भाषांतर शोधांमधून वगळा +- पहिल्या चालनावर बिल्ड प्रक्रिया मंद होऊ शकते (npm install, Vite build) ## सुरक्षा विचार -### पर्यावरण व्हेरिएबल्स +### पर्यावरण चल -- API की संग्रहात कधीही कमिट करू नका -- `.env` फाईल्स वापरा (आधीच `.gitignore` मध्ये आहेत) -- प्रकल्प READMEs मध्ये आवश्यक पर्यावरण व्हेरिएबल्स दस्तऐवजीकरण करा +- API की रेपॉजिटरीमध्ये कधीही कमिट करू नयेत +- `.env` फाइल्स वापरा (आधीच `.gitignore` मध्ये आहेत) +- प्रकल्पांच्या README मध्ये आवश्यक पर्यावरण चल दस्तऐवज करा ### Python प्रकल्प -- वर्च्युअल एन्व्हायर्नमेंट वापरा: `python -m venv venv` -- Dependencies अद्ययावत ठेवा -- GitHub टोकन्सला कमी परवानग्या द्या +- आभासी पर्यावरण वापरा: `python -m venv venv` +- अवलंबित्व अपडेट ठेवा +- GitHub टोकन्सकडे कमीतकमी परवानगी द्या -### GitHub Models प्रवेश +### GitHub मॉडेल्स प्रवेश -- GitHub Models साठी Personal Access Tokens (PAT) आवश्यक -- टोकन्स पर्यावरण व्हेरिएबल्स म्हणून साठवा -- टोकन्स किंवा क्रेडेन्शियल्स कधीही कमिट करू नका +- GitHub मॉडेल्ससाठी व्यक्तीगत प्रवेश टोकन्स (PAT) आवश्यक +- टोकन्स पर्यावरण चल म्हणून संग्रहित करा +- टोकन्स किंवा कागदपत्रे कधीही कमिट करू नका -## अतिरिक्त टीप +## अतिरिक्त नोंदी -### लक्षित प्रेक्षक +### उद्दिष्ट प्रेक्षक -- वेब विकासातील पूर्ण नवीन विद्यार्थी -- विद्यार्थी आणि स्वअध्ययन करणारे -- वर्गखोलांसाठी शिक्षक -- सुलभता आणि हळूहळू कौशल्य निर्माणीसाठी डिझाइन केलेली सामग्री +- वेब विकासासाठी पूर्णस्वरुपी नवशिके +- विद्यार्थी आणि स्वयं-अभ्यासक +- वर्गातील शिक्षक जे अभ्यासक्रम वापरतात +- सामग्री प्रवेशयोग्य आणि क्रमशः कौशल्य वाढीसाठी डिझाइन केली आहे ### शैक्षणिक तत्त्वज्ञान -- प्रकल्प-आधारित शिक्षण पद्धत -- वारंवार ज्ञान तपासण्या (क्विझ) -- हाताने कोडिंग सराव -- प्रत्यक्ष जीवनातील अनुप्रयोग उदाहरणे -- फ्रेमवर्कच्या आधी मूलभूत गोष्टींवर लक्ष +- प्रकल्प-आधारित शिकणे +- वारंवार ज्ञान तपासणी (क्विझ) +- हस्तक्षेप कोडिंग सराव +- प्रत्यक्ष अंमलबजावणी उदाहरणे +- फ्रेमवर्कच्या आधी मूलतत्त्वांवर लक्ष देणे -### संच देखभाल +### रेपॉजिटरी देखभाल -- सक्रिय शिकणाऱ्या आणि योगदानकर्त्यांचा समुदाय -- सहाय्यक सामग्री आणि अवलंबनांचे नियमित अद्यतने -- मेंटेनर्सने समस्या आणि चर्चांचे निरीक्षण -- GitHub Actions द्वारे भाषांतर अद्यतने स्वयंचलित +- शिकणाऱ्या आणि योगदान देणारे सक्रिय समुदाय +- अवलंबित्वे आणि सामग्रीचे नियमित अद्यतने +- समस्या आणि चर्चा तपासणारे मेंटेनर्स +- GitHub Actions मार्फत भाषांतर अद्यतने स्वयंचलित ### संबंधित संसाधने - [Microsoft Learn modules](https://docs.microsoft.com/learn/) - [Student Hub resources](https://docs.microsoft.com/learn/student-hub/) -- [GitHub Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot) शिकणाऱ्यांसाठी शिफारसीय -- अतिरिक्त कोर्सेस: Generative AI, Data Science, ML, IoT अभ्यासक्रम उपलब्ध +- शिकणाऱ्यांसाठी शिफारस केलेले [GitHub Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot) +- अतिरिक्त कोर्सेस: जनरेटिव्ह AI, डेटा सायन्स, ML, IoT अभ्यासक्रम उपलब्ध -### विशिष्ट प्रकल्पांवर काम करणे +### विशिष्ट प्रकल्पांसोबत काम करणे -वैयक्तिक प्रकल्पांसाठी तपशीलवार सूचना पाहण्यासाठी README फाइल्स पहा: +वैयक्तिक प्रकल्पांवरील तपशीलांसाठी README फायली पहा: - `quiz-app/README.md` - Vue 3 क्विझ अॅप्लिकेशन -- `7-bank-project/README.md` - बँकिंग अॅप्लिकेशन ऑथेंटिकेशनसह -- `5-browser-extension/README.md` - ब्राउझर एक्स्टेंशन विकास +- `7-bank-project/README.md` - प्रमाणीकरणासह बँकिंग अॅप्लिकेशन +- `5-browser-extension/README.md` - ब्राउझर विस्तार विकास - `6-space-game/README.md` - कॅनव्हास-आधारित गेम विकास -- `9-chat-project/README.md` - AI चॅट सहाय्यक प्रकल्प +- `9-chat-project/README.md` - एआय चॅट सहाय्यक प्रकल्प -### Monorepo रचना +### मोनोरिपॉ रचना -समांतर प्रकल्प असलेले पारंपारिक मोनोरिपो नसले तरी, या संग्रहात अनेक स्वतंत्र प्रकल्प आहेत: -- प्रत्येक धडा स्वतंत्र आहे -- प्रकल्प एकमेकांशी dependency शेअर करत नाहीत -- इतरांवर परिणाम न होता वैयक्तिक प्रकल्पांवर काम करा -- पूर्ण अभ्यासक्रमाचा अनुभव घेण्यासाठी पूर्ण संग्रह क्लोन करा +पारंपरिक मोनोरिपॉ नसेल तरी, ही रेपॉजिटरी अनेक स्वतंत्र प्रकल्पांचे समावेश आहे: +- प्रत्येक धडा स्वतःमध्ये संपूर्ण +- प्रकल्प एकमेकांचे अवलंबित्व शेअर करत नाहीत +- स्वतंत्र प्रकल्पांवर काम करा, इतरांवर परिणाम न होता +- पूर्ण अभ्यासक्रमाचा अनुभव घेण्यासाठी संपूर्ण रेपॉ क्लोन करा --- -**अस्वीकरण**: -हा दस्तऐवज AI अनुवाद सेवा [Co-op Translator](https://github.com/Azure/co-op-translator) वापरून अनुवादित केला आहे. आम्ही अचूकतेसाठी प्रयत्नशील असलो तरी, कृपया लक्षात घ्या की स्वयंचलित अनुवादात चुका किंवा असमर्थने असू शकतात. मूळ दस्तऐवज त्याच्या स्थानिक भाषेत अधिकृत स्रोत मानला जावा. महत्त्वाच्या माहितीकरिता व्यावसायिक मानवी अनुवाद करण्याची शिफारस केली जाते. या अनुवादाच्या वापरामुळे उद्भवलेल्या कोणत्याही गैरसमजुती किंवा चुकीच्या अर्थालाबाबत आम्ही जबाबदार नाही. +**स्पष्टीकरण**: +हा दस्तऐवज AI अनुवाद सेवा [Co-op Translator](https://github.com/Azure/co-op-translator) वापरून अनुवादित करण्यात आला आहे. आम्ही अचूकतेसाठी प्रयत्न करतो, तरी कृपया लक्षात ठेवा की स्वयंचलित अनुवादांमध्ये त्रुटी किंवा अचूकतेत फरक असू शकतो. मूळ दस्तऐवज त्याच्या स्थानिक भाषेत अधिकृत स्रोत मानला जावा. महत्वाच्या माहितीसाठी व्यावसायिक मानवी अनुवाद शिफारस केला जातो. या अनुवादाच्या वापरामुळे उद्भवणाऱ्या कोणत्याही गैरसमजुती किंवा चुकीच्या अर्थामुळे आम्ही जबाबदार नाही. \ No newline at end of file diff --git a/translations/mr/README.md b/translations/mr/README.md index 0529a6979..419a56225 100644 --- a/translations/mr/README.md +++ b/translations/mr/README.md @@ -10,203 +10,212 @@ [![Microsoft Foundry Discord](https://dcbadge.limes.pink/api/server/nTYy5BXMWG)](https://discord.gg/nTYy5BXMWG) -# सुरुवातीसाठी वेब विकास - एक अभ्यासक्रम +# नवशिक्यांसाठी वेब विकास - एक अभ्यासक्रम -Microsoft Cloud Advocates कडून दिलेल्या 12 आठवड्यांच्या सखोल अभ्यासक्रमाद्वारे वेब विकासाच्या मूलभूत गोष्टी शिकण्यासाठी. 24 धड्यांपैकी प्रत्येकात JavaScript, CSS आणि HTML यांचा अभ्यास प्रॅक्टिकल प्रोजेक्ट्स जसे की टेरारियम, ब्राऊझर एक्सटेंशन्स आणि स्पेस गेम्स यांच्यामार्फत केला जातो. क्विझ, चर्चा आणि व्यावहारिक असाइनमेंट्समध्ये सहभागी व्हा. आमच्या प्रभावी प्रोजेक्ट-आधारित शिक्षण पद्धतीने तुमच्या कौशल्यांना वाढवा आणि ज्ञान अधिक चांगल्या प्रकारे ठेवण्यास मदत करा. आजच तुमची कोडींग यात्रा सुरू करा! +Microsoft Cloud Advocates यांनी तयार केलेल्या 12 आठवड्यांच्या सखोल कोर्ससह वेब विकासाची मूलतत्त्वे शिका. 24 धड्यांपैकी प्रत्येकात JavaScript, CSS, आणि HTML मध्ये हाताळणी करून टेरारियम, ब्राऊझर विस्तार, आणि अवकाश खेळांसारख्या प्रकल्पांद्वारे सखोल अभ्यास केला आहे. क्विझ, चर्चासत्रं, आणि व्यावहारिक कामांमध्ये सहभाग घ्या. आमच्या प्रभावी प्रकल्पाधारित पद्धतीने तुमच्या कौशल्यात सुधारणा करा आणि तुमच्या ज्ञानाची जास्तीत जास्त जपून ठेवा. आजच तुमची कोडिंग यात्रा सुरू करा! Azure AI Foundry Discord समुदायात सामील व्हा [![Microsoft Foundry Discord](https://dcbadge.limes.pink/api/server/nTYy5BXMWG)](https://discord.gg/nTYy5BXMWG) -हे साधने वापरायला सुरुवात करण्यासाठी खालील चरणांचे पालन करा: -1. **रिपॉजिटरी फोर्क करा**: क्लिक करा [![GitHub forks](https://img.shields.io/github/forks/microsoft/Web-Dev-For-beginners.svg?style=social&label=Fork)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/fork) -2. **रिपॉजिटरी क्लोन करा**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git` -3. [**Azure AI Foundry Discord मध्ये सामील व्हा आणि तज्ञ व इतर डेव्हलपरशी भेटा**](https://discord.com/invite/ByRwuEEgH4) +या संसाधनांचा वापर सुरू करण्यासाठी खालील चरणांचे अनुसरण करा: +1. **रिपॉझिटरी फोर्क करा**: क्लिक करा [![GitHub forks](https://img.shields.io/github/forks/microsoft/Web-Dev-For-beginners.svg?style=social&label=Fork)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/fork) +2. **रिपॉझिटरी क्लोन करा**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git` +3. [**Azure AI Foundry Discord मध्ये सामील व्हा आणि तज्ञ व सहकारी विकसकांशी भेटा**](https://discord.com/invite/ByRwuEEgH4) ### 🌐 बहुभाषिक समर्थन -#### GitHub Action द्वारे समर्थित (स्वयंचलित व सदैव अद्यतने) +#### GitHub Action (स्वयंचलित व सदैव अद्ययावत) द्वारे समर्थित [Arabic](../ar/README.md) | [Bengali](../bn/README.md) | [Bulgarian](../bg/README.md) | [Burmese (Myanmar)](../my/README.md) | [Chinese (Simplified)](../zh-CN/README.md) | [Chinese (Traditional, Hong Kong)](../zh-HK/README.md) | [Chinese (Traditional, Macau)](../zh-MO/README.md) | [Chinese (Traditional, Taiwan)](../zh-TW/README.md) | [Croatian](../hr/README.md) | [Czech](../cs/README.md) | [Danish](../da/README.md) | [Dutch](../nl/README.md) | [Estonian](../et/README.md) | [Finnish](../fi/README.md) | [French](../fr/README.md) | [German](../de/README.md) | [Greek](../el/README.md) | [Hebrew](../he/README.md) | [Hindi](../hi/README.md) | [Hungarian](../hu/README.md) | [Indonesian](../id/README.md) | [Italian](../it/README.md) | [Japanese](../ja/README.md) | [Kannada](../kn/README.md) | [Korean](../ko/README.md) | [Lithuanian](../lt/README.md) | [Malay](../ms/README.md) | [Malayalam](../ml/README.md) | [Marathi](./README.md) | [Nepali](../ne/README.md) | [Nigerian Pidgin](../pcm/README.md) | [Norwegian](../no/README.md) | [Persian (Farsi)](../fa/README.md) | [Polish](../pl/README.md) | [Portuguese (Brazil)](../pt-BR/README.md) | [Portuguese (Portugal)](../pt-PT/README.md) | [Punjabi (Gurmukhi)](../pa/README.md) | [Romanian](../ro/README.md) | [Russian](../ru/README.md) | [Serbian (Cyrillic)](../sr/README.md) | [Slovak](../sk/README.md) | [Slovenian](../sl/README.md) | [Spanish](../es/README.md) | [Swahili](../sw/README.md) | [Swedish](../sv/README.md) | [Tagalog (Filipino)](../tl/README.md) | [Tamil](../ta/README.md) | [Telugu](../te/README.md) | [Thai](../th/README.md) | [Turkish](../tr/README.md) | [Ukrainian](../uk/README.md) | [Urdu](../ur/README.md) | [Vietnamese](../vi/README.md) -> **स्थानिकरित्या क्लोन करण्यास प्राधान्य द्याल का?** - -> या रिपॉजिटरीमध्ये 50+ भाषा अनुवाद आहेत ज्यामुळे डाउनलोड साईज लक्षणीय वाढतो. केवळ मूळ रिपॉजिटरी क्लोन करण्यासाठी, स्पार्स चेकआउट वापरा: +> **स्थानिक स्वरूपात क्लोन करावे का?** +> +> या रिपॉझिटरीमध्ये 50 पेक्षा जास्त भाषा अनुवादांचा समावेश आहे ज्यामुळे डाउनलोडचा आकार खूप वाढतो. अनुवादांशिवाय क्लोन करण्यासाठी, sparse checkout वापरा: +> +> **Bash / macOS / Linux:** > ```bash > git clone --filter=blob:none --sparse https://github.com/microsoft/Web-Dev-For-Beginners.git > cd Web-Dev-For-Beginners > git sparse-checkout set --no-cone '/*' '!translations' '!translated_images' > ``` -> हे तुम्हाला कोर्स पूर्ण करण्यासाठी आवश्यक असलेली सर्वकाही अधिक जलद डाउनलोड करण्यास मदत करेल. +> +> **CMD (Windows):** +> ```cmd +> git clone --filter=blob:none --sparse https://github.com/microsoft/Web-Dev-For-Beginners.git +> cd Web-Dev-For-Beginners +> git sparse-checkout set --no-cone "/*" "!translations" "!translated_images" +> ``` +> +> यामुळे आपल्याला कोर्स पूर्ण करण्यासाठी आवश्यक असलेले सर्व काही वेगाने डाउनलोड होते. -**जर तुम्हाला अतिरिक्त भाषांमध्ये समर्थन हवे असल्यास, ते [इथे](https://github.com/Azure/co-op-translator/blob/main/getting_started/supported-languages.md) यादी रूपात दिले आहे** +**अधिक भाषांमध्ये अनुवाद हवा असल्यास, ते [येथे](https://github.com/Azure/co-op-translator/blob/main/getting_started/supported-languages.md) यादीबद्ध आहेत** [![Open in Visual Studio Code](https://img.shields.io/static/v1?logo=visualstudiocode&label=&message=Open%20in%20Visual%20Studio%20Code&labelColor=2c2c32&color=007acc&logoColor=007acc)](https://open.vscode.dev/microsoft/Web-Dev-For-Beginners) #### 🧑‍🎓 _तुम्ही विद्यार्थी आहात का?_ -[**विद्यार्थी हब पृष्ठ**](https://docs.microsoft.com/learn/student-hub/?WT.mc_id=academic-77807-sagibbon) भेट द्या जिथे तुम्हाला सुरुवातीसाठी साधने, विद्यार्थी पॅक आणि अगदी मोफत सर्टिफिकेट व्हाउचर मिळवण्याचे मार्ग देखील सापडतील. हा पृष्ठ तुम्हाला आवर्जून बुकमार्क करायचा आणि वेळोवेळी तपासायचा आहे कारण आम्ही दर महिन्याला सामग्री बदलतो. +[**विद्यार्थी हब पृष्ठ**](https://docs.microsoft.com/learn/student-hub/?WT.mc_id=academic-77807-sagibbon) भेट द्या जिथे तुम्हाला नवशिक्यांसाठी संसाधने, विद्यार्थी पॅक आणि अगदी मोफत प्रमाणपत्र व्हाउचर मिळतील. हाच पृष्ठ तुम्हाला आवर्जून बुकमार्क करावे आणि वेळोवेळी तपासावे कारण आम्ही दरमहा सामग्री बदलतो. -### 📣 घोषणा - नवीन GitHub Copilot Agent मोड आव्हाने पूर्ण करा! +### 📣 घोषणा - नवीन GitHub Copilot Agent मोड आव्हाने पूर्ण करायची! -नवीन आव्हान जोडा, "GitHub Copilot Agent Challenge 🚀" हा बहुसंख्य अध्यायांमध्ये शोधा. हा नवीन आव्हान तुम्हाला GitHub Copilot आणि Agent मोड वापरून पूर्ण करायचा आहे. जर तुम्ही कधीही Agent मोड वापरला नसेल तर तो फक्त मजकूर तयार करणे नव्हे तर फायली तयार करणे, संपादित करणे, कमांड्स चालवणे आणि आणखी बरेच काही करू शकतो. +नवीन आव्हान जोडले गेले आहे, बहुतेक प्रकरणांमध्ये "GitHub Copilot Agent Challenge 🚀" शोधा. GitHub Copilot आणि Agent मोड वापरून पूर्ण करायचे हे नवीन आव्हान आहे. जर तुम्ही पूर्वी Agent मोड वापरला नसेल तर तो फक्त मजकूर तयार करत नाही तर फाईल तयार करणे, संपादित करणे, कमांड चालवणे इत्यादीही करू शकतो. -### 📣 घोषणा - _Generative AI वापरून नवीन प्रोजेक्ट तयार करा_ +### 📣 घोषणा - _Generative AI वापरून नवीन प्रोजेक्ट तयार करा_ -नवीन AI सहायक प्रोजेक्ट नुकताच जोडला गेला आहे, तपासा [प्रोजेक्ट](./9-chat-project/README.md) +नवीन AI साहायक प्रोजेक्ट नुकताच जोडले गेले आहे, ते पाहा [प्रोजेक्ट](./9-chat-project/README.md) -### 📣 घोषणा - _Generative AI साठी नवीन अभ्यासक्रम_ JavaScript साठी नुकताच रिलीज झाला आहे +### 📣 घोषणा - _Generative AI साठी JavaScript चा नवीन अभ्यासक्रम_ नुकताच प्रकाशित झाला आहे आमचा नवीन Generative AI अभ्यासक्रम मिस करू नका! -सुरू करण्यासाठी भेट द्या [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course)! +प्रारंभ करण्यासाठी भेट द्या [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course)! ![Background](../../translated_images/mr/background.148a8d43afde5730.webp) -- मूलभूतांसह RAG पर्यंतच्या सर्व गोष्टींचे धडे. -- Historical characters सह संवाद करा GenAI आणि आमच्या सोबतीच्या अॅपचा वापर करून. -- मजेदार आणि आकर्षक कथा, तुम्ही वेळ प्रवास करत असाल! +- मूलभूत गोष्टींपासून RAG पर्यंत सर्व विषयांना स्पर्श करणारे धडे. +- GenAI आणि आमच्या सोबतीच्या अॅपसह ऐतिहासिक पात्रांशी संवाद साधा. +- मजेदार आणि गुंतवणूक करणारी कथा, तुम्ही काळ प्रवास कराल! ![character](../../translated_images/mr/character.5c0dd8e067ffd693.webp) -प्रत्येक धड्यात एक असाइनमेंट पूर्ण करण्यासाठी, ज्ञान तपासणी आणि आव्हान दिलेले आहे जे तुम्हाला खालील विषय शिकण्यास मार्गदर्शन करते: +प्रत्येक धड्यात पूर्ण करण्यासाठी असाइनमेंट, ज्ञान तपासणी आणि आव्हान दिलेले आहे जे तुम्हाला खालील विषय शिकण्यात मार्गदर्शन करेल: - प्रॉम्प्टिंग आणि प्रॉम्प्ट इंजिनिअरिंग -- मजकूर व प्रतिमा अॅप जनरेशन -- शोध अॅप्स +- मजकूर आणि प्रतिमा अॅप निर्माण +- सर्च अॅप्स -सुरू करण्यासाठी भेट द्या [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course)! +प्रारंभ करण्यासाठी भेट द्या [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course)! ## 🌱 सुरुवात करणे -> **शिक्षकांनो**, आम्ही या अभ्यासक्रमाचा वापर कसे करावा यासाठी [काही सूचना](for-teachers.md) समाविष्ट केल्या आहेत. तुमचे अभिप्राय आमच्या [चर्चा फोरममध्ये](https://github.com/microsoft/Web-Dev-For-Beginners/discussions/categories/teacher-corner) द्या! +> **शिक्षकांनो**, आम्ही हा अभ्यासक्रम वापरण्यासाठी काही सूचना [इथे समाविष्ट केल्या आहेत](for-teachers.md). आमच्या चर्चासत्रात तुमचे अभिप्राय आम्हाला आवडतील [https://github.com/microsoft/Web-Dev-For-Beginners/discussions/categories/teacher-corner](https://github.com/microsoft/Web-Dev-For-Beginners/discussions/categories/teacher-corner)! -**[शिकणारे](https://aka.ms/student-page/?WT.mc_id=academic-77807-sagibbon)**, प्रत्येक धड्यासाठी प्रि-लेक्चर क्विझ पासून सुरू करा आणि नंतर व्याख्यान सामग्री वाचा, विविध क्रियाकलाप पूर्ण करा आणि पोस्ट-लेक्चर क्विझद्वारे तुमचे समज तपासा. +**[शिकणारे](https://aka.ms/student-page/?WT.mc_id=academic-77807-sagibbon)**, प्रत्येक धड्यासाठी, प्री-लेक्चर क्विझने सुरू करा आणि नंतर व्याख्यानाचा अभ्यास करा, विविध क्रियाकलाप पूर्ण करा आणि पोस्ट-लेक्चर क्विझने आपले ज्ञान तपासा. -तुमच्या शिक्षण अनुभवाला सुधारण्यासाठी, तुमच्या सहाध्यायांसोबत प्रोजेक्ट्सवर एकत्र काम करा! चर्चांना आमच्या [चर्चा फोरममध्ये](https://github.com/microsoft/Web-Dev-For-Beginners/discussions) प्रोत्साहन दिले जाते जिथे आमच्या मॉडरेटर टीम तुमच्या प्रश्नांची उत्तरे देण्यासाठी उपलब्ध असेल. +आपली शिकण्याची प्रक्रिया सुधारण्यासाठी, सहकारी विद्यार्थ्यांशी संपर्क साधा आणि प्रकल्पावर एकत्र काम करा! चर्चासत्रासाठी आमच्या [चर्चा मंचात](https://github.com/microsoft/Web-Dev-For-Beginners/discussions) सहभागी व्हा जिथे आमच्या मॉडरेटर टीमकडून आपले प्रश्न उत्तर दिले जातील. -तुमची अधिक शिक्षणासाठी, आम्ही [Microsoft Learn](https://learn.microsoft.com/users/wirelesslife/collections/p1ddcy5jwy0jkm?WT.mc_id=academic-77807-sagibbon) वापरण्याची जोरदार शिफारस करतो. +आपली शिकणूक अधिक वाढवण्यासाठी, आम्ही अत्यंत शिफारस करतो की आपण [Microsoft Learn](https://learn.microsoft.com/users/wirelesslife/collections/p1ddcy5jwy0jkm?WT.mc_id=academic-77807-sagibbon) मध्ये अतिरिक्त अध्ययन साहित्याचा अभ्यास करा. -### 📋 तुमचे पर्यावरण सेट करा +### 📋 तुमचे वातावरण सेट करणे -हा अभ्यासक्रम वापरण्यास तयार विकास वातावरणासह आहे! तुम्ही सुरू करताना, तुम्ही हा अभ्यासक्रम [Codespace](https://github.com/features/codespaces/) मध्ये चालवण्याचे निवडू शकता (_ब्राउझर-आधारित, कोणत्याही इन्स्टॉलेशन आवश्यक नाही अशा वातावरण_) किंवा तुमच्या संगणकावर स्थानिकरित्या [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) सारख्या टेक्स्ट एडिटर वापरून चालवू शकता. +हा अभ्यासक्रम एका विकसित वातावरणासह तयार आहे! सुरुवात करताना तुम्ही हा अभ्यासक्रम [Codespace](https://github.com/features/codespaces/) मध्ये चालवू शकता (_ब्राऊझर-आधारित, कोणतीही स्थापना आवश्यक न नसलेले वातावरण_), किंवा स्थानिक संगणकावर [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) सारख्या टेक्स्ट एडिटर वापरून चालवू शकता. -#### तुमचा रिपॉजिटरी तयार करा -तुमच्या कामाचे सहज जतन करण्यासाठी, तुमच्या स्वतःच्या कॉपीची निर्मिती करण्यासाठी शिफारस केली जाते. हे करण्यासाठी या पृष्ठावरील **Use this template** बटणावर क्लिक करा. यामुळे तुमच्या GitHub खात्यात या अभ्यासक्रमाची नक्कल असलेला नवीन रिपॉजिटरी तयार होईल. +#### तुमची रिपॉझिटरी तयार करा +तुमचा काम सहज जपण्यासाठी, तुम्हाला हा अभ्यासक्रमाची स्वतःची कॉपी तयार करणे शिफारसीय आहे. यासाठी या पृष्ठाच्या वरच्या बाजूस असलेल्या **Use this template** बटणावर क्लिक करा. हे तुमच्या GitHub खात्यात नवीन रिपॉझिटरी तयार करेल ज्यात अभ्यासक्रमाची कॉपी असेल. -हे चरणांचे अनुसरण करा: -1. **रिपॉजिटरी फोर्क करा**: या पृष्ठाच्या वरच्या उजव्या कोपर्‍यात असलेल्या "Fork" बटणावर क्लिक करा. -2. **रिपॉजिटरी क्लोन करा**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git` +हे खालीलप्रमाणे करा: +1. **रिपॉझिटरी फोर्क करा**: या पानाच्या वरच्या डाव्या कोपर्‍यासमोर "Fork" बटणावर क्लिक करा. +2. **रिपॉझिटरी क्लोन करा**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git` #### Codespace मध्ये अभ्यासक्रम चालवणे -तुमच्या तयार केलेल्या कॉपी मध्ये, **Code** बटणावर क्लिक करा आणि **Open with Codespaces** निवडा. यामुळे तुम्हाला काम करण्यासाठी नवीन Codespace तयार होईल. +तुमच्या तयार केलेल्या कॉपीमध्ये, **Code** बटणावर क्लिक करा आणि **Open with Codespaces** निवडा. हे तुमच्यासाठी नवीन Codespace तयार करेल ज्यात तुम्ही काम करू शकता. ![Codespace](../../translated_images/mr/createcodespace.0238bbf4d7a8d955.webp) -#### तुमच्या संगणकावर स्थानिकरित्या अभ्यासक्रम चालवणे - -या अभ्यासक्रमाला स्थानिकरित्या चालवण्यासाठी, तुम्हाला टेक्स्ट एडिटर, ब्राउझर आणि कमांड लाइन टूलची आवश्यकता आहे. आमचा पहिला धडा, [Introduction to Programming Languages and Tools of the Trade](../../1-getting-started-lessons/1-intro-to-programming-languages), तुम्हाला प्रत्येक टूल पर्यायांची माहिती देईल आणि तुमच्यासाठी सर्वोत्तम काय आहे ते निवडायला मदत करेल. +#### स्थानिक संगणकावर अभ्यासक्रम चालवणे -आमच्या शिफारशीप्रमाणे, तुम्ही [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) तुमचा एडिटर म्हणून वापरा ज्यामध्ये अंगभूत [टर्मिनल](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) देखील आहे. तुम्ही Visual Studio Code [येथे](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) डाउनलोड करू शकता. +हा अभ्यासक्रम तुमच्या संगणकावर चालवण्यासाठी तुम्हाला टेक्स्ट एडिटर, ब्राऊझर आणि कमांड लाइन टूलची गरज आहे. आमचा पहिला धडा [Introduction to Programming Languages and Tools of the Trade](../../1-getting-started-lessons/1-intro-to-programming-languages) तुम्हाला वेगवेगळ्या पर्यायांबाबत मार्गदर्शन करेल ज्यामुळे तुम्ही तुमच्यासाठी योग्य असलेल्या टूलची निवड करू शकता. - -1. तुमच्या संगणकावर तुमचा रिपॉजिटरी क्लोन करा. हे करण्यासाठी **Code** बटण क्लिक करा आणि URL कॉपी करा: +आमची शिफारस [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) हा आहे, ज्यामध्ये एक अंतर्निर्मित [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) देखील आहे. तुम्ही Visual Studio Code [येथे डाउनलोड करू शकता](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon). +1. तुमच्या संगणकावर तुमचे रिपॉझिटरी क्लोन करा. तुम्ही हे **Code** बटणावर क्लिक करून आणि URL कॉपी करून करू शकता: [CodeSpace](./images/createcodespace.png) -मग, [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) मध्ये [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) उघडा आणि खालील आदेश चालवा, `` या स्थानावर आपण नुकतीच कॉपी केलेली URL टाका: + + नंतर, [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) मध्ये [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) उघडा आणि खालील आदेश चालवा, `` च्या ठिकाणी तुम्ही आत्ता कॉपी केलेले URL ठेवा: ```bash git clone ``` -2. Visual Studio Code मध्ये फोल्डर उघडा. आपण हे **File** > **Open Folder** क्लिक करून आणि आपण नुकताच क्लोन केलेला फोल्डर निवडून करू शकता. +2. Visual Studio Code मध्ये फोल्डर उघडा. तुम्ही हे **File** > **Open Folder** क्लिक करून आणि तुम्ही क्लोन केलेला फोल्डर निवडून करू शकता. -> शिफारस केलेले Visual Studio Code विस्तार: +> शिफारसीय Visual Studio Code विस्तार: > -> * [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer&WT.mc_id=academic-77807-sagibbon) - Visual Studio Code मध्ये HTML पृष्ठांचे प्रीव्ह्यू करण्यासाठी -> * [Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot&WT.mc_id=academic-77807-sagibbon) - कोड जलद लिहिण्यास मदत करण्यासाठी +> * [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer&WT.mc_id=academic-77807-sagibbon) - Visual Studio Code मध्ये HTML पानांचे पूर्वदृश्य पाहण्यासाठी +> * [Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot&WT.mc_id=academic-77807-sagibbon) - कोड वेगाने लिहिण्यास मदत करण्यासाठी -## 📂 प्रत्येक धड्यात समाविष्ट आहे: +## 📂 प्रत्येक धडा यामधे आहे: - ऐच्छिक स्केचनोट - ऐच्छिक पूरक व्हिडिओ -- धड्यापूर्वी गरमावा क्विझ -- लिखित धडा -- प्रकल्प-आधारित धड्यांसाठी, प्रकल्प कसा तयार करायचा यावरील टप्प्याटप्प्याने मार्गदर्शक -- ज्ञान तपासण्या +- धड्यापूर्वी वॉर्मअप क्विझ +- लेखी धडा +- प्रकल्प आधारित धड्यांसाठी, प्रकल्प कसा तयार करायचा यावर पायरी-पायरी मार्गदर्शक +- ज्ञान तपासणी - एक आव्हान - पूरक वाचन - असाइनमेंट -- [धडा-नंतरचा क्विझ](https://ff-quizzes.netlify.app/web/) +- [धड्यानंतर क्विझ](https://ff-quizzes.netlify.app/web/) -> **क्विझ संबंधित टीप**: सर्व क्विझेस Quiz-app फोल्डरमध्ये आहेत, एकूण ४८ क्विझ, प्रत्येकी तीन प्रश्नांसह. ते [येथे](https://ff-quizzes.netlify.app/web/) उपलब्ध आहेत. क्विझ अॅप स्थानिकपणे चालवू शकता किंवा Azure वर तैनात करू शकता; `quiz-app` फोल्डरमधील सूचना फॉलो करा. +> **क्विझबद्दल टिप**: सर्व क्विझ Quiz-app फोल्डरमध्ये आहेत, एकूण 48 क्विझ तीन प्रश्नांसह. ते [इथे](https://ff-quizzes.netlify.app/web/) उपलब्ध आहेत, क्विझ अ‍ॅप स्थानिकरित्या चालवू शकतो किंवा Azure वर तैनात करू शकतो; `quiz-app` फोल्डरमधील सूचना पाळा. ## 🗃️ धडे -| | प्रकल्पाचे नाव | शिकवलेली संकल्पना | शैक्षणिक उद्दिष्टे | लिंक केलेला धडा | लेखक | +| | प्रकल्पाचे नाव | शिकवलेले संकल्पना | शिकण्याचे उद्दिष्टे | लिंक दिलेला धडा | लेखक | | :-: | :------------------------------------------------------: | :--------------------------------------------------------------------: | ----------------------------------------------------------------------------------------------------------------------------------- | :----------------------------------------------------------------------------------------------------------------------------: | :---------------------: | -| 01 | सुरुवात | प्रोग्रामिंगचे परिचय आणि औजारांची ओळख | बहुतेक प्रोग्रामिंग भाषांचे मूलभूत तत्त्वे आणि व्यावसायिक विकसकांना मदत करणाऱ्या सॉफ्टवेअरबद्दल शिका | [प्रोग्रामिंग भाषा आणि औजारांचे परिचय](./1-getting-started-lessons/1-intro-to-programming-languages/README.md) | Jasmine | -| 02 | सुरुवात | GitHub ची मूलभूत माहिती, टीमसोबत काम करण्याचा समावेश | आपल्या प्रकल्पात GitHub कसा वापरायचा, कोड बेसवर इतरांसोबत कसे सहकार्य करायचे | [GitHub परिचय](./1-getting-started-lessons/2-github-basics/README.md) | Floor | -| 03 | सुरुवात | प्रवेशयोग्यता | वेब प्रवेशयोग्यतेचे मूलतत्त्वे शिका | [प्रवेशयोग्यता मूलभूत](./1-getting-started-lessons/3-accessibility/README.md) | Christopher | -| 04 | JS मूलभूत | JavaScript डेटा प्रकार | JavaScript डेटा प्रकारांचे मूलभूत ज्ञान | [डेटा प्रकार](./2-js-basics/1-data-types/README.md) | Jasmine | -| 05 | JS मूलभूत | फंक्शन्स आणि मेथड्स | अ‍ॅप्लिकेशनच्या लॉजिक फ्लोसाठी फंक्शन्स आणि मेथड्सबद्दल शिका | [फंक्शन्स आणि मेथड्स](./2-js-basics/2-functions-methods/README.md) | Jasmine आणि Christopher | -| 06 | JS मूलभूत | JS सह निर्णय घेणे | आपल्या कोडमध्ये निर्णय-निर्मिती पद्धती वापरून स्थिती कशी तयार करायची हे शिका | [निर्णय घेणे](./2-js-basics/3-making-decisions/README.md) | Jasmine | -| 07 | JS मूलभूत | अ‍ॅरे आणि लूप्स | JavaScript मध्ये अ‍ॅरे आणि लूप्स वापरून डेटा कसा हाताळायचा हे शिका | [अ‍ॅरे आणि लूप्स](./2-js-basics/4-arrays-loops/README.md) | Jasmine | -| 08 | [Terrarium](./3-terrarium/solution/README.md) | HTML चा वापर | ऑनलाइन टेररियम तयार करण्यासाठी HTML तयार करा, लेआउट तयार करण्यावर लक्ष केंद्रित करा | [HTML परिचय](./3-terrarium/1-intro-to-html/README.md) | Jen | -| 09 | [Terrarium](./3-terrarium/solution/README.md) | CSS चा वापर | ऑनलाइन टेररियमला स्टाइल करण्यासाठी CSS तयार करा, मूलभूत CSS सह पृष्ठ प्रतिसादक बनवण्यावर लक्ष केंद्रित करा | [CSS परिचय](./3-terrarium/2-intro-to-css/README.md) | Jen | -| 10 | [Terrarium](./3-terrarium/solution/README.md) | JavaScript क्लोजर, DOM संशोधन | ड्रॅग/ड्रॉप इंटरफेससाठी JavaScript तयार करा, क्लोजर आणि DOM संशोधनावर लक्ष केंद्रित करा | [JS क्लोजर, DOM संशोधन](./3-terrarium/3-intro-to-DOM-and-closures/README.md) | Jen | -| 11 | [टायपिंग गेम](./4-typing-game/solution/README.md) | टायपिंग गेम तयार करणे | JavaScript अ‍ॅपची लॉजिक चालवण्यासाठी कीबोर्ड इव्हेंट्स कसे वापरायचे हे शिका | [इव्हेंट-चालित प्रोग्रामिंग](./4-typing-game/typing-game/README.md) | Christopher | -| 12 | [ग्रीन ब्राउझर विस्तार](./5-browser-extension/solution/README.md) | ब्राउझर सोबत काम करणं | ब्राउझर्स कसे काम करतात, त्यांचा इतिहास आणि ब्राउझर विस्तारांची पहिले घटक तयार करण्याची पद्धत शिका | [ब्राउझर बद्दल](./5-browser-extension/1-about-browsers/README.md) | Jen | -| 13 | [ग्रीन ब्राउझर विस्तार](./5-browser-extension/solution/README.md) | फॉर्म तयार करणे, API कॉल करणे आणि स्थानीय संचयात व्हेरिएबल्स साठवणे | API कॉल करण्यासाठी ब्राउझर एक्सटेंशनचे JavaScript तयार करा, स्थानीय संचयातील व्हेरिएबल्स वापरून | [API, फॉर्म, आणि लोकल स्टोरेज](./5-browser-extension/2-forms-browsers-local-storage/README.md) | Jen | -| 14 | [ग्रीन ब्राउझर विस्तार](./5-browser-extension/solution/README.md) | ब्राउझरमधील पृष्ठभूमी प्रक्रिये, वेब कार्यक्षमता | विस्तार आयकॉन व्यवस्थापित करण्यासाठी ब्राउझरच्या पृष्ठभूमी प्रक्रियांचा वापर करा; वेब कार्यक्षमता आणि काही ऑप्टिमायझेशन शिका | [पृष्ठभूमी कार्ये आणि कार्यक्षमता](./5-browser-extension/3-background-tasks-and-performance/README.md) | Jen | -| 15 | [स्पेस गेम](./6-space-game/solution/README.md) | JavaScript सह अजून प्रगत गेम डेव्हलपमेंट | वर्ग आणि संयोजन वापरून वारसा, आणि Pub/Sub पद्धत बद्दल शिका, गेम तयार करण्यासाठी तयारी | [प्रगत गेम डेव्हलपमेंट परिचय](./6-space-game/1-introduction/README.md) | Chris | -| 16 | [स्पेस गेम](./6-space-game/solution/README.md) | कॅनव्हासवर ड्रॉइंग | स्क्रीनवर घटक रेखाटण्यासाठी कॅनव्हास API बद्दल शिका | [कॅनव्हास वर ड्रॉइंग](./6-space-game/2-drawing-to-canvas/README.md) | Chris | -| 17 | [स्पेस गेम](./6-space-game/solution/README.md) | स्क्रीनवर घटक हलविणे | घटकांना गती मिळवून देण्यासाठी Cartesian Coordinates आणि कॅनव्हास API कसा वापरायचा हे शोधा | [घटक हलविणे](./6-space-game/3-moving-elements-around/README.md) | Chris | -| 18 | [स्पेस गेम](./6-space-game/solution/README.md) | संग撞 तपासणी | घटकांना एकमेकांशी टकराव करून कसे प्रतिक्रिया द्यायची आणि कार्यप्रदर्शनासाठी कूलडाउन फंक्शन कशी द्यायची ते शिका | [संघर्ष तपासणी](./6-space-game/4-collision-detection/README.md) | Chris | -| 19 | [स्पेस गेम](./6-space-game/solution/README.md) | गुणांक ठेवणे | गेमच्या स्थिती आणि कार्यक्षमतेवर आधारित गणिती गणना करा | [गुणांक ठेवणे](./6-space-game/5-keeping-score/README.md) | Chris | -| 20 | [स्पेस गेम](./6-space-game/solution/README.md) | गेम संपवणे आणि पुन्हा सुरू करणे | गेम संपवण्यास आणि पुनःप्रारंभ करण्यासंबंधी, संसाधने स्वच्छ करणे आणि व्हेरिएबल मूल्ये रीसेट करणे शिका | [अंतिम स्थिती](./6-space-game/6-end-condition/README.md) | Chris | -| 21 | [बँकिंग अ‍ॅप](./7-bank-project/solution/README.md) | वेब अ‍ॅपमध्ये HTML साचा आणि मार्ग | राउटिंग आणि HTML साच्यांचा वापर करून बहुपृष्ठी वेबसाइटचे आराखडा कसा तयार करायचा हे शिका | [HTML साच्य आणि मार्ग](./7-bank-project/1-template-route/README.md) | Yohan | -| 22 | [बँकिंग अ‍ॅप](./7-bank-project/solution/README.md) | लॉगिन आणि नोंदणी फॉर्म तयार करा | फॉर्म तयार करणे आणि प्रमाणीकरण प्रथांची हाताळणी कशी करायची शिका | [फॉर्म](./7-bank-project/2-forms/README.md) | Yohan | -| 23 | [बँकिंग अ‍ॅप](./7-bank-project/solution/README.md) | डेटा मिळवण्याच्या आणि वापरण्याच्या पद्धती | आपल्या अ‍ॅपमध्ये डेटा कसा प्रवाहित होतो, कसा मिळवायचा, साठवायचा आणि नष्ट करण्याचा मार्ग | [डेटा](./7-bank-project/3-data/README.md) | Yohan | -| 24 | [बँकिंग अ‍ॅप](./7-bank-project/solution/README.md) | राज्य व्यवस्थापन संकल्पना | आपल्या अ‍ॅपमध्ये स्थिती कशी टिकवली जाते आणि प्रोग्रामॅटिकली कशी व्यवस्थापित केली जाते हे शिका | [राज्य व्यवस्थापन](./7-bank-project/4-state-management/README.md) | Yohan | -| 25 | [Browser/VScode Code](../../8-code-editor) | VScode सोबत काम | कोड एडिटर कसा वापरायचा शिका| [VScode कोड एडिटर वापरा](./8-code-editor/1-using-a-code-editor/README.md) | Chris | -| 26 | [AI सहायक](./9-chat-project/README.md) | AI सह काम करणे | आपला स्वतःचा AI सहाय्यक कसा तयार करायचा शिका | [AI सहाय्यक प्रोजेक्ट](./9-chat-project/README.md) | Chris | +| 01 | Getting Started | प्रोग्रॅमिंग परिचय आणि उपकरणांची माहिती | बहुसंख्य प्रोग्रॅमिंग भाषांमागील मूलभूत तत्त्वे आणि व्यावसायिक विकसक जे काम करतात त्यासाठी मदत करणारे सॉफ्टवेअर शिकणे | [Intro to Programming Languages and Tools of the Trade](./1-getting-started-lessons/1-intro-to-programming-languages/README.md) | Jasmine | +| 02 | Getting Started | GitHub ची मूलभूत माहिती, टीमसोबत काम करणे | तुमच्या प्रकल्पात GitHub कसा वापरायचा, कोड बेसवर इतरांसोबत कसे सहकार्य करायचे याचा अभ्यास | [Intro to GitHub](./1-getting-started-lessons/2-github-basics/README.md) | Floor | +| 03 | Getting Started | प्रवेशयोग्यता | वेब प्रवेशयोग्यतेच्या मूलभूत गोष्टी शिकणे | [Accessibility Fundamentals](./1-getting-started-lessons/3-accessibility/README.md) | Christopher | +| 04 | JS Basics | JavaScript डेटा प्रकार | JavaScript डेटा प्रकारांचे मूलभूत ज्ञान | [Data Types](./2-js-basics/1-data-types/README.md) | Jasmine | +| 05 | JS Basics | फंक्शन्स आणि मेथड्स | एका अनुप्रयोगाच्या लॉजिक फ्लोवर नियंत्रण ठेवण्यासाठी फंक्शन्स आणि मेथड्सबद्दल शिकणे | [Functions and Methods](./2-js-basics/2-functions-methods/README.md) | Jasmine and Christopher | +| 06 | JS Basics | JSसह निर्णय घेणे | तुमच्या कोडमध्ये निर्णय घेण्याच्या पद्धती वापरून स्थिती कशी बनवायची हे शिकणे | [Making Decisions](./2-js-basics/3-making-decisions/README.md) | Jasmine | +| 07 | JS Basics | अ‍ॅरे आणि लूप | JavaScript मध्ये डेटा अ‍ॅरे आणि लूपने कसा हाताळायचा | [Arrays and Loops](./2-js-basics/4-arrays-loops/README.md) | Jasmine | +| 08 | [Terrarium](./3-terrarium/solution/README.md) | HTML प्रॅक्टिस | ऑनलाइन टेरारियम तयार करण्यासाठी HTML तयार करा, लेआउटवर लक्ष केंद्रित करा | [Introduction to HTML](./3-terrarium/1-intro-to-html/README.md) | Jen | +| 09 | [Terrarium](./3-terrarium/solution/README.md) | CSS प्रॅक्टिस | ऑनलाइन टेरारियमसाठी CSS तयार करा, CSS च्या मूलभूत गोष्टींचा वापर करून पान प्रतिसादात्मक कसे करायचे हे शिकणे | [Introduction to CSS](./3-terrarium/2-intro-to-css/README.md) | Jen | +| 10 | [Terrarium](./3-terrarium/solution/README.md) | JavaScript क्लोजर्स, DOM हाताळणी | टेरारियमसाठी JavaScript तयार करा जे ड्रॅग/ड्रॉप इंटरफेस म्हणून कार्य करतील, क्लोजर्स आणि DOM हाताळणीवर लक्ष देऊन | [JavaScript Closures, DOM manipulation](./3-terrarium/3-intro-to-DOM-and-closures/README.md) | Jen | +| 11 | [Typing Game](./4-typing-game/solution/README.md) | टायपिंग गेम बनवा | कीबोर्ड इव्हेंट्सचा वापर करून तुमच्या JavaScript अ‍ॅपच्या लॉजिकला कसे चालवायचे हे शिकणे | [Event-Driven Programming](./4-typing-game/typing-game/README.md) | Christopher | +| 12 | [Green Browser Extension](./5-browser-extension/solution/README.md) | ब्राउझरशी काम करणे | ब्राउझर कसे काम करतात, त्यांचा इतिहास काय आहे, आणि ब्राउझर एक्सटेंशनचे पहिले घटक कसे तयार करायचे याचा अभ्यास | [About Browsers](./5-browser-extension/1-about-browsers/README.md) | Jen | +| 13 | [Green Browser Extension](./5-browser-extension/solution/README.md) | फॉर्म तयार करणे, API कॉल करणे आणि स्थानिक संग्रहणात डेटा सेव्ह करणे | ब्राउझर एक्सटेंशनसाठी JavaScript घटक तयार करा ज्याने API कॉल करायचा आणि स्थानिक संग्रहणातील व्हेरिएबल वापरायचे | [APIs, Forms, and Local Storage](./5-browser-extension/2-forms-browsers-local-storage/README.md) | Jen | +| 14 | [Green Browser Extension](./5-browser-extension/solution/README.md) | ब्राउझरमधील पार्श्वभूमी प्रक्रिया, वेब कार्यक्षमता | अ‍ॅप्लिकेशनची चिन्हे कशी व्यवस्थापित करावी हे ब्राउझरच्या पार्श्वभूमी प्रक्रियांद्वारे करा; वेब कार्यक्षमता आणि ऑप्टिमायझेशनच्या काही गोष्टीही शिका | [Background Tasks and Performance](./5-browser-extension/3-background-tasks-and-performance/README.md) | Jen | +| 15 | [Space Game](./6-space-game/solution/README.md) | JavaScript वापरून अधिक प्रगत गेम विकास | क्लासेस आणि कंपोजिशन वापरून इनहेरिटन्स आणि Pub/Sub पॅटर्न बद्दल शिका, गेम तयार करण्याच्या तयारीसाठी | [Introduction to Advanced Game Development](./6-space-game/1-introduction/README.md) | Chris | +| 16 | [Space Game](./6-space-game/solution/README.md) | कॅनव्हासवर रेखाटन करणे | एक स्क्रीनवर घटक कसे रेखाटायचे हे Canvas API वापरून शिका | [Drawing to Canvas](./6-space-game/2-drawing-to-canvas/README.md) | Chris | +| 17 | [Space Game](./6-space-game/solution/README.md) | स्क्रीनवर घटक हलवणे | कर्टेसियन निर्देशांक आणि Canvas API वापरून घटकांना हालचाल कशी मिळवायची शोधा | [Moving Elements Around](./6-space-game/3-moving-elements-around/README.md) | Chris | +| 18 | [Space Game](./6-space-game/solution/README.md) | धडक ओळखणे | घटक एकमेकांशी कसे धडकतात आणि कीप्रेस वापरून प्रतिसाद द्यायचा, तसेच गेमची कार्यक्षमता सुनिश्चित करण्यासाठी कूलडाऊन फंक्शन द्या | [Collision Detection](./6-space-game/4-collision-detection/README.md) | Chris | +| 19 | [Space Game](./6-space-game/solution/README.md) | स्कोअर ठेवणे | गेमच्या स्थिती आणि कार्यक्षमतेवर आधारित गणिती गणना करा | [Keeping Score](./6-space-game/5-keeping-score/README.md) | Chris | +| 20 | [Space Game](./6-space-game/solution/README.md) | गेमचा शेवट आणि पुन्हा सुरू करणे | गेमचा शेवट कसा करायचा आणि पुन्हा सुरू कसा करायचा, तसेच रीसोर्सेस साफ करणे आणि व्हेरिएबल मूल्ये रीसेट करणे | [The Ending Condition](./6-space-game/6-end-condition/README.md) | Chris | +| 21 | [Banking App](./7-bank-project/solution/README.md) | वेब अ‍ॅप्समधील HTML टेम्पलेट्स आणि रूट्स | मल्टिपेज वेबसाइटचे आर्किटेक्चर रूटिंग आणि HTML टेम्पलेट्स वापरून कसे तयार करायचे ते शिका | [HTML Templates and Routes](./7-bank-project/1-template-route/README.md) | Yohan | +| 22 | [Banking App](./7-bank-project/solution/README.md) | लॉगिन आणि नोंदणी फॉर्म तयार करा | फॉर्म तयार करणे आणि व्हॅलिडेशन रुटीन्स कसे हाताळायचे हे शिका | [Forms](./7-bank-project/2-forms/README.md) | Yohan | +| 23 | [Banking App](./7-bank-project/solution/README.md) | डेटा मिळविण्याचे आणि वापरण्याचे प्रकार | तुमच्या अ‍ॅपमध्ये डेटा कसा प्रवाहित होतो, तो कसा मिळवायचा, साठवायचा आणि नष्ट करायचा याचा अभ्यास | [Data](./7-bank-project/3-data/README.md) | Yohan | +| 24 | [Banking App](./7-bank-project/solution/README.md) | स्टेट मॅनेजमेंटचे संकल्पना | तुमचा अ‍ॅप स्टेट कसा राखतो आणि प्रोग्रामिंगद्वारे त्याचे व्यवस्थापन कसे करायचे हे शिका | [State Management](./7-bank-project/4-state-management/README.md) | Yohan | +| 25 | [Browser/VScode Code](../../8-code-editor) | VScode सह काम करणे | कोड संपादक वापरणे शिका | [Use VScode Code Editor](./8-code-editor/1-using-a-code-editor/README.md) | Chris | +| 26 | [AI Assistants](./9-chat-project/README.md) | AI सह काम करणे | तुमचा स्वतःचा AI सहाय्यक कसा तयार करायचा हे शिका | [AI Assistant project](./9-chat-project/README.md) | Chris | ## 🏫 शिक्षणशास्त्र -आमच्या अभ्यासक्रमाला दोन मुख्य अध्यापन तत्त्वे लक्षात घेऊन डिझाईन केले आहे: -* प्रकल्प-आधारित शिक्षण -* वारंवार क्विझेस +आमच्या अभ्यासक्रमात दोन मुख्य शैक्षणिक तत्त्वे आहेत: +* प्रकल्प आधारित शिक्षण +* वारंवार क्विझ -हा प्रोग्राम JavaScript, HTML, आणि CSS चे मूलभूत तत्त्वे तसेच आजच्या वेब डेव्हलपर्सद्वारे वापरल्या जाणार्‍या नवीनतम साधने आणि तंत्रे शिकवतो. विद्यार्थी टायपिंग गेम, व्हर्च्युअल टेररियम, पर्यावरणपूरक ब्राउझर विस्तार, स्पेस-इन्व्हेडर-शैलीचा गेम, आणि व्यवसायांसाठी बँकिंग अ‍ॅप तयार करून प्रत्यक्ष अनुभव मिळवतील. मालिकेच्या शेवटी, विद्यार्थ्यांना वेब डेव्हलपमेंटची मजबूत समज प्राप्त होईल. +हा कार्यक्रम JavaScript, HTML, आणि CSS च्या मूलभूत गोष्टी तसेच आजच्या वेब विकसकांनी वापरलेले नवीनतम साधने आणि तंत्रे शिकवतो. विद्यार्थी टायपिंग गेम, वर्च्युअल टेरारियम, पर्यावरणपूरक ब्राउझर एक्सटेंशन, स्पेस-इन्व्हेडर-शैलीचा गेम, आणि व्यवसायांसाठी बँकिंग अ‍ॅप तयार करून व्यावहारिक अनुभव घेतील. या मालिकेच्या शेवटी, विद्यार्थ्यांना वेब विकासाचा ठोस समज प्राप्त होईल. -> 🎓 आपण या अभ्यासक्रमातील पहिले काही धडे [Learn Path](https://docs.microsoft.com/learn/paths/web-development-101/?WT.mc_id=academic-77807-sagibbon) म्हणून Microsoft Learn वर घेऊ शकता! +> 🎓 तुम्ही या अभ्यासक्रमातील पहिले काही धडे [Learn Path](https://docs.microsoft.com/learn/paths/web-development-101/?WT.mc_id=academic-77807-sagibbon) म्हणून Microsoft Learn वर घेऊ शकता! -ज्या प्रकल्पांसह मजकूर संबंधित असेल त्यामुळे विद्यार्थ्यांसाठी प्रक्रिया अधिक आकर्षक होते आणि संकल्पनांचे टिकून राहणे वाढते. आम्ही JavaScript मूलभूत संकल्पना परिचित करून देण्यासाठी काही सुरुवातीचे धडे आणि "[Beginners Series to: JavaScript](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript/?WT.mc_id=academic-77807-sagibbon)" व्हिडिओ ट्युटोरियल्सच्या संग्रहातील एक व्हिडिओ जोडला आहे, ज्यातील काही लेखकांनी अभ्यासक्रमात योगदान दिले आहे. +प्रकल्पांशी विषयवस्तू जुळवून, विद्यार्थ्यांसाठी प्रक्रिया अधिक आकर्षक बनते आणि संकल्पनांचे लक्षात ठेवणे वाढते. आम्ही JavaScript मूलभूत गोष्टींबाबत अनेक सुरूवातीचे धडे लिहिले आहेत, ज्यात "[Beginners Series to: JavaScript](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript/?WT.mc_id=academic-77807-sagibbon)" या व्हिडिओ ट्यूटोरियल्समधील व्हिडिओ समाविष्ट आहेत, ज्यांचे काही लेखक या अभ्यासक्रमात योगदान देतात. -त्याचप्रमाणे, वर्गापूर्वीचा क्विझ विद्यार्थ्याच्या अभ्यासासाठी तीव्र संकेत देतो, तर वर्गानंतरचा क्विझ अधिक टिकून राहिल्याची खात्री करतो. हा अभ्यासक्रम लवचिक आणि मजेदार ठेवण्यासाठी तयार केला आहे आणि पूर्ण किंवा भागांमध्ये घेता येऊ शकतो. प्रकल्प लहान प्रमाणात सुरू होतात आणि १२ आठवड्यांच्या कालावधीमध्ये हळूहळू जटील होतात. +याव्यतिरिक्त, वर्गाच्या आधी एक कमी धोक्याचा क्विझ विद्यार्थ्यांच्या शिकण्याच्या हेतूची उद्दिष्टे निश्चित करतो, तर वर्गानंतरचा दुसरा क्विझ अधिक टिकाव गाठण्यास मदत करतो. हा अभ्यासक्रम लवचिक आणि मजेदार करण्यासाठी डिझाइन केला आहे आणि संपूर्ण किंवा भाग म्हणून घेता येतो. प्रकल्प सुरुवातीला छोटे असतात आणि 12 आठवड्यांच्या चक्राच्या शेवटी अधिक जटिल होतात. -आम्ही उद्दिष्टपूर्वक JavaScript फ्रेमवर्क परिचय देणे टाळले आहे जेणेकरून वेब डेव्हलपर म्हणून आवश्यक मूलभूत कौशल्यांवर लक्ष केंद्रित करता येईल आणि फ्रेमवर्क स्वीकारण्यापूर्वी त्याचा अभ्यास करता येईल, पुढील चांगला टप्पा Node.js बद्दल शिकणे असेल, जे "[Beginner Series to: Node.js](https://channel9.msdn.com/Series/Beginners-Series-to-Nodejs/?WT.mc_id=academic-77807-sagibbon)" व्हिडिओ संग्रहाद्वारे मिळू शकते. +आम्ही जावास्क्रिप्ट फ्रेमवर्कमध्ये प्रवेश करणे टाळले आहे जेणेकरून वेब विकसकासाठी मूलभूत कौशल्यांवर लक्ष केंद्रीत करता येईल, फ्रेमवर्क स्वीकारण्याआधी. या अभ्यासक्रमाचा पुढचा चांगला टप्पा Node.js शिकणे असेल, ज्यासाठी दुसऱ्या व्हिडिओ संग्रहाचा वापर करू शकता: "[Beginner Series to: Node.js](https://channel9.msdn.com/Series/Beginners-Series-to-Nodejs/?WT.mc_id=academic-77807-sagibbon)". -> आमचे [कोड ऑफ कंडक्ट](CODE_OF_CONDUCT.md) आणि [योगदान देणे](CONTRIBUTING.md) मार्गदर्शक पान पहा. आम्ही आपले रचनात्मक अभिप्राय स्वागत करतो! +> आमच्या [नीती अभिवृत्ती](CODE_OF_CONDUCT.md) आणि [योगदानासाठी](CONTRIBUTING.md) मार्गदर्शक तत्त्वांचा अवलोकन करा. तुमचे रचनात्मक अभिप्राय आम्ही स्वागत करतो! ## 🧭 ऑफलाइन प्रवेश -आपण हा दस्तऐवज ऑफलाइन [Docsify](https://docsify.js.org/#/) वापरून चालवू शकता. हा रेपो Fork करा, आपल्या स्थानिक संगणकावर [Docsify इंस्टॉल](https://docsify.js.org/#/quickstart) करा, आणि मग या रेपोच्या मुख्य फोल्डरमध्ये `docsify serve` लिहा. वेबसाइट पोर्ट 3000 वर आपल्या लोकलहोस्टवर चालेल: `localhost:3000`. +तुम्ही [Docsify](https://docsify.js.org/#/) वापरून ही माहिती ऑफलाइन चालवू शकता. या रेपोचे फोर्क करा, स्थानिक संगणकावर [Docsify इंस्टॉल](https://docsify.js.org/#/quickstart) करा, नंतर या रेपोच्या मूळ फोल्डरमध्ये `docsify serve` टाईप करा. वेबसाईट पोर्ट 3000 वर तुमच्या लोकलहोस्टवर चालू होईल: `localhost:3000`. ## 📘 PDF +सर्व धड्यांचा PDF [येथे](https://microsoft.github.io/Web-Dev-For-Beginners/pdf/readme.pdf) सापडू शकतो. -सर्व धड्यांचा PDF [येथे](https://microsoft.github.io/Web-Dev-For-Beginners/pdf/readme.pdf) उपलब्ध आहे. +## 🎒 इतर अभ्यासक्रम -## 🎒 इतर कोर्सेस -आमची टीम इतर कोर्स तयार करते! तपासा: +आमची टीम इतर अभ्यासक्रम तयार करते! पहा: ### LangChain @@ -223,7 +232,7 @@ Azure AI Foundry Discord समुदायात सामील व्हा --- -### Generative AI Series +### जनरेटिव AI मालिका [![Generative AI for Beginners](https://img.shields.io/badge/Generative%20AI%20for%20Beginners-8B5CF6?style=for-the-badge&labelColor=E5E7EB&color=8B5CF6)](https://github.com/microsoft/generative-ai-for-beginners?WT.mc_id=academic-105485-koreyst) [![Generative AI (.NET)](https://img.shields.io/badge/Generative%20AI%20(.NET)-9333EA?style=for-the-badge&labelColor=E5E7EB&color=9333EA)](https://github.com/microsoft/Generative-AI-for-beginners-dotnet?WT.mc_id=academic-105485-koreyst) [![Generative AI (Java)](https://img.shields.io/badge/Generative%20AI%20(Java)-C084FC?style=for-the-badge&labelColor=E5E7EB&color=C084FC)](https://github.com/microsoft/generative-ai-for-beginners-java?WT.mc_id=academic-105485-koreyst) @@ -231,7 +240,7 @@ Azure AI Foundry Discord समुदायात सामील व्हा --- -### Core Learning +### मुख्य शिक्षण [![ML for Beginners](https://img.shields.io/badge/ML%20for%20Beginners-22C55E?style=for-the-badge&labelColor=E5E7EB&color=22C55E)](https://aka.ms/ml-beginners?WT.mc_id=academic-105485-koreyst) [![Data Science for Beginners](https://img.shields.io/badge/Data%20Science%20for%20Beginners-84CC16?style=for-the-badge&labelColor=E5E7EB&color=84CC16)](https://aka.ms/datascience-beginners?WT.mc_id=academic-105485-koreyst) [![AI for Beginners](https://img.shields.io/badge/AI%20for%20Beginners-A3E635?style=for-the-badge&labelColor=E5E7EB&color=A3E635)](https://aka.ms/ai-beginners?WT.mc_id=academic-105485-koreyst) @@ -242,29 +251,29 @@ Azure AI Foundry Discord समुदायात सामील व्हा --- -### Copilot Series +### Copilot मालिका [![Copilot for AI Paired Programming](https://img.shields.io/badge/Copilot%20for%20AI%20Paired%20Programming-FACC15?style=for-the-badge&labelColor=E5E7EB&color=FACC15)](https://aka.ms/GitHubCopilotAI?WT.mc_id=academic-105485-koreyst) [![Copilot for C#/.NET](https://img.shields.io/badge/Copilot%20for%20C%23/.NET-FBBF24?style=for-the-badge&labelColor=E5E7EB&color=FBBF24)](https://github.com/microsoft/mastering-github-copilot-for-dotnet-csharp-developers?WT.mc_id=academic-105485-koreyst) [![Copilot Adventure](https://img.shields.io/badge/Copilot%20Adventure-FDE68A?style=for-the-badge&labelColor=E5E7EB&color=FDE68A)](https://github.com/microsoft/CopilotAdventures?WT.mc_id=academic-105485-koreyst) -## मदत मिळवा +## मदत घेणे -जर तुम्हाला अडचण येत असेल किंवा AI ऍप्स तयार करताना काही प्रश्न असतील तर. इतर शिकणाऱ्यांसह आणि अनुभवी विकसकांसह MCP बाबत चर्चेमध्ये सहभागी व्हा. ही एक सहकार्यशील समुदाय आहे जिथे प्रश्न विचारले जातात आणि ज्ञान मुक्तपणे वाटले जाते. +जर तुम्हाला अडचण किंवा एआय ऍप्स तयार करताना काही प्रश्न असतील तर. MCP विषयी चर्चा करणाऱ्या सह-शिकणाऱ्यांसह आणि अनुभवी विकसकांसह सामील व्हा. ही एक समर्थक कम्युनिटी आहे जिथे प्रश्न विचारले जातात आणि ज्ञान स्वछंदपणे सामायिक केले जाते. [![Microsoft Foundry Discord](https://dcbadge.limes.pink/api/server/nTYy5BXMWG)](https://discord.gg/nTYy5BXMWG) -जर तुमच्याकडे उत्पादनाबाबत अभिप्राय किंवा चुका असतील तर भेट द्या: +तुमच्याकडे उत्पादनाबद्दल अभिप्राय किंवा तयार करताना त्रुटी असल्यास भेट द्या: [![Microsoft Foundry Developer Forum](https://img.shields.io/badge/GitHub-Microsoft_Foundry_Developer_Forum-blue?style=for-the-badge&logo=github&color=000000&logoColor=fff)](https://aka.ms/foundry/forum) ## परवाना -हे रेपॉझिटरी MIT परवान्याखाली परवानगी दिले गेले आहे. अधिक माहितीसाठी [LICENSE](../../LICENSE) फाइल पहा. +हा रिपॉझिटरी MIT परवान्याखाली परवानगी दिलेला आहे. अधिक माहितीसाठी [LICENSE](../../LICENSE) फाईल पहा. --- -**अस्वीकरण**: -हा दस्तऐवज AI अनुवाद सेवा [Co-op Translator](https://github.com/Azure/co-op-translator) चा उपयोग करून अनुवादित केलेला आहे. आम्ही अचूकतेसाठी प्रयत्न करतो, परंतु कृपया लक्षात घ्या की स्वयंचलित अनुवादांमध्ये चुका किंवा अचूकतेचा अभाव असू शकतो. मूळ दस्तऐवज त्याच्या स्थानिक भाषेत अधिकृत स्रोत मानला जावा. महत्त्वपूर्ण माहितीकरिता व्यावसायिक मानवी अनुवाद शिफारसीय आहे. या अनुवादाच्या वापरामुळे होणाऱ्या कुठल्याही गैरसमजुतीक किंवा चुकीच्या अर्थ लावण्याबाबत आम्ही जबाबदार नाही. +**सूचना**: +हा दस्तऐवज AI भाषांतर सेवा [Co-op Translator](https://github.com/Azure/co-op-translator) वापरून भाषांतरित केला आहे. आम्ही अचूकतेसाठी प्रयत्न करतो, तरी कृपया लक्षात घ्या की स्वयंचलित भाषांतरांमध्ये चुका किंवा अपूर्णता असू शकते. मूळ दस्तऐवज त्याच्या स्थानिक भाषेत अधिकृत स्रोत मानला पाहिजे. महत्त्वाच्या माहिती साठी व्यावसायिक मानवी भाषांतर शिफारसीय आहे. या भाषांतराचा वापरामुळे झालेल्या कोणत्याही गैरसमजुती किंवा चुकीच्या अर्थ लावणीसाठी आम्ही जबाबदार नाही. \ No newline at end of file diff --git a/translations/ne/.co-op-translator.json b/translations/ne/.co-op-translator.json index 5af16342e..b761953e1 100644 --- a/translations/ne/.co-op-translator.json +++ b/translations/ne/.co-op-translator.json @@ -1,7 +1,7 @@ { "1-getting-started-lessons/1-intro-to-programming-languages/README.md": { - "original_hash": "d45ddcc54eb9232a76d08328b09d792e", - "translation_date": "2025-11-03T15:19:18+00:00", + "original_hash": "bec5e35642176d9e483552bfc82996d8", + "translation_date": "2026-03-06T17:42:16+00:00", "source_file": "1-getting-started-lessons/1-intro-to-programming-languages/README.md", "language_code": "ne" }, @@ -493,7 +493,7 @@ }, "AGENTS.md": { "original_hash": "a362efd06d64d4134a0cfe8515a86d34", - "translation_date": "2026-02-06T16:47:57+00:00", + "translation_date": "2026-03-06T17:46:03+00:00", "source_file": "AGENTS.md", "language_code": "ne" }, @@ -516,8 +516,8 @@ "language_code": "ne" }, "README.md": { - "original_hash": "6d6385fd098088cb2d690fb0a6cdaedc", - "translation_date": "2026-02-06T16:42:12+00:00", + "original_hash": "a2c9eed480687319517c08a6319e5536", + "translation_date": "2026-03-06T17:37:35+00:00", "source_file": "README.md", "language_code": "ne" }, diff --git a/translations/ne/1-getting-started-lessons/1-intro-to-programming-languages/README.md b/translations/ne/1-getting-started-lessons/1-intro-to-programming-languages/README.md index b334dacc3..b60b2fe61 100644 --- a/translations/ne/1-getting-started-lessons/1-intro-to-programming-languages/README.md +++ b/translations/ne/1-getting-started-lessons/1-intro-to-programming-languages/README.md @@ -1,184 +1,181 @@ -# प्रोग्रामिङ भाषा र आधुनिक डेभलपर उपकरणहरूको परिचय +# परिचय प्रोग्रामिङ भाषाहरू र आधुनिक विकासकर्ता उपकरणहरू -नमस्ते, भविष्यका डेभलपर! 👋 के म तपाईंलाई केही भन्न सक्छु जसले मलाई हरेक दिन रोमाञ्चित बनाउँछ? तपाईंले पत्ता लगाउन लाग्नुभएको छ कि प्रोग्रामिङ केवल कम्प्युटरको बारेमा मात्र होइन – यो तपाईंको सबैभन्दा पागल विचारहरूलाई जीवनमा ल्याउन सक्ने वास्तविक सुपरपावर हो! +नमस्ते, भविष्यका विकासकर्ता! 👋 के म तिमीलाई केही भन्न सक्छु जुन हरेक दिन मलाई अझै पनि रोमाञ्चित बनाउँछ? तिमीले थाहा पाउनु हुनेछ कि प्रोग्रामिङ केवल कम्प्युटरहरूका बारेमा मात्र होइन – यो तिम्रा अति जादुई शक्तिहरू हो जुनले तिम्रा सबैभन्दा पागल विचारहरूलाई जीवन्त बनाउँछ! -तपाईंलाई थाहा छ त्यो क्षण जब तपाईं आफ्नो मनपर्ने एप प्रयोग गर्दै हुनुहुन्छ र सबै कुरा पूर्ण रूपमा मिल्छ? जब तपाईं एउटा बटन थिच्नुहुन्छ र केही जादुई हुन्छ जसले तपाईंलाई "वाह, उनीहरूले यो कसरी गरे?" भन्न बाध्य बनाउँछ। खैर, तपाईं जस्तै कोही – सम्भवतः रातको २ बजे आफ्नो मनपर्ने कफी शपमा तेस्रो एस्प्रेसोको साथ बसेर – त्यो जादु सिर्जना गर्ने कोड लेखेका थिए। र यहाँ तपाईंलाई चकित पार्ने कुरा छ: यो पाठको अन्त्यसम्ममा, तपाईंले उनीहरूले कसरी गरे भनेर मात्र बुझ्नुहुने छैन, तर तपाईं आफैंले प्रयास गर्न उत्सुक हुनुहुनेछ! +तिमीलाई त्यो क्षण थाहा छ जुन तिमी तिम्रो मनपर्ने एप्लिकेशन प्रयोग गरिरहेका हुन्छौ र सबै कुरा बिल्कुलै मेल खान्छ? जब तिमीले एउटा बटन थिच्छौ र केही बिल्कुलै जादुई हुन्छ जसले तिमीलाई "वा, तिनीहरूले कसरी गरे?" भन्न लगाउँछ? त्यस्तो कुनै मानिस जसरी तिमी जस्तै – सम्भवत: आफ्नो मनपर्ने कफि पसलमा राति २ बजे आफ्नो तेस्रो एस्प्रेसो लिएर बसेको – त्यो जादू सिर्जना गर्ने कोड लेखेको थियो। र यहाँ तिम्रो मन उडाउने कुरा छ: यो पाठ समाप्त हुँदा, तिमी बुझ्नेछौ तिनीहरूले कसरी गर्नुभयो, र आफैंले पनि गर्ने उत्सुकता हुनेछ! -हेर्नुहोस्, यदि प्रोग्रामिङ अहिले डर लाग्दो लाग्छ भने म पूर्ण रूपमा बुझ्छु। जब मैले सुरु गरें, मैले इमानदारीपूर्वक सोचेको थिए कि तपाईंलाई कुनै प्रकारको गणितको जीनियस हुनुपर्छ वा पाँच वर्षको उमेरदेखि कोडिङ गरिरहेको हुनुपर्छ। तर यहाँ के कुराले मेरो दृष्टिकोणलाई पूर्ण रूपमा परिवर्तन गर्यो: प्रोग्रामिङ नयाँ भाषामा संवाद गर्न सिक्ने जस्तै हो। तपाईं "नमस्ते" र "धन्यवाद" बाट सुरु गर्नुहुन्छ, त्यसपछि कफी अर्डर गर्न सिक्नुहुन्छ, र थाहा पाउनुहुन्छ, तपाईं गहिरो दार्शनिक छलफल गर्दै हुनुहुन्छ! तर यस अवस्थामा, तपाईं कम्प्युटरसँग संवाद गर्दै हुनुहुन्छ, र इमानदारीपूर्वक? तिनीहरू तपाईंले कहिल्यै गरेको सबैभन्दा धैर्यवान संवाद साझेदार हुन् – तिनीहरूले कहिल्यै तपाईंको गल्तीको न्याय गर्दैनन् र तिनीहरू सँधै फेरि प्रयास गर्न उत्साहित हुन्छन्! +हेर्नु, म पूर्ण रूपमा बुझ्छु यदि प्रोग्रामिङ अहिले डर लाग्ने जस्तो लागिरहेको छ भने। जब म सुरु गरेको थिएँ, म साँच्चिकै सोचेको थिएँ तिमीलाई गणितको जीनियस हुनुपर्छ वा पाँच वर्ष उमेरदेखि कोडिङ गर्दै आएको हुनुपर्छ। तर यो कुरा जसले मेरो दृष्टिकोण पूर्ण रूपमा परिवर्तन गर्यो: प्रोग्रामिङ बिल्कुलै नयाँ भाषामा कुरा सिक्ने जस्तो हो। तिमी "नमस्ते" र "धन्यवाद" बाट सुरु गर्छौ, त्यसपछि कफि अर्डर गर्न सिक्छौ, र अचेल तिमी गहिरो दार्शनिक छलफल गरिरहेका हुनेछौ! तर यो अवस्थामा, तिमी कम्प्युटरहरूसँग कुरा गरिरहेका छौ, र साँच्चिकै? उनीहरू सबैभन्दा धैर्यवान कुराकानी गर्ने साथीहरू हुन् – कहिल्यै तिम्रा गल्तीहरूलाई न्याय गर्दैनन् र सधैं पुनः प्रयास गर्न उत्साहित हुन्छन्! -आज, हामी ती अद्भुत उपकरणहरूको अन्वेषण गर्नेछौं जसले आधुनिक वेब विकासलाई सम्भव मात्र होइन, गम्भीर रूपमा लत लाग्ने बनाउँछ। म त्यही सम्पादकहरू, ब्राउजरहरू, र वर्कफ्लोहरूको कुरा गर्दैछु जुन नेटफ्लिक्स, स्पोटिफाई, र तपाईंको मनपर्ने इन्डी एप स्टुडियोका डेभलपरहरूले हरेक दिन प्रयोग गर्छन्। र यहाँ तपाईंलाई खुशीको नाच गर्न बनाउने भाग छ: यी पेशेवर-ग्रेड, उद्योग-मानक उपकरणहरूको अधिकांश पूर्ण रूपमा निःशुल्क छन्! +आज, हामी ती अद्भुत उपकरणहरू पत्ता लगाउने छौं जसले आधुनिक वेब विकासलाई सम्भव मात्र होइन, साँच्चिकै लत लाग्ने बनाउँछ। म ती नै सम्पादक, ब्राउजर, र काम गर्ने प्रक्रियाहरूको कुरा गर्दैछु जुन Netflix, Spotify, र तिम्रो मनपर्ने स्वतन्त्र एप स्टुडियोका विकासकर्ताहरू हरेक दिन प्रयोग गर्छन्। र यो भागले तिमीलाई खुशीले नाच्न लगाउने छ: यी धेरै व्यावसायिक स्तरका, उद्योग-मानक उपकरणहरू प्रायः पूर्ण रूपमा निःशुल्क छन्! -![प्रोग्रामिङ परिचय](../../../../translated_images/ne/webdev101-programming.d6e3f98e61ac4bff.webp) -> स्केच नोट [Tomomi Imura](https://twitter.com/girlie_mac) द्वारा +![Intro Programming](../../../../translated_images/ne/webdev101-programming.d6e3f98e61ac4bff.webp) +> स्केचनोट [टोमोमी इमुरा](https://twitter.com/girlie_mac) द्वारा ```mermaid journey - title Your Programming Journey Today - section Discover - What is Programming: 5: You - Programming Languages: 4: You - Tools Overview: 5: You - section Explore - Code Editors: 4: You - Browsers & DevTools: 5: You - Command Line: 3: You - section Practice - Language Detective: 4: You - Tool Exploration: 5: You - Community Connection: 5: You + title आजको तपाईंको प्रोग्रामिङ यात्रा + section पत्ता लगाउने + प्रोग्रामिङ के हो: 5: You + प्रोग्रामिङ भाषाहरू: 4: You + उपकरणहरूको अवलोकन: 5: You + section अन्वेषण गर्ने + कोड सम्पादकहरू: 4: You + ब्राउजरहरू र विकास उपकरणहरू: 5: You + आदेश पंक्ति: 3: You + section अभ्यास गर्ने + भाषा जासूस: 4: You + उपकरण अन्वेषण: 5: You + समुदाय सम्बन्ध: 5: You ``` +## तिमीले पहिले नै के जान्दछौ हेर्नुहोस्! -## तपाईंले पहिले नै के जान्नुहुन्छ हेर्नुहोस्! +मज़ा कुराहरूमा जानुअघि, मलाई जिज्ञासा छ – यो प्रोग्रामिङ संसारबारे तिमी पहिले नै के जान्दछौ? अनि सुन, यदि तिमी यी प्रश्नहरूलाई हेरेर सोच्दै छौ "मलाई यसबारे एकदमै थाहा छैन," त्यो मात्र ठीक छैन, यो उत्तम हो! यसको अर्थ तिमी बिल्कुल सही ठाउँमा छौ। यस क्विजलाई एउटा व्यायामअघि शरीर तान्ने जस्तै सोच – हामी दिमागका मांसपेशीहरू तातो गरिरहेको छौं! -मजाको कुरामा जानु अघि, म उत्सुक छु – तपाईंले यस प्रोग्रामिङ संसारको बारेमा पहिले नै के जान्नुहुन्छ? र सुन्नुहोस्, यदि तपाईं यी प्रश्नहरू हेर्दै हुनुहुन्छ र सोच्दै हुनुहुन्छ "मलाई यसको बारेमा शून्य थाहा छ," त्यो मात्र ठीक छैन, यो उत्तम छ! यसको मतलब तपाईं बिल्कुल सही ठाउँमा हुनुहुन्छ। यो क्विजलाई व्यायाम अघि स्ट्रेचिङ जस्तै सोच्नुहोस् – हामी ती मस्तिष्क मांसपेशीहरूलाई मात्र तातो बनाउँदैछौं! +[पाठ अघि क्विज लिनुहोस्](https://ff-quizzes.netlify.app/web/) -[पाठ अघि क्विज लिनुहोस्](https://forms.office.com/r/dru4TE0U9n?origin=lprLink) +## हामी एउटैसाथ जाने साहसिक यात्रा -## हामी सँगै जान लागेका साहसिक यात्रा +ठीक छ, म साँच्चै उत्साहित छु हामीले आज के अन्वेषण गर्ने छौं! गम्भीर रूपमा, मलाई तिम्रो अनुहार देख्न मन छ जब यी केही अवधारणाहरू क्लिक हुन्छन्। हामीले गर्ने यो अद्भुत यात्रा यस्ता छ: -ठीक छ, म साँच्चै उत्साहित छु कि हामी आज के अन्वेषण गर्न जाँदैछौं! गम्भीर रूपमा, म तपाईंको अनुहार देख्न चाहन्छु जब यी अवधारणाहरू क्लिक हुन्छन्। यहाँ हामी सँगै लिने अविश्वसनीय यात्रा छ: +- **प्रोग्रामिङ के हो वास्तवमा (र किन यो सबैभन्दा कूल कुरा हो!)** – हामी पत्ता लगाउने छौं कसरी कोड तिमी वरिपरि भएका सबै कुरा चलाउने अदृश्य जादू हो, त्यो अलार्म जसले सोमबार बिहान हो भनी कसरी थाहा पाउँछ देखि लिएर नेटफ्लिक्स सुझावहरूको अल्गोरिथ्मसम्म +- **प्रोग्रामिङ भाषाहरू र तिनीहरूको अद्भुत व्यक्तित्वहरू** – एउटा पार्टीमा सोच जहाँ प्रत्येक व्यक्तिसँग फरक-फरक सुपरपावरहरू र समस्या समाधान गर्ने तरिकाहरू छन्। प्रोग्रामिङ भाषा संसार त्यस्तै हो, र तिमी तिनीहरूलाई भेट्न मन पराउने छौ! +- **डिजिटल जादू गराउने आधारभूत निर्माण ब्लकहरू** – यसलाई अन्तिम सिर्जनात्मक LEGO सेट जस्तो सोच। एकपटक तिमीले यी टुक्राहरू कसरी मिल्छन् बुझेपछि, तिमी ले आफूले कल्पना गरेका कुनै पनि कुरा बनाउन सक्छौ +- **व्यावसायिक उपकरणहरू जसले तिमीलाई जादूगरको छडी पाएको जस्तो महसुस गराउनेछ** – म नाटकीय भएर भनेको होइन – यी उपकरणहरूले साँच्चै तिमीलाई सुपरपावर भएको महसुस गराउनेछन्, र सबैभन्दा राम्रो कुरा? यी नै उपकरणहरू प्रोहरूले प्रयोग गर्छन्! -- **प्रोग्रामिङ वास्तवमा के हो (र यो किन सबैभन्दा चिसो कुरा हो!)** – हामी पत्ता लगाउनेछौं कि कोड वास्तवमा तपाईंको वरिपरि सबै कुरालाई शक्ति दिने अदृश्य जादु हो, त्यो अलार्मबाट जसले कसरी सोमबार बिहान हो भनेर थाहा पाउँछदेखि तपाईंको नेटफ्लिक्स सिफारिसहरूलाई पूर्ण रूपमा क्युरेट गर्ने एल्गोरिदमसम्म -- **प्रोग्रामिङ भाषाहरू र तिनीहरूको अद्भुत व्यक्तित्वहरू** – कल्पना गर्नुहोस् कि तपाईं एउटा पार्टीमा हिँड्दै हुनुहुन्छ जहाँ प्रत्येक व्यक्तिसँग समस्या समाधान गर्ने पूर्ण रूपमा फरक सुपरपावरहरू छन्। प्रोग्रामिङ भाषा संसार यस्तै हो, र तपाईं तिनीहरूलाई भेट्न मन पराउनुहुनेछ! -- **डिजिटल जादु बनाउनका लागि आधारभूत निर्माण ब्लकहरू** – यीलाई अन्तिम रचनात्मक LEGO सेटको रूपमा सोच्नुहोस्। एकपटक तपाईंले यी टुक्राहरू कसरी फिट हुन्छन् भनेर बुझ्नुभयो भने, तपाईंले महसुस गर्नुहुनेछ कि तपाईंले आफ्नो कल्पनाले सपना देखेको कुनै पनि कुरा निर्माण गर्न सक्नुहुन्छ -- **पेशेवर उपकरणहरू जसले तपाईंलाई जादूगरको छडी दिइएको जस्तो महसुस गराउँछ** – म यहाँ नाटकीय हुँदै छैन – यी उपकरणहरूले तपाईंलाई वास्तवमा सुपरपावर भएको महसुस गराउँछ, र सबैभन्दा राम्रो भाग? तिनीहरू पेशेवरहरूले प्रयोग गर्ने समान हुन्! +> 💡 **यहाँ कुरा यतै छ**: आज सबै कुरा याद गर्न प्रयास नकर! अहिले, म केवल तिमीलाई सम्भावनामा उत्साह महसुस गराउन चाहन्छु। विवरणहरू स्वाभाविक रूपमा संगै अभ्यास गर्दा झनै याद हुनेछ – त्यो नै वास्तविक सिकाइ हो! -> 💡 **यहाँ कुरा छ**: आज सबै कुरा सम्झन प्रयास गर्ने बारे सोच्न पनि नहोस्! अहिले, म केवल तपाईंलाई सम्भव के छ भन्ने बारे उत्साहको झिल्को महसुस गर्न चाहन्छु। विवरणहरू अभ्यास गर्दा स्वाभाविक रूपमा अडिन्छन् – वास्तविक सिकाइ यसरी हुन्छ! +> तिमी यो पाठ [Microsoft Learn](https://learn.microsoft.com/en-us/learn/modules/web-development-101/introduction-programming/?WT.mc_id=academic-77807-sagibbon) मा लिन पनि सक्छौ! -> तपाईं यो पाठ [Microsoft Learn](https://docs.microsoft.com/learn/modules/web-development-101/introduction-programming/?WT.mc_id=academic-77807-sagibbon) मा लिन सक्नुहुन्छ! +## त त्यसोभए प्रोग्रामिङ *के* हो? -## त प्रोग्रामिङ वास्तवमा *के हो*? +ठीक छ, अब करोडौंको प्रश्न समाधान गरौं: प्रोग्रामिङ के हो साँच्चै? -ठीक छ, हामी लाखौं डलरको प्रश्नलाई सम्बोधन गरौं: प्रोग्रामिङ वास्तवमा के हो? +म तिमीलाई एउटा कथा सुनाउँछु जसले मेरो सोचाइ पूर्ण रूपमा परिवर्तन गर्‍यो। गत हप्ता म आमालाई हाम्रो नयाँ स्मार्ट टीभी रिमोट कसरी चलाउने हो भनेर देखाउँदै थिएँ। मैले आफैलाई यस्ता कुरा भन्ठानेँ "रातो बटन थिच्नू, तर त्यो ठूलो रातो होइन, बाँया साइडको सानो रातो बटन... होइन, तिम्रो अर्को बाँया... ठीक छ, अब दुई सेकेन्ड सम्म थिच्नू, एक होइन, तीन होइन..." थाहा छ यो ठ्याक्कै त्यस्तो छैन? 😅 -म तपाईंलाई एउटा कथा दिनेछु जसले मेरो सोच्ने तरिका पूर्ण रूपमा परिवर्तन गर्यो। गत हप्ता, म मेरी आमालाई हाम्रो नयाँ स्मार्ट टिभी रिमोट कसरी प्रयोग गर्ने भनेर व्याख्या गर्ने प्रयास गर्दै थिएँ। मैले आफैंलाई यस्तो कुरा भन्दै गरेको पाएँ "रातो बटन थिच्नुहोस्, तर ठूलो रातो बटन होइन, सानो रातो बटन बायाँतिर... होइन, तपाईंको अर्को बायाँ... ठीक छ, अब यसलाई दुई सेकेन्डको लागि थिच्नुहोस्, एक होइन, तीन होइन..." परिचित लाग्छ? 😅 +त्यै हो प्रोग्रामिङ! यो बहु-विस्तृत, चरण-दर-चरण निर्देशनहरू दिनेको कला हो जुन धेरै शक्तिशाली छ तर सबै कुरा स्पष्ट रूपमा भन्नुपर्छ। तर यहाँ, आमालाई (जो सोध्न सक्छ "कुन रातो बटन?!") बुझाउनुभन्दा कम्प्युटरलाई बुझाउनुपर्छ (जसले मात्र ठीक त्यसै गर्छ जुन तिमी भन्छौ, अर्थात् जुन तिमीले भन्न खोज्यौ त्यो होइन भने पनि)। -त्यो प्रोग्रामिङ हो! यो धेरै शक्तिशाली तर सबै कुरा पूर्ण रूपमा व्याख्या गर्न आवश्यक पर्ने चीजलाई अत्यन्त विस्तृत, चरण-दर-चरण निर्देशनहरू दिने कला हो। तर तपाईंको आमालाई व्याख्या गर्ने सट्टा (जो "कुन रातो बटन?!" सोध्न सक्छ), तपाईं कम्प्युटरलाई व्याख्या गर्दै हुनुहुन्छ (जसले तपाईंले भनेको कुरा ठीक गर्छ, तपाईंले भनेको कुरा तपाईंले भन्न चाहनुभएको कुरा होइन भने पनि)। +जब मैले यो पहिलोपटक सिकें, मेरो दिमाग उडायो: कम्प्युटरहरू वास्तवमै आफ्नै मूलमा धेरै सरल हुन्छन्। तिनीहरू केवल दुई कुरा बुझ्छन् – १ र ०, जुन तै हो “हो” र “होइन” वा “चालु” र “बन्द।” त्यहि हो! तर जादू के छ – हामीलाई म्याट्रिक्स जस्तो 1 र 0 मा कुरा गर्नु पर्दैन। त्यहि ठाउँमा **प्रोग्रामिङ भाषाहरू** मद्दत गर्छन्। तिनीहरू तिमीलाई विश्वकै सबैभन्दा उत्कृष्ट अनुवादक जस्तै हुन् जसले तिम्रा आदर्श मानव विचारहरूलाई कम्प्युटर भाषामा रूपान्तरण गर्छ। -जब मैले यो पहिलो पटक सिकें, यो मेरो दिमागलाई उडाएको कुरा यहाँ छ: कम्प्युटरहरू वास्तवमा आफ्नो मूलमा धेरै सरल छन्। तिनीहरूले शाब्दिक रूपमा केवल दुई चीजहरू बुझ्छन् – १ र ०, जुन मूल रूपमा "हो" र "होइन" वा "अन" र "अफ" मात्र हो। बस यति! तर यहाँ यो जादुई हुन्छ – हामीलाई १ र ० मा बोल्न आवश्यक छैन जस्तो कि हामी म्याट्रिक्समा छौं। त्यहाँ **प्रोग्रामिङ भाषाहरू** उद्धार गर्न आउँछन्। तिनीहरू संसारको सबैभन्दा राम्रो अनुवादक भएको जस्तै हुन् जसले तपाईंको पूर्ण रूपमा सामान्य मानव विचारहरूलाई कम्प्युटर भाषामा रूपान्तरण गर्दछ। +र मलाई अझै बिहान उठ्दा वास्तविक रूपमा रोमाञ्चित बनाउने कुरा छ: तिम्रो जीवनमा सबै कुरा डिजिटलमा कसैले तिमी जस्तै कपडामा बस्दै, कफीको कप बोकेर, आफ्नो ल्यापटपमा कोड टाइप गर्दै सुरू गरेको हो। त्यो Instagram फिल्टर जसले तिमीलाई निखार्छ? कसैले बनायो। त्यो सिफारिस जसले तिमीलाई तिमी नयाँ मनपर्ने गीतमा पुर्‍यायो? एक विकासकर्ताले त्यो अल्गोरिथ्म बनायो। त्यो एप जसले तिमीलाई साथीहरूसँग खानेकुरा बिल बाँड्न मद्दत गर्छ? हो, कसैले सोच्यो "यो झन्झटिलो छ, मैले यसलाई सुधार्न सक्छु" र त्यसपछि गरे! -र यहाँ के कुरा छ जसले मलाई हरेक बिहान वास्तविक झिल्को दिन्छ: तपाईंको जीवनमा शाब्दिक *सबै* डिजिटल कुरा तपाईं जस्तै कोहीबाट सुरु भएको थियो, सम्भवतः आफ्नो पजामा लगाएर कफीको कपको साथ, आफ्नो ल्यापटपमा कोड टाइप गर्दै। त्यो इन्स्टाग्राम फिल्टर जसले तपाईंलाई निर्दोष देखिन्छ? कसैले त्यो कोड गर्यो। सिफारिस जसले तपाईंलाई तपाईंको नयाँ मनपर्ने गीतमा पुर्‍यायो? डेभलपरले त्यो एल्गोरिदम निर्माण गर्यो। एप जसले तपाईंलाई साथीहरूसँग डिनर बिल विभाजन गर्न मद्दत गर्दछ? हो, कसैले सोच्यो "यो झन्झट छ, म यसलाई ठीक गर्न सक्छु जस्तो लाग्छ" र त्यसपछि... तिनीहरूले गरे! +जब तिमी प्रोग्राम गर्न सिक्छौ, तिमी केवल नयाँ सिप मात्र सिक्ने होइनौ – तिमी समस्याहरू समाधान गर्ने यो अद्भुत समुदायको भाग बन्नुभयो जसले आफ्नो दिन यसो सोचेर बिताउँछ, "म केहि यस्तो बनाउन सक्छु जुन कसैको दिन अलिअलि राम्रो बनाओस्?" साँच्चिकै, यो भन्दा कूल के छ? -जब तपाईंले प्रोग्राम गर्न सिक्नुहुन्छ, तपाईंले केवल नयाँ सीप उठाउनुहुन्न – तपाईं समस्या समाधान गर्नेहरूको यो अविश्वसनीय समुदायको हिस्सा बन्नुहुन्छ जसले आफ्नो दिन सोच्दै बिताउँछन्, "यदि मैले केही निर्माण गर्न सकें जसले कसैको दिनलाई अलिकति राम्रो बनाउँछ भने के हुन्छ?" इमानदारीपूर्वक, त्यो भन्दा चिसो केहि छ? +✅ **रोचक तथ्य खोजी**: खाली समय हुँदा एउटा धेरै रोचक कुरा खोज्नु - विश्वकै पहिलो कम्प्युटर प्रोग्रामर को हुन सक्छ? म तिमीलाई एउटा हिंट दिन्छु: त्यो व्यक्ति तिमीले सोचेकै नहुन सक्छ! यसको कथा साँच्चिकै आकर्षक छ र देखाउँछ कि प्रोग्रामिङ सधैं सिर्जनात्मक समस्याहरू समाधान गर्ने कला रही आएको छ। -✅ **मजाको तथ्य खोज**: यहाँ केही सुपर कूल छ जब तपाईंसँग खाली समय छ – तपाईंलाई लाग्छ कि संसारको पहिलो कम्प्युटर प्रोग्रामर को थियो? म तपाईंलाई संकेत दिनेछु: यो तपाईंले अपेक्षा गरेको व्यक्ति नहुन सक्छ! यस व्यक्तिको पछाडि कथा बिल्कुल आकर्षक छ र देखाउँछ कि प्रोग्रामिङ सधैं रचनात्मक समस्या समाधान र बक्स बाहिर सोच्ने बारेमा भएको छ। +### 🧠 **चेक-इन समय: तिमीलाई कस्तो लागिरहेको छ?** -### 🧠 **जाँच समय: तपाईं कस्तो महसुस गर्दै हुनुहुन्छ?** +**एकछिन सोच:** +- "कम्प्युटरलाई निर्देशन दिनु" को विचार अहिले तिमीलाई बुझिन्छ? +- के तिमी कुनै दैनिक काम प्रोग्रामिङले स्वचालन गर्न चाहन्छौ? +- यो पुरै प्रोग्रामिङ बारे कुन प्रश्नहरू तिम्रो मनमा छन्? -**एक क्षणको लागि विचार गर्नुहोस्:** -- "कम्प्युटरलाई निर्देशन दिनु" भन्ने विचार अब तपाईंलाई अर्थपूर्ण लाग्छ? -- के तपाईं कुनै दैनिक कार्यको बारेमा सोच्न सक्नुहुन्छ जुन तपाईं प्रोग्रामिङको साथ स्वचालित गर्न चाहनुहुन्छ? -- यस सम्पूर्ण प्रोग्रामिङ कुराको बारेमा तपाईंको दिमागमा के प्रश्नहरू उठिरहेका छन्? +> **स्मरण रहोस्**: केही अवधारणाहरू अहिले अलि अस्पष्ट लाग्नु सामान्य कुरा हो। प्रोग्रामिङ सिक्नु नयाँ भाषा सिक्ने जस्तो छ – तिम्रो दिमागले समयसँग नयाँ न्यूरो नेटवर्क निर्माण गर्छ। तिमी राम्रो गर्दैछौ! -> **स्मरण गर्नुहोस्**: यदि केही अवधारणाहरू अहिले अस्पष्ट लाग्छ भने यो पूर्ण रूपमा सामान्य हो। प्रोग्रामिङ सिक्नु नयाँ भाषा सिक्न जस्तै हो – तपाईंको मस्तिष्कले ती न्युरल मार्गहरू निर्माण गर्न समय लाग्छ। तपाईं राम्रो गर्दै हुनुहुन्छ! +## प्रोग्रामिङ भाषाहरू विभिन्न प्रकारका जादूका स्वादहरू जस्तै -## प्रोग्रामिङ भाषाहरू जादुको विभिन्न स्वादहरू जस्तै छन् +ठीक छ, यो अलि अजब लाग्न सक्छ तर जोडिदै जानु – प्रोग्रामिङ भाषाहरू धेरै फरक प्रकारका संगीतजस्तै छन्। सोच, तिमीलाई जाज छ, जुन न्यून र सहज छ, रक छ, जुन शक्तिशाली र सोझो छ, क्लासिकल छ, जुन सुरुचिपूर्ण र संरचित छ, र हिपहप छ, जुन रचनात्मक र अभिव्यक्तिशील छ। प्रत्येक शैलीको आफ्नै माहोल हुन्छ, उसका आफ्नै उत्साही समर्थकहरू हुन्छन्, र प्रत्येक फरक-फरक मनोदशा र अवसरका लागि उपयुक्त हुन्छ। -ठीक छ, यो अजीब लाग्न सक्छ, तर मेरो साथमा रहनुहोस् – प्रोग्रामिङ भाषाहरू विभिन्न प्रकारका संगीत जस्तै छन्। सोच्नुहोस्: तपाईंसँग जाज छ, जुन स्मूथ र इम्प्रोभाइजेशनल छ, रक जुन शक्तिशाली र सरल छ, क्लासिकल जुन सुरुचिपूर्ण र संरचित छ, र हिप-हप जुन रचनात्मक र अभिव्यक्तिपूर्ण छ। प्रत्येक शैलीको आफ्नै माहोल छ, आफ्नै उत्साही प्रशंसकहरूको समुदाय छ, र प्रत्येक विभिन्न मूड र अवसरहरूको लागि उत्तम छ। +प्रोग्रामिङ भाषाहरू पनि ठीक त्यही काम गर्छन्! तिमी एकै भाषा प्रयोग गरेर रमाइलो मोबाइल खेल बनाउँदैनौ जसले जलवायु डाटा मापन गर्छ, ठीक त्यसैगरी तिमी योग कक्षामा डेथ मेटल बजाउन चाहँदैनौ (ठिकै छ, अधिकांश योग कक्षाहरुमा भने! 😄)। -प्रोग्रामिङ भाषाहरू ठीक त्यस्तै काम गर्छन्! तपाईंले जलवायु डाटा ठूलो मात्रामा क्रन्च गर्न प्रयोग गर्ने भाषा र मजाको मोबाइल गेम निर्माण गर्न प्रयोग गर्ने भाषा एउटै हुँदैन, जस्तै तपाईं योग क्लासमा डेथ मेटल बजाउनुहुन्न (खैर, अधिकांश योग क्लासहरूमा! 😄)। - -तर यहाँ के कुरा छ जसले मलाई हरेक पटक सोच्दा मेरो दिमागलाई उडाउँछ: यी भाषाहरू संसारको सबैभन्दा धैर्यवान, प्रतिभाशाली अनुवादक भएको जस्तै छन्। तपाईं आफ्नो मानव मस्तिष्कलाई प्राकृतिक लाग्ने तरिकामा आफ्नो विचारहरू व्यक्त गर्न सक्नुहुन्छ, र तिनीहरूले त्यो कम्प्युटरले वास्तवमा बोल्ने १ र ० मा अनुवाद गर्ने अत्यन्त जटिल कामलाई ह्यान्डल गर्छन्। यो जस्तो छ कि तपाईंको साथमा "मानव रचनात्मकता" र "कम्प्युटर तर्क" मा पूर्ण रूपमा धाराप्रवाह भएको साथी छ – र तिनीहरू कहिल्यै थाक्दैनन्, कहिल्यै कफी ब्रेकको आवश्यकता पर्दैन, र तपाईंले सोधेको प्रश्नको लागि तपाईंलाई कहिल्यै न्याय गर्दैनन्! +तर हरेक पटक म सोच्दा मलाई अचम्म लाग्छ: यी भाषाहरू संसारकै सबैभन्दा धैर्यवान, प्रतिभाशाली दुभाषेलाई जस्तै छन् जुन तिम्रो छेउमा बसेर तिम्रा विचारहरूलाई सहज रूपमा बुझ्छ र कम्प्युटरको भाषा 1 र 0 मा रूपान्तरण गर्छ। यो एकदमै त्यस्तो साथी हो जो "मानव सिर्जनशीलता" र "कम्प्युटर तर्क" दुवैमा निपूर्ण छ – र कहिल्यै थाक्दैन, कहिल्यै कफि ब्रेक लिन पर्दैन, र तिमीलाई उस्तै प्रश्न दोहोर्याउन भन्दिन! ### लोकप्रिय प्रोग्रामिङ भाषाहरू र तिनीहरूको प्रयोग ```mermaid mindmap - root((Programming Languages)) - Web Development - JavaScript - Frontend Magic - Interactive Websites - TypeScript - JavaScript + Types - Enterprise Apps - Data & AI - Python - Data Science - Machine Learning - Automation - R - Statistics - Research - Mobile Apps - Java - Android - Enterprise - Swift + root((प्रोग्रामिङ भाषा)) + वेब विकास + जाभास्क्रिप्ट + फ्रन्टेंड जादू + अन्तरक्रियात्मक वेबसाइटहरू + टाइपस्क्रिप्ट + जाभास्क्रिप्ट + प्रकारहरू + उद्यम अनुप्रयोगहरू + डेटा र एआई + पाइथन + डेटा विज्ञान + मेसिन लर्निङ + स्वचालन + आर + तथ्याङ्क + अनुसन्धान + मोबाइल अनुप्रयोगहरू + जाभा + एन्ड्रोइड + उद्यम + स्विफ्ट iOS - Apple Ecosystem - Kotlin - Modern Android - Cross-platform - Systems & Performance + एप्पल ईकोसिस्टम + कोटलिन + आधुनिक एन्ड्रोइड + क्रस-प्लाटफर्म + प्रणाली र प्रदर्शन C++ - Games - Performance Critical - Rust - Memory Safety - System Programming - Go - Cloud Services - Scalable Backend + खेलहरू + प्रदर्शन महत्त्वपूर्ण + रस्टी + मेमोरी सुरक्षा + प्रणाली प्रोग्रामिङ + गो + क्लाउड सेवाहरू + स्केलेबल ब्याकएन्ड ``` - -| भाषा | उत्तम प्रयोग | किन यो लोकप्रिय छ | +| भाषा | उत्कृष्ट प्रयोग | किन लोकप्रिय छ | |----------|----------|------------------| -| **जाभास्क्रिप्ट** | वेब विकास, प्रयोगकर्ता इन्टरफेस | ब्राउजरमा चल्छ र अन्तरक्रियात्मक वेबसाइटहरूलाई शक्ति दिन्छ | -| **पाइथन** | डाटा विज्ञान, स्वचालन, एआई | पढ्न र सिक्न सजिलो, शक्तिशाली लाइब्रेरीहरू | -| **जाभा** | उद्यम एप्लिकेसनहरू, एन्ड्रोइड एप्स | प्लेटफर्म-स्वतन्त्र, ठूला प्रणालीहरूको लागि बलियो | -| **C#** | विन्डोज एप्लिकेसनहरू, खेल विकास | माइक्रोसफ्ट इकोसिस्टमको बलियो समर्थन | -| **Go** | क्लाउड सेवाहरू, ब्याकएन्ड प्रणालीहरू | छिटो, सरल, आधुनिक कम्प्युटिङको लागि डिजाइन गरिएको | +| **JavaScript** | वेब विकास, उपयोगकर्ता अन्तरफलकहरू | ब्राउजरमा चल्छ र अन्तरक्रियात्मक वेबसाइटहरू सन्चालन गर्दछ | +| **Python** | डाटा विज्ञान, स्वचालन, AI | सजिलै पढ्न र सिक्न सकिन्छ, शक्तिशाली पुस्तकालयहरू | +| **Java** | उद्यम अनुप्रयोगहरू, Android एपहरू | प्लेटफर्म-स्वतन्त्र, ठूलो प्रणालीका लागि बलियो | +| **C#** | विन्डोज एप्लिकेशन, खेल विकास | मजबूत माइक्रोसफ्ट इकोसिस्टम समर्थन | +| **Go** | क्लाउड सेवा, ब्याकएन्ड प्रणालीहरू | छिटो, सरल, आधुनिक कम्प्युटिङका लागि डिजाइन गरिएको | -### उच्च-स्तर बनाम निम्न-स्तर भाषाहरू +### उच्च-स्तर र तल्लो-स्तर भाषाहरू -ठीक छ, यो इमानदारीपूर्वक अवधारणा थियो जसले मलाई पहिलो पटक सिक्दा मेरो दिमागलाई तोड्यो, त्यसैले म तपाईंलाई त्यो उपमा साझा गर्न जाँदैछु जसले अन्ततः मलाई क्लिक गरायो – र म साँच्चै आशा गर्दछु कि यसले तपाईंलाई पनि मद्दत गर्दछ! +ठीक छ, यो साँच्चै त्यो अवधारणा थियो जसले मेरो दिमाग फुटायो जब मैले सुरु गरेको थिएँ, त्यसैले म त्यो उपमा साझा गर्न जाँदैछु जसले अन्ततः मलाई बुझायो – र मलाई आशा छ तिमीलाई पनि सहयोग पुग्नेछ! -कल्पना गर्नुहोस् कि तपाईं एउटा देशमा भ्रमण गर्दै हुनुहुन्छ जहाँ तपाईंले भाषा बोल्नुहुन्न, र तपाईंलाई नजिकको बाथरूम खोज्न अत्यन्त आवश्यक छ (हामी सबै त्यहाँ पुगेका छौं, हैन? 😅): +कल्पना गर – तिमी एउटा देश भ्रमण गर्दैछौ जहाँ तिमी भाषा बोल्दैनौ, र तुरुन्त शौचालय खोज्नुपर्छ (हामी सबै त्यो अवस्थामा पुगेका छौँ, होइन? 😅): -- **निम्न-स्तर प्रोग्रामिङ** स्थानीय बोलीलाई यति राम्रोसँग सिक्न जस्तै हो कि तपाईं कुनामा फल बेच्ने हजुरआमासँग सांस्कृतिक सन्दर्भहरू, स्थानीय स्ल्याङ, र भित्री मजाकहरू प्रयोग गरेर कुरा गर्न सक्नुहुन्छ जुन केवल त्यहाँ हुर्केका व्यक्तिले मात्र बुझ्न सक्छ। सुपर प्रभावशाली र अविश्वसनीय रूपमा कुशल... यदि तपाईं धाराप्रवाह हुनुहुन्छ भने! तर तपाईं केवल बाथरूम खोज्न प्रयास गर्दै हुनुहुन्छ भने धेरै भारी। +- **तल्लो-स्तर प्रोग्रामिङ** त्यस्तो हो जस्तै स्थानीय बोली यती राम्रोसँग सिक्नु कि तिमी त्यहाँ फल बेच्ने हजुरआमासँग साँस्कृतिक सन्दर्भ, स्थानीय बोलचाल, र भित्री हास्य प्रयोग गरी कुराकानी गर्न सक्दछौ जुन केवल त्यहाँ पलाएका मान्छेले बुझ्छन्। अत्यन्त प्रभावशाली र धेरै प्रभावकारी... यदि तिमी त्यो भाषामा दिर्घकालीक रूपमा दक्ष छौ भने! तर शौचालय खोज्ने बेला भने अलि भारी हुन्छ। -- **उच्च-स्तर प्रोग्रामिङ** त्यो अद्भुत स्थानीय साथी भएको जस्तै हो जसले तपाईंलाई मात्र बुझ्छ। तपाईं "मलाई साँच्चै शौचालय खोज्न आवश्यक छ" सामान्य अंग्रेजीमा भन्न सक्नुहुन्छ, र तिनीहरूले सबै सांस्कृतिक अनुवादलाई ह्यान्डल गर्छन् र तपाईंलाई यस्तो तरिकामा निर्देशन दिन्छन् जुन तपाईंको गैर-स्थानीय मस्तिष्कमा पूर्ण रूपमा अर्थपूर्ण हुन्छ। +- **उच्च-स्तर प्रोग्रामिङ** त्यस्तो हो जस्तो त्यो अद्भुत स्थानीय साथी जसले तिमीलाई बुझ्छ। तिमीले "मलाई शौचालय फेला पार्न जरुरी छ" सरल अंग्रेजीमा भनें, र उनी सबै सांस्कृतिक अनुवाद गर्छन् र तिमीलाई यस्तो तरिकामा निर्देशन दिन्छन् जुन तिम्रो व्यक्ति-मूलक मस्तिष्कलाई पूर्ण रूपमा बुझिन्छ। -प्रोग्रामिङ सर्तहरूमा: -- **निम्न-स्तर भाषाहरू** (जस्तै Assembly वा C) तपाईंलाई कम्प्युटरको वास्तविक हार्डवेयरसँग अविश्वसनीय रूपमा विस्तृत कुराकानी गर्न दिन्छ, तर तपाईंलाई मेसिन जस्तै सोच्न आवश्यक छ, जुन... खैर, हामी केवल यो ठूलो मानसिक परिवर्तन हो भनेर भनौं! -- **उच्च-स्तर भाषाहरू** (जस्तै जाभास्क्रिप्ट, पाइथन, वा C#) तपाईंलाई मानव जस्तै सोच्न दिन्छ जबकि तिनीहरूले दृश्य पछाडि सबै मेसिन-भाषा ह्यान्डल गर्छन्। साथै, तिनीहरूसँग यी अविश्वसनीय स्वागतयोग्य समुदायहरू छन् जसले नयाँ भएको कस्तो महसुस हुन्छ भनेर सम्झन्छन् र वास्तवमा मद्दत गर्न चाहन्छन्! +प्रोग्रामिङमा: +- **तल्लो-स्तर भाषाहरू** (जस्तै Assembly वा C) तिमीलाई कम्प्युटरको वास्तविक हार्डवेयरसँग धेरै विस्तारपूर्वक कुराकानी गर्न अनुमति दिन्छ, तर तिमीले मेसिन झैँ सोच्नुपर्छ, जुन... खैर, ठूलो मानसिक परिवर्तन हो! +- **उच्च-स्तर भाषाहरू** (जस्तै JavaScript, Python, वा C#) तिमीलाई मान्छेसँग जस्तै सोच्न दिन्छ जब तिनीहरू पृष्ठभूमिमा मेसिन भाषामा सबै जटिल काम गर्छन्। साथै, यिनका अत्यन्त स्वागतयोग्य समुदायहरू छन् जो आफ्नै नयाँ अनुभव सम्झन्छन् र साँच्चिकै सहयोग गर्न चाहन्छन्! -तपाईंलाई सुरु गर्न म कुन सुझाव दिनेछु भनेर अनुमान गर्नुहोस्? 😉 उच्च-स्तर भाषाहरू प्रशिक्षण पाङ्ग्राहरू भएको जस्तै छन् जुन तपाईं वास्तवमा कहिल्यै हटाउन चाहनुहुन्न किनभने तिनीहरूले सम्पूर्ण अनुभवलाई धेरै रमाइलो बनाउँछन्! +तिमी जे सोच्यौ? 😉 म तिमीलाई कुनबाट सुरु गर्न सल्लाह दिनेछु? उच्च-स्तर भाषाहरू तिमीलाई यस्तो प्रशिक्षण पाङ्ग्रा जस्तै हो जुन तिमी कहिल्यै हटाउन चाहँदैनौ किनभने तिनीहरूले अनुभवलाई धेरै रमाइलो बनाउँछन्! ```mermaid flowchart TB - A["👤 Human Thought:
'I want to calculate Fibonacci numbers'"] --> B{Choose Language Level} + A["👤 मान्छेको सोच:
'म फिबोनाची सङ्ख्याहरू गणना गर्न चाहन्छु'"] --> B{भाषा स्तर चयन गर्नुहोस्} - B -->|High-Level| C["🌟 JavaScript/Python
Easy to read and write"] - B -->|Low-Level| D["⚙️ Assembly/C
Direct hardware control"] + B -->|उच्च स्तर| C["🌟 जाभास्क्रिप्ट/पाइथन
पढ्न र लेख्न सजिलो"] + B -->|तल्लो स्तर| D["⚙️ असेम्ब्ली/सी
प्रत्यक्ष हार्डवेयर नियन्त्रण"] - C --> E["📝 Write: fibonacci(10)"] - D --> F["📝 Write: mov r0,#00
sub r0,r0,#01"] + C --> E["📝 लेख्नुहोस्: fibonacci(10)"] + D --> F["📝 लेख्नुहोस्: mov r0,#00
sub r0,r0,#01"] - E --> G["🤖 Computer Understanding:
Translator handles complexity"] + E --> G["🤖 कम्प्युटरको बुझाइ:
अनुवादकले जटिलता सम्हाल्छ"] F --> G - G --> H["💻 Same Result:
0, 1, 1, 2, 3, 5, 8, 13..."] + G --> H["💻 उस्तै परिणाम:
0, 1, 1, 2, 3, 5, 8, 13..."] style C fill:#e1f5fe style D fill:#fff3e0 style H fill:#e8f5e8 ``` +### म तिमीलाई देखाउँछु किन उच्च-स्तर भाषाहरू धेरै मित्रवत छन् -### उच्च-स्तर भाषाहरू किन धेरै मैत्रीपूर्ण छन् भनेर म तपाईंलाई देखाउँछु - -ठीक छ, म तपाईंलाई केही देखाउन जाँदैछु जसले उच्च-स्तर भाषाहरू किन माया गरें भनेर पूर्ण रूपमा प्रदर्शन गर्दछ, तर पहिले – म तपाईंलाई केहि वाचा गर्न आवश्यक छ। जब तपाईंले त्यो पहिलो कोड उदाहरण देख्नुहुन्छ, आतंक नगर्नुहोस्! यो डर लाग्दो देखिनु पर्ने हो। त्यो ठीक त्यही बिन्दु हो जुन म बनाउँदैछु! +ठीक छ, म तिमीलाई यस्तो कुरा देखाउन लागें जुन म उच्च-स्तर भाषाहरूमा किन प्रेम गर्थे भन्ने स्पष्ट पार्छ, तर पहिले – मलाई तिमी केही कुरा वाचा गर्नुपर्नेछ। पहिलो कोड उदाहरण हेर्दा डराउनु पर्दैन! त्यो जानाजान डर देखाउनको लागि हो। ठीक यो नै मेरो बिन्दु हो! -हामी एकदमै समान कार्य दुई पूर्ण रूपमा फरक शैलीमा लेखिएको हेर्नेछौं। दुवैले फिबोनाच्ची अनुक्रम सिर्जना गर्छन् – यो यो सुन्दर गणितीय ढाँचा हो जहाँ प्रत्येक संख्या अघिल्लो दुईको योग हो: ०, १, १, २, ३, ५, ८, १३... (मजाको तथ्य: तपाईंले यो ढाँचा प्रकृतिमा शाब्दिक रूपमा सबै ठाउँमा पाउनुहुनेछ – घामफूलको बीउको घुमाउरो, सल्लाको शंकु ढाँचा, यहाँसम्म कि आकाशगंगाहरू बनाउने तरिका!) +हामी ठीक उही काम दुई बिल्कुल फरक शैलीमा लेखिएको हेर्ने छौं। दुबैले फारबोनाच्ची अनुक्रम नामको गणितीय सुन्दर पैटर्न सिर्जना गर्छ – यो त्यस्तो प्याटर्न हो जहाँ प्रत्येक संख्या अघिल्ला दुई संख्या योग हो: 0, 1, 1, 2, 3, 5, 8, 13... (रोचक कुरा: तिमी यो ढाँचा प्रकृतिमा पनि सबैत्र पाउनेछौ – सूर्यफूलका बीउका घुम्ती, पाइन्कोनका ढाँचाहरू, यहाँसम्म कि आकाशगंगाहरूको निर्माण!) -तयार हुनुहुन्छ फरक देख्न? सुरु गरौं! +तयार छौं भिन्नता हेर्न? सुरु गरौं! -**उच्च-स्तर भाषा (जाभास्क्रिप्ट) – मानव-मैत्रीपूर्ण:** +**उच्च-स्तर भाषा (JavaScript) – मान्छे-मित्रवत:** ```javascript -// Step 1: Basic Fibonacci setup +// चरण १: आधारभूत फिबोनाची सेटअप const fibonacciCount = 10; let current = 0; let next = 1; @@ -186,127 +183,201 @@ let next = 1; console.log('Fibonacci sequence:'); ``` -**यो कोडले के गर्छ:** -- **घोषणा गर्नुहोस्** कि हामी कति फिबोनाच्ची संख्या उत्पन्न गर्न चाहन्छौं -- **आरम्भ गर्नुहोस्** दुई भेरिएबलहरू अनुक्रममा हालको र अर्को संख्याहरू ट्र्याक गर्न -- **सेट अप गर्नुहोस्** फिबोनाच्ची ढ -- **टिप्पणीहरू**: उच्च-स्तरीय भाषाहरूले व्याख्यात्मक टिप्पणीहरूलाई प्रोत्साहन गर्छन् जसले कोडलाई आफैंले बुझ्न सक्ने बनाउँछ। -- **संरचना**: जाभास्क्रिप्टको तार्किक प्रवाहले मानिसहरूले समस्याहरूलाई चरण-दर-चरण सोच्ने तरिकासँग मेल खान्छ। -- **मर्मतसम्भार**: विभिन्न आवश्यकताहरूका लागि जाभास्क्रिप्ट संस्करण अद्यावधिक गर्नु सरल र स्पष्ट छ। +**यो कोड के गर्छ:** +- **घोषणा** स्थायी मान जसले कति वटा फारबोनाच्ची संख्या उत्पन्न गर्ने छ भनेर जनाउँछ +- **शुरूवात** दुई भेरिएबलमार्फत अनुक्रमका हाल र अर्को संख्या ट्र्याक गर्छ +- **सेटअप** सुरुका मानहरू (0 र 1) जसले फारबोनाच्ची नमूना परिभाषित गर्छ +- **प्रदर्शन** आउटपुटको लागि एक शीर्षक सन्देश देखाउँछ + +```javascript +// चरण २: लूपको साथ अनुक्रम उत्पन्न गर्नुहोस् +for (let i = 0; i < fibonacciCount; i++) { + console.log(`Position ${i + 1}: ${current}`); + + // अनुक्रममा अर्को संख्या गणना गर्नुहोस् + const sum = current + next; + current = next; + next = sum; +} +``` + +**यहाँ के हुन्छ भाँच्दै:** +- **पर्खाल** हरेक अनुक्रम स्थानमा `for` लूप प्रयोग गरेर घुम्छ +- **प्रदर्शन** प्रत्येक सङ्ख्या र यसको स्थान टेम्प्लेट लिटरल फारम्याटिङ्गले देखाउँछ +- **गणना** वर्तमान र अर्को मानहरू जोडेर अर्को फारबोनाच्ची संख्या बनाउँछ +- **अद्यावधिक** हाम्रो ट्र्याकिङ भेरिएबलहरू अर्को चरणमा लाग्छ + +```javascript +// चरण ३: आधुनिक कार्यात्मक दृष्टिकोण +const generateFibonacci = (count) => { + const sequence = [0, 1]; + + for (let i = 2; i < count; i++) { + sequence[i] = sequence[i - 1] + sequence[i - 2]; + } + + return sequence; +}; + +// उपयोग उदाहण +const fibSequence = generateFibonacci(10); +console.log(fibSequence); +``` + +**माथि, हामीले:** +- **बनेको** आधुनिक एरो फङ्सन सिन्ट्याक्स प्रयोग गरेर पुन: प्रयोग गर्न मिल्ने फंक्शन +- **बनायो** सम्पूर्ण अनुक्रम भण्डारण गर्नको लागि एरे एकल एकल देखाउनुभन्दा +- **एरे इन्डेक्सिङ** प्रयोग गरेर हरेक नयाँ संख्या पहिलेका मानबाट गणना गर्‍यो +- **फिर्ता गर्‍यो** पूर्ण अनुक्रम लचिलो प्रयोगको लागि प्रोग्रामका अन्य भागहरूमा + +**तल्लो-स्तर भाषा (ARM Assembly) – कम्प्युटर-मित्रवत:** + +```assembly + area ascen,code,readonly + entry + code32 + adr r0,thumb+1 + bx r0 + code16 +thumb + mov r0,#00 + sub r0,r0,#01 + mov r1,#01 + mov r4,#10 + ldr r2,=0x40000000 +back add r0,r1 + str r0,[r2] + add r2,#04 + mov r3,r0 + mov r0,r1 + mov r1,r3 + sub r4,#01 + cmp r4,#00 + bne back + end +``` + +JavaScript संस्करण लगभग अंग्रेजी निर्देश जस्तै पढिन्छ, जबकि Assembly संस्करण कम्प्युटरको प्रोसेसरलाई सिधै नियन्त्रण गर्ने गूढ आदेशहरू प्रयोग गर्छ। दुबैले ठ्याक्कै उही काम गर्दछन्, तर उच्च-स्तर भाषा मान्छेलाई बुझ्न, लेख्न, र मर्मत गर्न सजिलो हुन्छ। + +**तिमीले देख्ने मुख्य फरकहरू:** +- **पढ्न सजिलो**: JavaScript मा `fibonacciCount` जस्ता वर्णनात्मक नामहरू प्रयोग गरिन्छ जबकि Assembly ले `r0`, `r1` जस्ता रहस्यमय लेबलहरू प्रयोग गर्दछ +- **टिप्पणीहरू**: उच्च-स्तरीय भाषाहरू व्याख्यात्मक टिप्पणीहरूलाई प्रोत्साहन गर्छन् जसले कोडलाई आत्म-दस्तावेजी बनाउँछ +- **संरचना**: JavaScript को तार्किक प्रवाहले मानिसहरू समस्याहरूलाई चरण-दर-चरण कसरी सोच्दछन् त्यो अनुसार मेल खान्छ +- **मर्मतसम्भार**: फरक आवश्यकताहरूको लागि JavaScript संस्करण अद्यावधिक गर्नु सरल र स्पष्ट हुन्छ -✅ **फिबोनाची अनुक्रमको बारेमा**: यो अत्यन्तै सुन्दर संख्याको ढाँचा (जहाँ प्रत्येक संख्या अघिल्लो दुईको योग बराबर हुन्छ: ०, १, १, २, ३, ५, ८...) प्रकृतिमा *जताततै* देखिन्छ! तपाईंले यसलाई सूर्यफूलको घुमाउरो, सल्लाको शंकुका ढाँचाहरू, नौटिलस खोलको घुमाउरो, र यहाँसम्म कि रुखका हाँगाहरू बढ्ने तरिकामा पनि पाउनुहुनेछ। गणित र कोडले प्रकृतिले सौन्दर्य सिर्जना गर्न प्रयोग गर्ने ढाँचाहरूलाई बुझ्न र पुनः सिर्जना गर्न मद्दत गर्न सक्छ भन्ने कुरा साँच्चै चमत्कारी छ! +✅ **Fibonacci अनुक्रम बारे**: यो अत्यन्त आकर्षक संख्या ढाँचा (जहाँ प्रत्येक संख्या अघिल्लो दुईको योग बराबर हुन्छ: 0, 1, 1, 2, 3, 5, 8...) प्रकृतिमा शब्दशः *सबै ठाउँमा* पाईन्छ! तपाईं यसलाई सूर्यगुलाबी फुलका घुमाउरोहरू, पाइनकोन ढाँचाहरू, नटिलस खोलाहरू कसरी घुम्छन् र रुखका हाँगाहरू कसरी बढ्छन् त्यसमाथि पनि पाउनुहुनेछ। कति अचम्म लाग्दो छ कि गणित र कोडले हामीलाई प्राकृतिक सुन्दरताका ढाँचाहरू बुझ्न र पुनःनिर्माण गर्न सहयोग पुर्‍याउँछन्! -## जादू सिर्जना गर्ने आधारभूत तत्वहरू +## जादु हुने आधारभूत पाटाहरू -ठिक छ, अब तपाईंले प्रोग्रामिङ भाषाहरूलाई काममा देख्नुभयो, आउनुहोस् ती आधारभूत टुक्राहरूलाई तोडौं जसले अहिलेसम्म लेखिएको प्रत्येक प्रोग्राम बनाउँछ। यीलाई तपाईंको मनपर्ने रेसिपीका आवश्यक सामग्रीहरू जस्तै सोच्नुहोस् – एकपटक तपाईंले प्रत्येकले के गर्छ बुझ्नुभयो भने, तपाईंले लगभग कुनै पनि भाषामा कोड पढ्न र लेख्न सक्नुहुन्छ! +ठिक छ, अब तपाईंले कार्यक्रम भाषाहरू क्रियाशील रूपमा कस्तो देखिन्छ भनेर हेर्नुभयो, आउनुहोस् ती मुलभूत अंशहरूलाई टुक्र्याएर हेयरौं जसले शब्दशः हरेक लेखिएको प्रोग्राम बनाउँछन्। यीलाई तपाईंको मनपर्ने पाक विधिमामा आवश्यक सामग्रीहरू जस्तो सम्झनुहोस् – एकपटक तपाईंले प्रत्येक अंशको काम बुझ्नुभयो भने, तपाईं लगभग कुनै पनि भाषामा कोड पढ्न र लेख्न सक्षम हुनुहुनेछ! -यो प्रोग्रामिङको व्याकरण सिक्ने जस्तै हो। विद्यालयमा तपाईंले संज्ञा, क्रियापद, र वाक्यहरू कसरी मिलाउने भनेर सिक्नुभएको सम्झनुहुन्छ? प्रोग्रामिङको आफ्नै व्याकरण छ, र इमानदारीपूर्वक भन्नुपर्दा, यो अंग्रेजी व्याकरणभन्दा धेरै तार्किक र क्षमाशील छ! 😄 +यो प्रोग्रामिङको व्याकरण सिक्ने जस्तो हो। स्कूलमा जब तपाईंले नाम, क्रिया र वाक्य कसरी बनाएँ भन्ने कुरा सिक्नु भयो? प्रोग्रामिङको आफ्नै व्याकरण छ, र साँच्चै भन्नुपर्दा, त्यो अंग्रेजी व्याकरण भन्दा धेरै तार्किक र माफालु छ! 😄 -### स्टेटमेन्टहरू: चरण-दर-चरण निर्देशनहरू +### बयानहरू: कदम-दर-कदम निर्देशनहरू -आउनुहोस् **स्टेटमेन्टहरू**बाट सुरु गरौं – यी तपाईंको कम्प्युटरसँगको कुराकानीका व्यक्तिगत वाक्यहरू जस्तै हुन्। प्रत्येक स्टेटमेन्टले कम्प्युटरलाई एक विशिष्ट काम गर्न भन्छ, जस्तै निर्देशन दिनु: "यहाँ बायाँ मोड्नुहोस्," "रातो बत्तीमा रोक्नुहोस्," "त्यो ठाउँमा पार्क गर्नुहोस्।" +हाम्रा सुरु गरौं **बयानहरू** बाट – यी तपाईंको कम्प्युटरसँग कुराकानी गर्ने व्यक्तिगत वाक्य जस्तै हुन्छन्। हरेक बयानले कम्प्युटरलाई कुनै एउटा विशेष काम गर्न आदेश दिन्छ, जस्तै दिशानिर्देशनहरू दिने: "यहाँबाट बायाँ घुम," "रातो बत्तीमा रोकिनु," "त्यो ठाउँमा पार्क गर्नु।" -मलाई स्टेटमेन्टहरू मनपर्छ किनभने ती सामान्यतया पढ्न सजिलो हुन्छन्। यो हेर्नुहोस्: +बयानहरूको सबैभन्दा राम्रो कुरा तिनीहरू धेरै पढ्न सजिला हुन्छन्। यो हेरौँ: ```javascript -// Basic statements that perform single actions +// एकल कार्यहरू गर्ने आधारभूत कथनहरू const userName = "Alex"; console.log("Hello, world!"); const sum = 5 + 3; ``` - -**यो कोडले के गर्छ:** -- **घोषणा गर्नुहोस्** स्थिर भेरिएबल प्रयोगकर्ताको नाम भण्डारण गर्न। -- **देखाउनुहोस्** अभिवादन सन्देश कन्सोल आउटपुटमा। -- **गणना गर्नुहोस्** र गणितीय अपरेशनको नतिजा भण्डारण गर्नुहोस्। + +**यस कोडले के गर्छ:** +- प्रयोगकर्ताको नाम भण्डारण गर्न स्थिर चर घोषणा गर्नुहोस् +- कन्सोल आउटपुटमा अभिवादन सन्देश देखाउनुहोस् +- गणितीय अपरेसनको परिणाम गणना र भण्डारण गर्नुहोस् ```javascript -// Statements that interact with web pages +// वेब पृष्ठहरूसँग अन्तरक्रिया गर्ने वक्तव्यहरू document.title = "My Awesome Website"; document.body.style.backgroundColor = "lightblue"; ``` - -**चरण-दर-चरण, यहाँ के भइरहेको छ:** -- **परिवर्तन गर्नुहोस्** ब्राउजर ट्याबमा देखिने वेबपेजको शीर्षक। -- **बदल्नुहोस्** सम्पूर्ण पृष्ठको पृष्ठभूमि रंग। -### भेरिएबलहरू: तपाईंको प्रोग्रामको मेमोरी प्रणाली +**क्रमशः, यसरी हुन्छ:** +- ब्राउजर ट्याबमा देखा पर्ने वेबपेजको शीर्षक परिवर्तन गर्नुहोस् +- सम्पूर्ण पृष्ठको पृष्ठभूमि रङ परिवर्तन गर्नुहोस् -ठिक छ, **भेरिएबलहरू** इमानदारीपूर्वक मेरो मनपर्ने अवधारणाहरू मध्ये एक हो किनभने ती तपाईंले दैनिक जीवनमा प्रयोग गर्ने चीजहरू जस्तै छन्! +### चरहरू: तपाईंको प्रोग्रामको स्मृति प्रणाली -तपाईंको फोनको सम्पर्क सूचीको बारेमा सोच्नुहोस्। तपाईंले सबैको फोन नम्बर याद गर्नुहुन्न – यसको सट्टा, तपाईं "आमा," "सबैभन्दा राम्रो साथी," वा "पिज्जा स्थान जसले रातको २ बजेसम्म डेलिभर गर्छ" बचत गर्नुहुन्छ र तपाईंको फोनले वास्तविक नम्बरहरू सम्झन्छ। भेरिएबलहरू ठीक त्यस्तै काम गर्छन्! ती लेबल गरिएको कन्टेनरहरू जस्तै हुन् जहाँ तपाईंको प्रोग्रामले जानकारी भण्डारण गर्न सक्छ र पछि नाम प्रयोग गरेर पुनः प्राप्त गर्न सक्छ। +ठीक छ, **चरहरू** मेरो सबैभन्दा मनपर्ने अवधारणाहरू मध्ये एक हुन् किनभने तिनीहरू तपाईंले दैनिक रूपमा प्रयोग गर्ने वस्तुहरू जस्तै हुन्! -यहाँ के साँच्चै चाखलाग्दो छ: भेरिएबलहरू तपाईंको प्रोग्राम चल्दा परिवर्तन गर्न सक्छन् (त्यसैले नाम "भेरिएबल" – हेर्नुहोस् उनीहरूले के गरे?)। जस्तै तपाईंले त्यो पिज्जा स्थान सम्पर्क अपडेट गर्न सक्नुहुन्छ जब तपाईंले अझ राम्रो ठाउँ पत्ता लगाउनुहुन्छ, भेरिएबलहरू तपाईंको प्रोग्रामले नयाँ जानकारी सिक्दा वा परिस्थितिहरू परिवर्तन हुँदा अपडेट गर्न सकिन्छ! +तपाईंको फोनको सम्पर्क सूचीलाई सोच्नुहोस्। तपाईं सबैको नम्बर याद गर्नुहुन्न – बरु "आमा," "सबैभन्दा राम्रो साथी," वा "रात्री २ बजेसम्म पिज्जा डेलिभरी गर्ने ठाउँ" सुरक्षित गर्नुहुन्छ र तपाईंको फोनले वास्तविक नम्बरहरू याद गर्छ। चरहरू त्यस्तै हुन्छन्! तिनीहरू लेबल गरिएका कन्टेनरहरू हुन् जहाँ तपाईंको प्रोग्रामले जानकारी भण्डारण गर्न र पछि नाम प्रयोग गरी पुन: प्राप्त गर्न सक्छ। -म तपाईंलाई यो कति सुन्दर सरल हुन सक्छ भनेर देखाउँछु: +यो साँच्चिकै राम्रो कुरा हो: चरहरू प्रोग्राम चलिरहेको बेला परिवर्तन हुन सक्छन् (त्यसैले तिनीहरूलाई "चर" भनिन्छ – के हेर्नुभएको?). जस्तै तपाईं तेस्रो पक्ष पिज्जा स्थल परिवर्तन गर्नुहुन्छ जब राम्रो ठाउँ भेट्टाउनुहुन्छ, प्रोग्रामले नयाँ जानकारी सिक्दा वा अवस्था परिवर्तन हुँदा चरहरू अद्यावधिक गर्न सकिन्छ! + +यहाँ कति सरल र सुन्दर हुने देखाउन तयार छु: ```javascript -// Step 1: Creating basic variables +// चरण 1: आधारभूत चरहरू सिर्जना गर्दै const siteName = "Weather Dashboard"; let currentWeather = "sunny"; let temperature = 75; let isRaining = false; ``` - -**यी अवधारणाहरू बुझ्दै:** -- **भण्डारण गर्नुहोस्** स्थिर मानहरू `const` भेरिएबलहरूमा (जस्तै साइट नाम)। -- **प्रयोग गर्नुहोस्** `let` मानहरूको लागि जुन तपाईंको प्रोग्राममा परिवर्तन हुन सक्छ। -- **असाइन गर्नुहोस्** विभिन्न डेटा प्रकारहरू: स्ट्रिङहरू (पाठ), नम्बरहरू, र बूलियनहरू (सत्य/झुटो)। -- **चयन गर्नुहोस्** वर्णनात्मक नामहरू जसले प्रत्येक भेरिएबलले के समावेश गर्छ व्याख्या गर्छ। + +**यी अवधारणाहरू बुझ्दै:** +- `const` चरहरूमा अपरिवर्तनीय मानहरू भण्डारण गर्नुहोस् (जस्तै साइट नाम) +- प्रोग्रामभर परिवर्तन हुन सक्ने मानहरूका लागि `let` प्रयोग गर्नुहोस् +- विभिन्न प्रकारका डेटा जस्तै स्ट्रिङ (पाठ), संख्या, र बूलियन (सत्य/असत्य) निर्धारण गर्नुहोस् +- प्रत्येक चरले के चाहन्छ भन्ने वर्णन गर्ने नामहरू रोज्नुहोस् ```javascript -// Step 2: Working with objects to group related data +// चरण २: सम्बन्धित डाटा समूह गर्न वस्तुहरूसँग काम गर्ने const weatherData = { location: "San Francisco", humidity: 65, windSpeed: 12 }; ``` - -**माथिको कोडमा, हामीले:** -- **सिर्जना गर्यौं** सम्बन्धित मौसम जानकारीलाई एकसाथ समूह गर्न एक वस्तु। -- **व्यवस्थित गर्यौं** एक भेरिएबल नाम अन्तर्गत धेरै डेटा टुक्राहरू। -- **प्रयोग गर्यौं** प्रत्येक टुक्रालाई स्पष्ट रूपमा लेबल गर्न कुञ्जी-मूल्य जोडीहरू। + +**माथिको ठाउँमा हामीले:** +- सम्बन्धित मौसम सूचना समूहबद्ध गर्न वस्तु बनायौं +- धेरै डेटा एउटै चर नाम अन्तर्गत सङगठित गर्यौं +- प्रत्येक जानकारीलाई स्पष्ट रूपमा लेबल गर्न कुञ्जी-मूल्य जोडीहरू प्रयोग गर्यौं ```javascript -// Step 3: Using and updating variables +// चरण ३: चलहरू प्रयोग र अद्यावधिक गर्दै console.log(`${siteName}: Today is ${currentWeather} and ${temperature}°F`); console.log(`Wind speed: ${weatherData.windSpeed} mph`); -// Updating changeable variables +// परिवर्तनशील चलहरू अद्यावधिक गर्दै currentWeather = "cloudy"; temperature = 68; ``` - -**प्रत्येक भाग बुझौं:** -- **देखाउनुहोस्** जानकारी टेम्प्लेट लिटरलहरू प्रयोग गरेर `${}` सिन्ट्याक्स। -- **पहुंच गर्नुहोस्** वस्तु गुणहरू डट नोटेशन (`weatherData.windSpeed`) प्रयोग गरेर। -- **अपडेट गर्नुहोस्** `let` भेरिएबलहरू बदलिने अवस्थाहरू प्रतिबिम्बित गर्न। -- **संयोजन गर्नुहोस्** धेरै भेरिएबलहरू अर्थपूर्ण सन्देशहरू सिर्जना गर्न। + +**प्रत्येक भाग बुझौं:** +- `${}` प्रयोग गरी टेम्प्लेट लिटरल्स मार्फत जानकारी प्रदर्शन गर्नुहोस् +- डट नोटेशन (`weatherData.windSpeed`) ले वस्तुको गुणहरू पहुँच गर्नुहोस् +- `let` संग घोषित चरहरूलाई हालको अवस्थाहरू प्रतिबिम्बित गर्न अद्यावधिक गर्नुहोस् +- धेरै चरहरू मिलाएर अर्थपूर्ण सन्देशहरू सिर्जना गर्नुहोस् ```javascript -// Step 4: Modern destructuring for cleaner code +// चरण ४: सफा कोडको लागि आधुनिक डेस्ट्रक्चरिङ्ग const { location, humidity } = weatherData; console.log(`${location} humidity: ${humidity}%`); ``` - -**तपाईंलाई थाहा हुनुपर्ने कुरा:** -- **निकाल्नुहोस्** वस्तुहरूबाट विशिष्ट गुणहरू डेस्ट्रक्चरिङ असाइनमेन्ट प्रयोग गरेर। -- **सिर्जना गर्नुहोस्** नयाँ भेरिएबलहरू स्वतः वस्तु कुञ्जीहरूको समान नामहरू प्रयोग गरेर। -- **सरल बनाउनुहोस्** कोड दोहोरिने डट नोटेशनबाट बचेर। -### नियन्त्रण प्रवाह: तपाईंको प्रोग्रामलाई सोच्न सिकाउँदै +**जान्न आवश्यक कुरा:** +- वस्तुबाट विशिष्ट गुणहरू निकाल्न संरचना (destructuring) असाइनमेन्ट प्रयोग गर्नुहोस् +- वस्तु कुञ्जीहरू जस्तै नामका नयाँ चरहरू स्वतः सिर्जना गर्नुहोस् +- केवल डट नोटेशन दोहोर्याउने टाढा गरेर कोड सरल बनाउनुहोस् -ठिक छ, यहाँ प्रोग्रामिङ साँच्चै चमत्कारी हुन्छ! **नियन्त्रण प्रवाह** भनेको तपाईंको प्रोग्रामलाई स्मार्ट निर्णय गर्न सिकाउनु हो, ठीक तपाईंले दैनिक जीवनमा सोच्नुभएको जस्तै। +### नियन्त्रण प्रवाह: तपाईँको प्रोग्रामलाई सोच्न सिकाउनु -कल्पना गर्नुहोस्: आज बिहान तपाईंले सम्भवतः यस्तो सोच्नुभयो "यदि पानी परिरहेको छ भने, म छाता लिन्छु। यदि चिसो छ भने, म ज्याकेट लगाउँछु। यदि म ढिलो छु भने, म नास्ता छोड्छु र बाटोमा कफी लिन्छु।" तपाईंको मस्तिष्कले यो यदि-त्यसपछि तर्क स्वाभाविक रूपमा दैनिक जीवनमा दर्जनौं पटक अनुसरण गर्छ! +ठिक छ, यहाँ प्रोग्रामिङ पूर्णतया रोमाञ्चक बन्न थाल्छ! **नियन्त्रण प्रवाह** तपाईंको प्रोग्रामलाई बुद्धिमानी निर्णय गर्न सिकाउने प्रक्रिया हो, ठीक तपाईंले दैनिक जीवनमा बिना सोचाइ गर्ने जस्तो। -यसले प्रोग्रामहरूलाई बोरिंग, पूर्वानुमानित स्क्रिप्टको सट्टा बौद्धिक र जीवित महसुस गराउँछ। तिनीहरूले वास्तवमा स्थिति हेर्न सक्छन्, के भइरहेको छ मूल्याङ्कन गर्न सक्छन्, र उपयुक्त रूपमा प्रतिक्रिया दिन सक्छन्। यो तपाईंको प्रोग्रामलाई अनुकूलन गर्न र निर्णय गर्न सक्ने मस्तिष्क दिने जस्तै हो! +कल्पना गर्नुहोस्: आज बिहान तपाईंले " यदि पानी पर्दैछ भने छाता लिएर जान्छु। यदि चिसो छ भने ज्याकेट लगाउँछु। यदि म ढिला छु भने बिहानको खाना छोडेर बाटोमा कफी लिन्छु।" तपाईंको दिमाग स्वतः यो यदि-त्यसो हो त-त्यसो सम्बन्धित तर्कलाई पटक-पटक पालना गर्छ! -यो कति सुन्दर काम गर्छ हेर्न चाहनुहुन्छ? म तपाईंलाई देखाउँछु: +यसले प्रोग्रामहरूलाई बुद्धिमानी र जीवन्त महसुस गराउँछ, केवल कुनै एकरस, कडाइपूर्ण स्क्रिप्ट चलाउने नभई। तिनीहरूले अवस्था मूल्यांकन गरेर उपयुक्त प्रतिक्रिया दिन सक्छन्। यो तपाईंको प्रोग्रामलाई अनुकूलन र निर्णय गर्ने मष्तिष्क दिने जस्तो हो! + +यो कति असाधारण काम गर्छ भनेर देख्न चाहनुहुन्छ? हेरौँ: ```javascript -// Step 1: Basic conditional logic +// चरण १: आधारभूत सशर्त तर्क const userAge = 17; if (userAge >= 18) { @@ -316,15 +387,15 @@ if (userAge >= 18) { console.log(`You'll be able to vote in ${yearsToWait} year(s).`); } ``` - -**यो कोडले के गर्छ:** -- **जाँच गर्नुहोस्** प्रयोगकर्ताको उमेर मतदान आवश्यकतासँग मेल खान्छ कि छैन। -- **कार्यान्वयन गर्नुहोस्** विभिन्न कोड ब्लकहरू सर्तको परिणामको आधारमा। -- **गणना गर्नुहोस्** र मतदान योग्यता प्राप्त गर्न कति समय बाँकी छ देखाउनुहोस्। -- **प्रदान गर्नुहोस्** प्रत्येक परिदृश्यको लागि विशिष्ट, उपयोगी प्रतिक्रिया। + +**यस कोडले के गर्छ:** +- प्रयोगकर्ताको उमेर मतदान योग्यता पूरा गरेको छ कि छैन जाँच्नुहोस् +- अवस्थाको परिणाम अनुसार विभिन्न कोड ब्लकहरू चलाउनुहोस् +- १८ वर्ष मुनिको भए मतदान योग्यता सम्म कति समय बाँकी छ गणना गरी देखाउनुहोस् +- प्रत्येक परिदृश्यका लागि विशेष, उपयोगी प्रतिक्रिया दिनुहोस् ```javascript -// Step 2: Multiple conditions with logical operators +// चरण २: तार्किक अपरेटरहरूसँग बहु सर्तहरू const userAge = 17; const hasPermission = true; @@ -336,26 +407,26 @@ if (userAge >= 18 && hasPermission) { console.log("Sorry, you must be at least 16 years old."); } ``` - -**यहाँ के भइरहेको छ तोड्दै:** -- **संयोजन गर्नुहोस्** धेरै सर्तहरू `&&` (र) अपरेटर प्रयोग गरेर। -- **सिर्जना गर्नुहोस्** सर्तहरूको पदानुक्रम `else if` प्रयोग गरेर धेरै परिदृश्यहरूको लागि। -- **सम्भावित सबै केसहरू ह्यान्डल गर्नुहोस्** अन्तिम `else` स्टेटमेन्टसँग। -- **प्रदान गर्नुहोस्** प्रत्येक फरक परिस्थितिको लागि स्पष्ट, कार्ययोग्य प्रतिक्रिया। + +**यहाँ के हुन्छ टूटेर बुझौं:** +- `&&` (र) अपरेटर प्रयोग गरी धेरै अवस्था संयोजन गर्नुहोस् +- `else if` प्रयोग गरी विभिन्न परिदृश्यहरूको श्रेणी बनाउनुहोस् +- अन्तिम `else` बयानले सबै सम्भावित केसहरू सम्हाल्छ +- प्रत्येक फरक अवस्थाका लागि स्पष्ट, उपयोगी प्रतिक्रिया दिनुहोस् ```javascript -// Step 3: Concise conditional with ternary operator +// चरण ३: टर्नरी अपरेटरसँग संक्षिप्त सर्तीय अभिव्यक्ति const votingStatus = userAge >= 18 ? "Can vote" : "Cannot vote yet"; console.log(`Status: ${votingStatus}`); ``` - -**तपाईंले सम्झनुपर्ने कुरा:** -- **प्रयोग गर्नुहोस्** टर्नरी अपरेटर (`? :`) सरल दुई-विकल्प सर्तहरूको लागि। -- **लेख्नुहोस्** सर्त पहिले, त्यसपछि `?`, त्यसपछि सत्य परिणाम, त्यसपछि `:`, त्यसपछि झुटो परिणाम। -- **लागू गर्नुहोस्** यो ढाँचा जब तपाईंलाई सर्तहरूको आधारमा मानहरू असाइन गर्न आवश्यक छ। + +**स्मरण गर्नु पर्ने कुरा:** +- सरल दुइ विकल्प अवस्थाहरूका लागि ternary अपरेटर (`? :`) प्रयोग गर्नुहोस् +- पहिले अवस्था लेख्नुहोस्, त्यसपछि `?`, त्यसपछि सत्य परिणाम, त्यसपछि `:`, त्यसपछि झूठ परिणाम लेख्नुहोस् +- अवस्था अनुसार मानहरु निर्धारित गर्न यो ढाँचाको प्रयोग गर्नुहोस् ```javascript -// Step 4: Handling multiple specific cases +// चरण ४: धेरै विशिष्ट केसहरूको व्यवस्थापन const dayOfWeek = "Tuesday"; switch (dayOfWeek) { @@ -374,58 +445,57 @@ switch (dayOfWeek) { console.log("Invalid day of the week"); } ``` - -**यो कोडले निम्न कार्यहरू पूरा गर्छ:** -- **मिलाउनुहोस्** भेरिएबल मानलाई धेरै विशिष्ट केसहरूसँग। -- **समूह बनाउनुहोस्** समान केसहरू (सप्ताहका दिन बनाम सप्ताहन्त)। -- **कार्यान्वयन गर्नुहोस्** उपयुक्त कोड ब्लक जब मिलान भेटिन्छ। -- **समावेश गर्नुहोस्** अप्रत्याशित मानहरू ह्यान्डल गर्न `default` केस। -- **प्रयोग गर्नुहोस्** `break` स्टेटमेन्टहरू कोडलाई अर्को केसमा जारी राख्नबाट रोक्न। -> 💡 **वास्तविक जीवनको उपमा**: नियन्त्रण प्रवाहलाई संसारकै सबैभन्दा धैर्यवान जीपीएसले तपाईंलाई निर्देशन दिइरहेको जस्तै सोच्नुहोस्। यो भन्न सक्छ "यदि मेन स्ट्रीटमा ट्राफिक छ भने, राजमार्ग लिनुहोस्। यदि राजमार्गमा निर्माण भइरहेको छ भने, रमणीय मार्ग प्रयास गर्नुहोस्।" प्रोग्रामहरूले ठीक त्यस्तै प्रकारको सर्तात्मक तर्क प्रयोग गर्छन् विभिन्न परिस्थितिहरूमा बुद्धिमानीपूर्वक प्रतिक्रिया दिन र सधैं प्रयोगकर्ताहरूलाई उत्तम सम्भावित अनुभव दिन। +**यस कोडले के गर्छ:** +- चरको मानलाई धेरै विशिष्ट केसहरूसँग मिलाउनुहोस् +- समान केसहरूलाई समूहबद्ध गर्नुहोस् (हप्तापछि र सप्ताहन्त) +- मिलेको बेला उचित कोड ब्लक कार्यान्वयन गर्नुहोस् +- अप्रत्याशित मानहरूका लागि `default` केस समावेश गर्नुहोस् +- अर्को केसमा नजाने गरि `break` स्टेटमेन्टहरू प्रयोग गर्नुहोस् -### 🎯 **अवधारणाको जाँच: आधारभूत तत्वहरूको मास्टरी** +> 💡 **वास्तविक-विश्व तुलना**: नियन्त्रण प्रवाहलाई संसारकै सबैभन्दा धैर्यशील GPS समान सम्झनुहोस् जुन तपाईंलाई दिशानिर्देश दिन्छ। यसले भन्न सक्छ "यदि मेन स्ट्रीटमा ट्राफिक छ भने, सट्टा हाइवे लिनुहोस्। यदि हाइवेमा निर्माण कार्य अवरुद्ध छ भने, रमणीय मार्ग प्रयोग गर्नुहोस्।" प्रोग्रामहरूले पनि यस्ता प्रकारका स्थिति अनुसार प्रतिक्रिया दिन बुद्धिमानी निर्णय तर्कहरू प्रयोग गर्छन् र सधैं प्रयोगकर्तालाई उत्तम अनुभव दिन्छन्। -**आउनुहोस् हेर्नुहोस् तपाईं आधारभूत कुराहरूमा कत्तिको राम्रो गर्दै हुनुहुन्छ:** -- के तपाईं आफ्नो शब्दमा भेरिएबल र स्टेटमेन्टको बीचको फरक व्याख्या गर्न सक्नुहुन्छ? -- तपाईंले यदि-त्यसपछि निर्णय प्रयोग गर्ने वास्तविक जीवनको परिदृश्य सोच्न सक्नुहुन्छ (जस्तै हाम्रो मतदान उदाहरण)? -- प्रोग्रामिङ तर्कको बारेमा तपाईंलाई चकित पार्ने एउटा कुरा के हो? +### 🎯 **अवधारणा जाँच: आधारभूत तत्वहरूमा दक्षता** -**छिटो आत्मविश्वास बूस्टर:** +**मूलभूत कुराहरूमा तपाईं कति सक्षम हुनुहुन्छ जाँचौं:** +- तपाईं आफ्नै शब्दमा चर र बयानको बीच के फरक छ भन्न सक्नुहुन्छ? +- एउटा वास्तविक-विश्व परिस्थिति सोच्नुहोस् जहाँ तपाईंले यदि-त्यसो निर्णय प्रयोग गर्नुहुन्छ (जस्तै हामीले मतदान उदाहरणमा गर्यौं) +- प्रोग्रामिङ तर्कको बारेमा के कुराले तपाईंलाई अचम्मित पार्‍यो? + +**छिटो आत्मविश्वास बढाउने कुरा:** ```mermaid flowchart LR - A["📝 Statements
(Instructions)"] --> B["📦 Variables
(Storage)"] --> C["🔀 Control Flow
(Decisions)"] --> D["🎉 Working Program!"] + A["📝 कथनहरू
(निर्देशनहरू)"] --> B["📦 चरहरू
(भण्डारण)"] --> C["🔀 नियन्त्रण प्रवाह
(निर्णयहरू)"] --> D["🎉 काम गर्ने कार्यक्रम!"] style A fill:#ffeb3b style B fill:#4caf50 style C fill:#2196f3 style D fill:#ff4081 ``` - -✅ **अर्को के आउँदैछ**: हामी यी अवधारणाहरूमा अझ गहिरो डुब्न जाँदैछौं र यो अविश्वसनीय यात्रामा सँगै अगाडि बढ्दै जाँदा पूर्ण रूपमा रमाइलो गर्नेछौं! अहिले, तपाईंले अगाडि रहेका सबै अद्भुत सम्भावनाहरूको बारेमा उत्साहित महसुस गर्न ध्यान दिनुहोस्। विशिष्ट सीपहरू र प्रविधिहरू अभ्यास गर्दा स्वाभाविक रूपमा अडिनेछन् – म वाचा गर्छु यो तपाईंले अपेक्षा गर्नुभएको भन्दा धेरै रमाइलो हुनेछ! +✅ **आगामी के छ**: हामी यी अवधारणाहरू अझ गहिराइमा अध्ययन गर्नेछौं र यो अनौंठो यात्रा सँगै रमाइलो गर्ने छौं! अहिले त केवल भविष्यका सबै अद्भुत सम्भावनाहरूको लागि उत्साह महसुस गर्न केन्द्रित हुनुहोस्। विशेष सीप र प्रविधिहरू अभ्यासका साथ स्वाभाविक रूपमा टाँसिनेछन् – म वाचा गर्छु यो तपाईंले आशा गर्नुभन्दा धेरै रमाइलो हुनेछ! -## व्यापारका उपकरणहरू +## उपकरणहरूको संसार -ठिक छ, यो इमानदारीपूर्वक जहाँ म यति उत्साहित हुन्छु कि म आफूलाई सम्हाल्न सक्दिन! 🚀 हामी ती अविश्वसनीय उपकरणहरूको बारेमा कुरा गर्न जाँदैछौं जसले तपाईंलाई डिजिटल अन्तरिक्ष यानको चाबी दिइएको जस्तो महसुस गराउनेछ। +ठिक छ, यहाँ म साँच्चै उत्साहित छु र आफूलाई रोक्न गाह्रो छ! 🚀 हामी ती अविश्वसनीय उपकरणहरू बारे कुरा गर्न जाँदैछौं जसले तपाईंलाई जस्तो लाग्छ डिजिटल अन्तरिक्ष यानका साँचाहरू पाउँदा जस्तो महसुस हुन सक्दछ। -तपाईंलाई थाहा छ कसरी शेफसँग ती पूर्ण रूपमा सन्तुलित चक्कुहरू हुन्छन् जसले उनीहरूको हातको विस्तार जस्तो महसुस गराउँछ? वा कसरी संगीतकारसँग त्यो एक गिटार हुन्छ जसले उनीहरूले छोएपछि गाउन जस्तो देखिन्छ? ठिक छ, विकासकर्ताहरूको आफ्नै संस्करणका यी जादुई उपकरणहरू छन्, र यहाँ के तपाईंलाई पूर्ण रूपमा चकित पार्नेछ – ती मध्ये अधिकांश पूर्ण रूपमा निःशुल्क छन्! +तपाईं कसरी रसोइया सन्तुलित छुरा प्रयोग गर्छ जुन हातको विस्तार जस्तो लाग्छ भनेर थाहा छ? वा कसरी संगीतकारसँग त्यो एक गितार हुन्छ जुन त्यसलाई छोएपछिको छिनमै गीत गाउन थाल्छ? खैर, विकासकर्ताहरूका आफ्नै जादुगर उपकरणहरू छन्, र यहाँ के छ जसले तपाईंको मन पूर्णतया उडाउनेछ – अधिकांश पूर्णतया निःशुल्क छन्! -म तपाईंलाई यी उपकरणहरू साझा गर्न सोच्दै मेरो कुर्सीमा उफ्रिरहेको छु किनभने तिनीहरूले हामीले सफ्टवेयर निर्माण गर्ने तरिकालाई पूर्ण रूपमा क्रान्तिकारी बनाएका छन्। हामी एआई-संचालित कोडिङ सहायकहरूको बारेमा कुरा गर्दैछौं जसले तपाईंको कोड लेख्न मद्दत गर्न सक्छ (म मजाक गरिरहेको छैन!), क्लाउड वातावरण जहाँ तपाईं शाब्दिक रूपमा वाइफाइ भएको कुनै पनि ठाउँबाट सम्पूर्ण एप्लिकेसनहरू निर्माण गर्न सक्नुहुन्छ, र डिबगिङ उपकरणहरू यति परिष्कृत छन् कि तिनीहरू तपाईंको प्रोग्रामहरूको लागि एक्स-रे दृष्टि भएको जस्तो छन्। +म भन्दाभन्दै खुशीले उफ्रिरहेको छु यी साझा गर्न किनभने तिनीहरूले सफ्टवेयर बनाउने तरिका पूर्ण रूपमा परिवर्तन गरिदिएका छन्। हामी AI-सञ्चालित कोडिङ सहयोगीहरूको बारेमा कुरा गर्दैछौं जसले तपाईंको कोड लेख्न मद्दत गर्छ (म ठट्टा गरिरहेको छैन!), क्लाउड वातावरणहरू जहाँ तपाईं जुनसुकै स्थानबाट Wi-Fi सँग सम्पूर्ण एप्लिकेसनहरू निर्माण गर्न सक्नुहुन्छ, र डिबगिङ उपकरणहरू जसले तपाईंको प्रोग्रामहरूका लागि X-ray दृष्टि भएको जस्तो सहायता दिन्छ। -र यहाँ भाग छ जसले अझै मलाई चिसो दिन्छ: यी "सुरुवात उपकरणहरू" होइनन् जुन तपाईंले बढ्दै जानुहुन्छ। यी Google, Netflix, र तपाईंले मन पराउने त्यो इन्डी एप स्टुडियोका विकासकर्ताहरूले अहिलेको क्षणमा प्रयोग गरिरहेका ठ्याक्कै समान व्यावसायिक-ग्रेड उपकरणहरू हुन्। तिनीहरू प्रयोग गर्दा तपाईंलाई यति धेरै प्रो महसुस हुनेछ! +र यहाँ त्यो भाग छ जसले अझै पनि मलाई चिसो छाप दिन्छ: यी "सुरु गर्नेलाई मात्र" उपकरणहरू होइनन् जुन तपाईंले छोड्ने कुरा हो। यी Google, Netflix, र तपाईंले मन पराउने त्यस स्वतन्त्र एप स्टुडियोका विकासकर्ताहरूले अहिले नै प्रयोग गरिरहेको ठ्याक्कै त्यही व्यावसायिक उपकरणहरू हुन्। तपाईंलाई यिनीहरू प्रयोग गर्दा असाधारण पेशेवर महसुस हुनेछ! ```mermaid graph TD - A["💡 Your Idea"] --> B["⌨️ Code Editor
(VS Code)"] - B --> C["🌐 Browser DevTools
(Testing & Debugging)"] - C --> D["⚡ Command Line
(Automation & Tools)"] - D --> E["📚 Documentation
(Learning & Reference)"] - E --> F["🚀 Amazing Web App!"] + A["💡 तपाईंको विचार"] --> B["⌨️ कोड सम्पादक
(VS Code)"] + B --> C["🌐 ब्राउजर डेभटुल्स
(टेस्टिङ र डिबगिङ)"] + C --> D["⚡ कमाण्ड लाइन
(स्वचालन र उपकरणहरू)"] + D --> E["📚 कागजातहरू
(अध्ययन र सन्दर्भ)"] + E --> F["🚀 शानदार वेब एप!"] - B -.-> G["🤖 AI Assistant
(GitHub Copilot)"] - C -.-> H["📱 Device Testing
(Responsive Design)"] - D -.-> I["📦 Package Managers
(npm, yarn)"] - E -.-> J["👥 Community
(Stack Overflow)"] + B -.-> G["🤖 एआई सहायक
(GitHub Copilot)"] + C -.-> H["📱 उपकरण परीक्षण
(उत्तरदायी डिजाइन)"] + D -.-> I["📦 प्याकेज म्यानेजरहरू
(npm, yarn)"] + E -.-> J["👥 समुदाय
(Stack Overflow)"] style A fill:#fff59d style F fill:#c8e6c9 @@ -434,324 +504,344 @@ graph TD style I fill:#ffccbc style J fill:#e8eaf6 ``` - -### कोड सम्पादकहरू र IDEs: तपाईंको नयाँ डिजिटल सबैभन्दा राम्रो साथीहरू +### कोड सम्पादकहरू र IDE: तपाईंका नयाँ डिजिटल सबैभन्दा राम्रो साथीहरू + +आउनुहोस् कोड सम्पादकहरूको कुरा गरौं – यी साँच्चिकै तपाईंका नयाँ मनपर्ने ठाउँ बन्ने छन्! तिनीहरूलाई तपाईंको व्यक्तिगत कोडिङ आश्रय स्थलको रूपमा सोच्नुहोस् जहाँ तपाईंले आफ्नो डिजिटल सिर्जनाहरू बनाउने र पूरा गर्ने अधिकांश समय बिताउनेछ। + +तर यहाँ आधुनिक सम्पादकहरूको जादु छ: तिनीहरू केवल सामान्य टेक्स्ट सम्पादकहरू मात्र होइनन्। ती तपाईंको सबभन्दा प्रतिभाशाली, सहयोगी कोडिङ गुरु तपार्इंसँग २४/७ बसेको जस्तो हुन्छ। तिनीहरूले तपाईंको टाइपोहरू तपाईंलाई थाहा हुनु अघि नै समात्छन्, सुधार सुझावहरू दिन्छन् जसले तपाईंलाई दिमागी खतरनाक देखाउँछन्, हरेक टुक्रा कोड काय हुन्छ भनेर बुझ्न मद्दत गर्छन्, र केही त तपाईंले के टाइप गर्न लाग्नु भएको छ अन्दाज लगाएर तपाईंलाई विचार पुरा गर्ने प्रस्ताव पनि गर्छन्! + +म याद गर्छु जब म पहिलो पटक अटोकम्प्लिशन भेटें – मलाई लाग्थ्यो म भविष्यमा रहेको छु। तपाईं केही टाइप गर्न थाल्नुहुन्छ र तपाईंको सम्पादक भन्छ, "हे, तपाईं केहि यस्तै प्रकारको फङ्सन सोच्दै हुनुहुन्थ्यो जुन तपाईंलाई चाहिन्छ?" यो तपाईंको कोडिङ साथीको रूपमा मष्तिष्क पढ्ने जस्तो हो! -आउनुहोस् कोड सम्पादकहरूको बारेमा कुरा गरौं – यी गम्भीर रूपमा तपाईंको नयाँ मनपर्ने ठाउँहरू बन्न जाँदैछन्! तिनीहरूलाई तपाईंको व्यक्तिगत कोडिङ अभयारण्य जस्तै सोच्नुहोस् जहाँ तपाईं आफ्नो डिजिटल सिर्जनाहरू निर्माण र परिष्कृत गर्न अधिकांश समय बिताउनुहुनेछ। +**यी सम्पादकहरूलाई किन यति अद्भुत बनाउँछ?** -तर यहाँ के पूर्ण रूपमा जादुई छ आधुनिक सम्पादकहरूको बारेमा: तिनीहरू केवल फ्यान्सी पाठ सम्पादकहरू मात्र होइनन्। तिनीहरू जस्तै छन् कि तपाईंको छेउमा २४/७ बस्ने सबैभन्दा प्रतिभाशाली, सहयोगी कोडिङ गुरु। तिनीहरूले तपाईंको टाइपोहरू तपाईंले नोटिस गर्नु अघि नै समात्छन्, सुधारहरूको सुझाव दिन्छन् जसले तपाईंलाई प्रतिभाशाली जस्तो देखाउँछ, तपाईंलाई प्रत्येक कोडको टुक्राले के गर्छ बुझ्न मद्दत गर्छ, र तिनीहरू मध्ये केहीले तपाईंले टाइप गर्न लागेको कुरा भविष्यवाणी गर्न सक्छन् र तपाईंको विचारहरू समाप्त गर्न प्रस्ताव गर्न सक्छन्! +आधुनिक कोड सम्पादकहरूले तपाईंको उत्पादकत्व बढाउने विविध सुविधा प्रदान गर्छन्: -मलाई याद छ जब मैले पहिलो पटक अटो-कम्प्लिसन पत्ता लगाएँ – म शाब्दिक रूपमा भविष्यमा बाँचिरहेको जस्तो महसुस गरें। तपाईंले केही टाइप गर्न सुरु गर्नुहुन्छ, र तपाईंको सम्पादकले भन्छ, "हेर्नुहोस्, के तपाईंलाई यो फङ्सन चाहिएको थियो जसले तपाईंलाई चाहिएको कुरा ठीक गर्छ?" यो तपाईंको कोडिङ साथीको रूपमा मन पढ्ने जस्तो छ! +| सुविधा | के गर्छ | किन मद्दत गर्छ | +|---------|----------|----------------| +| **सिन्ट्याक्स हाइलाइटिङ** | तपाईंको कोडका विभिन्न भागहरूलाई रंगीन बनाउँछ | कोड पढ्न सजिलो र त्रुटि पत्ता लगाउन मद्दत गर्छ | +| **अटोकम्प्लिशन** | तपाईंले टाइप गर्दा कोड सुझाव दिन्छ | कोड लेख्न छिटो र टाइपो कम गर्छ | +| **डिबगिङ उपकरणहरू** | त्रुटिहरू पत्ता लगाउन र सुधार गर्न मद्दत गर्छ | अनुसन्धानमा धेरै समय बचत गर्छ | +| **एक्सटेन्सनहरू** | विशेष सुविधा थप्छ | तपाईंको सम्पादकलाई कुनै पनि प्रविधिको लागि अनुकूल बनाउनुहोस् | +| **AI सहायकहरू** | कोड र व्याख्या सुझाव दिन्छ | सिकाइ र उत्पादकत्व तीव्र बनाउँछ | -**यी सम्पादकहरूलाई यति अविश्वसनीय बनाउने के हो?** +> 🎥 **भिडियो स्रोत**: यी उपकरणहरू कसरी काम गर्छन् देख्न चाहनुहुन्छ? यो [Tools of the Trade video](https://youtube.com/watch?v=69WJeXGBdxg) हेर्नुहोस्। -आधुनिक कोड सम्पादकहरूले तपाईंको उत्पादकता बढाउन डिजाइन गरिएको प्रभावशाली सुविधाहरूको श्रृंखला प्रस्ताव गर्छन्: +#### वेब विकासका लागि सिफारिस गरिएका सम्पादकहरू -| सुविधा | यसले के गर्छ | यसले किन मद्दत गर्छ | -|---------|--------------|--------------| -| **सिन्ट्याक्स हाइलाइटिङ** | तपाईंको कोडका विभिन्न भागहरूलाई रंग दिन्छ | कोड पढ्न र त्रुटि पत्ता लगाउन सजिलो बनाउँछ | -| **अटो-कम्प्लिसन** | तपाईंले टाइप गर्दा कोडको सुझाव दिन्छ | कोडिङ गति बढाउँछ र टाइपोहरू कम गर्छ | -| **डिबगिङ उपकरणहरू** | त्रुटि पत्ता लगाउन र सुधार गर्न मद्दत गर्छ | समस्या समाधान गर्ने समय बचाउँछ | -| **एक्सटेन्सनहरू** | विशेष सुविधाहरू थप्छ | कुनै पनि प्रविधिका लागि तपाईंको सम्पादकलाई अनुकूलित गर्नुहोस् | -| **एआई सहायकहरू** | कोड र व्याख्याको सुझाव दिन्छ | सिकाइ र उत्पादकता बढाउँछ | +**[Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon)** (निःशुल्क) +- वेब विकासकर्ताहरूमा सर्वाधिक लोकप्रिय +- उत्कृष्ट एक्सटेन्सन इकोसिस्टम +- इनबिल्ट टर्मिनल र Git समाकलन +- **अवश्य राख्नुपर्ने एक्सटेन्सनहरू**: + - [GitHub Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot) - AI-सञ्चालित कोड सुझावहरू + - [Live Share](https://marketplace.visualstudio.com/items?itemName=MS-vsliveshare.vsliveshare) - यथार्थ-समयको सहकार्य + - [Prettier](https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode) - स्वचालित कोड फर्म्याटिङ + - [Code Spell Checker](https://marketplace.visualstudio.com/items?itemName=streetsidesoftware.code-spell-checker) - तपाईंको कोडको टाइपो पत्ता लगाउने -> 🎥 **भिडियो स्रोत**: यी उपकरणहरूलाई काममा देख्न चाहनुहुन्छ? [टूल्स अफ द ट्रेड भिडियो](https://youtube.com/watch?v=69WJeXGBdxg) हेर्नुहोस् विस्तृत अवलोकनको लागि। +**[JetBrains WebStorm](https://www.jetbrains.com/webstorm/)** (पेड, विद्यार्थीहरूका लागि निःशुल्क) +- उच्च स्तरीय डिबगिङ र परीक्षण उपकरणहरू +- बौद्धिक कोड पूर्णता +- इनबिल्ट भर्सन कन्ट्रोल -#### वेब विकासका लागि सिफारिस गरिएका सम्पादकहरू +**क्लाउड-आधारित IDEs** (विभिन्न मूल्यहरू) +- [GitHub Codespaces](https://github.com/features/codespaces) - ब्राउजरमा पूर्ण VS Code +- [Replit](https://replit.com/) - सिक्न र कोड साझा गर्न उत्कृष्ट +- [StackBlitz](https://stackblitz.com/) - छिटो, पूर्ण-स्ट्याक वेब विकास -**[Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon)** (निःशुल्क) -- वेब विकासकर्ताहरू बीच सबैभन्दा लोकप्रिय। -- उत्कृष्ट एक्सटेन्सन इकोसिस्टम। -- बिल्ट-इन टर्मिनल र Git एकीकरण। -- **आवश्यक एक्सटेन्सनहरू**: - - [GitHub Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot) - एआई-संचालित कोड सुझावहरू। - - [Live Share](https://marketplace.visualstudio.com/items?itemName=MS-vsliveshare.vsliveshare) - वास्तविक -पहिलो पटक कसैले मलाई ब्राउजरको DevTools देखाएको थियो, म तीन घण्टा जति क्लिक गर्दै "पर्खिनुहोस्, यसले यो पनि गर्न सक्छ?!" भन्दै बिताएँ। तपाईं कुनै पनि वेबसाइटलाई वास्तविक समयमा सम्पादन गर्न सक्नुहुन्छ, सबै कुरा कति छिटो लोड हुन्छ भनेर हेर्न सक्नुहुन्छ, विभिन्न उपकरणहरूमा तपाईंको साइट कस्तो देखिन्छ भनेर परीक्षण गर्न सक्नुहुन्छ, र JavaScript लाई पूर्ण प्रो जस्तै डिबग गर्न सक्नुहुन्छ। यो साँच्चै अचम्मको कुरा हो! +> 💡 **सुरु गर्ने सुझाव**: Visual Studio Code बाट सुरु गर्नुहोस् – यो निःशुल्क, उद्योगमा व्यापक प्रयोग हुने, र ठूलो समुदायले सहयोगी ट्युटोरियलहरू र एक्सटेन्सनहरू बनाइरहेको छ। -**किन ब्राउजरहरू तपाईंको गोप्य हतियार हुन्:** +### वेब ब्राउजरहरू: तपाईंको गोप्य विकास प्रयोगशाला -जब तपाईं वेबसाइट वा वेब एप्लिकेसन बनाउनुहुन्छ, तपाईंलाई यो वास्तविक संसारमा कस्तो देखिन्छ र कस्तो व्यवहार गर्छ भनेर हेर्न आवश्यक छ। ब्राउजरहरूले तपाईंको काम मात्र देखाउँदैनन्, तर प्रदर्शन, पहुँचयोग्यता, र सम्भावित समस्याहरूको विस्तृत प्रतिक्रिया पनि प्रदान गर्छन्। +ठीक छ, तपाईंको मन पूर्णतया उडाउन तयार हुनुहोस्! तपाईं सामाजिक मिडिया स्क्रोल गर्न र भिडियो हेर्न ब्राउजरहरू प्रयोग गर्दै आइरहनुभएको छ। तर उनीहरू सधैं तपाईंलाई पत्ता लगाउन बाँकी रहेको अविश्वसनीय गोप्य विकास प्रयोगशाला लुकाइरहेका थिए! -#### ब्राउजर डेभलपर टूल्स (DevTools) +हरेक पटक तपाईंले वेबपेजमा राईट-क्लिक गरी "Inspect Element" छान्नुहुन्छ, तपाईं विकासकर्ता उपकरणहरूको एउटा लुकाइएको संसार खोल्नुहुन्छ जुन साँच्चिकै मैले पहिले सयौं डलर तिरेर किन्ने महँगो सफ्टवेयरहरू भन्दा बढी शक्तिशाली छन्। यो ठ्याक्कै तपाईंको पुरानो भान्सा पछाडि एउटा व्यावसायिक रसोइया प्रयोगशाला लुकिरहेको पत्ता लगाउनुजस्तो हो! +पहिलो पटक कसैले मलाई ब्राउजर DevTools देखाएको बेला, म लगभग तीन घन्टा मात्र क्लिक गर्दै र "पर्ख, त्यो पनि गर्न सक्छ?!" भन्दै बिताएँ। तपाईं साँच्चिकै कुनै पनि वेबसाइटलाई वास्तविक समयमा सम्पादन गर्न सक्नुहुन्छ, सबै कुरा कति छिटो लोड हुन्छ भनेर ठीकै देख्न सक्नुहुन्छ, तपाईंको साइट विभिन्न उपकरणहरूमा कस्तो देखिन्छ भनेर परीक्षण गर्न सक्नुहुन्छ, र जाभास्क्रिप्टलाई पूर्ण प्रो जस्तै डिबग गर्न सक्नुहुन्छ। यो पूर्ण रूपमा मनमोहक छ! -आधुनिक ब्राउजरहरूले व्यापक विकास उपकरणहरू समावेश गर्छन्: +**ब्राउजरहरू किन तपाईंको गोप्य हतियार हुन् भनेको यहाँ छ:** -| टूल श्रेणी | यसले के गर्छ | उदाहरण प्रयोग केस | -|------------|--------------|--------------------| -| **Element Inspector** | HTML/CSS लाई वास्तविक समयमा हेर्न र सम्पादन गर्न | स्टाइल समायोजन गरेर तत्काल परिणाम हेर्नुहोस् | -| **Console** | त्रुटि सन्देशहरू हेर्नुहोस् र JavaScript परीक्षण गर्नुहोस् | समस्याहरू डिबग गर्नुहोस् र कोडमा प्रयोग गर्नुहोस् | -| **Network Monitor** | स्रोतहरू कसरी लोड हुन्छन् ट्र्याक गर्नुहोस् | प्रदर्शन र लोड समय अनुकूलित गर्नुहोस् | -| **Accessibility Checker** | समावेशी डिजाइनको लागि परीक्षण गर्नुहोस् | सुनिश्चित गर्नुहोस् कि तपाईंको साइट सबै प्रयोगकर्ताहरूको लागि काम गर्छ | -| **Device Simulator** | विभिन्न स्क्रिन साइजहरूमा पूर्वावलोकन गर्नुहोस् | धेरै उपकरणहरू बिना उत्तरदायी डिजाइन परीक्षण गर्नुहोस् | +जब तपाईं वेबसाइट वा वेब एप्लिकेसन बनाउनुहुन्छ, तपाईंले वास्तविक दुनियाँमा यसले कस्तो देखिन्छ र कसरी व्यवहार गर्छ भनेर देख्नुपर्छ। ब्राउजरहरूले तपाईंको काम मात्र देखाउने होइनन्, प्रदर्शन, पहुँचयोग्यता, र सम्भावित समस्याहरूको विस्तृत प्रतिक्रिया पनि प्रदान गर्छन्। -#### विकासको लागि सिफारिस गरिएका ब्राउजरहरू +#### ब्राउजर डेवलपर टुल्स (DevTools) -- **[Chrome](https://developers.google.com/web/tools/chrome-devtools/)** - विस्तृत दस्तावेजसहित उद्योग-मानक DevTools +आधुनिक ब्राउजरहरूले व्यापक विकास सूटहरू समावेश गर्छन्: + +| उपकरण वर्ग | के गर्छ | प्रयोग गर्ने उदाहरण | +|------------|---------|--------------------| +| **एलिमेन्ट इन्स्पेक्टर** | HTML/CSS वास्तविक समयमा हेर्न र सम्पादन गर्न | तुरुन्त नतिजा हेर्न शैली समायोजन गर्न | +| **कन्सोल** | त्रुटि सन्देशहरू हेर्न र जाभास्क्रिप्ट परीक्षण गर्न | समस्याहरू डिबग गर्न र कोडसँग प्रयोग गर्न | +| **नेटवर्क मनिटर** | स्रोतहरू कसरी लोड हुन्छन् ट्र्याक गर्न | प्रदर्शन र लोडिङ समयहरू अनुकूलन गर्न | +| **पहुँचयोग्यता चेकर** | समावेशी डिजाइन परीक्षण गर्न | सुनिश्चित गर्न कि तपाईंको साइट सबै प्रयोगकर्ताहरूको लागि काम गर्छ | +| **डिभाइस सिम्युलेटर** | विभिन्न स्क्रिन आकारहरूमा पूर्वावलोकन गर्न | धेरै उपकरण बिना नै रेस्पोन्सिभ डिजाइन परीक्षण गर्न | + +#### विकासका लागि सिफारिस गरिएका ब्राउजरहरू + +- **[Chrome](https://developers.google.com/web/tools/chrome-devtools/)** - उद्योग-मानक DevTools व्यापक दस्तावेजीकरणसहित - **[Firefox](https://developer.mozilla.org/docs/Tools)** - उत्कृष्ट CSS Grid र पहुँचयोग्यता उपकरणहरू -- **[Edge](https://docs.microsoft.com/microsoft-edge/devtools-guide-chromium/?WT.mc_id=academic-77807-sagibbon)** - Chromium मा आधारित Microsoft को विकास स्रोतहरूसँग +- **[Edge](https://docs.microsoft.com/microsoft-edge/devtools-guide-chromium/?WT.mc_id=academic-77807-sagibbon)** - Microsoft को विकास स्रोतहरूसहित Chromium मा आधारित -> ⚠️ **महत्वपूर्ण परीक्षण सुझाव**: तपाईंको वेबसाइटहरू धेरै ब्राउजरहरूमा सधैं परीक्षण गर्नुहोस्! Chrome मा पूर्ण रूपमा काम गर्ने कुरा Safari वा Firefox मा फरक देखिन सक्छ। व्यावसायिक विकासकर्ताहरूले सबै प्रमुख ब्राउजरहरूमा परीक्षण गर्छन् ताकि प्रयोगकर्ताको अनुभव सुसंगत होस्। +> ⚠️ **महत्वपूर्ण परीक्षण सुझाव**: तपाईंको वेबसाइटहरू सधैं बहु ब्राउजरहरूमा परीक्षण गर्नुहोस्! जुन कुरा Chrome मा उत्तम काम गर्छ त्यो Safari वा Firefox मा फरक देखिन सक्छ। व्यावसायिक विकासकर्ताहरू सबै प्रमुख ब्राउजरहरूमा प्रयोगकर्ता अनुभव सुसंगत बनाउन टेस्ट गर्छन्। -### कमाण्ड लाइन टूल्स: विकासकर्ताको सुपरपावरको प्रवेशद्वार +### कमाण्ड लाइन उपकरणहरू: तपाईंको विकासकर्ता उच्च क्षमता प्रवेशद्वार -ठिक छ, कमाण्ड लाइनको बारेमा यहाँ एकदम इमानदार क्षण राखौं, किनकि म चाहन्छु तपाईंले यो कुरा कसैबाट सुन्नुहोस् जसले यो वास्तवमै बुझ्छ। जब मैले पहिलो पटक देखेँ – बस यो डर लाग्दो कालो स्क्रिन झिल्किरहेको पाठसँग – मैले शाब्दिक रूपमा सोचेँ, "होइन, बिल्कुल होइन! यो 1980 को ह्याकर फिल्मबाट केही जस्तो देखिन्छ, र म यसका लागि पर्याप्त स्मार्ट छैन!" 😅 +ठीक छ, कमाण्ड लाइन बारे पूर्ण ईमान्दार क्षण यहाँ छ किनकि म चाहन्छु तपाईं यो कसैबाट सुन्नुहोस् जसले साँच्चिकै बुझ्छ। जब मैले पहिलो पटक देखेँ – त्यो मात्र डराउने कालो स्क्रिन ब्लिंक गर्ने टेक्स्टसहित – मैले साँच्चिकै सोचें, "होइन, बिल्कुल होइन! यो 1980 को दशकको ह्याकर चलचित्र जस्तो देखिन्छ, र म यो लागि स्मार्ट छैन!" 😅 -तर यहाँ के हो जुन म चाहन्छु कसैले मलाई त्यतिबेला भनेको होस्, र म तपाईंलाई अहिले बताउँदैछु: कमाण्ड लाइन डर लाग्दो छैन – यो वास्तवमा तपाईंको कम्प्युटरसँग प्रत्यक्ष कुराकानी जस्तै हो। यसलाई सोच्नुहोस् कि तपाईंको मनपर्ने स्थानीय रेस्टुरेन्टमा जानु जहाँ शेफलाई तपाईंले के मन पराउनुहुन्छ भन्ने थाहा छ र तपाईंले "मलाई केही अद्भुत चिजले आश्चर्यचकित बनाउनुहोस्" भनेको मात्रले केही उत्तम तयार गर्न सक्छ। +तर यहाँ त्यो कुरा हो जुन म चाहन्थेँ कसैले मलाई त्यो बेला भनिदिएको होस्, र जुन म अहिले तपाईंलाई भनिरहेको छु: कमाण्ड लाइन डराउने कुरा होइन – यो साँच्चिकै तपाईंको कम्प्युटरसँग प्रत्यक्ष संवाद जस्तो हो। यो त्यो फरक जस्तो हो जुन एक सुन्दर ऐप मार्फत तस्वीर र मेनुका साथ खाना अर्डर गर्ने (जसले सजिलो बनाउँछ) बनाम तपाईंको मनपर्ने स्थानीय रेस्टुरेन्टमा जानु जहाँ सेफले तपाईं के मन पराउनुहुन्छ भनी थाहा पाउँछन् र "कसरी मलाई अचम्मको कुरा दिनुहोस्" मात्र भनी केहि बनाई दिन्छ। -कमाण्ड लाइन त्यहाँ हो जहाँ विकासकर्ताहरू पूर्ण जादूगर जस्तो महसुस गर्न जान्छन्। तपाईं केही जादुई शब्दहरू टाइप गर्नुहुन्छ (ठिक छ, तिनीहरू केवल कमाण्डहरू हुन्, तर तिनीहरू जादुई महसुस हुन्छन्!), इन्टर थिच्नुहोस्, र BOOM – तपाईंले सम्पूर्ण परियोजना संरचनाहरू सिर्जना गर्नुभएको छ, संसारभरका शक्तिशाली उपकरणहरू स्थापना गर्नुभएको छ, वा तपाईंको एपलाई इन्टरनेटमा लाखौं मानिसहरूले हेर्नका लागि तैनात गर्नुभएको छ। तपाईंले त्यो शक्ति पहिलो पटक अनुभव गरेपछि, यो वास्तवमै धेरै नशालु हुन्छ! +कमाण्ड लाइन त्यही स्थान हो जहाँ विकासकर्ताहरूले आफूलाई पूर्ण जादूगर महसुस गर्छन्। तपाईंले केही जादूजस्तो लाग्ने शब्दहरू टाइप गर्नुहुन्छ (ठीक छ, ती केवल कमाण्ड हुन्, तर जादुईजस्तो महसुस हुन्छ!), इन्टर थिच्नुहोस्, र बूम – तपाईंले पूरा परियोजना संरचनाहरू तयार पार्नुभयो, विश्वभरिका शक्तिशाली उपकरणहरू इन्स्टल गर्नुभयो, वा तपाईंको एपलाई इन्टरनेटमा करोडौँ मानिसहरूले हेर्नका लागि डिप्लोय गर्नुभयो। एक पटक त्यो शक्ति अनुभव गरेपछि, यो साँच्चिकै आदी हुन सक्छ! -**किन कमाण्ड लाइन तपाईंको मनपर्ने उपकरण बन्नेछ:** +**किन कमाण्ड लाइन तपाईंको मनपर्ने उपकरण हुनेछ:** -ग्राफिकल इन्टरफेसहरू धेरै कार्यहरूको लागि उत्कृष्ट छन्, तर कमाण्ड लाइन स्वचालन, सटीकता, र गति मा उत्कृष्ट छ। धेरै विकास उपकरणहरू मुख्य रूपमा कमाण्ड लाइन इन्टरफेसहरू मार्फत काम गर्छन्, र तिनीहरूलाई कुशलतापूर्वक प्रयोग गर्न सिक्नाले तपाईंको उत्पादकता नाटकीय रूपमा सुधार गर्न सक्छ। +ग्राफिकल इन्टरफेसहरू धेरै कार्यहरूको लागि राम्रो भए तापनि कमाण्ड लाइन अटोमेशन, परिशुद्धता, र छिटोमा उत्कृष्ट हुन्छ। धेरै विकास उपकरणहरू प्रायः कमाण्ड लाइन इन्टरफेस मार्फत काम गर्छन्, र ती प्रभावकारी प्रयोग गर्न सिक्नुले तपाईंको उत्पादकत्वलाई नाटकीय रूपमा सुधार गर्न सक्छ। ```bash -# Step 1: Create and navigate to project directory +# चरण १: परियोजना निर्देशिका सिर्जना गर्नुहोस् र त्यहाँ जानुहोस् mkdir my-awesome-website cd my-awesome-website ``` - -**यो कोडले के गर्छ:** -- **नयाँ डाइरेक्टरी सिर्जना गर्नुहोस्** "my-awesome-website" नामक तपाईंको परियोजनाको लागि -- **नयाँ सिर्जित डाइरेक्टरीमा जानुहोस्** काम सुरु गर्न + +**यो कोडले के गर्छ:** +- **नयाँ** डिरेक्टरी "my-awesome-website" तपाईंको परियोजनाको लागि बनाउँछ +- **नयाँ बनाइएको डिरेक्टरीमा प्रवेश** गरेर काम सुरु गर्छ ```bash -# Step 2: Initialize project with package.json +# चरण २: package.json सहित परियोजना सुरु गर्नुहोस् npm init -y -# Install modern development tools +# आधुनिक विकास उपकरणहरू स्थापना गर्नुहोस् npm install --save-dev vite prettier eslint npm install --save-dev @eslint/js ``` - -**चरणबद्ध रूपमा, यहाँ के भइरहेको छ:** -- **नयाँ Node.js परियोजना आरम्भ गर्नुहोस्** डिफल्ट सेटिङ्सको साथ `npm init -y` प्रयोग गरेर -- **Vite स्थापना गर्नुहोस्** आधुनिक निर्माण उपकरणको रूपमा छिटो विकास र उत्पादन निर्माणहरूको लागि -- **Prettier थप्नुहोस्** स्वचालित कोड फर्म्याटिङको लागि र ESLint कोड गुणस्तर जाँचको लागि -- **`--save-dev` फ्ल्याग प्रयोग गर्नुहोस्** यीलाई विकास-केवल निर्भरता रूपमा चिन्हित गर्न + +**क्रमशः के भइरहेको छ:** +- `npm init -y` प्रयोग गरी डिफल्ट सेटिङसहित नयाँ Node.js परियोजना आरम्भ गर्न +- छिटो विकास र उत्पादन बिल्डका लागि आधुनिक बिल्ड उपकरण Vite इन्स्टल गर्न +- स्वचालित कोड फर्म्याटिङको लागि Prettier र कोड गुणस्तर जाँचका लागि ESLint थप्न +- `--save-dev` झण्डा प्रयोग गरी यी केवल विकास-सम्बन्धित निर्भरता भनेर मार्क गर्न ```bash -# Step 3: Create project structure and files +# चरण ३: परियोजना संरचना र फाइलहरू सिर्जना गर्नुहोस् mkdir src assets echo 'My Site

Hello World

' > index.html -# Start development server +# विकास सर्भर सुरु गर्नुहोस् npx vite ``` - -**माथिकोमा, हामीले:** -- **हाम्रो परियोजना व्यवस्थित गर्यौं** स्रोत कोड र सम्पत्ताहरूको लागि छुट्टै फोल्डरहरू सिर्जना गरेर -- **मूल HTML फाइल उत्पन्न गर्यौं** उचित दस्तावेज संरचनासहित -- **Vite विकास सर्भर सुरु गर्यौं** लाइभ रीलोडिङ र हट मोड्युल प्रतिस्थापनको लागि + +**माथिल्लो कोडमा हामीले:** +- स्रोत कोड र एसेटका लागि अलग-अलग फोल्डरहरू बनाएर परियोजनालाई व्यवस्थित गर्‍यौं +- उचित कागजात संरचनासहित आधारभूत HTML फाइल बनायौं +- लाइभ रीलोड र हट मोड्युल रिप्लेसमेन्टको लागि Vite विकास सर्भर सुरु गर्‍यौं #### वेब विकासको लागि आवश्यक कमाण्ड लाइन उपकरणहरू -| उपकरण | उद्देश्य | किन तपाईंलाई यसको आवश्यकता छ | -|-------|---------|-----------------------------| -| **[Git](https://git-scm.com/)** | संस्करण नियन्त्रण | परिवर्तनहरू ट्र्याक गर्नुहोस्, अरूसँग सहकार्य गर्नुहोस्, तपाईंको काम ब्याकअप गर्नुहोस् | -| **[Node.js & npm](https://nodejs.org/)** | JavaScript रनटाइम र प्याकेज व्यवस्थापन | ब्राउजर बाहिर JavaScript चलाउनुहोस्, आधुनिक विकास उपकरणहरू स्थापना गर्नुहोस् | -| **[Vite](https://vitejs.dev/)** | निर्माण उपकरण र विकास सर्भर | हट मोड्युल प्रतिस्थापनको साथ छिटो विकास | -| **[ESLint](https://eslint.org/)** | कोड गुणस्तर | तपाईंको JavaScript मा समस्या स्वचालित रूपमा फेला पार्नुहोस् र समाधान गर्नुहोस् | -| **[Prettier](https://prettier.io/)** | कोड फर्म्याटिङ | तपाईंको कोडलाई सुसंगत रूपमा फर्म्याटेड र पढ्न योग्य राख्नुहोस् | +| उपकरण | उद्देश्य | किन आवश्यक छ | +|---------|----------|----------------| +| **[Git](https://git-scm.com/)** | संस्करण नियन्त्रण | परिवर्तन ट्र्याक गर्न, अरूसँग सहकार्य गर्न, काम ब्याकअप गर्न | +| **[Node.js & npm](https://nodejs.org/)** | जाभास्क्रिप्ट रनटाइम र प्याकेज व्यवस्थापन | जाभास्क्रिप्ट ब्राउजर बाहिर चलाउन, आधुनिक विकास उपकरणहरू इन्स्टल गर्न | +| **[Vite](https://vitejs.dev/)** | बिल्ड उपकरण र विकास सर्भर | छिटो विकास गति र हट मोड्युल रिप्लेसमेन्टका लागि | +| **[ESLint](https://eslint.org/)** | कोड गुणस्तर | तपाईँको जाभास्क्रिप्टमा समस्याहरू स्वचालित रूपमा फेला पार्न र सुधार गर्न | +| **[Prettier](https://prettier.io/)** | कोड फर्म्याटिङ | कोडलाई सधैं समान र पढ्नयोग्य राख्न | #### प्लेटफर्म-विशिष्ट विकल्पहरू -**Windows:** -- **[Windows Terminal](https://docs.microsoft.com/windows/terminal/?WT.mc_id=academic-77807-sagibbon)** - आधुनिक, सुविधा सम्पन्न टर्मिनल -- **[PowerShell](https://docs.microsoft.com/powershell/?WT.mc_id=academic-77807-sagibbon)** 💻 - शक्तिशाली स्क्रिप्टिङ वातावरण -- **[Command Prompt](https://docs.microsoft.com/windows-server/administration/windows-commands/?WT.mc_id=academic-77807-sagibbon)** 💻 - परम्परागत Windows कमाण्ड लाइन +**Windows:** +- **[Windows Terminal](https://docs.microsoft.com/windows/terminal/?WT.mc_id=academic-77807-sagibbon)** - आधुनिक, सुविधायुक्त टर्मिनल +- **[PowerShell](https://docs.microsoft.com/powershell/?WT.mc_id=academic-77807-sagibbon)** 💻 - शक्तिशाली स्क्रिप्टिङ वातावरण +- **[Command Prompt](https://docs.microsoft.com/windows-server/administration/windows-commands/?WT.mc_id=academic-77807-sagibbon)** 💻 - पारम्परिक Windows कमाण्ड लाइन -**macOS:** -- **[Terminal](https://support.apple.com/guide/terminal/)** 💻 - बिल्ट-इन टर्मिनल एप्लिकेसन -- **[iTerm2](https://iterm2.com/)** - उन्नत सुविधाहरू भएको टर्मिनल +**macOS:** +- **[Terminal](https://support.apple.com/guide/terminal/)** 💻 - बिल्ट-इन टर्मिनल एप्लिकेसन +- **[iTerm2](https://iterm2.com/)** - उन्नत सुविधासहित टर्मिनल -**Linux:** -- **[Bash](https://www.gnu.org/software/bash/)** 💻 - मानक Linux शेल -- **[KDE Konsole](https://docs.kde.org/trunk5/en/konsole/konsole/index.html)** - उन्नत टर्मिनल इम्युलेटर +**Linux:** +- **[Bash](https://www.gnu.org/software/bash/)** 💻 - मानक Linux शेल +- **[KDE Konsole](https://docs.kde.org/trunk5/en/konsole/konsole/index.html)** - उन्नत टर्मिनल इम्युलेटर -> 💻 = अपरेटिङ सिस्टममा पूर्व-स्थापित +> 💻 = अपरेटिङ सिस्टममा पूर्व-इन्स्टल गरिएको -> 🎯 **अध्ययन मार्ग**: `cd` (डाइरेक्टरी परिवर्तन गर्नुहोस्), `ls` वा `dir` (फाइलहरूको सूची), र `mkdir` (फोल्डर सिर्जना गर्नुहोस्) जस्ता आधारभूत कमाण्डहरूबाट सुरु गर्नुहोस्। आधुनिक वर्कफ्लो कमाण्डहरू जस्तै `npm install`, `git status`, र `code .` (VS Code मा हालको डाइरेक्टरी खोल्छ) अभ्यास गर्नुहोस्। तपाईं अधिक सहज हुँदै जानुहुन्छ, तपाईं स्वाभाविक रूपमा अधिक उन्नत कमाण्डहरू र स्वचालन प्रविधिहरू सिक्नुहुनेछ। +> 🎯 **शिक्षण मार्ग:** `cd` (डिरेक्टरी परिवर्तन), `ls` वा `dir` (फाइल सूची), र `mkdir` (फोल्डर बनाउने) जस्ता आधारभूत कमाण्डहरूबाट सुरु गर्नुहोस्। `npm install`, `git status`, र `code .` (हालको डिरेक्टरी VS Code मा खोल्ने) जस्ता आधुनिक वर्कफ्लो कमाण्डहरूसँग अभ्यास गर्नुहोस्। जति बढी आराम महसुस गर्ने हुँदै जानुहुन्छ, त्यति नै तपाईंले उन्नत कमाण्डहरू र अटोमेशन प्रविधिहरू स्वाभाविक रूपमा सिक्नेछ। -### दस्तावेज: तपाईंको सधैं उपलब्ध सिकाइ गुरु +### दस्तावेजीकरण: सधैं उपलब्ध सिकाइ गुरु -ठिक छ, म एउटा सानो रहस्य साझा गर्न चाहन्छु जसले तपाईंलाई नयाँ सिक्नेमा धेरै राम्रो महसुस गराउनेछ: सबैभन्दा अनुभवी विकासकर्ताहरूले आफ्नो समयको ठूलो हिस्सा दस्तावेज पढ्नमा बिताउँछन्। र त्यो किनभने उनीहरूलाई थाहा छैन भन्ने होइन – यो वास्तवमा बुद्धिमताको संकेत हो! +ठीक छ, म तपाईंलाई एउटा सानो रहस्य बताउन चाहन्छु जसले तपाईंलाई शुरुवाती भएर धेरै राम्रो महसुस गराउनेछ: सबैभन्दा अनुभवी विकासकर्ताहरू पनि आफ्नो समयको ठूलो भाग दस्तावेज पढ्नमा बिताउँछन्। त्यो यसकारण हैन कि उनीहरूलाई के गर्दैछन् थाहा छैन – यो त बुद्धिमत्ताको चिन्ह हो! -दस्तावेजलाई २४/७ उपलब्ध विश्वको सबैभन्दा धैर्यवान, जानकार शिक्षकहरूको पहुँच भएको जस्तो सोच्नुहोस्। रातको २ बजे समस्यामा अड्किनु भयो? दस्तावेज त्यहाँ छ न्यानो भर्चुअल अँगालो र तपाईंलाई चाहिएको उत्तरको साथ। सबैले कुरा गरिरहेको नयाँ सुविधाको बारेमा सिक्न चाहनुहुन्छ? दस्तावेजले तपाईंलाई चरणबद्ध उदाहरणहरूको साथ समर्थन गरेको छ। केहि किन काम गर्छ भनेर बुझ्न प्रयास गर्दै हुनुहुन्छ? तपाईंले अनुमान गर्नुभयो – दस्तावेजले यसलाई अन्ततः क्लिक गराउने तरिकामा व्याख्या गर्न तयार छ! +दस्तावेजीकरणलाई तपाईंले संसारकै सबैभन्दा धैर्यशील, ज्ञानवान शिक्षकहरूलाई २४/७ पहुँच भएको जस्तो सोच्नुहोस्। बिहान २ बजे समस्यामा पर्नुभयो? दस्तावेजीकरण त्यही जान्दोजान न्यानो भर्चुअल अँगालो र ठ्याक्कै आवश्यक उत्तरसहित हुन्छ। सबैले कुरा गरिरहेका शीत नयाँ सुविधाबारे जान्न चाहनुहुन्छ? दस्तावेजीकरण तपाईंका लागि कदम-दर-कदम उदाहरणहरू सहित छ। किन केहि यसरी काम गर्छ भनेर बुझ्न खोज्दै हुनुहुन्छ? तपाईंले अनुमान लगाउनुभयो - दस्तावेजीकरण यसलाई अन्ततः बुझ्ने तरिकाले व्याख्या गर्न तयार छ! -#### आवश्यक दस्तावेज स्रोतहरू +यहाँ एउटाले मेरो दृष्टिकोण पूर्ण रूपमा परिवर्तन गर्‍यो: वेब विकासको दुनियाँ अत्यन्तै छिटो चल्छ, र कोही पनि सबै कुरा याद राख्दैन (म भन्छु निश्चितै केही पनि होइन)! मैले १५+ वर्ष अनुभव भएका वरिष्ठ विकासकर्तालाई आधारभूत सिन्ट्याक्स खोज्दै देखेको छु, र थाहा छ के? त्यो लाजको कुरा हैन – त्यो स्मार्ट हो! यो उत्कृष्ट स्मरण शक्ति हुनुको कुरा होइन; यो छिटो भरपर्दो उत्तरहरू कहाँ फेला पार्ने र तीलाई कसरी लागू गर्ने बुझ्नको कुरा हो। -**[Mozilla Developer Network (MDN)](https://developer.mozilla.org/docs/Web)** -- वेब प्रविधि दस्तावेजको सुनौलो मानक -- HTML, CSS, र JavaScript का लागि व्यापक मार्गदर्शकहरू -- ब्राउजर अनुकूलता जानकारी समावेश गर्दछ -- व्यावहारिक उदाहरणहरू र अन्तरक्रियात्मक डेमोहरू समावेश गर्दछ +**यहाँ साँच्चिकै जादू हुन्छ:** -**[Web.dev](https://web.dev)** (Google द्वारा) -- आधुनिक वेब विकासका उत्कृष्ट अभ्यासहरू -- प्रदर्शन अनुकूलन मार्गदर्शकहरू -- पहुँचयोग्यता र समावेशी डिजाइन सिद्धान्तहरू -- वास्तविक परियोजनाहरूबाट केस अध्ययनहरू +व्यावसायिक विकासकर्ताहरू आफ्नो धेरै समय दस्तावेजीकरण पढ्नमा बिताउँछन् – त्यसका लागि होइन कि उनीहरूको के गर्दैछन् थाहा छैन, तर यो किनभने वेब विकासको परिदृश्य यति छिटो विकास हुँदैछ कि नवीनतम रहन लगातार सिकाइ आवश्यक छ। उत्कृष्ट दस्तावेजीकरणले तपाईंलाई मात्र *कसरी* प्रयोग गर्ने देखाउँदैन, तर *किन* र *कहिले* प्रयोग गर्ने बुझ्न मद्दत गर्छ। -**[Microsoft Developer Documentation](https://docs.microsoft.com/microsoft-edge/#microsoft-edge-for-developers)** -- Edge ब्राउजर विकास स्रोतहरू -- प्रोग्रेसिभ वेब एप मार्गदर्शकहरू -- क्रस-प्लेटफर्म विकास अन्तर्दृष्टिहरू +#### आवश्यक दस्तावेजीकरण स्रोतहरू -**[Frontend Masters Learning Paths](https://frontendmasters.com/learn/)** -- संरचित सिकाइ पाठ्यक्रमहरू -- उद्योग विशेषज्ञहरूबाट भिडियो पाठहरू -- हातमा कोडिङ अभ्यासहरू +**[Mozilla Developer Network (MDN)](https://developer.mozilla.org/docs/Web)** +- वेब प्रविधि दस्तावेजका लागि सुनौलो मानक +- HTML, CSS, र जाभास्क्रिप्टका लागि व्यापक मार्गनिर्देशन +- ब्राउजर संगतता जानकारी समावेश +- व्यवहारिक उदाहरणहरू र अन्तरक्रियात्मक डेमोहरूसहित -> 📚 **अध्ययन रणनीति**: दस्तावेजलाई याद गर्न प्रयास नगर्नुहोस् – यसको सट्टा, यसलाई कुशलतापूर्वक नेभिगेट गर्न सिक्नुहोस्। बारम्बार प्रयोग गरिएका सन्दर्भहरू बुकमार्क गर्नुहोस् र विशिष्ट जानकारी छिटो फेला पार्न खोज कार्यहरू प्रयोग गर्ने अभ्यास गर्नुहोस्। +**[Web.dev](https://web.dev)** (Google द्वारा) +- आधुनिक वेब विकास उत्तम अभ्यासहरू +- प्रदर्शन अनुकूलन मार्गदर्शन +- पहुँचयोग्यता र समावेशी डिजाइन सिद्धान्तहरू +- वास्तविक परियोजनाहरूबाट केस स्टडीहरू -### 🔧 **टूल मास्टरी चेक: तपाईंलाई के आकर्षित गर्छ?** +**[Microsoft Developer Documentation](https://docs.microsoft.com/microsoft-edge/#microsoft-edge-for-developers)** +- Edge ब्राउजर विकास स्रोतहरू +- प्रोग्रेसिभ वेब एप मार्गनिर्देशन +- क्रस-प्लेटफर्म विकास अन्तर्दृष्टिहरू -**एक क्षण लिनुहोस् विचार गर्न:** -- कुन उपकरण तपाईंलाई पहिलो पटक प्रयास गर्न सबैभन्दा उत्साहित बनाउँछ? (यहाँ कुनै गलत उत्तर छैन!) -- के कमाण्ड लाइन अझै डर लाग्दो महसुस हुन्छ, वा तपाईं यसमा जिज्ञासु हुनुहुन्छ? -- के तपाईं आफ्नो मनपर्ने वेबसाइटहरूको पर्दा पछाडि हेर्न ब्राउजर DevTools प्रयोग गर्ने कल्पना गर्न सक्नुहुन्छ? +**[Frontend Masters Learning Paths](https://frontendmasters.com/learn/)** +- संरचित सिकाइ पाठ्यक्रमहरू +- उद्योग विशेषज्ञहरूबाट भिडियो कोर्सहरू +- हातमा लिएर पढ्ने कोडिङ अभ्यासहरू -```mermaid -pie title "Developer Time Spent With Tools" - "Code Editor" : 40 - "Browser Testing" : 25 - "Command Line" : 15 - "Reading Docs" : 15 - "Debugging" : 5 -``` +> 📚 **अध्ययन रणनीति:** दस्तावेजीकरण याद गर्न प्रयास नगर्नुहोस् – यसको सट्टा, यसमा कसरी प्रभावकारी रूपमा नेभिगेट गर्ने सिक्नुहोस्। बारम्बार प्रयोग गरिने संदर्भहरू बुकमार्क गर्नुहोस् र विशेष जानकारी छिटो फेला पार्न खोजी कार्यहरू प्रयोग गरेर अभ्यास गर्नुहोस्। -> **मजाको जानकारी**: अधिकांश विकासकर्ताहरू आफ्नो समयको लगभग ४०% आफ्नो कोड सम्पादकमा बिताउँछन्, तर ध्यान दिनुहोस् कि परीक्षण, सिकाइ, र समस्या समाधानमा कति समय जान्छ। प्रोग्रामिङ केवल कोड लेख्ने बारे होइन – यो अनुभवहरू सिर्जना गर्ने बारे हो! +### 🔧 **उपकरण विशेषज्ञता जाँच: तपाईंलाई के मन पर्यो?** -✅ **विचारको लागि खाना**: यहाँ केहि रोचक सोच्नको लागि छ – वेबसाइटहरू निर्माण गर्नका लागि उपकरणहरू (विकास) वेबसाइटहरू कस्तो देखिन्छ भनेर डिजाइन गर्नका लागि उपकरणहरू (डिजाइन) भन्दा कसरी फरक हुन सक्छन्? यो सुन्दर घर डिजाइन गर्ने आर्किटेक्ट र वास्तवमा यसलाई निर्माण गर्ने ठेकेदारको बीचको फरक जस्तै हो। दुवै महत्त्वपूर्ण छन्, तर तिनीहरूलाई फरक उपकरण बक्सहरू चाहिन्छ! यस प्रकारको सोचले तपाईंलाई वेबसाइटहरू कसरी जीवनमा आउँछन् भन्ने ठूलो चित्र देख्न वास्तवमै मद्दत गर्नेछ। +**एउटा पल लिनुहोस् र विचार गर्नुहोस्:** +- कुन उपकरण तपाईं पहिलो पटक प्रयास गर्न सबैभन्दा उत्साहित हुनुहुन्छ? (गलत जवाफ छैन!) +- कमाण्ड लाइन अझै पनि डर लाग्छ कि तपाईंको जिज्ञासा छ? +- तपाईंले आफ्नो मनपर्ने वेबसाइटहरूको पर्दा पछाडिको दृष्य हेर्न ब्राउजर DevTools प्रयोग गर्ने कल्पना गर्न सक्नुहुन्छ? + +```mermaid +pie title "उन्नतकर्ताले उपकरणहरूसँग बिताएको समय" + "कोड सम्पादक" : 40 + "ब्राउजर परीक्षण" : 25 + "कमाण्ड लाइन" : 15 + "कागजात पढ्ने" : 15 + "डिबगिङ" : 5 +``` +> **रोचक तथ्य:** अधिकांश विकासकर्ताहरू आफ्नो कोड सम्पादकमा लगभग ४०% समय बिताउँछन्, तर ध्यान दिनुहोस् कति समय परीक्षण, सिकाइ, र समस्याहरू समाधान गर्न जान्छ। प्रोग्रामिङ केवल कोड लेख्ने कुरा होइन – यो अनुभव सिर्जना गर्ने कुरा हो! + +✅ **विचारका लागि खानेकुरा:** यो रमाइलो कुरा विचार गर्नुहोस् – तपाईंलाई के लाग्छ वेबसाइट निर्माण (विकास) उपकरणहरू र त्यसले कस्तो देखिन्छ डिजाइन गर्ने उपकरणहरूमा के फरक हुन्छ? यो त्यही फरक हो जुन एक आर्किटेक्टले सुन्दर घर डिजाइन गर्ने र ठेकेदारले वास्तवमा त्यसलाई निर्माण गर्नेबीच हुन्छ। दुवै अत्यावश्यक छन्, तर तिनीहरूले फरक उपकरणहरू चाहिन्छ! यो प्रकारको सोचले तपाईंलाई वेबसाइटहरू जीवन्त कसरी हुन्छन् भन्ने ठूलो चित्र देख्न धेरै मद्दत गर्नेछ। ## GitHub Copilot Agent Challenge 🚀 -Agent मोड प्रयोग गरेर निम्न चुनौती पूरा गर्नुहोस्: +एजेन्ट मोड प्रयोग गरी निम्न चुनौती पूरा गर्नुहोस्: -**विवरण:** आधुनिक कोड सम्पादक वा IDE को सुविधाहरू अन्वेषण गर्नुहोस् र यसले वेब विकासकर्ताको रूपमा तपाईंको वर्कफ्लो सुधार गर्न कसरी सक्छ भनेर प्रदर्शन गर्नुहोस्। +**विवरण:** कुनै आधुनिक कोड सम्पादक वा IDE का विशेषताहरू अन्वेषण गर्नुहोस् र कसरी यसले वेब विकासकर्ता रुपमा तपाईंको वर्कफ्लो सुधार गर्न सक्छ भन्ने प्रदर्शन गर्नुहोस्। -**प्रेरणा:** कोड सम्पादक वा IDE (जस्तै Visual Studio Code, WebStorm, वा क्लाउड-आधारित IDE) चयन गर्नुहोस्। तीन सुविधाहरू वा एक्सटेन्सनहरूको सूची बनाउनुहोस् जसले तपाईंलाई कोड लेख्न, डिबग गर्न, वा कुशलतापूर्वक मर्मत गर्न मद्दत गर्छ। प्रत्येकको लागि, यसले तपाईंको वर्कफ्लोमा कसरी फाइदा पुर्‍याउँछ भन्ने संक्षिप्त व्याख्या प्रदान गर्नुहोस्। +**प्रम्प्ट:** कुनै कोड सम्पादक वा IDE (जस्तै Visual Studio Code, WebStorm, वा क्लाउड-आधारित IDE) चयन गर्नुहोस्। तीनवटा सुविधाहरू वा एक्सटेन्सनहरूले तपाईंलाई कोड लेख्न, डिबग गर्न, वा मर्मत गर्न कसरी सहयोग गर्छ भन्ने छोटकरीमा व्याख्या सहित सूचीबद्ध गर्नुहोस्। --- ## 🚀 चुनौती -**ठिक छ, जासूस, तपाईंको पहिलो केसको लागि तयार?** - -अब तपाईंले यो अद्भुत आधार प्राप्त गर्नुभएको छ, मसँग एउटा साहसिक कार्य छ जसले तपाईंलाई प्रोग्रामिङ संसार कति विविध र आकर्षक छ भनेर देख्न मद्दत गर्नेछ। र सुन्नुहोस् – यो कोड लेख्ने बारे होइन, त्यसैले यहाँ कुनै दबाब छैन! तपाईंलाई आफ्नो पहिलो रोमाञ्चक केसमा प्रोग्रामिङ भाषा जासूसको रूपमा सोच्नुहोस्! - -**तपाईंको मिशन, यदि तपाईंले स्वीकार गर्नुभयो भने:** -1. **भाषा अन्वेषक बन्नुहोस्**: तीन प्रोग्रामिङ भाषाहरू चयन गर्नुहोस् जुन पूर्ण रूपमा फरक ब्रह्माण्डबाट आउँछन् – सायद एउटा वेबसाइटहरू निर्माण गर्ने, एउटा मोबाइल एपहरू बनाउने, र एउटा वैज्ञानिकहरूको लागि डेटा विश्लेषण गर्ने। प्रत्येक भाषामा लेखिएको एउटै साधारण कार्यको उदाहरणहरू फेला पार्नुहोस्। म वाचा गर्छु तपाईं पूर्ण रूपमा चकित हुनुहुनेछ कि तिनीहरूले एकै काम गर्न कति फरक देखिन्छन्! +**ठीक छ, जासूस, तपाईंको पहिलो केसका लागि तयार हुनुहुन्छ?** -2. **तिनीहरूको उत्पत्ति कथाहरू पत्ता लगाउनुहोस्**: प्रत्येक भाषा विशेष के बनाउँछ? यहाँ एउटा चाखलाग्दो तथ्य छ – प्रत्येक प्रोग्रामिङ भाषा सिर्जना गरिएको थियो किनभने कसैले सोचे, "तपाईंलाई थाहा छ के? यो विशिष्ट समस्या समाधान गर्नको लागि राम्रो तरिका हुनुपर्छ।" के तपाईं ती समस्याहरू के थिए भनेर पत्ता लगाउन सक्नुहुन्छ? यी कथाहरू साँच्चै आकर्षक छन्! +अब तपाईंले यो जबरजस्त आधार पाउनुभयो, म एउटा साहसिक कथा छ जुन तपाईंलाई प्रोग्रामिङ विश्व कति विविध र रोचक छ भन्ने देखाउन मद्दत गर्नेछ। र सुनुहोस् – यो अझै कोड लेख्ने बारे होइन, त्यसैले कुनै दबाब छैन! आफूलाई एक प्रोग्रामिङ भाषा जासूसको रूपमा सोच्नुहोस् तपाईंको पहिलो रोमाञ्चक केसमा! -3. **समुदायहरू भेट्नुहोस्**: प्रत्येक भाषाको समुदाय कत्तिको स्वागतयोग्य र उत्साही छ हेर्नुहोस्। केहीसँग लाखौं विकासकर्ताहरू छन् जो ज्ञान साझा गर्दै र एकअर्कालाई मद्दत गर्दैछन्, अरू साना तर अविश्वसनीय रूपमा नजिक र सहयोगी छन्। तपाईंलाई यी समुदायहरूको फरक व्यक्तित्व देख्न मनपर्नेछ! +**तपाईंको मिशन, यदि तपाईं स्वीकार गर्नुहुन्छ भने:** +1. **भाषा अन्वेषक बन्नुहोस्:** एकदमै फरक-फरक विश्वबाट तीन प्रोग्रामिङ भाषा छान्नुहोस् – सम्भवतया एउटा वेबसाइटहरु बनाउने, एउटा मोबाइल एप्स बनाउने, र अर्को वैज्ञानिकहरूको लागि डेटा विश्लेषण गर्ने। प्रत्येक भाषामा एउटै साधारण कार्यको उदाहरणहरू खोज्नुहोस्। मलाई विश्वास गर्नुहोस् तपाईं तिनका देखिने भिन्नताहरूले पूर्ण रूपमा अचम्मित हुनुहुनेछ! +2. **उनीहरूको उत्पत्तिको कथा पत्ता लगाउनुहोस्:** प्रत्येक भाषा के विशेष बनाउँछ? यहाँ एउटा रमाइलो तथ्य छ – प्रत्येक प्रोग्रामिङ भाषा त्यसकारण बन्यो किनकि कसैले सोच्यो, "यो विशेष समस्याको समाधानका लागि अझ राम्रो तरिका हुनुपर्छ।" तपाईं त्यो समस्याहरू के थिए पत्ता लगाउन सक्नुहुन्छ? केही कथाहरू साँच्चिकै रोचक छन्! +3. **समुदायहरू भेट्नुहोस्:** जाँच गर्नुहोस् प्रत्येक भाषाको समुदाय कति स्वागतयोग्य र उत्साही छ। केहीमा लाखौं विकासकर्ताहरू ज्ञान साझेदारी गर्छन् र एक अर्कालाई मद्दत गर्छन्, केही साना तर अत्यन्तै घनिष्ठ र सहयोगी छन्। तपाईं ती समुदायहरूको फरक व्यक्तित्वहरू हेर्न मन पराउने हुनुहुन्छ! +4. **आफ्नो Gut फेरी अनुसरण गर्नुहोस्:** अहिले सबैभन्दा सहज लाग्ने भाषा कुन हो? "सही" छनोट बारे चिन्ता नगर्नुहोस् – केवल आफ्नो आन्तरिक आवाज सुन्नुहोस्! यहाँ साँच्चै कुनै गलत उत्तर छैन, र तपाईं पछि अन्य भाषाहरू पनि अन्वेषण गर्न सक्नुहुन्छ। -4. **आफ्नो आन्तरिक भावना पछ्याउनुहोस्**: कुन भाषा अहिले तपाईंलाई सबैभन्दा पहुँचयोग्य लाग्छ? "सही" छनोट गर्ने बारे तनाव नगर्नुहोस् – केवल आफ्नो अन्तर्ज्ञान सुन्नुहोस्! यहाँ कुनै गलत उत्तर छैन, र तपाईं पछि अरू अन्वेषण गर्न सक्नुहुन्छ। +**बोनस जासूसी कार्य:** पत्ता लगाउन कोसिस गर्नुहोस् कुन प्रमुख वेबसाइट वा एपहरू प्रत्येक भाषाले बनाएको छ। म ग्यारेन्टी गर्छु तपाईं Instagram, Netflix, वा त्यो मोबाइल खेल जुन रोक्न सक्नुहुन्न कसले बनाएको थाहा पाउँदा अचम्मित हुनुहुनेछ! -**बोनस जासूस कार्य**: प्रत्येक भाषाले कुन प्रमुख वेबसाइटहरू वा एपहरू निर्माण गरेको छ पत्ता लगाउन प्रयास गर्नुहोस्। म ग्यारेन्टी दिन्छु तपाईं चकित हुनुहुनेछ कि Instagram, Netflix, वा त्यो मोबाइल गेम जसलाई तपाईं रोक्न सक्नुहुन्न केले शक्ति दिन्छ! +> 💡 **स्मरण रहोस:** तपाईं आज कुनै भाषा विशेषज्ञ बन्न खोज्दै हुनुहुन्न। तपाईं केवल आफू बस्न चाहनु भएको ठाउँ निश्चित गर्नुभन्दा पहिले छिमेक जान्दै हुनुहुन्छ। समय लिनुहोस्, रमाइलो गर्नुहोस्, र जिज्ञासा तपाईंको मार्गदर्शक बन्न दिनुहोस्! -> 💡 **स्मरण गर्नुहोस्**: तपाईं आज यी भाषाहरूको कुनै पनि मा विशेषज्ञ बन्न प्रयास गर्दै हुनुहुन्न। तपाईं केवल छिमेकलाई चिन्न प्रयास गर्दै हुनुहुन्छ अघि तपाईंले कहाँ पसल स्थापना गर्न चाहनुहुन्छ निर्णय गर्नुहोस्। आफ्नो समय लिनुहोस्, यससँग रमाइलो गर्नुहोस्, र तपाईंको जिज्ञासाले तपाईंलाई मार्गदर्शन गर्न दिनुहोस्! +## तपाईंले के पत्ता लगाउनुभयो त्यसको उत्सव मनाऔं! -## तपाईंले पत्ता लगाउनुभएको कुरा मनाउन तयार हुनुहोस्! +हेर, तपाईंले आज यति धेरै अविश्वसनीय जानकारी ग्रहण गर्नुभयो! म साँच्चिकै उत्साहित छु तपाईंले कति राम्रो सिक्नुभएको छ भनेर हेर्न। र सम्झनुहोस् – यो कुनै परीक्षण होइन जहाँ सबै कुरा perfect हुनुपर्छ। यो तपाईंले यो रोचक संसारका बारेमा सिकेका सबै रमाइला कुरा मनाउने उत्सव जस्तो छ जुन तपाईंमा पसेको छ! -हे भगवान, तपाईंले आज कति अविश्वसनीय जानकारी अवशोषित गर्नुभएको छ! म साँच्चै उत्साहित छु कि तपाईंले यस अद्भुत यात्राको कति भाग सम्झनुभएको छ। र सम्झनुहोस् – यो कुनै परीक्षा होइन जहाँ तपाईंले सबै कुरा सही गर्न आवश्यक छ। यो तपाईंले सिक्नुभएको सबै चाखलाग्दो कुराको उत्सव जस्तै हो! +[पाठपछिको क्विज लिने](https://ff-quizzes.netlify.app/web/) -[पाठ-पछिको क्विज लिनुहोस्](https://ff-quizzes.netlify.app/web/) -## समीक्षा र आत्म अध्ययन +## समीक्षा र स्व-अध्ययन -**आफ्नो समय लिनुहोस् र यसलाई रमाइलो बनाउनुहोस्!** +**आफ्नो समय लिई एक्सप्लोर गर्नुहोस् र रमाइलो गर्नुहोस्!** +तपाईंले आज धेरै कुरा सिक्नुभएको छ, र त्यो गर्व गर्ने कुरा हो! अब रमाइलो भाग आउँछ – ती विषयहरू अन्वेषण गर्ने जुनले तपाईंको जिज्ञासा जगाएको छ। याद गर्नुहोस्, यो गृहकार्य होइन – यो एक साहसिक यात्रा हो! -तपाईंले आज धेरै कुरा सिक्नुभएको छ, र यो गर्व गर्न लायक कुरा हो! अब रमाइलो भाग आउँछ – ती विषयहरू अन्वेषण गर्नुहोस् जसले तपाईंको जिज्ञासा जगायो। सम्झनुहोस्, यो गृहकार्य होइन – यो एउटा साहसिक यात्रा हो! +**तपाईंलाई उत्साहित गर्ने कुरामा गहिराईमा जानुहोस्:** -**तपाईंलाई उत्साहित गर्ने कुरामा गहिरो डुबुल्की मार्नुहोस्:** +**प्रोग्रामिङ भाषासँग हातेमालो गर्नुहोस्:** +- २-३ भाषाको आधिकारिक वेबसाइटहरू भ्रमण गर्नुहोस् जुनले तपाईंको ध्यान तानेको छ। प्रत्येकको आफ्नै व्यक्तित्व र कथा हुन्छ! +- [CodePen](https://codepen.io/), [JSFiddle](https://jsfiddle.net/), वा [Replit](https://replit.com/) जस्ता अनलाइन कोडिङ प्लेटफर्महरू प्रयोग गर्नुहोस्। प्रयोग गर्न नडराउनुहोस् – तपाईं केही बिग्रन सक्नुहुन्न! +- तपाईंको मनपर्ने भाषाको उद्भवबारे पढ्नुहोस्। साँच्चिकै, यी केही उत्पत्ति कथाहरू अचम्मका हुन्छन् र तपाईंलाई भाषाहरू किन त्यस्तै काम गर्छन् बुझ्न मद्दत गर्नेछन्। -**प्रोग्रामिङ भाषाहरूमा व्यावहारिक अनुभव लिनुहोस्:** -- तपाईंलाई मन परेको २-३ भाषाहरूको आधिकारिक वेबसाइटहरूमा जानुहोस्। प्रत्येकको आफ्नै विशेषता र कथा छ! -- [CodePen](https://codepen.io/), [JSFiddle](https://jsfiddle.net/), वा [Replit](https://replit.com/) जस्ता अनलाइन कोडिङ प्लेग्राउन्डहरू प्रयास गर्नुहोस्। प्रयोग गर्न डराउनुहोस् – तपाईंले केही बिगार्न सक्नुहुन्न! -- तपाईंको मनपर्ने भाषाको उत्पत्ति कसरी भयो भन्नेबारे पढ्नुहोस्। साँच्चै, यी उत्पत्ति कथाहरू रोचक छन् र तपाईंलाई भाषाहरू किन यसरी काम गर्छन् भन्ने बुझ्न मद्दत गर्नेछन्। +**तपाईंका नयाँ उपकरणहरूसँग परिचित हुनुहोस्:** +- यदि तपाईंले भिजुअल स्टुडियो कोड डाउनलोड गर्नुभएको छैन भने डाउनलोड गर्नुहोस् – यो निःशुल्क छ र तपाईंलाई मन पर्नेछ! +- एक्सटेन्सन बजार एक दुई मिनेट हेरौं। यो तपाईंको कोड सम्पादकको लागि एप स्टोर जस्तो छ! +- आफ्नो ब्राउजरको डेभलपर टूल्स खोल्नुहोस् र केही क्लिक गर्नुहोस्। सबै कुरा बुझ्ने चिन्ता गर्नु पर्दैन – के के छ भनेर परिचित हुनुहोस्। -**आफ्नो नयाँ उपकरणहरूसँग सहज हुनुहोस्:** -- Visual Studio Code डाउनलोड गर्नुहोस् यदि तपाईंले अझै डाउनलोड गर्नुभएको छैन भने – यो निःशुल्क छ र तपाईंलाई यो मनपर्नेछ! -- Extensions marketplace ब्राउज गर्न केही मिनेट खर्च गर्नुहोस्। यो तपाईंको कोड एडिटरको लागि एप स्टोर जस्तै हो! -- तपाईंको ब्राउजरको Developer Tools खोल्नुहोस् र क्लिक गर्न सुरु गर्नुहोस्। सबै कुरा बुझ्न चिन्ता नगर्नुहोस् – त्यहाँ के छ भनेर परिचित हुनुहोस्। +**समुदायमा सहभागी हुनुहोस्:** +- केही डेभलपर समुदायहरूको पछ्याउनुहोस् [Dev.to](https://dev.to/), [Stack Overflow](https://stackoverflow.com/), वा [GitHub](https://github.com/) मा। प्रोग्रामिङ समुदाय नयाँ आगन्तुकहरूका लागि अत्यन्त स्वागतयोग्य छ! +- युट्युबमा शुरुवाती-मैत्री कोडिङ भिडियोहरू हेर्नुहोस्। त्यहाँ धेरै उत्कृष्ट निर्माताहरू छन् जसले शुरु गर्दा कस्तो हुन्छ सम्झन सक्छन्। +- स्थानीय मिटअप वा अनलाइन समुदायमा सहभागी हुनु विचार गर्नुहोस्। विश्वास गर्नुहोस्, डेभलपरहरूले नयाँ आउँदाहरुलाई मद्दत गर्न मन पराउँछन्! -**समुदायमा सामेल हुनुहोस्:** -- [Dev.to](https://dev.to/), [Stack Overflow](https://stackoverflow.com/), वा [GitHub](https://github.com/) मा केही डेभलपर समुदायहरूलाई फलो गर्नुहोस्। प्रोग्रामिङ समुदाय नयाँ व्यक्तिहरूलाई स्वागत गर्न धेरै उत्सुक छ! -- YouTube मा केही शुरुआती मैत्री कोडिङ भिडियोहरू हेर्नुहोस्। त्यहाँ धेरै उत्कृष्ट सिर्जनाकर्ताहरू छन् जसले सुरु गर्दा कस्तो महसुस हुन्छ भन्ने सम्झन्छन्। -- स्थानीय मिटअपहरू वा अनलाइन समुदायहरूमा सामेल हुने विचार गर्नुहोस्। विश्वास गर्नुहोस्, डेभलपरहरू नयाँ व्यक्तिहरूलाई मद्दत गर्न मन पराउँछन्! +> 🎯 **सुनुहोस्, मैले तपाईंलाई याद गर्न चाहेको कुरा यो हो**: तपाईंलाई एक रातमै कोडिङ विजार्ड बन्ने अपेक्षा गरिएको छैन! अहिले तपाईं यस अद्भुत नयाँ संसारलाई चिन्दै हुनुहुन्छ जुन तपाईंको हिस्सा बन्नेछ। समय लिनुहोस्, यात्राको मजा लिनुहोस्, र याद गर्नुहोस् – तपाईंले जसलाई सम्मान गर्नुहुन्छ हरेक डेभलपर पनि यस्तै ठाउँमा बसेका थिए, उत्साहित र सायद अलि तनावमा। यो पूर्ण रूपमा सामान्य हो, र यसले तपाईं ठीक गर्दै हुनुहुन्छ भन्ने देखाउँछ। -> 🎯 **सुन्नुहोस्, यहाँ म तपाईंलाई सम्झाउन चाहन्छु**: तपाईंलाई रातारात कोडिङ विशेषज्ञ बन्ने अपेक्षा गरिएको छैन! अहिले, तपाईं यो अद्भुत नयाँ संसारलाई चिन्न सुरु गर्दै हुनुहुन्छ जसको तपाईं भाग बन्न लाग्नुभएको छ। आफ्नो समय लिनुहोस्, यात्रा रमाइलो बनाउनुहोस्, र सम्झनुहोस् – तपाईंले प्रशंसा गर्ने प्रत्येक डेभलपर एकपटक तपाईं जस्तै स्थानमा बसेका थिए, उत्साहित र सायद अलि अलमलमा परेका। यो पूर्ण रूपमा सामान्य हो, र यसको मतलब तपाईं सही गरिरहनुभएको छ। - - - -## असाइनमेन्ट +## Assignment [Reading the Docs](assignment.md) -> 💡 **तपाईंको असाइनमेन्टको लागि सानो प्रेरणा**: म तपाईंलाई केही उपकरणहरू अन्वेषण गर्न देख्न चाहन्छु जुन हामीले अझै कभर गरेका छैनौं! हामीले पहिले नै चर्चा गरेका एडिटरहरू, ब्राउजरहरू, र कमाण्ड लाइन उपकरणहरू छोड्नुहोस् – त्यहाँ विकासका लागि अद्भुत उपकरणहरूको सम्पूर्ण ब्रह्माण्ड छ जुन पत्ता लगाउन तपाईंलाई पर्खिरहेको छ। ती उपकरणहरू खोज्नुहोस् जुन सक्रिय रूपमा मर्मत गरिन्छ र जीवंत, सहयोगी समुदायहरू छन् (यीसँग उत्कृष्ट ट्यूटोरियलहरू र सहयोगी व्यक्तिहरू हुने सम्भावना बढी हुन्छ जब तपाईं अनिवार्य रूपमा अड्किनुहुन्छ र सहयोगी हातको आवश्यकता हुन्छ)। +> 💡 **तपाईंको असाइन्मेन्टको लागि एउटा सानो प्रोत्साहन**: मैले अझै समेट्न नसकेका केही उपकरणहरू अन्वेषण गर्ने कुरा देख्न मन लाग्छ! हामीले पहिले नै कुरा गरेका सम्पादक, ब्राउजर, र कमाण्ड लाइन उपकरणहरूलाई छोड्नुहोस् – त्यहाँ बाहिर एक विशाल अद्भुत विकास उपकरणहरूको ब्रह्माण्ड छ जुन पत्ता लगाउन बाँकी छ। ती उपकरणहरू खोज्नुहोस् जुन सक्रिय रूपमा मर्मतसम्भार हुन्छन् र जीवित, सहयोगी समुदायहरू छन् (यीमा सबैभन्दा राम्रो ट्युटोरियल हुन्छन् र जब तपाईं अड्किनुहुन्छ र मद्दत चाहिन्छ तब सबैभन्दा सहयोगी मानिसहरू हुन्छन्)। --- ## 🚀 तपाईंको प्रोग्रामिङ यात्रा समयरेखा ### ⚡ **अर्को ५ मिनेटमा तपाईं के गर्न सक्नुहुन्छ** -- [ ] तपाईंलाई मन परेको २-३ प्रोग्रामिङ भाषाको वेबसाइट बुकमार्क गर्नुहोस् -- [ ] Visual Studio Code डाउनलोड गर्नुहोस् यदि तपाईंले अझै डाउनलोड गर्नुभएको छैन भने -- [ ] तपाईंको ब्राउजरको DevTools (F12) खोल्नुहोस् र कुनै पनि वेबसाइटमा क्लिक गर्नुहोस् -- [ ] एउटा प्रोग्रामिङ समुदायमा सामेल हुनुहोस् (Dev.to, Reddit r/webdev, वा Stack Overflow) - -### ⏰ **यो घण्टामा तपाईं के हासिल गर्न सक्नुहुन्छ** -- [ ] पाठपछिको क्विज पूरा गर्नुहोस् र तपाईंको उत्तरहरूमा विचार गर्नुहोस् -- [ ] GitHub Copilot एक्सटेन्सनको साथ VS Code सेटअप गर्नुहोस् -- [ ] अनलाइनमा २ फरक प्रोग्रामिङ भाषाहरूमा "Hello World" उदाहरण प्रयास गर्नुहोस् -- [ ] YouTube मा "Day in the Life of a Developer" भिडियो हेर्नुहोस् -- [ ] तपाईंको प्रोग्रामिङ भाषा डिटेक्टिभ कार्य सुरु गर्नुहोस् (चुनौतीबाट) - -### 📅 **तपाईंको हप्ताको साहसिक यात्रा** -- [ ] असाइनमेन्ट पूरा गर्नुहोस् र ३ नयाँ विकास उपकरणहरू अन्वेषण गर्नुहोस् -- [ ] सामाजिक सञ्जालमा ५ डेभलपरहरू वा प्रोग्रामिङ खाताहरू फलो गर्नुहोस् -- [ ] CodePen वा Replit मा केही सानो निर्माण प्रयास गर्नुहोस् (यहाँसम्म कि "Hello, [तपाईंको नाम]!") -- [ ] कसैको कोडिङ यात्राबारे एक डेभलपर ब्लग पोस्ट पढ्नुहोस् -- [ ] भर्चुअल मिटअपमा सामेल हुनुहोस् वा प्रोग्रामिङ टक हेर्नुहोस् -- [ ] अनलाइन ट्यूटोरियलहरूसँग तपाईंले रोजेको भाषा सिक्न सुरु गर्नुहोस् - -### 🗓️ **तपाईंको महिनाको रूपान्तरण** -- [ ] तपाईंको पहिलो सानो प्रोजेक्ट निर्माण गर्नुहोस् (यहाँसम्म कि एउटा साधारण वेबपेज पनि गनिन्छ!) -- [ ] ओपन-सोर्स प्रोजेक्टमा योगदान गर्नुहोस् (डकुमेन्टेसन सुधारबाट सुरु गर्नुहोस्) -- [ ] कोहीलाई मार्गदर्शन गर्नुहोस् जो आफ्नो प्रोग्रामिङ यात्रा सुरु गर्दैछ +- [ ] २-३ प्रोग्रामिङ भाषा वेबसाइटहरू बुकमार्क गर्नुहोस् जुनले तपाईंको ध्यान तानेको छ +- [ ] यदि भिजुअल स्टुडियो कोड डाउनलोड गर्नुभएको छैन भने डाउनलोड गर्नुहोस् +- [ ] आफ्नो ब्राउजरको DevTools (F12) खोल्नुहोस् र कुनै पनि वेबसाइटमा क्लिक गर्नुहोस् +- [ ] एउटा प्रोग्रामिङ समुदायमा सहभागी हुनुहोस् (Dev.to, Reddit r/webdev, वा Stack Overflow) + +### ⏰ **यस घण्टामा तपाईं के पूरा गर्न सक्नुहुन्छ** +- [ ] पाठपछि गरिएको क्विज पूरा गर्नुहोस् र आफ्नो उत्तरहरूमा प्रतिबिम्बित हुनुहोस् +- [ ] VS Code मा GitHub Copilot एक्सटेन्सन सेटअप गर्नुहोस् +- [ ] दुई फरक प्रोग्रामिङ भाषामा अनलाइन "Hello World" उदाहरण प्रयास गर्नुहोस् +- [ ] युट्युबमा "Developer को एक दिन" भिडियो हेर्नुहोस् +- [ ] प्रोग्रामिङ भाषा जासूस काम सुरु गर्नुहोस् (चुनौतीबाट) + +### 📅 **तपाईंको हप्तादेखि थलो रोमाञ्चक यात्रा** +- [ ] असाइन्मेन्ट पूरा गर्नुहोस् र ३ नयाँ विकास उपकरणहरू अन्वेषण गर्नुहोस् +- [ ] सामाजिक संजालमा ५ जना डेभलपर वा प्रोग्रामिङ खाता फलो गर्नुहोस् +- [ ] CodePen वा Replit मा केही साना कुरा बनाउने प्रयास गर्नुहोस् (जति सानो भए पनि "Hello, [तपाईंको नाम]!" ठिकै छ) +- [ ] कसैको कोडिङ यात्रामा एक डेभलपर ब्लग पोस्ट पढ्नुहोस् +- [ ] भर्चुअल मिटअपमा सहभागी हुनुहोस् वा प्रोग्रामिङ सम्बन्धि टक वार्ता हेर्नुहोस् +- [ ] तपाईंले रोजेको भाषाको अनलाइन ट्युटोरियलहरूबाट सिक्न सुरु गर्नुहोस् + +### 🗓️ **तपाईंको महिनादेखि लामो रूपान्तरण** +- [ ] आफ्नो पहिलो सानो प्रोजेक्ट निर्माण गर्नुहोस् (सजिलो वेबपेज पनि ठीकै छ) +- [ ] खुल्ला स्रोत प्रोजेक्टमा योगदान दिनुहोस् (सर्वप्रथम कागजात सुधारहरूबाट सुरु गर्नुहोस्) +- [ ] कसैलाई मार्गदर्शन गर्नुहोस् जो प्रोग्रामिङ यात्रा शुरु गर्दैछ - [ ] तपाईंको डेभलपर पोर्टफोलियो वेबसाइट बनाउनुहोस् -- [ ] स्थानीय डेभलपर समुदायहरू वा अध्ययन समूहहरूसँग जडान गर्नुहोस् -- [ ] तपाईंको अर्को सिकाइको लक्ष्य योजना गर्न सुरु गर्नुहोस् +- [ ] स्थानीय डेभलपर समुदाय वा अध्ययन समूहमा जडान हुनुहोस् +- [ ] अर्को सिकाइ लक्ष्य योजना बनाउन सुरु गर्नुहोस् ### 🎯 **अन्तिम प्रतिबिम्ब जाँच** -**अगाडि बढ्नु अघि, एक क्षण लिनुहोस् र उत्सव मनाउनुहोस्:** -- आज प्रोग्रामिङको बारेमा तपाईंलाई उत्साहित गर्ने एउटा कुरा के हो? -- कुन उपकरण वा अवधारणा तपाईंले पहिलो अन्वेषण गर्न चाहनुहुन्छ? -- यो प्रोग्रामिङ यात्रा सुरु गर्दा तपाईंलाई कस्तो महसुस भइरहेको छ? -- अहिले तपाईंले डेभलपरलाई सोध्न चाहनुभएको एउटा प्रश्न के हो? +**अगाडि बढ्नु अघि, एक क्षण लिएर उत्सव मनाउनुहोस्:** +- आज प्रोग्रामिङमा के कुराले तपाईंलाई उत्साहित गरायो? +- कुन उपकरण वा अवधारणा पहिलो अन्वेषण गर्न चाहनुहुन्छ? +- यो प्रोग्रामिङ यात्रा सुरु गर्ने बारेमा तपाईंको भावना कस्तो छ? +- अहिले तपाईंले डेभलपरलाई सोध्न चाहेको एउटा प्रश्न के हो? ```mermaid journey - title Your Confidence Building Journey - section Today - Curious: 3: You - Overwhelmed: 4: You - Excited: 5: You - section This Week - Exploring: 4: You - Learning: 5: You - Connecting: 4: You - section Next Month - Building: 5: You - Confident: 5: You - Helping Others: 5: You + title तपाईको आत्मविश्वास निर्माण यात्रा + section आज + जिज्ञासु: 3: You + अभिभूत: 4: You + उत्साहित: 5: You + section यस हप्ता + अन्वेषण गर्दै: 4: You + सिक्दै: 5: You + जोड्दै: 4: You + section अर्को महिना + निर्माण गर्दै: 5: You + विश्वस्त: 5: You + अरुलाई मद्दत गर्दै: 5: You ``` - -> 🌟 **सम्झनुहोस्**: प्रत्येक विशेषज्ञ एकपटक नयाँ सिक्ने व्यक्ति थिए। प्रत्येक वरिष्ठ डेभलपरले एकपटक तपाईं जस्तै महसुस गरेका थिए – उत्साहित, सायद अलि अलमलमा, र के सम्भव छ भन्ने बारेमा निश्चित रूपमा जिज्ञासु। तपाईं अद्भुत कम्पनीमा हुनुहुन्छ, र यो यात्रा अविश्वसनीय हुने छ। प्रोग्रामिङको अद्भुत संसारमा स्वागत छ! 🎉 +> 🌟 **याद गर्नुहोस्**: प्रत्येक विशेषज्ञ पनि कहिल्यै शुरुवाती थिए। हरेक वरिष्ठ डेभलपरले पनि अहिले तपाइँ जस्तै अनुभव गरेका थिए – उत्साहित, सायद अलि तनावग्रस्त, र के सम्भव छ भनेर जिज्ञासु। तपाईं अचम्मको समूहमा हुनुहुन्छ, र यो यात्रा अविश्वसनीय हुनेछ। प्रोग्रामिङको रमणीय संसारमा स्वागत छ! 🎉 --- -**अस्वीकरण**: -यो दस्तावेज़ AI अनुवाद सेवा [Co-op Translator](https://github.com/Azure/co-op-translator) प्रयोग गरेर अनुवाद गरिएको छ। हामी शुद्धताको लागि प्रयास गर्छौं, तर कृपया ध्यान दिनुहोस् कि स्वचालित अनुवादहरूमा त्रुटिहरू वा अशुद्धताहरू हुन सक्छ। यसको मूल भाषा मा रहेको मूल दस्तावेज़लाई आधिकारिक स्रोत मानिनुपर्छ। महत्वपूर्ण जानकारीको लागि, व्यावसायिक मानव अनुवाद सिफारिस गरिन्छ। यस अनुवादको प्रयोगबाट उत्पन्न हुने कुनै पनि गलतफहमी वा गलत व्याख्याको लागि हामी जिम्मेवार हुने छैनौं। \ No newline at end of file + +**अस्वीकरण**: +यो दस्तावेज AI अनुवाद सेवा [Co-op Translator](https://github.com/Azure/co-op-translator) प्रयोग गरेर अनुवाद गरिएको हो। हामी सटीकताको लागि प्रयास गर्छौं, तर कृपया जानकार हुनुहोस् कि स्वचालित अनुवादमा त्रुटि वा अनिश्चितताहरू हुन सक्छन्। मूल दस्तावेज यसको मूल भाषामा नै अधिकारप्राप्त स्रोत मानिनु पर्छ। महत्वपूर्ण जानकारीका लागि व्यावसायिक मानवीय अनुवाद सिफारिस गरिन्छ। यस अनुवादको प्रयोगबाट उत्पन्न हुने कुनै भ्रम वा गलत बुझाइका लागि हामी जिम्मेवार छैनौं। + \ No newline at end of file diff --git a/translations/ne/AGENTS.md b/translations/ne/AGENTS.md index 7e48d3ebd..5d3beca9e 100644 --- a/translations/ne/AGENTS.md +++ b/translations/ne/AGENTS.md @@ -2,36 +2,36 @@ ## परियोजना अवलोकन -यो शुरुआतीहरूलाई वेब विकासका आधारहरू सिकाउनको लागि शैक्षिक पाठ्यक्रम भण्डार हो। पाठ्यक्रम माइक्रोसफ्ट क्लाउड एड्भोकेट्सद्वारा विकास गरिएको एक व्यापक १२ हप्ते कोर्स हो, जसमा जाभास्क्रिप्ट, CSS, र HTML समेटिएका २४ वटा व्यावहारिक पाठहरू समावेश छन्। +यो शुरुवातीहरूलाई वेब विकासको आधारहरू सिकाउनका लागि शैक्षिक पाठ्यक्रम रिपोजिटरी हो। यो पाठ्यक्रम Microsoft Cloud Advocates द्वारा विकास गरिएको व्यापक १२ हप्ता लामो कोर्स हो, जसमा JavaScript, CSS, र HTML समेटिएका २४ व्यावहारिक पाठहरू समावेश छन्। -### मुख्य कम्पोनेन्टहरू +### मुख्य तत्वहरू -- **शैक्षिक सामग्री**: परियोजना-आधारित मोड्युलहरूमा व्यवस्थित २४ संरचित पाठहरू -- **व्यावहारिक परियोजनाहरू**: टेरारियम, टाइपिंग खेल, ब्राउजर एक्सटेन्सन, स्पेस खेल, बैंकिङ एप, कोड सम्पादक, र AI चैट सहायक -- **इन्टरएक्टिभ क्विजहरू**: प्रत्येकमा ३ प्रश्न सहित ४८ क्विजहरू (पाठ अघि/पछिको मूल्याङ्कनहरू) -- **बहुभाषी समर्थन**: GitHub Actions मार्फत ५०+ भाषाहरूमा स्वतः अनुवाद -- **प्रविधिहरू**: HTML, CSS, JavaScript, Vue.js ३, Vite, Node.js, Express, Python (AI परियोजनाहरूको लागि) +- **शैक्षिक सामग्री**: परियोजना-आधारित मोड्युलहरूमा आयोजित २४ संरचित पाठहरू +- **व्यावहारिक परियोजनाहरू**: Terrarium, Typing Game, Browser Extension, Space Game, Banking App, Code Editor, र AI Chat Assistant +- **इंटरएक्टिभ क्विजहरू**: प्रत्येकमा ३ प्रश्न सहित ४८ क्विजहरू (पाठ अघि/पछि मूल्याङ्कन) +- **बहुभाषी समर्थन**: GitHub Actions मार्फत ५०+ भाषाहरूमा स्वचालित अनुवादहरू +- **प्रविधिहरू**: HTML, CSS, JavaScript, Vue.js 3, Vite, Node.js, Express, Python (AI परियोजनाहरूका लागि) ### वास्तुकला -- पाठमा आधारित संरचनासहित शैक्षिक भण्डार +- पाठ आधारित संरचनामा शैक्षिक रिपोजिटरी - प्रत्येक पाठ फोल्डरमा README, कोड उदाहरणहरू, र समाधानहरू हुन्छन् -- अलग-अलग डाइरेक्टरीहरूमा स्वतन्त्र परियोजनाहरू (quiz-app, विभिन्न पाठ परियोजनाहरू) -- GitHub Actions (co-op-translator) प्रयोग गरेर अनुवाद प्रणाली -- Docsify मार्फत डकुमेन्टेसन सेवा र PDF रूपमा उपलब्ध +- अलग-अलग डाइरेक्टरीहरूमा स्ट्यान्डअलोन परियोजनाहरू (quiz-app, विभिन्न पाठ परियोजनाहरू) +- GitHub Actions (co-op-translator) प्रयोग गरी अनुवाद प्रणाली +- Docsify मार्फत सेवा गरिएको दस्तावेज र PDF रूपमा उपलब्ध ## सेटअप आदेशहरू -यो भण्डार प्रायः शैक्षिक सामग्री उपभोगका लागि हो। विशिष्ट परियोजनाहरूमा काम गर्नको लागि: +यो रिपोजिटरी मुख्य रूपमा शैक्षिक सामग्री उपभोगका लागि हो। विशेष परियोजनाहरूमा काम गर्नका लागि: -### मुख्य भण्डार सेटअप +### मुख्य रिपोजिटरी सेटअप ```bash git clone https://github.com/microsoft/Web-Dev-For-Beginners.git cd Web-Dev-For-Beginners ``` -### क्विज एप सेटअप (Vue 3 + Vite) +### Quiz App सेटअप (Vue 3 + Vite) ```bash cd quiz-app @@ -48,7 +48,7 @@ cd 7-bank-project/api npm install npm start # API सर्भर सुरु गर्नुहोस् npm run lint # ESLint चलाउनुहोस् -npm run format # Prettier सँग फर्म्याट गर्नुहोस् +npm run format # Prettier सँग स्वरूपित गर्नुहोस् ``` ### ब्राउजर एक्सटेन्सन परियोजनाहरू @@ -56,15 +56,15 @@ npm run format # Prettier सँग फर्म्याट गर्नु ```bash cd 5-browser-extension/solution npm install -# ब्राउजर-विशेष विस्तार लोड गर्ने निर्देशनहरू पालना गर्नुहोस् +# ब्राउजर-विशिष्ट विस्तार लोड गर्ने निर्देशनहरू पालना गर्नुहोस् ``` -### स्पेस खेल परियोजनाहरू +### स्पेस गेम परियोजनाहरू ```bash cd 6-space-game/solution npm install -# ब्राउजरमा index.html खोल्नुहोस् वा Live Server प्रयोग गर्नुहोस् +# index.html ब्राउजरमा खोल्नुहोस् वा Live Server प्रयोग गर्नुहोस् ``` ### चैट परियोजना (Python ब्याकएन्ड) @@ -78,205 +78,205 @@ python api.py ## विकास कार्यप्रवाह -### सामग्री योगदानकर्ताहरूको लागि +### सामग्री योगदानकर्ताका लागि -1. आफ्नो GitHub खातामा **भण्डार उपशाखा (fork)** गर्नुहोस् -2. आफ्नो उपशाखा **स्थानीय रूपमा क्लोन** गर्नुहोस् -3. आफ्नो परिवर्तनहरूको लागि **नयाँ शाखा सिर्जना** गर्नुहोस् -4. पाठ सामग्री वा कोड उदाहरणहरूमा परिवर्तनहरू गर्नुहोस् -5. सम्बन्धित परियोजना डाइरेक्टरीहरूमा कुनै पनि कोड परिवर्तनको परीक्षण गर्नुहोस् -6. योगदान दिशानिर्देशहरू अनुसरण गर्दै पुल अनुरोधहरू पेश गर्नुहोस् +1. आफ्नो GitHub खातामा रिपोजिटरी फोर्क गर्नुहोस् +2. फोर्क स्थानीय रूपमा क्लोन गर्नुहोस् +3. परिवर्तनहरूका लागि नयाँ शाखा बनाउनुहोस् +4. पाठ सामग्री वा कोड उदाहरणहरूमा परिवर्तन गर्नुहोस् +5. सम्बन्धित परियोजना डाइरेक्टरीहरूमा कोड परिवर्तन परीक्षण गर्नुहोस् +6. योगदान दिशानिर्देश अनुसार पुल रिक्वेस्ट पठाउनुहोस् -### सिक्नेहरूको लागि +### सिक्नेहरूका लागि -1. भण्डार उपशाखा गर्नुहोस् वा क्लोन गर्नुहोस् -2. पाठ डाइरेक्टरीहरूलाई क्रमिक रूपमा नेभिगेट गर्नुहोस् -3. प्रत्येक पाठका लागि README फाइलहरू पढ्नुहोस् -4. https://ff-quizzes.netlify.app/web/ मा पाठअघि क्विजहरू पूरा गर्नुहोस् -5. पाठ फोल्डरहरूमा कोड उदाहरणहरू मार्फत काम गर्नुहोस् -6. असाइनमेन्ट र चुनौतीहरू पूरा गर्नुहोस् -7. पाठपछिका क्विजहरू लिनुहोस् +1. रिपोजिटरी फोर्क वा क्लोन गर्नुहोस् +2. पाठ निर्देशिकाहरू अनुक्रमिक रूपमा जानुहोस् +3. प्रत्येक पाठको README फाइल पढ्नुहोस् +4. प्रि-लेसन क्विजहरू पूरा गर्नुहोस् https://ff-quizzes.netlify.app/web/ +5. पाठ फोल्डरमा कोड उदाहरणहरूमा काम गर्नुहोस् +6. असाइन्मेन्ट र चुनौतीहरू पूरा गर्नुहोस् +7. पोस्ट-लेसन क्विजहरू लिनुहोस् ### प्रत्यक्ष विकास -- **डकुमेन्टेसन**: मूलमा `docsify serve` चलाउनुहोस् (पोर्ट ३०००) -- **क्विज एप**: quiz-app डाइरेक्टरीमा `npm run dev` चलाउनुहोस् -- **परियोजनाहरू**: HTML परियोजनाहरूका लागि VS Code Live Server एक्सटेन्सन प्रयोग गर्नुहोस् +- **दस्तावेजहरू**: रुटमा `docsify serve` चलाउनुहोस् (पोर्ट ३०००) +- **Quiz App**: quiz-app डाइरेक्टरीमा `npm run dev` चलाउनुहोस् +- **परियोजनाहरू**: HTML परियोजनाहरूका लागि VS Code Live Server विस्तार प्रयोग गर्नुहोस् - **API परियोजनाहरू**: सम्बन्धित API डाइरेक्टरीहरूमा `npm start` चलाउनुहोस् ## परीक्षण निर्देशनहरू -### क्विज एप परीक्षण +### Quiz App परीक्षण ```bash cd quiz-app -npm run lint # कोड शैली समस्याहरू जाँच गर्नुहोस् -npm run build # निर्माण सफल भयो कि भनी जाँच गर्नुहोस् +npm run lint # कोड शैली सम्बन्धी समस्याहरू जाँच गर्नुहोस् +npm run build # निर्माण सफल हुन्छ कि छैन भेरिफाई गर्नुहोस् ``` ### बैंक API परीक्षण ```bash cd 7-bank-project/api -npm run lint # कोड शैली समस्याहरू जाँच गर्नुहोस् -node server.js # सर्भर त्रुटिहरू बिना सुरु हुन्छ कि छैन भेरिफाइ गर्नुहोस् +npm run lint # कोड शैली सम्बन्धी समस्याहरू जाँच गर्नुहोस् +node server.js # सर्भर बिना त्रुटिहरू सुरु हुन्छ कि भनेर प्रमाणित गर्नुहोस् ``` ### सामान्य परीक्षण दृष्टिकोण -- यो शैक्षिक भण्डार हो, व्यापक स्वचालित परीक्षणहरू छैनन् -- म्यानुअल परीक्षणमा ध्यान केन्द्रित: - - कोड उदाहरणहरू त्रुटिविहीन चल्नुपर्ने - - डकुमेन्टेसनमा लिङ्कहरू ठीक काम गर्ने - - परियोजना सफलतापूर्वक बर्न्ड बन्ने - - उदाहरणहरूले उत्तम अभ्यासहरू पालन गर्ने +- यो शैक्षिक रिपोजिटरी व्यापक स्वचालित परीक्षणहरूसहित छैन +- म्यानुअल परीक्षण केन्द्रित हुन्छ: + - कोड उदाहरणहरू त्रुटिविना चल्ने + - दस्तावेजीकरणका लिङ्कहरू ठीक काम गर्ने + - परियोजना बिल्डहरू सफलतापूर्वक पूरा हुने + - उदाहरणहरूले उत्तम अभ्यासहरू अनुसरण गर्ने -### पूर्व-प्रस्तुतीकरण जाँचहरू +### पेश गर्नु अघि जाँचहरू -- package.json भएका डाइरेक्टरीहरूमा `npm run lint` चलाउनुहोस् -- मार्कडाउन लिङ्कहरू सही छन् कि छैनन् जाँच गर्नुहोस् -- ब्राउजर वा Node.js मा कोड उदाहरणहरू परीक्षण गर्नुहोस् -- अनुवादहरूले उचित संरचना कायम राखेको छ कि छैन जाँच गर्नुहोस् +- `package.json` भएका डाइरेक्टरीहरूमा `npm run lint` चलाउनुहोस् +- मार्कडाउन लिङ्कहरू मान्य छन् भनी पुष्टि गर्नुहोस् +- कोड उदाहरणहरू ब्राउजर वा Node.js मा परीक्षण गर्नुहोस् +- अनुवादहरूले उचित संरचना कायम राखेका छन् भनी जाँच गर्नुहोस् ## कोड शैली दिशानिर्देशहरू ### JavaScript - आधुनिक ES6+ सिन्ट्याक्स प्रयोग गर्नुहोस् -- परियोजनाहरूमा दिइएका मानक ESLint कन्फिगरेसनहरू पालना गर्नुहोस् +- परियोजनाहरूमा उपलब्ध मानक ESLint कन्फिगरेसनहरू अनुसरण गर्नुहोस् - शैक्षिक स्पष्टताका लागि अर्थपूर्ण भेरिएबल र फंक्शन नामहरू प्रयोग गर्नुहोस् -- सिक्नेहरूको लागि अवधारणाहरू व्याख्या गर्ने टिप्पणीहरू थप्नुहोस् -- जहाँ कन्फिगर गरिएको छ, Prettier प्रयोग गरी फर्म्याट गर्नुहोस् +- सिक्नेहरूका लागि अवधारणाहरू व्याख्या गर्ने टिप्पणीहरू थप्नुहोस् +- Prettier प्रयोग गरिएको ठाउँमा फर्म्याट गर्नुहोस् ### HTML/CSS -- सेम्यान्टिक HTML5 एलिमेन्टहरू -- प्रत्युत्तरात्मक डिजाइन सिद्धान्तहरू -- स्पष्ट क्लास नामकरण परम्पराहरू -- CSS प्रविधिहरू सिक्नेको लागि व्याख्यात्मक टिप्पणीहरू +- सेमेन्टिक HTML5 तत्वहरू +- प्रतिक्रिया डिजाइनको सिद्धान्तहरू +- स्पष्ट क्लास नामकरण कन्वेन्सनहरू +- CSS प्रविधिहरू सिकाउने टिप्पणीहरू ### Python - PEP 8 शैली दिशानिर्देशहरू - स्पष्ट, शैक्षिक कोड उदाहरणहरू -- सिकाइका लागि आवश्यक परे टाइप हिंटहरू +- सिक्न सहयोगी हुने ठाउँमा टाइप संकेतहरू -### मार्कडाउन डकुमेन्टेसन +### Markdown दस्तावेजीकरण -- स्पष्ट शीर्षक संरचना +- स्पष्ट हेडिङ संरचना - भाषा निर्दिष्ट सहित कोड ब्लकहरू - अतिरिक्त स्रोतहरूका लागि लिङ्कहरू -- `images/` डाइरेक्टरीमा स्क्रिनशट र छविहरू -- पहुँचयोग्यताका लागि छविहरूमा वैकल्पिक पाठ +- `images/` निर्देशिकाहरूमा स्क्रीनशटहरू र छविहरू +- पहुँचयोग्यताका लागि छविहरूमा Alt टेक्स्ट ### फाइल संगठन -- पाठहरू अनुक्रमिक सङ्ख्यामा संकेत गरिएको (1-getting-started-lessons, 2-js-basics, आदि) -- प्रत्येक परियोजनामा `solution/` र प्रायः `start/` वा `your-work/` फोल्डरहरू +- पाठहरू अनुक्रमिक नम्बरमा (1-getting-started-lessons, 2-js-basics, आदि) +- प्रत्येक परियोजनामा `solution/` र प्रायः `start/` वा `your-work/` निर्देशिका हुन्छन् - पाठ-विशिष्ट `images/` फोल्डरहरूमा छविहरू संग्रहित - अनुवादहरू `translations/{language-code}/` संरचनामा ## बिल्ड र डिप्लोयमेन्ट -### क्विज एप डिप्लोयमेन्ट (Azure Static Web Apps) +### Quiz App डिप्लोयमेन्ट (Azure Static Web Apps) -क्विज एप Azure Static Web Apps डिप्लोयमेन्टको लागि कन्फिगर गरिएको छ: +quiz-app Azure Static Web Apps डिप्लोयमेन्टका लागि कन्फिगर गरिएको छ: ```bash cd quiz-app npm run build # dist/ फोल्डर सिर्जना गर्दछ -# मुख्यमा पुश गर्दा GitHub Actions कार्यप्रवाह मार्फत तैनाथ गर्दछ +# मुख्य शाखामा push गर्दा GitHub Actions workflow मार्फत वितरण गर्दछ ``` Azure Static Web Apps कन्फिगरेसन: -- **एप स्थान**: `/quiz-app` +- **एप्स स्थान**: `/quiz-app` - **आउटपुट स्थान**: `dist` - **वर्कफ्लो**: `.github/workflows/azure-static-web-apps-ashy-river-0debb7803.yml` -### डकुमेन्टेसन PDF निर्माण +### दस्तावेज PDF उत्पादन ```bash npm install # docsify-to-pdf स्थापना गर्नुहोस् npm run convert # docs बाट PDF उत्पादन गर्नुहोस् ``` -### Docsify डकुमेन्टेसन +### Docsify दस्तावेजीकरण ```bash -npm install -g docsify-cli # Docsify लाई विश्वव्यापी रूपमा स्थापना गर्नुहोस् +npm install -g docsify-cli # Docsify लाई ग्लोबली इन्स्टल गर्नुहोस् docsify serve # localhost:3000 मा सेवा गर्नुहोस् ``` ### परियोजना-विशिष्ट बिल्डहरू -प्रत्येक परियोजना डाइरेक्टरीको आफ्नो बिल्ड प्रक्रिया हुन सक्छ: -- Vue परियोजनाहरू: `npm run build` ले उत्पादन बन्डलहरू सिर्जना गर्छ -- स्थिर परियोजनाहरू: कुनै बिल्ड चरण छैन, फाइलहरू सिधै सेवा गर्नुपर्छ +हरेक परियोजना निर्देशिकाले आफ्नो बिल्ड प्रक्रिया हुन सक्छ: +- Vue परियोजनाहरू: `npm run build` प्रयोग गरी उत्पादन बन्डलहरू सिर्जना +- स्थिर परियोजनाहरू: बिल्ड चरण बिना, फाइलहरू प्रत्यक्ष सेवा -## पुल अनुरोध दिशानिर्देशहरू +## पुल रिक्वेस्ट दिशानिर्देशहरू ### शीर्षक ढाँचा -परिवर्तन क्षेत्र स्पष्ट जनाउने शीर्षकहरू प्रयोग गर्नुहोस्: -- `[Quiz-app] पाठ X को लागि नयाँ क्विज थप्नुहोस्` -- `[Lesson-3] टेरारियम परियोजनामा टाइपो सुधार्नुहोस्` -- `[Translation] पाठ 5 को लागि स्पेनिश अनुवाद थप्नुहोस्` -- `[Docs] सेटअप निर्देशनहरू अद्यावधिक गर्नुहोस्` +परिवर्तन क्षेत्र स्पष्ट जनाउने शीर्षक प्रयोग गर्नुहोस्: +- `[Quiz-app] पाठ X का लागि नयाँ क्विज थप्नुहोस्` +- `[Lesson-3] terrarium परियोजनामा टाइपो सच्याउनुहोस्` +- `[Translation] पाठ 5 का लागि स्पेनिश अनुवाद थप्नुहोस्` +- `[Docs] सेटअप निर्देशन अद्यावधिक गर्नुहोस्` ### आवश्यक जाँचहरू PR पेश गर्नु अघि: 1. **कोड गुणस्तर**: - - प्रभावित परियोजना डाइरेक्टरीहरूमा `npm run lint` चलाउनुहोस् - - सबै लिन्टिङ त्रुटि र चेतावनीहरू सुधार्नुहोस् + - प्रभावित परियोजना निर्देशिकाहरूमा `npm run lint` चलाउनुहोस् + - सबै लिन्टिङ त्रुटि र चेतावनीहरू सच्याउनुहोस् 2. **बिल्ड प्रमाणीकरण**: - - लागू परे `npm run build` चलाउनुहोस् - - कुनै बिल्ड त्रुटि नभएको सुनिश्चित गर्नुहोस् + - लागू भएमा `npm run build` चलाउनुहोस् + - कुनै बिल्ड त्रुटि नहोस् पुष्टि गर्नुहोस् 3. **लिङ्क प्रमाणीकरण**: - सबै मार्कडाउन लिङ्कहरू परीक्षण गर्नुहोस् - - छवि सन्दर्भहरू काम गर्ने जाँच गर्नुहोस् + - छवि सन्दर्भहरू काम गर्छन् भनी सुनिश्चित गर्नुहोस् 4. **सामग्री समीक्षा**: - - वर्तनी र व्याकरणका लागि प्रूफरीड गर्नुहोस् - - कोड उदाहरणहरू सही र शैक्षिक छन् भन्ने सुनिश्चित गर्नुहोस् - - अनुवादहरूले मूल अर्थ कायम राखेको जाँच गर्नुहोस् + - वर्तनी र व्याकरण जाँच्नुहोस् + - कोड उदाहरणहरू शैक्षिक र सहि छन् भनी सुनिश्चित गर्नुहोस् + - अनुवादहरूले मूल अर्थ कायम राखेका छन् भनी पुष्टि गर्नुहोस् ### योगदान आवश्यकताहरू -- Microsoft CLA (पहिलो PR मा स्वतः जाँच) -- [Microsoft Open Source Code of Conduct](https://opensource.microsoft.com/codeofconduct/) पालना गर्नुहोस् -- विस्तृत दिशानिर्देशहरूको लागि [CONTRIBUTING.md](./CONTRIBUTING.md) हेर्नुहोस् -- PR विवरणमा मुद्दा नम्बरहरूको उल्लेख गर्नुहोस् यदि लागू छ भने +- Microsoft CLA (पहिलो PR मा स्वचालित जाँच) +- [Microsoft Open Source Code of Conduct](https://opensource.microsoft.com/codeofconduct/) पालन +- विस्तृत दिशानिर्देशका लागि [CONTRIBUTING.md](./CONTRIBUTING.md) हेर्नुहोस् +- आवश्यक भए मुद्दा नम्बरहरू PR विवरणमा समावेश गर्नुहोस् ### समीक्षा प्रक्रिया -- PR हरू मर्मतकर्ताहरू र समुदाय द्वारा समीक्षा गरिन्छ -- शैक्षिक स्पष्टता प्राथमिकता दिइन्छ -- कोड उदाहरणहरूले वर्तमान उत्तम अभ्यासहरू पालना गर्नुपर्छ -- अनुवादहरू शुद्धता र सांस्कृतिक उपयुक्तताका लागि समीक्षा गरिन्छ +- PR लाई मर्मतकर्ताहरू र समुदायले समीक्षा गर्छन् +- शैक्षिक स्पष्टतामा जोड दिइन्छ +- कोड उदाहरणहरूले वर्तमान उत्तम अभ्यासहरू अनुसरण गर्नुपर्छ +- अनुवादहरू यथार्थ र सांस्कृतिक उपयुक्तताका लागि समीक्षा गरिन्छ ## अनुवाद प्रणाली ### स्वतः अनुवाद -- GitHub Actions मा co-op-translator वर्कफ्लो प्रयोग गर्दछ -- ५०+ भाषाहरूमा स्वचालित अनुवाद गर्दछ -- मुख्य डाइरेक्टरीहरूमा स्रोत फाइलहरू -- अनुवादित फाइलहरू `translations/{language-code}/` डाइरेक्टरीहरूमा +- GitHub Actions सँग co-op-translator workflow प्रयोग +- ५०+ भाषाहरूमा स्वचालित अनुवाद +- मुख्य निर्देशिकाहरूमा स्रोत फाइलहरू +- अनुवादित फाइलहरू `translations/{language-code}/` निर्देशिकामा -### म्यानुअल अनुवाद सुधारहरू थप्ने +### म्यानुअल अनुवाद सुधार थप -1. `translations/{language-code}/` मा फाइल पत्ता लगाउनुहोस् -2. संरचना कायम राख्दै सुधारहरू गर्नुहोस् -3. कोड उदाहरणहरू कार्यशील रहन्छन् सुनिश्चित गर्नुहोस् +1. `translations/{language-code}/` मा फाइल खोज्नुहोस् +2. संरचना कायम राख्दै सुधार गर्नुहोस् +3. कोड उदाहरणहरू काम गर्दैछन् भनी सुनिश्चित गर्नुहोस् 4. स्थानीयकृत क्विज सामग्री परीक्षण गर्नुहोस् -### अनुवाद मेटाडाटा +### अनुवाद मेटाडेटा -अनुवादित फाइलहरूमा मेटाडाटा हेडर समावेश हुन्छ: +अनुवादित फाइलहरूमा मेटाडेटा हेडर हुन्छ: ```markdown -**अस्वीकरण**: -यो दस्तावेज़लाई AI अनुवाद सेवा [Co-op Translator](https://github.com/Azure/co-op-translator) प्रयोग गरेर अनुवाद गरिएको हो। हामी सही अनुवादका लागि प्रयासरत छौं, तर कृपया ध्यान दिनुहोस् कि स्वचालित अनुवादमा त्रुटि वा असत्यताहरू हुन सक्छन्। मूल दस्तावेज़लाई यसको मूल भाषामा आधिकारिक स्रोत मान्नु पर्नेछ। महत्वपूर्ण जानकारीका लागि पेशेवर मानवीय अनुवाद सिफारिस गरिन्छ। यस अनुवाद प्रयोगबाट हुने कुनै गलतफहमी वा अर्थ निरूपणका लागि हामी जिम्मेवार छैनौं। +**अस्वीकरण**: +यस दस्तावेजलाई AI अनुवाद सेवा [Co-op Translator](https://github.com/Azure/co-op-translator) को प्रयोग गरी अनुवाद गरिएको हो। हामी शुद्धताको प्रयास गर्छौं, तर कृपया बुझ्नुस् कि स्वचालित अनुवादमा त्रुटि वा अशुद्धता हुन सक्दछ। मूल भाषा मा भएको दस्तावेजलाई अधिकारिक स्रोतको रूपमा मान्नुपर्छ। महत्वपूर्ण जानकारीहरूको लागि व्यावसायिक मानव अनुवाद सिफारिस गरिन्छ। यस अनुवादको प्रयोगबाट हुने कुनै पनि गलतफहमी वा गलत व्याख्याका लागि हामी जिम्मेवार छैनौं। \ No newline at end of file diff --git a/translations/ne/README.md b/translations/ne/README.md index e61334dc9..0ca218df6 100644 --- a/translations/ne/README.md +++ b/translations/ne/README.md @@ -1,195 +1,219 @@ -# सुरु गर्नको लागि वेब विकास - एक पाठ्यक्रम +[![GitHub license](https://img.shields.io/github/license/microsoft/Web-Dev-For-Beginners.svg)](https://github.com/microsoft/Web-Dev-For-Beginners/blob/master/LICENSE) +[![GitHub contributors](https://img.shields.io/github/contributors/microsoft/Web-Dev-For-Beginners.svg)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/graphs/contributors/) +[![GitHub issues](https://img.shields.io/github/issues/microsoft/Web-Dev-For-Beginners.svg)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/issues/) +[![GitHub pull-requests](https://img.shields.io/github/issues-pr/microsoft/Web-Dev-For-Beginners.svg)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/pulls/) +[![PRs Welcome](https://img.shields.io/badge/PRs-welcome-brightgreen.svg?style=flat-square)](http://makeapullrequest.com) -Microsoft क्लाउड एड्भोकेट्स द्वारा तयार पारिएको हाम्रो १२ हप्ता लामो सम्पूर्ण कोर्ससँग वेब विकासका आधारहरू सिक्नुहोस्। २४ पाठहरू प्रत्येकले JavaScript, CSS, र HTML मा टेरारियम, ब्राउजर एक्सटेन्सनहरू, र अन्तरिक्ष खेलजस्ता व्यावहारिक परियोजनाहरू मार्फत गहिराइमा जान्छन्। क्विजहरू, छलफलहरू, र व्यावहारिक कार्यहरूमा सहभागिता जनाउनुहोस्। हाम्रो प्रभावकारी परियोजना-आधारित शिक्षाशैलीसँग तपाईंका सीपहरू बढाउनुहोस् र ज्ञानलाई प्रभावकारी रूपमा सम्झन सक्नुहोस्। आजै आफ्नो कोडिङ यात्रा सुरु गर्नुहोस्! +[![GitHub watchers](https://img.shields.io/github/watchers/microsoft/Web-Dev-For-Beginners.svg?style=social&label=Watch&maxAge=2592000)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/watchers/) +[![GitHub forks](https://img.shields.io/github/forks/microsoft/Web-Dev-For-Beginners.svg?style=social&label=Fork&maxAge=2592000)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/network/) +[![GitHub stars](https://img.shields.io/github/stars/microsoft/Web-Dev-For-Beginners.svg?style=social&label=Star&maxAge=2592000)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/stargazers/) + +[![Microsoft Foundry Discord](https://dcbadge.limes.pink/api/server/nTYy5BXMWG)](https://discord.gg/nTYy5BXMWG) + +# शुरुवातीहरूको लागि वेब विकास - एक पाठ्यक्रम + +Microsoft Cloud Advocates द्वारा संचालित हाम्रो १२ हप्ता लामो समग्र पाठ्यक्रमसँग वेब विकासका आधारभूत कुराहरू सिक्नुहोस्। हरेक २४ पाठहरूमा terrariums, browser extensions, र space games जस्ता अभ्यास परियोजनाहरू मार्फत JavaScript, CSS, र HTML को अध्यन गरिन्छ। प्रश्नोत्तरीहरू, छलफलहरू, र व्यावहारिक कर्तव्यहरूमा संलग्न हुनुहोस्। हाम्रो प्रभावकारी परियोजना-आधारित शिक्षण पद्धतिसँग आफ्नो सीपहरू वृद्धि गर्नुहोस् र ज्ञानलाई प्रभावकारी रूपमा कायम राख्नुहोस्। आजै आफ्नो कोडिङ यात्रा सुरु गर्नुहोस्! Azure AI Foundry Discord समुदायमा सामेल हुनुहोस् [![Microsoft Foundry Discord](https://dcbadge.limes.pink/api/server/nTYy5BXMWG)](https://discord.gg/nTYy5BXMWG) -यी स्रोतहरू प्रयोग गर्न सुरू गर्न यी चरणहरू पछ्याउनुहोस्: -1. **रेपोजिटोरी फोर्क गर्नुहोस्**: क्लिक गर्नुहोस् [![GitHub forks](https://img.shields.io/github/forks/microsoft/Web-Dev-For-beginners.svg?style=social&label=Fork)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/fork) -2. **रेपोजिटोरी क्लोन गर्नुहोस्**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git` -3. [**Azure AI Foundry Discord मा सामेल हुनुहोस् र विशेषज्ञहरू र सहकर्मी विकासकर्ताहरूसँग भेट्नुहोस्**](https://discord.com/invite/ByRwuEEgH4) +यी स्रोतहरू प्रयोग गरेर सुरु गर्न यी चरणहरू पालना गर्नुहोस्: +1. **Repository Fork गर्नुहोस्**: क्लिक गर्नुहोस् [![GitHub forks](https://img.shields.io/github/forks/microsoft/Web-Dev-For-beginners.svg?style=social&label=Fork)](https://GitHub.com/microsoft/Web-Dev-For-Beginners/fork) +2. **Repository Clone गर्नुहोस्**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git` +3. [**Azure AI Foundry Discord मा सामेल हुनुहोस् र विशेषज्ञ र अन्य विकासकर्ताहरूसँग भेट्नुहोस्**](https://discord.com/invite/ByRwuEEgH4) -### 🌐 बहुभाषी समर्थन +### 🌐 बहुभाषीय समर्थन -#### GitHub Action मार्फत समर्थन गरिएको (स्वचालित र सँधै अद्यावधिक) +#### GitHub Action मार्फत समर्थित (स्वचालित र सधैं अद्यावधिक) -> **स्थानीय रूपमा क्लोन गर्न रुचाउनुहुन्छ?** + +[Arabic](../ar/README.md) | [Bengali](../bn/README.md) | [Bulgarian](../bg/README.md) | [Burmese (Myanmar)](../my/README.md) | [Chinese (Simplified)](../zh-CN/README.md) | [Chinese (Traditional, Hong Kong)](../zh-HK/README.md) | [Chinese (Traditional, Macau)](../zh-MO/README.md) | [Chinese (Traditional, Taiwan)](../zh-TW/README.md) | [Croatian](../hr/README.md) | [Czech](../cs/README.md) | [Danish](../da/README.md) | [Dutch](../nl/README.md) | [Estonian](../et/README.md) | [Finnish](../fi/README.md) | [French](../fr/README.md) | [German](../de/README.md) | [Greek](../el/README.md) | [Hebrew](../he/README.md) | [Hindi](../hi/README.md) | [Hungarian](../hu/README.md) | [Indonesian](../id/README.md) | [Italian](../it/README.md) | [Japanese](../ja/README.md) | [Kannada](../kn/README.md) | [Korean](../ko/README.md) | [Lithuanian](../lt/README.md) | [Malay](../ms/README.md) | [Malayalam](../ml/README.md) | [Marathi](../mr/README.md) | [Nepali](./README.md) | [Nigerian Pidgin](../pcm/README.md) | [Norwegian](../no/README.md) | [Persian (Farsi)](../fa/README.md) | [Polish](../pl/README.md) | [Portuguese (Brazil)](../pt-BR/README.md) | [Portuguese (Portugal)](../pt-PT/README.md) | [Punjabi (Gurmukhi)](../pa/README.md) | [Romanian](../ro/README.md) | [Russian](../ru/README.md) | [Serbian (Cyrillic)](../sr/README.md) | [Slovak](../sk/README.md) | [Slovenian](../sl/README.md) | [Spanish](../es/README.md) | [Swahili](../sw/README.md) | [Swedish](../sv/README.md) | [Tagalog (Filipino)](../tl/README.md) | [Tamil](../ta/README.md) | [Telugu](../te/README.md) | [Thai](../th/README.md) | [Turkish](../tr/README.md) | [Ukrainian](../uk/README.md) | [Urdu](../ur/README.md) | [Vietnamese](../vi/README.md) -> यो रेपोजिटोरीमा ५०+ भाषाका अनुवादहरू समावेश गरिएको छ जसले डाउनलोड आकार उल्लेखनीय रूपमा बढाउँछ। अनुवादहरू बिना क्लोन गर्न, sparse checkout प्रयोग गर्नुहोस्: +> **स्थानीय रूपमा क्लोन गर्न प्राथमिकता दिनुहुन्छ?** +> +> यस repository मा ५०+ भाषा अनुवादहरू छन् जुन डाउनलोड आकार धेरै बढाउँछ। अनुवादहरू बिना क्लोन गर्न sparse checkout प्रयोग गर्नुहोस्: +> +> **Bash / macOS / Linux:** > ```bash > git clone --filter=blob:none --sparse https://github.com/microsoft/Web-Dev-For-Beginners.git > cd Web-Dev-For-Beginners > git sparse-checkout set --no-cone '/*' '!translations' '!translated_images' > ``` -> यसले तपाईंलाई कोर्स पूरा गर्न आवश्यक सबै सामग्री छिटो डाउनलोड गर्ने सुविधा दिन्छ। +> +> **CMD (Windows):** +> ```cmd +> git clone --filter=blob:none --sparse https://github.com/microsoft/Web-Dev-For-Beginners.git +> cd Web-Dev-For-Beginners +> git sparse-checkout set --no-cone "/*" "!translations" "!translated_images" +> ``` +> +> यसले तपाईंलाई पाठ्यक्रम पूरा गर्न आवश्यक सबै कुरा छिटो डाउनलोड गराउँछ। + -**यदि थप अनुवाद भाषाहरू समर्थन चाहनुहुन्छ भने, ती [यहाँ](https://github.com/Azure/co-op-translator/blob/main/getting_started/supported-languages.md) सूचीबद्ध छन्** +**यदि तपाईं थप अनुवाद भाषाहरू चाहानुहुन्छ भने ती यहाँ सूचीबद्ध छन् [यहाँ](https://github.com/Azure/co-op-translator/blob/main/getting_started/supported-languages.md)** -[![Visual Studio Code मा खोल्नुहोस्](https://img.shields.io/static/v1?logo=visualstudiocode&label=&message=Visual%20Studio%20Code%20मा%20खोल्नुहोस्&labelColor=2c2c32&color=007acc&logoColor=007acc)](https://open.vscode.dev/microsoft/Web-Dev-For-Beginners) +[![Open in Visual Studio Code](https://img.shields.io/static/v1?logo=visualstudiocode&label=&message=Open%20in%20Visual%20Studio%20Code&labelColor=2c2c32&color=007acc&logoColor=007acc)](https://open.vscode.dev/microsoft/Web-Dev-For-Beginners) -#### 🧑‍🎓 _के तपाईं विद्यार्थी हुनुहुन्छ?_ +#### 🧑‍🎓 _तपाईं विद्यार्थी हो?_ -[**विद्यार्थी हब पृष्ठ**](https://docs.microsoft.com/learn/student-hub/?WT.mc_id=academic-77807-sagibbon) भ्रमण गर्नुहोस् जहाँ तपाईंले शुरुवाती स्रोतहरू, विद्यार्थी प्याकहरू र निशुल्क प्रमाणपत्र भौचर प्राप्त गर्ने तरिकाहरू पाउनुहुनेछ। यो पृष्ठ तपाईंले समय-समयमा हेर्दै जानुपर्ने हो किनकि हामी प्रत्येक महिना सामग्री अद्यावधिक गर्छौं। +[**विद्यार्थी हब पृष्ठ**](https://docs.microsoft.com/learn/student-hub/?WT.mc_id=academic-77807-sagibbon) भ्रमण गर्नुहोस् जहाँ तपाईंले शुरुवातीहरूको लागि स्रोतहरू, विद्यार्थी प्याकहरू र निशुल्क प्रमाणपत्र भौचर कसरी पाउने तरिकाहरू पाउनुहुनेछ। यो पृष्ठ तपाईंले बुकमार्क गर्नु पर्ने पृष्ठ हो र हामी मासिक रूपमा सामग्री परिवर्तन गर्दा समय समयमा जाँच गर्नुहोस्। -### 📣 घोषणा - नयाँ GitHub Copilot Agent मोड चुनौतीहरू पूरा गर्न! +### 📣 घोषणा - नयाँ GitHub Copilot Agent मोड चुनौतीहरू पूरा गर्नुहोस्! -नयाँ चुनौती थपिएको छ, धेरै अध्यायहरूमा "GitHub Copilot Agent Challenge 🚀" खोज्नुहोस्। यो तपाईंलाई GitHub Copilot र Agent मोड प्रयोग गरेर पूरा गर्न नयाँ चुनौती हो। यदि अहिलेसम्म Agent मोड प्रयोग गर्नुभएको छैन भने, यसले मात्र टेक्स्ट सिर्जना गर्ने होइन, फाइलहरू सिर्जना र सम्पादन गर्ने, कमाण्डहरू चलाउने लगायतका कामहरू गर्न सक्छ। +नयाँ चुनौती थपियो, धेरै अध्यायहरूमा "GitHub Copilot Agent Challenge 🚀" खोज्नुहोस्। यो GitHub Copilot र Agent मोडको प्रयोग गरेर तपाईंले पूरा गर्न सक्ने नयाँ चुनौती हो। यदि तपाईंले पहिले Agent मोड प्रयोग गर्नुभएन भने यो केवल पाठ बनाउने मात्र नभई फाइलहरू सिर्जना गर्न, सम्पादन गर्न, आदेशहरू चलाउन र अझ धेरै गर्न सक्षम छ। -### 📣 घोषणा - _Generative AI प्रयोग गरेर नयाँ परियोजना निर्माण_ +### 📣 घोषणा - _Generative AI प्रयोग गरेर नयाँ परियोजना बनाउने_ -नयाँ AI सहायक परियोजना थपिएको छ, जाँच गर्नुहोस् [परियोजना](./9-chat-project/README.md) +नयाँ AI सहायक परियोजना थपियो, यहाँ हेरौं [परियोजना](./9-chat-project/README.md) -### 📣 घोषणा - _Generative AI का लागि नयाँ पाठ्यक्रम_ हालै रिलिज गरिएको छ +### 📣 घोषणा - _Generative AI को लागि नयाँ पाठ्यक्रम_ JavaScript मा जारी भएको छ -हामीले नयाँ Generative AI पाठ्यक्रम जारी गरेका छौं! +हाम्रो नयाँ Generative AI पाठ्यक्रम नछुटाउनुहोस्! -सुरु गर्न [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) भ्रमण गर्नुहोस्! +सुरु गर्न जानुहोस् [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) ![Background](../../translated_images/ne/background.148a8d43afde5730.webp) -- आधारहरूदेखि RAG सम्म सबै विषयहरू समेटिएका पाठहरू। -- GenAI र हाम्रो साथी एप प्रयोग गरेर ऐतिहासिक पात्रहरूसँग अन्तरक्रिया गर्नुहोस्। -- रमाइलो र आकर्षक कथा, तपाईं समयको यात्रा गर्दै हुनुहुनेछ! +- आधारभूतदेखि RAG सम्म सबै विषयहरू समेटिएको पाठहरू। +- GenAI र हाम्रो साथीसँग ऐतिहासिक पात्रहरूसँग अन्तरक्रिया गर्नुहोस्। +- रमाईलो र रोचक कथावाचन, तपाईं समय यात्रा गर्दै हुनुहुन्छ! ![character](../../translated_images/ne/character.5c0dd8e067ffd693.webp) -प्रत्येक पाठमा पूरा गर्नको लागि कार्य, ज्ञान जाँच र चुनौती समावेश छ जसले तपाईंलाई यी विषयहरूमा मार्गदर्शन गर्दछ: -- प्रॉम्प्टिङ र प्रॉम्प्ट इन्जिनियरिङ -- टेक्स्ट र छवि एप निर्माण -- खोज एपहरू +हरेक पाठसँग एउटा कार्य पूरा गर्ने, ज्ञान जाँच्ने र चुनौती समावेश छ जसले तपाईंलाई यी विषयहरूमा मार्गदर्शन गर्छ: +- Prompting र prompt engineering +- पाठ र छवि एप् उत्पादन +- खोजी एप्लिकेसनहरू -सुरु गर्न [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) भ्रमण गर्नुहोस्! +सुरु गर्न जानुहोस् [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) ## 🌱 सुरु गर्ने तरिका -> **शिक्षकहरू**, हामीले [यस पाठ्यक्रम प्रयोग गर्ने केही सुझावहरू](for-teachers.md) समावेश गरेका छौं। कृपया तपाईंको प्रतिक्रिया [हाम्रो छलफल फोरम](https://github.com/microsoft/Web-Dev-For-Beginners/discussions/categories/teacher-corner) मा दिनुहोस्! +> **शिक्षकहरू**, हामीसँग [केही सुझावहरू](for-teachers.md) छन् यस पाठ्यक्रम कसरी प्रयोग गर्ने भनेर। कृपया हाम्रो सुझावहरूमा प्रतिक्रिया दिनुहोस् [हाम्रो छलफल फोरममा](https://github.com/microsoft/Web-Dev-For-Beginners/discussions/categories/teacher-corner)! -**[शिक्षार्थीहरू](https://aka.ms/student-page/?WT.mc_id=academic-77807-sagibbon)**, प्रत्येक पाठको लागि, प्रि-लेक्चर क्विजसँग सुरु गर्नुहोस् र त्यसपछि लेक्चर सामग्री पढ्नुस्, विभिन्न गतिविधिहरू पूरा गर्नुस् र पोष्ट-लेक्चर क्विजमा आफ्नो बुझाइ जाँच गर्नुहोस्। +**[शिक्षार्थीहरू](https://aka.ms/student-page/?WT.mc_id=academic-77807-sagibbon)**, प्रत्येक पाठका लागि, प्रि-लेक्चर क्विजबाट सुरु गर्नुहोस् र त्यसपछि लेक्चर सामग्री पढ्नुहोस्, विभिन्न गतिविधिहरू पूरा गर्नुहोस् र पोस्ट-लेक्चर क्विजसँग आफ्नो बुझाइ जाँच्नुहोस्। -आफ्नो सिकाइ अनुभव सुधार गर्न, सहकर्मीहरूसँग मिलेर परियोजनाहरूमा काम गर्नुहोस्! छलफलहरू हाम्रो [ छलफल फोरम](https://github.com/microsoft/Web-Dev-For-Beginners/discussions) मा प्रोत्साहित गरिन्छ जहाँ हाम्रो मोडरेटर टिम तपाईंका प्रश्नहरूको उत्तर दिन उपलब्ध हुनेछ। +तपाईंको सिकाइ अनुभवलाई बढावा दिनका लागि, आफ्नो सहपाठीहरूसँग जोडिएर परियोजनाहरूमा सँगै काम गर्नुहोस्! छलफलहरू हाम्रो [चर्चा फोरम](https://github.com/microsoft/Web-Dev-For-Beginners/discussions) मा प्रोत्साहित गरिन्छ जहाँ हाम्रो मोडरेटर टोलीले तपाईंको प्रश्नहरूको उत्तर दिन उपलब्ध हुनेछ। -तपाईंको शिक्षालाई थप मजबूत बनाउन, हामी अत्यन्त रूपले अतिरिक्त अध्ययन सामग्रीका लागि [Microsoft Learn](https://learn.microsoft.com/users/wirelesslife/collections/p1ddcy5jwy0jkm?WT.mc_id=academic-77807-sagibbon) अन्वेषण गर्न सिफारिस गर्छौं। +आफ्नो शिक्षालाई अझ अघि बढाउन, हामी अत्यधिक सिफारिस गर्दछौं कि तपाईंले [Microsoft Learn](https://learn.microsoft.com/users/wirelesslife/collections/p1ddcy5jwy0jkm?WT.mc_id=academic-77807-sagibbon) अतिरिक्त अध्ययन सामग्रीहरूको लागि अन्वेषण गर्नुहोस्। -### 📋 आफ्नो वातावरण सेटअप गर्ने तरिका +### 📋 आफ्नो वातावरण सेटअप गर्नुहोस् -यस पाठ्यक्रमसँग विकास वातावरण तयार छ! सुरु गर्दा तपाईं यसलाई [Codespace](https://github.com/features/codespaces/) (ब्राउजरमा आधारित, कुनै स्थापना आवश्यक छैन) मा वा तपाईंको कम्प्युटरमा स्थानीय रूपमा [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) जस्तो टेक्स्ट एडिटर प्रयोग गरेर चलाउन सक्नुहुन्छ। +यस पाठ्यक्रमसँग विकासको वातावरण तयार छ! सुरु गर्दा, तपाईं [Codespace](https://github.com/features/codespaces/) (_ब्राउजर आधारित, कुनै इन्स्टल आवश्यकता छैन वातावरण_), वा तपाईंको कम्प्युटरमा स्थानीय रूपमा [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) जस्ता टेक्स्ट सम्पादक प्रयोग गरेर पाठ्यक्रम चलाउन सक्नुहुन्छ। -#### आफ्नो रेपोजिटोरी सिर्जना गर्नुहोस् -आफ्नो काम सजिलै सुरक्षित गर्नको लागि, आफ्नो GitHub खातामा यो रेपोजिटोरीको एउटा प्रतिलिपि बनाउनु सिफारिस गरिन्छ। तपाईँले पृष्ठको माथि रहेको **Use this template** बटन थिचेर यो गर्न सक्नुहुन्छ। यसले सहपाठ्यक्रमको प्रतिलिपि सहित नयाँ रेपोजिटोरी बनाउनेछ। +#### आफ्नो repository सिर्जना गर्नुहोस् +आफ्नो काम सजिलै सुरक्षित गर्न, तपाईंले यो repository को आफ्नै प्रति सिर्जना गर्ने सिफारिस गरिन्छ। तपाईं यसलाई पृष्ठको माथिल्लो भागमा रहेको **Use this template** बटनमा क्लिक गरेर गर्न सक्नुहुन्छ। यसले Github खातामा पाठ्यक्रमको प्रति भएको नयाँ repository सिर्जना गर्नेछ। -यी चरणहरू अनुसरण गर्नुहोस्: -1. **रेपोजिटोरी फोर्क गर्नुहोस्**: पृष्ठको माथि-दायाँ कुनामा रहेको "Fork" बटन थिच्नुहोस्। -2. **रेपोजिटोरी क्लोन गर्नुहोस्**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git` +यी चरणहरू पालना गर्नुहोस्: +1. **Repository Fork गर्नुहोस्**: यस पृष्ठको माथि-दायाँ कुनामा रहेको "Fork" बटनमा क्लिक गर्नुहोस्। +2. **Repository Clone गर्नुहोस्**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git` -#### Codespace मा पाठ्यक्रम चलाउने तरिका +#### Codespace मा पाठ्यक्रम चलाउनुहोस् -तपाईंले सिर्जना गरेको आफ्नो रेपोजिटोरीमा **Code** बटन थिच्नुहोस् र **Open with Codespaces** चयन गर्नुहोस्। यसले तपाईंको लागि नयाँ Codespace सिर्जना गर्नेछ। +तपाईंले सिर्जना गरेको आफ्नो repository प्रतिमा, **Code** बटन थिच्नुहोस् र **Open with Codespaces** चयन गर्नुहोस्। यसले तपाईंलाई कार्य गर्न नयाँ Codespace सिर्जना गर्नेछ। ![Codespace](../../translated_images/ne/createcodespace.0238bbf4d7a8d955.webp) -#### आफ्नै कम्प्युटरमा पाठ्यक्रम चलाउने तरिका +#### आफ्नो कम्प्युटरमा स्थानीय रूपमा पाठ्यक्रम चलाउनुहोस् -यस पाठ्यक्रमलाई स्थानीय रूपमा चलाउन, तपाईंलाई एउटा टेक्ट्स एडिटर, ब्राउजर, र कमाण्ड लाइन उपकरण चाहिन्छ। हाम्रो पहिलो पाठ, [Introduction to Programming Languages and Tools of the Trade](../../1-getting-started-lessons/1-intro-to-programming-languages), यी उपकरणहरूको विभिन्न विकल्पहरू मार्फत तपाईंलाई मार्गदर्शन गर्नेछ ताकि तपाईंलाई सबैभन्दा उपयुक्त छान्न सकियोस्। +तपाईंको कम्प्युटरमा यस पाठ्यक्रमलाई स्थानीय रूपमा चलाउन, तपाईलाई एक टेक्स्ट सम्पादक, एउटा ब्राउजर, र कमाण्ड लाइन उपकरण आवश्यक पर्नेछ। हाम्रो पहिलो पाठ, [प्रोग्रामिङ भाषा र उपकरणहरूको परिचय](../../1-getting-started-lessons/1-intro-to-programming-languages), तपाईंलाई सबै उपकरणहरूको विभिन्न विकल्पहरूमा हिँडेर आफूलाई उपयुक्त छानेर छनोट गर्न मद्दत गर्नेछ। -हामी सिफारिस गर्छौं कि तपाईं [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) प्रयोग गर्नुहोस्, जसमा इनबिल्ट [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) पनि छ। तपाईं Visual Studio Code यहाँबाट डाउनलोड गर्न सक्नुहुन्छ: [यहाँ](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon)। - -1. आफ्नो रेपोजिटोरीलाई आफ्नै कम्प्युटरमा क्लोन गर्नुहोस्। यो गर्नको लागि **Code** बटन थिचेर URL कपी गर्नुहोस्: +हाम्रो सिफारिस हुन्छ कि तपाईं [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) लाई आफ्नो सम्पादकको रूपमा प्रयोग गर्नुहोस्, जसमा [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) पनि समावेश छ। तपाईं Visual Studio Code यो ठाउँबाट डाउनलोड गर्न सक्नुहुन्छ [यहाँ](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon)। +1. आफ्नो रिपोजिटरी आफ्नो कम्प्युटरमा क्लोन गर्नुहोस्। तपाईंले यो **Code** बटनमा क्लिक गरेर र URL कपी गरेर गर्न सक्नुहुन्छ: [CodeSpace](./images/createcodespace.png) - त्यसपछि, भित्र [टर्मिनल](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) खोल्नुहोस् [भिजुअल स्टुडियो कोड](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) र तलको आदेश चलाउनुहोस्, `` सँग तपाईले भर्खरै कपी गर्नुभयो URL प्रतिस्थापन गर्दै: + + त्यसपछि, [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) भित्र [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) खोल्नुहोस् र तलको आदेश चलाउनुहोस्, जहाँ `` साटासाट तपाईंले कपी गरेको URL राख्नुहोस्: ```bash git clone ``` -2. भिजुअल स्टुडियो कोडमा फोल्डर खोल्नुहोस्। तपाईं यो **File** > **Open Folder** क्लिक गरेर र भर्खरै क्लोन गरेको फोल्डर चयन गरेर गर्न सक्नुहुन्छ। +2. Visual Studio Code मा फोल्डर खोल्नुहोस्। तपाईंले यो **File** > **Open Folder** क्लिक गरेर र हालै क्लोन गरेको फोल्डर चयन गरेर गर्न सक्नुहुन्छ। - -> सिफारिस गरिएको भिजुअल स्टुडियो कोड विस्तारहरू: +> सिफारिस गरिएको Visual Studio Code एक्सटेन्सनहरू: > -> * [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer&WT.mc_id=academic-77807-sagibbon) - भिजुअल स्टुडियो कोड भित्र HTML पृष्ठहरूको पूर्वावलोकन गर्न -> * [Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot&WT.mc_id=academic-77807-sagibbon) - तपाईंलाई छिटो कोड लेख्न मद्दत गर्न +> * [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer&WT.mc_id=academic-77807-sagibbon) - Visual Studio Code भित्र HTML पानाहरू पूर्वावलोकन गर्न +> * [Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot&WT.mc_id=academic-77807-sagibbon) - तपाईलाई छिटो कोड लेख्न मद्दत गर्ने -## 📂 प्रत्येक पाठमा समावेश छन्: +## 📂 प्रत्येक पाठमा समावेश छ: -- वैकल्पिक स्केचनोट +- वैकल्पिक स्केच नोट - वैकल्पिक पूरक भिडियो -- पूर्वपाठ वार्मअप क्विज -- लिखित पाठ -- परियोजना-आधारित पाठहरूका लागि, परियोजना बनाउन चरण-द्वारा-चरण मार्गदर्शकहरू +- पाठअघि तातोप तापी क्वीज +- लेखिएको पाठ +- प्रोजेक्ट आधारित पाठहरूको लागि, प्रोजेक्ट कसरी बनाउने भन्ने चरण-द्वारा-चरण मार्गदर्शनहरू - ज्ञान जाँचहरू -- चुनौती -- पूरक पठन -- असाइन्मेन्ट -- [पोस्ट-पाठ क्विज](https://ff-quizzes.netlify.app/web/) +- एउटा चुनौती +- पूरक पढाइ +- असाइनमेन्ट +- [पाठपछि क्वीज](https://ff-quizzes.netlify.app/web/) -> **क्विजहरू बारे नोट**: सबै क्विजहरू Quiz-app फोल्डरमा छन्, ४८ कुल क्विजहरू प्रत्येक तीन प्रश्नका साथ। तपाई यहाँबाट उपलब्ध छन् [यहाँ](https://ff-quizzes.netlify.app/web/); क्विज एप स्थानीय रूपमा चलाउन सकिन्छ वा Azure मा परिनियोजन गर्न सकिन्छ; `quiz-app` फोल्डरमा निर्देशनहरू पालन गर्नुहोस्। +> **क्वीजहरूबारे सूचना**: सबै क्वीजहरू Quiz-app फोल्डरमा रहेका छन्, कुल ४८ क्वीजहरू हरेकमा तीन प्रश्नहरू हुन्छन्। तिनीहरू [यहाँ](https://ff-quizzes.netlify.app/web/) उपलब्ध छन्। क्वीज एप स्थानीय रूपमा चलाउन वा Azure मा डिप्लोय गर्न सकिन्छ; `quiz-app` फोल्डरमा निर्देशहरू पछ्याउनुहोस्। ## 🗃️ पाठहरू -| | परियोजनाको नाम | सिकाइ जाने अवधारणाहरू | सिकाइ उद्देश्यहरू | सम्बद्ध पाठ | लेखक | -| :-: | :--------------------------------------------------------: | :--------------------------------------------------------------------------: | --------------------------------------------------------------------------------------------------------------------------------- | :----------------------------------------------------------------------------------------------------------------------------: | :-------------------: | -| 01 | सुरु गर्दै | प्रोग्रामिङ परिचय र व्यापारका उपकरणहरू | प्रायः प्रोग्रामिङ भाषाहरूको आधारभूत सिद्धान्तहरू र पेशेवर विकासकर्ताहरूलाई मद्दत गर्ने सफ्टवेयर बारे जान्नुहोस् | [प्रोग्रामिङ भाषाहरू र उपकरणहरूको परिचय](./1-getting-started-lessons/1-intro-to-programming-languages/README.md) | Jasmine | -| 02 | सुरु गर्दै | GitHub का आधार, टिमसँग काम गर्ने समावेश | तपाईंको परियोजनामा GitHub कसरी प्रयोग गर्ने, कोड बेसमा अरूसँग कसरी सहकार्य गर्ने | [GitHub परिचय](./1-getting-started-lessons/2-github-basics/README.md) | Floor | -| 03 | सुरु गर्दै | पहुँचयोग्यता | वेब पहुँचयोग्यताको आधारभूत कुरा सिक्नुहोस् | [पहुँचयोग्यता आधारभूत कुरा](./1-getting-started-lessons/3-accessibility/README.md) | Christopher | -| 04 | JS आधारहरू | Javascript डाटा प्रकारहरू | Javascript डाटा प्रकारहरूको आधारभूत कुरा | [डाटा प्रकारहरू](./2-js-basics/1-data-types/README.md) | Jasmine | -| 05 | JS आधारहरू | फङ्सनहरू र मेथडहरू | अनुप्रयोगको लॉजिक प्रवाह व्यवस्थापन गर्न फङ्सन र मेथडहरूबारे जान्नुहोस् | [फङ्सनहरू र मेथडहरू](./2-js-basics/2-functions-methods/README.md) | Jasmine र Christopher | -| 06 | JS आधारहरू | JS संग निर्णयहरू गर्ने | निर्णय-निर्माण विधिहरू प्रयोग गरी तपाईंको कोडमा शर्तहरू कसरी सिर्जना गर्ने जान्नुहोस् | [निर्णय लिनु](./2-js-basics/3-making-decisions/README.md) | Jasmine | -| 07 | JS आधारहरू | एरेहरू र लूपहरू | Javascript मा एरेहरू र लूपमार्फत डाटासँग काम गर्नुहोस् | [एरेहरू र लूपहरू](./2-js-basics/4-arrays-loops/README.md) | Jasmine | -| 08 | [Terrarium](./3-terrarium/solution/README.md) | HTML अभ्यासमा | अनलाइन टेरारियम बनाउन HTML निर्माण गर्नुहोस्, लेआउट निर्माणमा ध्यान दिँदै | [HTML परिचय](./3-terrarium/1-intro-to-html/README.md) | Jen | -| 09 | [Terrarium](./3-terrarium/solution/README.md) | CSS अभ्यासमा | अनलाइन टेरारियमको शैली बनाउन CSS निर्माण गर्नुहोस्, CSS का आधारभूत कुरा समावेश गर्दै पृष्ठलाई प्रतिक्रिया दिने बनाउने | [CSS परिचय](./3-terrarium/2-intro-to-css/README.md) | Jen | -| 10 | [Terrarium](./3-terrarium/solution/README.md) | Javascript क्लोजरहरू, DOM हेरफेर | टेरारियमलाई ड्र्याग/ड्रप इन्टरफेस बनाउन Javascript तयार पार्नुहोस्, क्लोजर र DOM हेरफेरमा ध्यान केन्द्रित गर्दै | [Javascript क्लोजरहरू, DOM हेरफेर](./3-terrarium/3-intro-to-DOM-and-closures/README.md) | Jen | -| 11 | [Typing Game](./4-typing-game/solution/README.md) | टाइपिंग खेल बनाउनुहोस् | तपाईंको Javascript अनुप्रयोगको लॉजिक चलाउन किबोर्ड इभेन्टहरू प्रयोग कसरी गर्ने जान्नुहोस् | [इभेन्ट-चलित प्रोग्रामिङ](./4-typing-game/typing-game/README.md) | Christopher | -| 12 | [Green Browser Extension](./5-browser-extension/solution/README.md) | ब्राउजरहरूसँग काम गर्दै | ब्राउजरले कसरी काम गर्छ, यसको इतिहास, र ब्राउजर एक्सटेन्सनका पहिलो तत्वहरू कसरी तयार गर्ने जान्नुहोस् | [ब्राउजरहरूबारे](./5-browser-extension/1-about-browsers/README.md) | Jen | -| 13 | [Green Browser Extension](./5-browser-extension/solution/README.md) | फारम बनाउने, API कल गर्ने र स्थानीय भण्डारणमा चरहरू भण्डारण गर्ने | तपाईंको ब्राउजर एक्सटेन्सनका Javascript तत्वहरू निर्माण गर्नुहोस्, स्थानीय भण्डारणमा राखिएका चरहरू प्रयोग गरी API कल गर्न | [API, फारमहरू, र स्थानीय भण्डारण](./5-browser-extension/2-forms-browsers-local-storage/README.md) | Jen | -| 14 | [Green Browser Extension](./5-browser-extension/solution/README.md) | ब्राउजरमा ब्याकग्राउण्ड प्रक्रियाहरू, वेब प्रदर्शन | एक्सटेन्सनको आइकन व्यवस्थापन गर्न ब्राउजरको ब्याकग्राउण्ड प्रक्रियाहरू प्रयोग गर्नुहोस्; वेब प्रदर्शन र केही अनुकूलनहरू बारे जान्नुहोस् | [ब्याकग्राउण्ड कार्य र प्रदर्शन](./5-browser-extension/3-background-tasks-and-performance/README.md) | Jen | -| 15 | [Space Game](./6-space-game/solution/README.md) | Javascript सँग अझ उन्नत खेल विकास | वर्गहरू र सङ्गठन दुवै प्रयोग गरेर इनहेरिटेन्स र पब/सब् ढाँचाबारे जान्नुहोस्, खेल निर्माणको तयारीका लागि | [उन्नत खेल विकास परिचय](./6-space-game/1-introduction/README.md) | Chris | -| 16 | [Space Game](./6-space-game/solution/README.md) | क्यानभासमा चित्रण | स्क्रिनमा तत्वहरू तान्न प्रयोग हुने क्यानभास एपीआईबारे जान्नुहोस् | [क्यानभासमा चित्रण](./6-space-game/2-drawing-to-canvas/README.md) | Chris | -| 17 | [Space Game](./6-space-game/solution/README.md) | स्क्रिनमा तत्वहरू सर्नु | कार्टेसियन निर्देशांक र क्यानभास एपीआई प्रयोग गरी तत्वहरू कसरी गति लिन सक्छन् पत्ता लगाउनुहोस् | [तत्वहरू सार्न](./6-space-game/3-moving-elements-around/README.md) | Chris | -| 18 | [Space Game](./6-space-game/solution/README.md) | टक्कर पत्ता लगाउने | प्रमुख थिच्ने प्रयोग गरी तत्वहरूलाई टक्कर गराउने र एकअर्कामा प्रतिक्रिया दिने बनाउनुहोस् र खेलको प्रदर्शन सुनिश्चित गर्न कूलडाउन फङ्सन प्रदान गर्नुहोस् | [टक्कर पत्ता लगाउने](./6-space-game/4-collision-detection/README.md) | Chris | -| 19 | [Space Game](./6-space-game/solution/README.md) | स्कोर राख्ने | खेलको स्थिति र प्रदर्शनमा आधारित गणितीय गणना गर्नुहोस् | [स्कोर राख्ने](./6-space-game/5-keeping-score/README.md) | Chris | -| 20 | [Space Game](./6-space-game/solution/README.md) | खेल अन्त्य र पुनः सुरु गर्ने | खेल अन्त्य र पुनः सुरु गर्ने, संसाधनहरू सफा गर्ने र चर मानहरू रिसेट गर्ने बारे जान्नुहोस् | [अन्त्य सर्त](./6-space-game/6-end-condition/README.md) | Chris | -| 21 | [Banking App](./7-bank-project/solution/README.md) | वेब अनुप्रयोगमा HTML टेम्प्लेट र मार्गहरू | मल्टिपेज वेबसाइटको वास्तुकला तयार गर्न मार्गनिर्देशन र HTML टेम्प्लेटहरू कसरी सिर्जना गर्ने जान्नुहोस् | [HTML टेम्प्लेट र मार्गहरू](./7-bank-project/1-template-route/README.md) | Yohan | -| 22 | [Banking App](./7-bank-project/solution/README.md) | लगइन र दर्ता फारम बनाउने | फारमहरू बनाउन र प्रमाणिकरण प्रक्रिया कसरी गर्ने जान्नुहोस् | [फारमहरू](./7-bank-project/2-forms/README.md) | Yohan | -| 23 | [Banking App](./7-bank-project/solution/README.md) | डाटा प्राप्त र प्रयोग गर्ने तरिकाहरू | तपाईंको अनुप्रयोगमा डाटा कसरी आउँछ र जान्छ, कसरि प्राप्त गर्ने, भण्डारण गर्ने, र नष्ट गर्ने जान्नुहोस् | [डाटा](./7-bank-project/3-data/README.md) | Yohan | -| 24 | [Banking App](./7-bank-project/solution/README.md) | राज्य व्यवस्थापनका सिद्धान्तहरू | तपाईंको अनुप्रयोगले कसरी राज्य राख्छ र यसलाई प्रोग्रामिङमार्फत कसरी व्यवस्थापन गर्ने जान्नुहोस् | [राज्य व्यवस्थापन](./7-bank-project/4-state-management/README.md) | Yohan | -| 25 | [Browser/VScode Code](../../8-code-editor) | VScode सँग काम गर्दै | कोड सम्पादक प्रयोग कसरी गर्ने जान्नुहोस् | [VScode कोड सम्पादक प्रयोग](./8-code-editor/1-using-a-code-editor/README.md) | Chris | -| 26 | [AI Assistants](./9-chat-project/README.md) | AI सँग काम गर्दै | आफ्नै AI सहायक कसरी बनाउने जान्नुहोस् | [AI सहायक परियोजना](./9-chat-project/README.md) | Chris | - -## 🏫 शिक्षाशास्त्र - -हाम्रो पाठ्यक्रम दुई प्रमुख शिक्षाशास्त्रीय सिद्वान्तहरूलाई ध्यानमा राखेर डिजाइन गरिएको छ: -* परियोजना-आधारित सिकाइ -* बारम्बार क्विजहरू - -कार्यक्रमले Javascript, HTML, र CSS का आधारभूत कुरा सिकाउँछ, साथै आजका वेब विकासकर्ताहरूले उपयोग गर्ने नवीनतम उपकरण र प्रविधिहरू पनि। विद्यार्थीहरूले टाइपिंग खेल, भर्चुअल टेरारियम, वातावरणमैत्री ब्राउजर एक्सटेन्सन, स्पेस-इनभेडर-शैलीको खेल, र व्यवसायहरूको लागि बैंकिङ्ग अनुप्रयोग बनाएर व्यावहारिक अनुभव गर्न पाउनेछन्। सिरीजको अन्त्यसम्म, विद्यार्थीहरूले वेब विकासको एक दृढ समझ पाउनेछन्। - -> 🎓 तपाईं यस पाठ्यक्रमको पहिलो केही पाठहरूलाई Microsoft Learn मा [Learn Path](https://docs.microsoft.com/learn/paths/web-development-101/?WT.mc_id=academic-77807-sagibbon) को रूपमा लिन सक्नुहुन्छ! - -सामग्री परियोजनाहरूसँग मेल खान सुनिश्चित गर्दा, प्रक्रिया विद्यार्थीहरूका लागि अझ रोचक हुन्छ र अवधारणाहरूको सम्झनामा सुधार हुन्छ। हामीले केही शुरुवाती पाठहरू Javascript आधारहरूमा लेखेका छौं अवधारणाहरू परिचय गराउन, जुन "[Beginners Series to: JavaScript](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript/?WT.mc_id=academic-77807-sagibbon)" भिडियो शृंखलाबाट एक भिडियोसँग जोडिएको छ, जसका केही लेखकहरूले यस पाठ्यक्रममा योगदान दिएका छन्। - -थप रूपमा, कक्षाको लागि पहिले एक कम जोखिम क्विजले विद्यार्थीहरूको विषय सिकाइमा चाहना सेट गर्दछ, जबकि कक्षापछि दोस्रो क्विजले थप सम्झना सुनिश्चित गर्दछ। यो पाठ्यक्रम लचिलो र रमाइलो बनाउन डिजाइन गरिएको छ र पूरै वा भागमा लिन सकिन्छ। परियोजनाहरू सानाबाट सुरु हुन्छन् र १२ हप्ता चक्रको अन्त्यमा क्रमशः जटिल हुँदै जान्छन्। - -हामीले सचेत रूपमा Javascript फ्रेमवर्कहरू प्रस्तुत नगरेका छौं किनकि फ्रेमवर्क स्वीकार्नुभन्दा पहिले वेब विकासकर्ताका लागि आवश्यक आधारभूत सीपहरूमा ध्यान केन्द्रित गर्नको लागि, यस पाठ्यक्रम पूरा गर्नको राम्रो अर्को चरण भनेको अर्को भिडियो संग्रहबाट Node.js सिक्नु हो: "[Beginner Series to: Node.js](https://channel9.msdn.com/Series/Beginners-Series-to-Nodejs/?WT.mc_id=academic-77807-sagibbon)"। - -> हाम्रो [व्यवहार संहिता](CODE_OF_CONDUCT.md) र [योगदान गर्ने तरिका](CONTRIBUTING.md) दिशानिर्देशहरू भेट्नुहोस्। हामी तपाईंको रचनात्मक प्रतिक्रिया स्वागत गर्दछौं! +| | प्रोजेक्ट नाम | सिकाइका अवधारणाहरू | सिकाइका उद्देश्यहरू | लिंक गरिएको पाठ | लेखक | +| :-: | :------------------------------------------------------: | :--------------------------------------------------------------------: | ----------------------------------------------------------------------------------------------------------------------------------- | :----------------------------------------------------------------------------------------------------------------------------: | :---------------------: | +| 01 | सुरूवात गर्दै | प्रोग्रामिङ परिचय र उपकरणहरू | अधिकांश प्रोग्रामिङ भाषाहरूको आधारभूत अवधारणाहरू सिक्नुहोस् र पेशेवर विकासकर्ताले आफ्नो काम गर्न प्रयोग गर्ने सफ्टवेयरको बारेमा जान्नुहोस् | [प्रोग्रामिङ भाषाहरू र उपकरणहरूको परिचय](./1-getting-started-lessons/1-intro-to-programming-languages/README.md) | Jasmine | +| 02 | सुरूवात गर्दै | GitHub को आधारभूत कुरा, टोलीसँग काम गर्नेसमेत | तपाईंको प्रोजेक्टमा GitHub कसरी प्रयोग गर्ने, र कोड बेसमा अरूसँग कसरी सहकार्य गर्ने | [GitHub परिचय](./1-getting-started-lessons/2-github-basics/README.md) | Floor | +| 03 | सुरूवात गर्दै | पहुँचयोग्यता | वेब पहुँचयोग्यताको आधारभूत कुरा सिक्नुहोस् | [पहुंचयोग्यता आधारभूत कुरा](./1-getting-started-lessons/3-accessibility/README.md) | Christopher | +| 04 | JS आधारभूत | JavaScript डेटा प्रकार | JavaScript डेटा प्रकारहरूको आधारभूत कुरा | [डेटा प्रकार](./2-js-basics/1-data-types/README.md) | Jasmine | +| 05 | JS आधारभूत | कार्यहरू र विधिहरू | आवेदनको तर्क प्रवाह व्यवस्थापन गर्न कार्यहरू र विधिहरूको बारे सिक्नुहोस् | [कार्यहरू र विधिहरू](./2-js-basics/2-functions-methods/README.md) | Jasmine र Christopher | +| 06 | JS आधारभूत | JS सँग निर्णय बनाउने | निर्णय गर्ने तरिका प्रयोग गरी तपाईंको कोडमा सर्तहरू कसरी बनाउन सिक्नुहोस् | [निर्णय बनाउने](./2-js-basics/3-making-decisions/README.md) | Jasmine | +| 07 | JS आधारभूत | एर्रेहरू र लूपहरू | JavaScript मा एर्रे र लूपहरूको प्रयोग गरी डाटासँग काम गर्नुहोस् | [एर्रे र लूपहरू](./2-js-basics/4-arrays-loops/README.md) | Jasmine | +| 08 | [Terrarium](./3-terrarium/solution/README.md) | प्रायोगमा HTML | अनलाइन टेरियम बनाउन HTML निर्माण गर्नुहोस्, लेआउट बनाउनमा केन्द्रित | [HTML परिचय](./3-terrarium/1-intro-to-html/README.md) | Jen | +| 09 | [Terrarium](./3-terrarium/solution/README.md) | प्रायोगमा CSS | अनलाइन टेरियमलाई स्टाइल दिन CSS बनाउनुहोस्, पृष्ठले प्रतिक्रिया जनाउने गरी CSS का आधारहरू सहित | [CSS परिचय](./3-terrarium/2-intro-to-css/README.md) | Jen | +| 10 | [Terrarium](./3-terrarium/solution/README.md) | JavaScript क्लोजरहरू, DOM हेरफेर | टेरियमलाई ड्र्याग/ड्रप इन्टरफेस बनाउन JavaScript लेख्नुहोस्, क्लोजर र DOM हेरफेरमा केन्द्रित | [JavaScript क्लोजरहरू, DOM हेरफेर](./3-terrarium/3-intro-to-DOM-and-closures/README.md) | Jen | +| 11 | [टाइपिङ गेम](./4-typing-game/solution/README.md) | टाइपिङ गेम बनाउने | कीबोर्ड इभेन्टहरू प्रयोग गरेर तपाईंको JavaScript अनुप्रयोगको तर्क चलाउन सिक्नुहोस् | [इभेन्ट-चालित प्रोग्रामिङ](./4-typing-game/typing-game/README.md) | Christopher | +| 12 | [हरियो ब्राउजर एक्सटेन्सन](./5-browser-extension/solution/README.md) | ब्राउजरहरूसँग काम | ब्राउजरहरू कसरी काम गर्छन्, तिनको इतिहास र ब्राउजर एक्सटेन्सनका पहिलो तत्वहरू कसरी बनाउने | [ब्राउजरहरूबारे](./5-browser-extension/1-about-browsers/README.md) | Jen | +| 13 | [हरियो ब्राउजर एक्सटेन्सन](./5-browser-extension/solution/README.md) | फारम बनाउने, API कल गर्ने र स्थानीय संग्रहमा भेरिएबल राख्ने | आफ्नो ब्राउजर एक्सटेन्सनका JavaScript तत्वहरू बनाउन, स्थानीय संग्रहमा राखिएका भेरिएबल छन् API कल गर्न | [API, फारम र स्थानीय संग्रह](./5-browser-extension/2-forms-browsers-local-storage/README.md) | Jen | +| 14 | [हरियो ब्राउजर एक्सटेन्सन](./5-browser-extension/solution/README.md) | ब्राउजरको पृष्ठभूमि प्रक्रियाहरू, वेब प्रदर्शन | एक्सटेन्सनको आइकन व्यवस्थापन गर्न ब्राउजरको पृष्ठभूमि प्रक्रियाहरू प्रयोग गर्नुहोस्; वेब प्रदर्शन र सुधार गर्न सिक्नुहोस् | [पृष्ठभूमि कार्यहरू र प्रदर्शन](./5-browser-extension/3-background-tasks-and-performance/README.md) | Jen | +| 15 | [सपेस गेम](./6-space-game/solution/README.md) | JavaScript सँग अझ उन्नत गेम विकास | Inheritance बारे क्लासहरू र Composition दुवै र Pub/Sub ढाँचाबारे सिक्नुहोस्, गेम विकासको तयारीका लागि | [उन्नत गेम विकास परिचय](./6-space-game/1-introduction/README.md) | Chris | +| 16 | [सपेस गेम](./6-space-game/solution/README.md) | क्यानभासमा चित्र बनाउने | स्क्रीनमा तन्काउन क्यानभास API को बारेमा सिक्नुहोस् | [क्यानभासमा चित्र बनाउने](./6-space-game/2-drawing-to-canvas/README.md) | Chris | +| 17 | [सपेस गेम](./6-space-game/solution/README.md) | स्क्रिनमा तत्वहरू सार्ने | तत्वहरू गति पाउन कार्टेशियन समन्वय प्रणाली र क्यानभास API प्रयोग कसरी गर्ने पत्ता लगाउनुहोस् | [तत्वहरू सार्ने](./6-space-game/3-moving-elements-around/README.md) | Chris | +| 18 | [सपेस गेम](./6-space-game/solution/README.md) | टक्कर पत्ता लगाउने | कुञ्जी थिच्नेहरू प्रयोग गरी तत्वहरू कसरी आपसमा ठोक्किन्छन् र प्रतिक्रिया दिन्छन् र प्रदर्शन सुनिश्चित गर्न कोलडाउन फंक्शन दिने | [टक्कर पत्ता लगाउने](./6-space-game/4-collision-detection/README.md) | Chris | +| 19 | [सपेस गेम](./6-space-game/solution/README.md) | स्कोर राख्ने | गेमको स्थिति र प्रदर्शन आधारमा गणितीय हिसाबकिताब गर्नुहोस् | [स्कोर राख्ने](./6-space-game/5-keeping-score/README.md) | Chris | +| 20 | [सपेस गेम](./6-space-game/solution/README.md) | गेम अन्त्य र पुनः सुरु गर्ने | गेम अन्त्य र पुनः सुरु गर्न सिक्नुहोस्, जसमा स्रोतहरू सफा गर्ने र भेरिएबल मानहरू रिसेट गर्ने पनि समावेश छ | [अन्त्य अवस्था](./6-space-game/6-end-condition/README.md) | Chris | +| 21 | [बैंकिङ एप](./7-bank-project/solution/README.md) | वेब एपमा HTML टेम्प्लेट र मार्गहरू | बहुपृष्ठ वेबसाइटको संरचना सिर्जना गर्न रुटिङ र HTML टेम्प्लेट प्रयोग कसरी गर्ने सिक्नुहोस् | [HTML टेम्प्लेट र मार्गहरू](./7-bank-project/1-template-route/README.md) | Yohan | +| 22 | [बैंकिङ एप](./7-bank-project/solution/README.md) | लग इन र दर्ता फारम बनाउने | फारम निर्माण र प्रमाणीकरण प्रक्रिया व्यवस्थापनको बारेमा जान्नुहोस् | [फारमहरू](./7-bank-project/2-forms/README.md) | Yohan | +| 23 | [बैंकिङ एप](./7-bank-project/solution/README.md) | डेटा ल्याउने र प्रयोग गर्ने तरिकाहरू | तपाईंको एपमा डेटा कसरी आउँछ र जान्छ, कसरी तानिन्छ, भण्डारण गरिन्छ र हटाइन्छ | [डेटा](./7-bank-project/3-data/README.md) | Yohan | +| 24 | [बैंकिङ एप](./7-bank-project/solution/README.md) | राज्य व्यवस्थापनका अवधारणाहरू | तपाईंको एपले कसरी राज्य सम्हाल्छ र यसलाई प्रोग्रामले कसरी व्यवस्थापन गर्ने सिक्नुहोस् | [राज्य व्यवस्थापन](./7-bank-project/4-state-management/README.md) | Yohan | +| 25 | [ब्राउजर/VScode कोड](../../8-code-editor) | VScode प्रयोग गर्ने | कोड सम्पादक कसरी प्रयोग गर्ने जान्नुहोस्| [VScode कोड सम्पादक प्रयोग](./8-code-editor/1-using-a-code-editor/README.md) | Chris | +| 26 | [AI सहायकहरू](./9-chat-project/README.md) | AI सँग काम गर्ने | आफ्नो AI सहायक कसरी बनाउने सिक्नुहोस् | [AI सहायक प्रोजेक्ट](./9-chat-project/README.md) | Chris | + +## 🏫 पठनशास्त्र + +हाम्रो पाठ्यक्रम दुई प्रमुख पठनशास्त्रीय सिद्धान्तहरूसँग डिजाइन गरिएको छ: +* प्रोजेक्ट-आधारित सिकाइ +* बारम्बार क्वीज + +कार्यक्रमले JavaScript, HTML, र CSS का आधारभूत कुराहरू सिकाउँछ, साथै आजका वेब विकासकर्ताहरूले प्रयोग गर्ने नवीनतम उपकरणहरू र प्रविधिहरू पनि। विद्यार्थीहरूले टाइपिङ गेम, भर्चुअल टेरियम, इको-मैत्री ब्राउजर एक्सटेन्सन, स्पेस-इन्वेडर शैलीको गेम, र व्यवसायहरूका लागि बैंकिङ एप जस्ता परियोजनाहरू बनाउन व्यावहारिक अनुभव प्राप्त गर्ने अवसर पाउनेछन्। श्रृंखलाको अन्त्यसम्म, विद्यार्थीहरूले वेब विकासको राम्रो समझ हासिल गर्नेछन्। + +> 🎓 तपाईं यो पाठ्यक्रमका केही पहिलो पाठहरू Microsoft Learn मा [Learn Path](https://docs.microsoft.com/learn/paths/web-development-101/?WT.mc_id=academic-77807-sagibbon) को रूपमा लिन सक्नुहुन्छ! + +सामग्री प्रोजेक्टहरूसँग मेल खाने सुनिश्चित गर्दा, प्रक्रिया विद्यार्थीहरूका लागि अझ रोचक हुन्छ र अवधारणाहरूको ज्ञान वृद्धिमा मद्दत पुग्छ। हामीले JavaScript आधारभूत कुराहरू सिकाउन धेरै प्रारम्भिक पाठहरू लेखेका छौं, जसमा "[JavaScript को लागि बिगिनर्स सिरिज](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript/?WT.mc_id=academic-77807-sagibbon)" भिडियो ट्युटोरियलहरूबाट एक भिडियो पनि समावेश छ, जसका केही लेखकहरूले यो पाठ्यक्रममा योगदान दिएका छन्। + +थप रूपमा, कक्षा सुरु हुनुअघि सजिलो क्वीजले विद्यार्थीलाई विषय सिक्न तयार पार्छ, भने कक्षा पछि दोस्रो क्वीजले अवधारणा अझ राम्रोसँग सम्झन मद्दत गर्छ। यो पाठ्यक्रम लचिलो र रमाइलो बनाउन डिजाइन गरिएको हो र पूर्ण रूपमा वा आंशिक रूपमा लिन सकिन्छ। परियोजनाहरू साना बाट सुरु भएर १२ हप्ता अवधिको अन्त्यसम्म बुझ्न कठिन हुँदै जान्छ। + +हामीले जानाजानी JavaScript फ्रेमवर्कहरू समावेश गर्नबाट बचेका छौं ताकि आधारभूत वेब विकास कौशलहरूमा केन्द्रित रहिऊस्, फ्रेमवर्क अपनाउनु अघि। यस पाठ्यक्रम पूरा गरेपछि अर्को राम्रो चरण Node.js सिक्नु हुनेछ, जुन अर्को भिडियो संग्रह "[Node.js को लागि बिगिनर्स सिरिज](https://channel9.msdn.com/Series/Beginners-Series-to-Nodejs/?WT.mc_id=academic-77807-sagibbon)" बाट सिक्न सकिन्छ। + +> हाम्रो [आचार संहिता](CODE_OF_CONDUCT.md) र [योगदान गर्ने तरिका](CONTRIBUTING.md) दिशानिर्देशमा जानुहोस्। हामी तपाईंको रचनात्मक प्रतिक्रिया स्वागत गर्दछौं! ## 🧭 अफलाइन पहुँच -तपाईं यो कागजातलाई अफलाइनमा [Docsify](https://docsify.js.org/#/) प्रयोग गरेर चलाउन सक्नुहुन्छ। यो भण्डार फोर्क गर्नुहोस्, तपाईंको स्थानीय मेसिनमा [Docsify स्थापना](https://docsify.js.org/#/quickstart) गर्नुहोस्, र त्यसपछि यस भण्डारको मूल फोल्डरमा `docsify serve` टाइप गर्नुहोस्। वेबसाइट तपाईंको लोकलहोस्टमा पोर्ट ३००० मा सेवा हुनेछ: `localhost:3000`। +तपाईं [Docsify](https://docsify.js.org/#/) प्रयोग गरी यो दस्तावेज अफलाइन रूपमा चलाउन सक्नुहुन्छ। यस रिपोमा फोर्क गर्नुहोस्, [Docsify स्थापना](https://docsify.js.org/#/quickstart) गर्नुहोस् आफ्नो स्थानीय कम्प्युटरमा, र त्यसपछि यो रिपोको मूल फोल्डरमा `docsify serve` टाइप गर्नुहोस्। वेबसाइट तपाईंको लोकलहोस्टमा पोर्ट 3000 मा सेवा हुनेछ: `localhost:3000`। ## 📘 PDF - -सबै पाठहरूको PDF [यहाँ](https://microsoft.github.io/Web-Dev-For-Beginners/pdf/readme.pdf) फेला पार्न सकिन्छ। - +सबै पाठहरूको PDF फाइल [यहाँ](https://microsoft.github.io/Web-Dev-For-Beginners/pdf/readme.pdf) फेला पार्न सकिन्छ। ## 🎒 अन्य कोर्सहरू -हाम्रो टोलीले अन्य कोर्सहरू पनि उत्पादन गर्दछ! जाँच गर्नुहोस्: + +हाम्रो टोलीले अन्य कोर्सहरू पनि उत्पादन गर्छ! जाँच गर्नुहोस्: ### LangChain @@ -206,7 +230,7 @@ Azure AI Foundry Discord समुदायमा सामेल हुनु --- -### Generative AI Series +### Generative AI श्रृंखला [![Generative AI for Beginners](https://img.shields.io/badge/Generative%20AI%20for%20Beginners-8B5CF6?style=for-the-badge&labelColor=E5E7EB&color=8B5CF6)](https://github.com/microsoft/generative-ai-for-beginners?WT.mc_id=academic-105485-koreyst) [![Generative AI (.NET)](https://img.shields.io/badge/Generative%20AI%20(.NET)-9333EA?style=for-the-badge&labelColor=E5E7EB&color=9333EA)](https://github.com/microsoft/Generative-AI-for-beginners-dotnet?WT.mc_id=academic-105485-koreyst) [![Generative AI (Java)](https://img.shields.io/badge/Generative%20AI%20(Java)-C084FC?style=for-the-badge&labelColor=E5E7EB&color=C084FC)](https://github.com/microsoft/generative-ai-for-beginners-java?WT.mc_id=academic-105485-koreyst) @@ -214,7 +238,7 @@ Azure AI Foundry Discord समुदायमा सामेल हुनु --- -### Core Learning +### कोर सिकाइ [![ML for Beginners](https://img.shields.io/badge/ML%20for%20Beginners-22C55E?style=for-the-badge&labelColor=E5E7EB&color=22C55E)](https://aka.ms/ml-beginners?WT.mc_id=academic-105485-koreyst) [![Data Science for Beginners](https://img.shields.io/badge/Data%20Science%20for%20Beginners-84CC16?style=for-the-badge&labelColor=E5E7EB&color=84CC16)](https://aka.ms/datascience-beginners?WT.mc_id=academic-105485-koreyst) [![AI for Beginners](https://img.shields.io/badge/AI%20for%20Beginners-A3E635?style=for-the-badge&labelColor=E5E7EB&color=A3E635)](https://aka.ms/ai-beginners?WT.mc_id=academic-105485-koreyst) @@ -225,29 +249,29 @@ Azure AI Foundry Discord समुदायमा सामेल हुनु --- -### Copilot Series +### कोपाइलट श्रृंखला [![Copilot for AI Paired Programming](https://img.shields.io/badge/Copilot%20for%20AI%20Paired%20Programming-FACC15?style=for-the-badge&labelColor=E5E7EB&color=FACC15)](https://aka.ms/GitHubCopilotAI?WT.mc_id=academic-105485-koreyst) [![Copilot for C#/.NET](https://img.shields.io/badge/Copilot%20for%20C%23/.NET-FBBF24?style=for-the-badge&labelColor=E5E7EB&color=FBBF24)](https://github.com/microsoft/mastering-github-copilot-for-dotnet-csharp-developers?WT.mc_id=academic-105485-koreyst) [![Copilot Adventure](https://img.shields.io/badge/Copilot%20Adventure-FDE68A?style=for-the-badge&labelColor=E5E7EB&color=FDE68A)](https://github.com/microsoft/CopilotAdventures?WT.mc_id=academic-105485-koreyst) -## सहायता प्राप्त गर्दै +## सहायता पाउने तरिका -यदि तपाइँ अल्झनु हुन्छ वा AI अनुप्रयोगहरू निर्माण गर्दा केहि प्रश्नहरू छन् भने। MCP सम्बन्धी छलफलहरूमा साथी सिक्नेहरू र अनुभवी विकासकर्ताहरू सामेल हुनुहोस्। यो एक सहयोगी समुदाय हो जहाँ प्रश्नहरू स्वागतयोग्य छन् र ज्ञान स्वतन्त्र रूपमा साझा गरिन्छ। +यदि तपाईं अड्किनुहुन्छ वा AI एप्लिकेसनहरू निर्माण गर्दा कुनै प्रश्नहरू छन् भने। साथी सिक्नेहरू र अनुभवी विकासकर्ताहरूसँग MCP सम्बन्धी छलफलहरूमा सामेल हुनुहोस्। यो एक सहयोगी समुदाय हो जहाँ प्रश्नहरू स्वागत छ र ज्ञान स्वतन्त्र रूपमा बाँडिन्छ। [![Microsoft Foundry Discord](https://dcbadge.limes.pink/api/server/nTYy5BXMWG)](https://discord.gg/nTYy5BXMWG) -यदि तपाइँसँग उत्पादन प्रतिक्रिया वा गल्तीहरू छन् भने निर्माण गर्ने क्रममा भ्रमण गर्नुहोस्: +यदि तपाईंलाई उत्पादन समबन्धी प्रतिक्रिया छ वा निर्माण गर्दा त्रुटिहरू छन् भने भ्रमण गर्नुहोस्: [![Microsoft Foundry Developer Forum](https://img.shields.io/badge/GitHub-Microsoft_Foundry_Developer_Forum-blue?style=for-the-badge&logo=github&color=000000&logoColor=fff)](https://aka.ms/foundry/forum) -## अनुमति +## लाइसेन्स -यो रिपोजिटरी MIT अनुमति अन्तर्गत लाइसेन्स गरिएको छ। थप जानकारीको लागि [LICENSE](../../LICENSE) फाइल हेर्नुहोस्। +यो रिपोजिटोरी MIT लाइसेन्स अन्तर्गत लाइसेन्स भएको छ। थप जानकारीको लागि [LICENSE](../../LICENSE) फाइल हेर्नुहोस्। --- -**अस्वीकरण**: -यस दस्तावेजलाई AI अनुवाद सेवा [Co-op Translator](https://github.com/Azure/co-op-translator) द्वारा अनुवाद गरिएको हो। हामी सही अनुवाद गर्न प्रयास गरिरहेका छौँ भने पनि, कृपया ध्यान दिनुहोस् कि स्वत: अनुवादमा त्रुटि वा अशुद्धता हुन सक्छ। मूल दस्तावेज यसको मूल भाषामा नै प्रामाणिक स्रोत मानिनु पर्छ। महत्वपूर्ण जानकारीको लागि व्यावसायिक मानव अनुवाद सिफारिस गरिन्छ। यस अनुवादको प्रयोगबाट उत्पन्न भएका कुनै पनि गलतफहमी वा गलत व्याख्याको लागि हामी जिम्मेवार छैनौं। +**अस्वीकरण**: +यस कागजातलाई AI अनुवाद सेवा [Co-op Translator](https://github.com/Azure/co-op-translator) प्रयोग गरी अनुवाद गरिएको हो। हामी सबै प्रयासका बावजुद, कृपया जान्नुहोस् कि स्वचालित अनुवादमा त्रुटिहरू वा अशुद्धता हुन सक्छ। मूल भाषा मा रहेको कागजातलाई आधिकारिक स्रोतको रूपमा मानिनु पर्छ। महत्वपूर्ण जानकारीको लागि व्यावसायिक मानव अनुवाद सल्लाह दिइन्छ। यस अनुवादको प्रयोगबाट हुने कुनै पनि गलतफहमी वा गलत अर्थ लगाउन हामी उत्तरदायी छैनौं। \ No newline at end of file