مرحبًا بك، أيها المطور المستقبلي! 👋 هل أنت مستعد للانضمام إلى ملايين المبرمجين حول العالم؟ أنا متحمس جدًا لتعريفك بـ GitHub – فكر فيه كأنه منصة التواصل الاجتماعي للمبرمجين، ولكن بدلاً من مشاركة صور الغداء، نحن نشارك الأكواد ونبني أشياء مذهلة معًا!
ما يدهشني حقًا هو أن كل تطبيق على هاتفك، وكل موقع تزوره، ومعظم الأدوات التي ستتعلم استخدامها تم إنشاؤها بواسطة فرق من المطورين الذين يتعاونون على منصات مثل GitHub. تطبيق الموسيقى الذي تحبه؟ شخص مثلك ساهم فيه. اللعبة التي لا تستطيع التوقف عن لعبها؟ نعم، ربما تم بناؤها بالتعاون عبر GitHub. والآن ستتعلم كيف تكون جزءًا من هذا المجتمع الرائع!
ما يدهشني حقًا هو أن كل تطبيق على هاتفك، وكل موقع تزوره، ومعظم الأدوات التي ستتعلم استخدامها تم بناؤها بواسطة فرق من المطورين الذين يتعاونون على منصات مثل GitHub. تطبيق الموسيقى الذي تحبه؟ شخص مثلك ساهم فيه. اللعبة التي لا تستطيع التوقف عن لعبها؟ نعم، ربما تم بناؤها بالتعاون عبر GitHub. والآن ستتعلم كيف تكون جزءًا من هذا المجتمع الرائع!
أعلم أن هذا قد يبدو كثيرًا في البداية – أذكر تمامًا عندما نظرت إلى صفحتي الأولى على GitHub وقلت "ما هذا بحق السماء؟". ولكن إليك الأمر: كل مطور بدأ تمامًا من حيث أنت الآن. بنهاية هذا الدرس، سيكون لديك مستودع GitHub خاص بك (فكر فيه كأنه معرض مشاريعك الشخصي في السحابة)، وستعرف كيف تحفظ عملك، وتشاركه مع الآخرين، وحتى تساهم في مشاريع يستخدمها الملايين.
أعلم أن هذا قد يبدو كثيرًا في البداية – أذكر تمامًا عندما نظرت لأول مرة إلى صفحة GitHub الخاصة بي وقلت "ما هذا بحق السماء؟". ولكن إليك الأمر: كل مطور بدأ تمامًا من حيث أنت الآن. بنهاية هذا الدرس، سيكون لديك مستودع GitHub خاص بك (فكر فيه كأنه معرض مشاريعك الشخصي في السحابة)، وستعرف كيف تحفظ عملك، وتشاركه مع الآخرين، وحتى تساهم في مشاريع يستخدمها الملايين.
سنخوض هذه الرحلة معًا، خطوة بخطوة. لا استعجال، لا ضغط – فقط أنت وأنا وبعض الأدوات الرائعة التي ستصبح أصدقائك الجدد!
@ -22,21 +22,20 @@ CO_OP_TRANSLATOR_METADATA:
```mermaid
journey
title Your GitHub Adventure Today
section Setup
Install Git: 4: You
Create Account: 5: You
First Repository: 5: You
section Master Git
Local Changes: 4: You
Commits & Pushes: 5: You
Branching: 4: You
section Collaborate
Fork Projects: 4: You
Pull Requests: 5: You
Open Source: 5: You
title مغامرتك على GitHub اليوم
section الإعداد
تثبيت Git: 4: أنت
إنشاء حساب: 5: أنت
أول مستودع: 5: أنت
section إتقان Git
تغييرات محلية: 4: أنت
الالتزامات والدفع: 5: أنت
إنشاء الفروع: 4: أنت
section التعاون
استنساخ المشاريع: 4: أنت
طلبات السحب: 5: أنت
المصدر المفتوح: 5: أنت
```
## اختبار ما قبل المحاضرة
[اختبار ما قبل المحاضرة](https://ff-quizzes.netlify.app)
@ -44,7 +43,7 @@ journey
قبل أن نغوص في الأمور المثيرة حقًا، دعنا نجهز جهاز الكمبيوتر الخاص بك لبعض السحر مع GitHub! فكر في هذا كأنه تنظيم أدواتك الفنية قبل إنشاء تحفة فنية – وجود الأدوات المناسبة يجعل كل شيء أكثر سلاسة ومتعة.
سأرشدك شخصيًا خلال كل خطوة من خطوات الإعداد، وأعدك أن الأمر ليس مخيفًا كما قد يبدو للوهلة الأولى. إذا لم تفهم شيئًا على الفور، فهذا طبيعي تمامًا! أذكر عندما كنت أعد بيئة التطوير الأولى لي وشعرت وكأنني أحاول قراءة رموز هيروغليفية قديمة. كل مطور كان في مكانك تمامًا، يتساءل عما إذا كان يفعل ذلك بشكل صحيح. مفاجأة: إذا كنت هنا تتعلم، فأنت بالفعل تفعل ذلك بشكل صحيح! 🌟
سأرشدك شخصيًا خلال كل خطوة من خطوات الإعداد، وأعدك أن الأمر ليس مخيفًا كما قد يبدو للوهلة الأولى. إذا لم تفهم شيئًا على الفور، فهذا طبيعي تمامًا! أذكر تمامًا عندما كنت أعد بيئة التطوير الأولى لي وشعرت وكأنني أحاول قراءة رموز هيروغليفية قديمة. كل مطور مر بنفس ما تمر به الآن، متسائلًا إذا كان يفعل ذلك بشكل صحيح. تنبيه: إذا كنت هنا تتعلم، فأنت بالفعل تفعل ذلك بشكل صحيح! 🌟
في هذا الدرس، سنتناول:
@ -56,12 +55,12 @@ journey
دعنا نجهز جهاز الكمبيوتر الخاص بك لبعض السحر مع GitHub! لا تقلق – هذا الإعداد شيء تحتاج إلى القيام به مرة واحدة فقط، وبعدها ستكون جاهزًا طوال رحلتك البرمجية.
حسنًا، لنبدأ بالأساسيات! أولاً، نحتاج إلى التحقق مما إذا كان Git مثبتًا بالفعل على جهازك. Git يشبه وجود مساعد ذكي جدًا يتذكر كل تغيير تقوم به في الكود الخاص بك – أفضل بكثير من الضغط على Ctrl+S كل ثانيتين (كلنا كنا هناك!).
حسنًا، لنبدأ بالأساسيات! أولاً، نحتاج إلى التحقق مما إذا كان Git مثبتًا بالفعل على جهازك. Git يشبه وجود مساعد ذكي جدًا يتذكر كل تغيير تقوم به في الكود الخاص بك – أفضل بكثير من الضغط على Ctrl+S كل ثانيتين (كلنا مررنا بذلك!).
دعنا نرى ما إذا كان Git مثبتًا بالفعل عن طريق كتابة هذا الأمر السحري في الطرفية الخاصة بك:
دعنا نرى ما إذا كان Git مثبتًا بالفعل عن طريق كتابة هذا الأمر السحري في الطرفية:
`git --version`
إذا لم يكن Git موجودًا بعد، لا تقلق! فقط توجه إلى [تنزيل Git](https://git-scm.com/downloads) وقم بتحميله. بمجرد تثبيته، نحتاج إلى تعريف Git بك بشكل صحيح:
إذا لم يكن Git مثبتًا بعد، لا تقلق! فقط توجه إلى [تنزيل Git](https://git-scm.com/downloads) وقم بتحميله. بمجرد تثبيته، نحتاج إلى تعريف Git بك بشكل صحيح:
> 💡 **الإعداد لأول مرة**: هذه الأوامر تخبر Git من أنت. سيتم إرفاق هذه المعلومات بكل عملية حفظ تقوم بها، لذا اختر اسمًا وبريدًا إلكترونيًا تشعر بالراحة في مشاركتهما علنًا.
@ -81,11 +80,11 @@ git config --list
💡 **نصيحة حديثة**: فكر في إعداد [مفاتيح SSH](https://docs.github.com/en/authentication/connecting-to-github-with-ssh) أو استخدام [GitHub CLI](https://cli.github.com/) لتسهيل المصادقة بدون كلمات مرور.
✅ GitHub ليس مستودع الأكواد الوحيد في العالم؛ هناك غيره، لكن GitHub هو الأكثر شهرة.
✅ GitHub ليس مستودع الأكواد الوحيد في العالم؛ هناك آخرون، ولكن GitHub هو الأكثر شهرة.
### التحضير
ستحتاج إلى مجلد يحتوي على مشروع كود على جهازك المحلي (الكمبيوتر المحمول أو المكتبي)، ومستودع عام على GitHub، والذي سيعمل كمثال على كيفية المساهمة في مشاريع الآخرين.
ستحتاج إلى مجلد يحتوي على مشروع كود على جهازك المحلي (الكمبيوتر المحمول أو الكمبيوتر الشخصي)، ومستودع عام على GitHub، والذي سيعمل كمثال على كيفية المساهمة في مشاريع الآخرين.
### الحفاظ على أمان الكود الخاص بك
@ -93,10 +92,10 @@ git config --list
سنوضح لك الطرق الحديثة والآمنة للعمل مع GitHub منذ البداية. بهذه الطريقة، ستطور عادات جيدة ستخدمك طوال مسيرتك البرمجية.
عند العمل مع GitHub، من المهم اتباع أفضل ممارسات الأمان:
عند العمل مع GitHub، من المهم اتباع أفضل الممارسات الأمنية:
| مجال الأمان | أفضل الممارسات | لماذا هو مهم |
|-------------|----------------|---------------|
| مجال الأمان | أفضل ممارسة | لماذا هو مهم |
|-------------|-------------|---------------|
| **المصادقة** | استخدم مفاتيح SSH أو رموز الوصول الشخصية | كلمات المرور أقل أمانًا ويتم التخلص منها تدريجيًا |
| **المصادقة الثنائية** | قم بتمكين المصادقة الثنائية (2FA) على حساب GitHub الخاص بك | تضيف طبقة إضافية من الحماية للحساب |
| **أمان المستودع** | لا تقم أبدًا بحفظ معلومات حساسة | لا يجب أن تكون مفاتيح API وكلمات المرور في المستودعات العامة |
حسنًا، هنا تبدأ الأمور في أن تصبح مثيرة حقًا! 🎉 نحن على وشك تعلم كيفية تتبع وإدارة الكود الخاص بك مثل المحترفين، وبصراحة، هذا أحد الأشياء المفضلة لدي لتعليمها لأنها تغير اللعبة تمامًا.
حسنًا، هنا تبدأ الأمور تصبح مثيرة حقًا! 🎉 نحن على وشك تعلم كيفية تتبع وإدارة الكود الخاص بك مثل المحترفين، وبصراحة، هذا أحد الأشياء المفضلة لدي لتعليمها لأنه يغير اللعبة تمامًا.
تخيل هذا: أنت تكتب قصة مذهلة، وتريد تتبع كل مسودة، وكل تعديل رائع، وكل لحظة "انتظر، هذا عبقري!" على طول الطريق. هذا بالضبط ما يفعله Git لكودك! إنه مثل وجود دفتر ملاحظات مذهل يسافر عبر الزمن ويتذكر كل شيء – كل ضغطة مفتاح، كل تغيير، كل لحظة "أوه، لقد أفسدت كل شيء" التي يمكنك التراجع عنها فورًا.
تخيل هذا: أنت تكتب قصة مذهلة، وتريد تتبع كل مسودة، وكل تعديل رائع، وكل لحظة "انتظر، هذا عبقري!" على طول الطريق. هذا بالضبط ما يفعله Git لكودك! إنه مثل وجود دفتر ملاحظات مذهل يسافر عبر الزمن ويتذكر كل شيء – كل ضغطة مفتاح، كل تغيير، كل لحظة "أوه، هذا كسر كل شيء" التي يمكنك التراجع عنها فورًا.
سأكون صريحًا – قد يبدو هذا مربكًا في البداية. عندما بدأت، كنت أفكر "لماذا لا يمكنني فقط حفظ ملفاتي بشكل طبيعي؟" ولكن ثق بي في هذا: بمجرد أن تفهم Git (وستفهمه!)، ستحصل على تلك اللحظة المضيئة حيث تفكر "كيف كنت أبرمج بدون هذا؟" إنه مثل اكتشاف أنك تستطيع الطيران بعد أن كنت تمشي طوال حياتك!
سأكون صادقًا – قد يبدو هذا مربكًا في البداية. عندما بدأت، كنت أفكر "لماذا لا يمكنني فقط حفظ ملفاتي كالمعتاد؟" ولكن ثق بي في هذا: بمجرد أن تفهم Git (وستفهمه!)، ستحصل على تلك اللحظة التي تقول فيها "كيف كنت أبرمج بدون هذا؟" إنه مثل اكتشاف أنك تستطيع الطيران بعد أن كنت تمشي في كل مكان طوال حياتك!
لنفترض أن لديك مجلدًا محليًا يحتوي على مشروع كود وتريد البدء في تتبع تقدمك باستخدام Git - نظام التحكم في الإصدارات. بعض الناس يقارنون استخدام Git بكتابة رسالة حب لنفسك المستقبلية. عند قراءة رسائل الحفظ الخاصة بك بعد أيام أو أسابيع أو أشهر، ستتمكن من تذكر سبب اتخاذك لقرار معين، أو "التراجع" عن تغيير –بالطبع، عندما تكتب رسائل حفظ جيدة.
لنفترض أن لديك مجلدًا محليًا يحتوي على مشروع كود وتريد البدء في تتبع تقدمك باستخدام git - نظام التحكم في الإصدارات. بعض الناس يقارنون استخدام git بكتابة رسالة حب لنفسك المستقبلية. عند قراءة رسائل الالتزام الخاصة بك بعد أيام أو أسابيع أو أشهر، ستتمكن من تذكر سبب اتخاذك لقرار معين، أو "التراجع" عن تغيير –هذا إذا كتبت رسائل "التزام" جيدة.
```mermaid
flowchart TD
A[📁 Your Project Files] --> B{Is it a Git Repository?}
B -->|No| C[git init]
B -->|Yes| D[Make Changes]
A[📁 ملفات مشروعك] --> B{هل هو مستودع Git؟}
B -->|لا| C[git init]
B -->|نعم| D[قم بإجراء تغييرات]
C --> D
D --> E[git add .]
E --> F["git commit -m 'message'"]
E --> F["git commit -m 'رسالة'"]
F --> G[git push]
G --> H[🌟 Code on GitHub!]
G --> H[🌟 الكود على GitHub!]
H --> I{Want to collaborate?}
I -->|Yes| J[Fork & Clone]
I -->|No| D
J --> K[Create Branch]
K --> L[Make Changes]
L --> M[Pull Request]
M --> N[🎉 Contributing!]
H --> I{هل تريد التعاون؟}
I -->|نعم| J[Fork & Clone]
I -->|لا| D
J --> K[إنشاء فرع]
K --> L[قم بإجراء تغييرات]
L --> M[طلب سحب]
M --> N[🎉 المساهمة!]
style A fill:#fff59d
style H fill:#c8e6c9
style N fill:#ff4081,color:#fff
```
### المهمة: إنشاء مستودعك الأول!
> 🎯 **مهمتك (وأنا متحمس جدًا لك!)**: سنقوم بإنشاء مستودع GitHub الأول الخاص بك معًا! بحلول الوقت الذي ننتهي فيه هنا، سيكون لديك ركن صغير خاص بك على الإنترنت حيث يعيش كودك، وستكون قد قمت بأول "حفظ" (هذا هو المصطلح الذي يستخدمه المطورون لحفظ عملهم بطريقة ذكية جدًا).
> 🎯 **مهمتك (وأنا متحمس جدًا لك!)**: سنقوم بإنشاء مستودع GitHub الأول الخاص بك معًا! بحلول الوقت الذي ننتهي فيه هنا، سيكون لديك ركن صغير خاص بك على الإنترنت حيث يعيش كودك، وستكون قد قمت بأول "التزام" (هذا مصطلح المطورين لحفظ عملك بطريقة ذكية جدًا).
>
> هذه لحظة خاصة جدًا – أنت على وشك الانضمام رسميًا إلى المجتمع العالمي للمطورين! ما زلت أتذكر الإثارة عند إنشاء مستودعي الأول والتفكير "واو، أنا أفعل هذا حقًا!"
> هذه لحظة خاصة جدًا – أنت على وشك الانضمام رسميًا إلى مجتمع المطورينالعالمي! ما زلت أتذكر الإثارة عند إنشاء المستودع الأول لي والتفكير "واو، أنا أفعل هذا حقًا!"
دعنا نخوض هذه المغامرة معًا، خطوة بخطوة. خذ وقتك مع كل جزء – لا توجد جائزة للاستعجال، وأعدك أن كل خطوة ستصبح منطقية. تذكر، كل نجم برمجي تعجب به كان يومًا ما جالسًا في مكانك تمامًا، على وشك إنشاء مستودعه الأول. كم هذا رائع؟
دعنا نسير في هذه المغامرة معًا، خطوة بخطوة. خذ وقتك مع كل جزء – لا توجد جائزة للاستعجال، وأعدك أن كل خطوة ستصبح منطقية. تذكر، كل نجم برمجي تعجب به كان يجلس يومًا ما بالضبط حيث أنت الآن، على وشك إنشاء مستودعه الأول. كم هذا رائع؟
> شاهد الفيديو
>
@ -166,16 +164,16 @@ flowchart TD
**لنقم بذلك معًا:**
1. **إنشاء مستودعك على GitHub**. توجه إلى GitHub.com وابحث عن الزر الأخضر اللامع **جديد** (أو علامة **+** في الزاوية العلوية اليمنى). انقر عليه واختر **مستودع جديد**.
1. **إنشاء مستودعك على GitHub**. توجه إلى GitHub.com وابحث عن الزر الأخضر اللامع **New** (أو علامة **+** في الزاوية العلوية اليمنى). انقر عليه واختر **New repository**.
إليك ما يجب فعله:
1. امنح مستودعك اسمًا – اجعله شيئًا ذا معنى بالنسبة لك!
1. أضف وصفًا إذا أردت (هذا يساعد الآخرين على فهم مشروعك)
1. قرر ما إذا كنت تريد أن يكون عامًا (يمكن للجميع رؤيته) أو خاصًا (فقط لك)
1. أوصي بتحديد المربع لإضافة ملف README – إنه مثل الصفحة الأولى لمشروعك
1. انقر على **إنشاء مستودع** واحتفل – لقد أنشأت مستودعك الأول! 🎉
1. قرر ما إذا كنت تريده عامًا (يمكن للجميع رؤيته) أو خاصًا (فقط لك)
1. أوصي بتحديد المربع لإضافة ملف README – إنه مثل الصفحة الأمامية لمشروعك
1. انقر على **Create repository** واحتفل – لقد أنشأت مستودعك الأول! 🎉
2. **انتقل إلى مجلد مشروعك**. الآن دعنا نفتح الطرفية الخاصة بك (لا تقلق، ليست مخيفة كما تبدو!). نحتاج إلى إخبار جهاز الكمبيوتر الخاص بك بمكان ملفات مشروعك. اكتب هذا الأمر:
2. **انتقل إلى مجلد مشروعك**. الآن دعنا نفتح الطرفية (لا تقلق، ليست مخيفة كما تبدو!). نحتاج إلى إخبار جهاز الكمبيوتر الخاص بك بمكان ملفات مشروعك. اكتب هذا الأمر:
```bash
cd [name of your folder]
@ -195,7 +193,7 @@ flowchart TD
**ما الذي حدث للتو (أشياء رائعة جدًا!):**
- قام Git بإنشاء مجلد مخفي `.git` في مشروعك – لن تراه، لكنه موجود!
- أصبح مجلدك العادي الآن "مستودعًا" يمكنه تتبع كل تغيير تقوم به
- فكر في الأمر كأنه يمنح مجلدك قوى خارقة لتذكر كل شيء
- فكر فيه كأنه يمنح مجلدك قوى خارقة لتذكر كل شيء
4. **تحقق مما يحدث**. دعنا نرى ما الذي يعتقده Git عن مشروعك الآن:
@ -205,7 +203,7 @@ flowchart TD
**فهم ما يقوله Git:**
قد ترى شيئًا يبدو هكذا:
قد ترى شيئًا يبدو كهذا:
```output
Changes not staged for commit:
@ -234,7 +232,7 @@ flowchart TD
- النقطة `.` تعني "كل شيء في هذا المجلد"
- الآن ملفاتك "جاهزة" للخطوة التالية
**تريد أن تكون أكثر انتقائية؟** يمكنك إضافة ملفات محددة فقط:
**هل تريد أن تكون أكثر انتقائية؟** يمكنك إضافة ملفات محددة فقط:
```bash
git add [file or folder name]
@ -245,72 +243,73 @@ flowchart TD
- يساعدك على تنظيم عملك في أجزاء منطقية
- يجعل من السهل فهم ما تغير ومتى
**غيرت رأيك؟** لا تقلق! يمكنك إزالة الملفات من التجهيز هكذا:
**غيرت رأيك؟** لا تقلق! يمكنك إزالة الملفات من التجهيز مثل هذا:
```bash
# Unstage everything
# إلغاء تحديد كل شيء
git reset
# Unstage just one file
# إلغاء تحديد ملف واحد فقط
git reset [file name]
```
لا تقلق – هذا لا يحذف عملك، فقط يخرج الملفات من "جاهزة للحفظ".
6. **احفظ عملك بشكل دائم** (قم بأول عملية حفظ!):
6. **احفظ عملك بشكل دائم** (قم بأول التزام لك!):
```bash
git commit -m "first commit"
```
**🎉 تهانينا! لقد قمت بأول عملية حفظ!**
**🎉 تهانينا! لقد قمت بأول التزام لك!**
**ما الذي حدث للتو:**
- أخذ Git "لقطة" لجميع الملفات الجاهزة في هذه اللحظة بالضبط
- رسالة الحفظ "first commit" تشرح ما يدور حوله هذا الحفظ
- أعطى Git لهذه اللقطة معرفًا فريدًا حتى تتمكن دائمًا من العثور عليها لاحقًا
- رسالة الالتزام "first commit" تشرح ما هو هذا الحفظ
- أعطى Git هذه اللقطة معرفًا فريدًا حتى تتمكن دائمًا من العثور عليها لاحقًا
- لقد بدأت رسميًا في تتبع تاريخ مشروعك!
> 💡 **رسائل الحفظ المستقبلية**: بالنسبة للحفظات القادمة، كن أكثر وصفًا! بدلاً من "تحديث الأشياء"، جرب "إضافة نموذج الاتصال إلى الصفحة الرئيسية" أو "إصلاح خطأ في قائمة التنقل". ستشكر نفسك في المستقبل!
> 💡 **رسائل الالتزام المستقبلية**: بالنسبة لالتزاماتك القادمة، كن أكثر وصفًا! بدلاً من "تحديث الأشياء"، جرب "إضافة نموذج الاتصال إلى الصفحة الرئيسية" أو "إصلاح خطأ في قائمة التنقل". نفسك المستقبلية ستشكرك!
7. **ربط مشروعك المحلي بـ GitHub**. الآن، مشروعك موجود فقط على جهاز الكمبيوتر الخاص بك. دعنا نربطه بمستودع GitHub الخاص بك حتى تتمكن من مشاركته مع العالم!
7. **اربط مشروعك المحلي بـ GitHub**. الآن، مشروعك موجود فقط على جهاز الكمبيوتر الخاص بك. دعنا نربطه بمستودع GitHub الخاص بك حتى تتمكن من مشاركته مع العالم!
أولاً، انتقل إلى صفحة مستودع GitHub الخاص بك ونسخ الرابط. ثم عد إلى هنا واكتب:
أولاً، انتقل إلى صفحة مستودع GitHub الخاص بك ونسخ عنوان URL. ثم عد إلى هنا واكتب:
- أنشأنا اتصالاً بين مشروعك المحلي ومستودع GitHub الخاص بك.
- "Origin" هو مجرد اسم مستعار لمستودع GitHub الخاص بك – يشبه إضافة جهة اتصال إلى هاتفك.
- الآن يعرف Git المحلي الخاص بك أين يرسل الكود الخاص بك عندما تكون جاهزًا لمشاركته.
(استبدل هذا العنوان بعنوان مستودعك الفعلي!)
**ما الذي فعلناه للتو:**
- قمنا بإنشاء اتصال بين مشروعك المحلي ومستودع GitHub الخاص بك.
- "Origin" هو مجرد اسم مستعار لمستودع GitHub الخاص بك – يشبه إضافة جهة اتصال إلى هاتفك.
- الآن يعرف Git المحلي الخاص بك أين يرسل الكود الخاص بك عندما تكون جاهزًا لمشاركته.
💡 **طريقة أسهل**: إذا كان لديك GitHub CLI مثبتًا، يمكنك القيام بذلك بأمر واحد:
💡 **طريقة أسهل**: إذا كان لديك GitHub CLI مثبتًا، يمكنك القيام بذلك بأمر واحد:
```bash
gh repo create my-repo --public --push --source=.
```
8. **أرسل الكود الخاص بك إلى GitHub** (اللحظة الحاسمة!):
8. **أرسل الكود الخاص بك إلى GitHub** (اللحظة الكبيرة!):
```bash
git push -u origin main
```
**🚀 هذا هو! أنت تقوم برفع الكود الخاص بك إلى GitHub!**
**ما يحدث:**
- تنتقل التغييرات التي أجريتها من جهاز الكمبيوتر الخاص بك إلى GitHub.
- العلم `-u` يقوم بإعداد اتصال دائم لتسهيل عمليات الدفع المستقبلية.
- "main" هو اسم الفرع الرئيسي الخاص بك (مثل المجلد الرئيسي).
- بعد ذلك، يمكنك فقط كتابة `git push` لعمليات الرفع المستقبلية!
**🚀 هذه هي اللحظة! أنت تقوم برفع الكود الخاص بك إلى GitHub!**
**ما الذي يحدث:**
- التغييرات التي قمت بها تنتقل من جهاز الكمبيوتر الخاص بك إلى GitHub.
- العلم `-u` يقوم بإعداد اتصال دائم لتسهيل عمليات الدفع المستقبلية.
- "main" هو اسم الفرع الأساسي الخاص بك (مثل المجلد الرئيسي).
- بعد ذلك، يمكنك فقط كتابة `git push` للرفع في المستقبل!
💡 **ملاحظة سريعة**: إذا كان اسم الفرع الخاص بك مختلفًا (مثل "master")، فاستخدم هذا الاسم بدلاً من ذلك. يمكنك التحقق باستخدام `git branch --show-current`.
💡 **ملاحظة سريعة**: إذا كان اسم الفرع الخاص بك مختلفًا (مثل "master")، استخدم ذلك الاسم. يمكنك التحقق باستخدام `git branch --show-current`.
9. **إيقاعك اليومي الجديد في البرمجة** (هنا يصبح الأمر ممتعًا!):
من الآن فصاعدًا، كلما أجريت تغييرات على مشروعك، لديك هذه الخطوات الثلاث البسيطة:
من الآن فصاعدًا، كلما أجريت تغييرات على مشروعك، لديك هذه الخطوات الثلاثة البسيطة:
```bash
git add .
@ -318,18 +317,18 @@ flowchart TD
git push
```
**هذا يصبح نبض البرمجة الخاص بك:**
- قم بإجراء تغييرات رائعة على الكود الخاص بك ✨
- قم بتهيئتها باستخدام `git add` ("مرحبًا Git، انتبه لهذه التغييرات!")
- احفظها باستخدام `git commit` ورسالة وصفية (ستشكر نفسك في المستقبل!)
- شاركها مع العالم باستخدام `git push` 🚀
- كرر العملية – بجدية، هذا يصبح طبيعيًا مثل التنفس!
**هذا يصبح نبض البرمجة الخاص بك:**
- قم بإجراء تغييرات رائعة على الكود الخاص بك ✨
- قم بتجهيزها باستخدام `git add` ("مرحبًا Git، انتبه لهذه التغييرات!")
- احفظها باستخدام `git commit` ورسالة وصفية (ستشكر نفسك في المستقبل!)
- شاركها مع العالم باستخدام `git push` 🚀
- كرر العملية – بجدية، هذا يصبح طبيعيًا مثل التنفس!
أحب هذا الأسلوب لأنه يشبه وجود نقاط حفظ متعددة في لعبة فيديو. أجريت تغييرًا تحبه؟ قم بحفظه! تريد تجربة شيء محفوف بالمخاطر؟ لا مشكلة – يمكنك دائمًا العودة إلى آخر حفظ إذا حدث خطأ ما!
أحب هذا الأسلوب لأنه يشبه وجود نقاط حفظ متعددة في لعبة فيديو. أجريت تغييرًا تحبه؟ قم بحفظه! تريد تجربة شيء محفوف بالمخاطر؟ لا مشكلة – يمكنك دائمًا العودة إلى آخر حفظ إذا حدثت مشكلة!
> 💡 **نصيحة**: قد ترغب أيضًا في اعتماد ملف `.gitignore` لمنع ظهور الملفات التي لا تريد تتبعها على GitHub - مثل ملف الملاحظات الذي تخزنه في نفس المجلد ولكنه ليس له مكان في مستودع عام. يمكنك العثور على قوالب لملفات `.gitignore` في [.gitignore templates](https://github.com/github/gitignore) أو إنشاء واحد باستخدام [gitignore.io](https://www.toptal.com/developers/gitignore).
> 💡 **نصيحة**: قد ترغب أيضًا في اعتماد ملف `.gitignore` لمنع ظهور الملفات التي لا تريد تتبعها على GitHub - مثل ملف الملاحظات الذي تخزنه في نفس المجلد ولكنه ليس له مكان في مستودع عام. يمكنك العثور على قوالب لملفات `.gitignore` في [.gitignore templates](https://github.com/github/gitignore) أو إنشاء واحد باستخدام [gitignore.io](https://www.toptal.com/developers/gitignore).
### 🧠 **أول تسجيل في المستودع: كيف كان شعورك؟**
### 🧠 **أول تسجيل في المستودع: كيف كان الشعور؟**
**خذ لحظة للاحتفال والتفكير:**
- كيف كان شعورك عندما رأيت الكود الخاص بك يظهر على GitHub لأول مرة؟
@ -338,81 +337,79 @@ flowchart TD
```mermaid
stateDiagram-v2
[*] --> LocalFiles: Create project
[*] --> LocalFiles: إنشاء مشروع
LocalFiles --> Staged: git add .
Staged --> Committed: git commit
Committed --> GitHub: git push
GitHub --> [*]: Success! 🎉
GitHub --> [*]: نجاح! 🎉
note right of Staged
Files ready to save
الملفات جاهزة للحفظ
end note
note right of Committed
Snapshot created
تم إنشاء لقطة
end note
```
> **تذكر**: حتى المطورين ذوي الخبرة ينسون أحيانًا الأوامر الدقيقة. جعل هذا الأسلوب يصبح ذاكرة عضلية يتطلب ممارسة - أنت تقوم بعمل رائع!
#### أساليب Git الحديثة
فكر في تبني هذه الممارسات الحديثة:
- **التزامات تقليدية**: استخدم تنسيقًا قياسيًا لرسائل الالتزام مثل `feat:`، `fix:`، `docs:`، إلخ. تعرف على المزيد في [conventionalcommits.org](https://www.conventionalcommits.org/)
- **التزامات تقليدية**: استخدم صيغة موحدة لرسائل الالتزام مثل `feat:`، `fix:`، `docs:`، إلخ. تعرف على المزيد في [conventionalcommits.org](https://www.conventionalcommits.org/)
- **التزامات ذرية**: اجعل كل التزام يمثل تغييرًا منطقيًا واحدًا.
- **التزامات متكررة**: قم بالالتزام بشكل متكرر مع رسائل وصفية بدلاً من الالتزامات الكبيرة وغير المتكررة.
#### رسائل الالتزام
سطر موضوع الالتزام الجيد يكمل الجملة التالية:
إذا تم تطبيقه، فإن هذا الالتزام سي<سطر الموضوع الخاص بك هنا>
إذا تم تطبيقه، هذا الالتزام سوف<سطر الموضوع الخاص بك هنا>
بالنسبة للموضوع، استخدم صيغة الأمر، الزمن الحاضر: "تغيير" وليس "تم تغييره" ولا "تغييرات". كما هو الحال في الموضوع، في النص (اختياري) استخدم أيضًا صيغة الأمر، الزمن الحاضر. يجب أن يتضمن النص الدافع للتغيير ويقارن ذلك بالسلوك السابق. أنت تشرح "لماذا"، وليس "كيف".
بالنسبة للموضوع، استخدم صيغة الأمر، الزمن الحاضر: "تغيير" وليس "تم تغييره" ولا "تغييرات". كما هو الحال في الموضوع، في النص (اختياري) أيضًا استخدم صيغة الأمر، الزمن الحاضر. يجب أن يتضمن النص الدافع للتغيير ويقارن ذلك بالسلوك السابق. أنت تشرح "لماذا"، وليس "كيف".
✅ خذ بضع دقائق لتصفح GitHub. هل يمكنك العثور على رسالة التزام رائعة حقًا؟ هل يمكنك العثور على رسالة بسيطة جدًا؟ ما المعلومات التي تعتقد أنها الأكثر أهمية وفائدة لنقلها في رسالة الالتزام؟
✅ خذ بضع دقائق لتصفح GitHub. هل يمكنك العثور على رسالة التزام رائعة حقًا؟ هل يمكنك العثور على واحدة بسيطة جدًا؟ ما المعلومات التي تعتقد أنها الأكثر أهمية وفائدة لتوصيلها في رسالة الالتزام؟
## العمل مع الآخرين (الجزء الممتع!)
تمسك بقبعتك لأن هذا هو المكان الذي يصبح فيه GitHub سحريًا تمامًا! 🪄 لقد أتقنت إدارة الكود الخاص بك، ولكن الآن نحن نغوص في الجزء المفضل لدي – التعاون مع أشخاص رائعين من جميع أنحاء العالم.
تخيل هذا: تستيقظ غدًا وترى أن شخصًا في طوكيو قام بتحسين الكود الخاص بك أثناء نومك. ثم شخص في برلين يصلح خطأ كنت عالقًا فيه. بحلول فترة الظهيرة، يضيف مطور في ساو باولو ميزة لم تفكر فيها حتى. هذا ليس خيالًا علميًا– هذا مجرد يوم عادي في عالم GitHub!
تخيل هذا: تستيقظ غدًا وترى أن شخصًا في طوكيو قام بتحسين الكود الخاص بك أثناء نومك. ثم شخص في برلين يصلح خطأ كنت عالقًا فيه. بحلول فترة الظهيرة، مطور في ساو باولو أضاف ميزة لم تفكر فيها حتى. هذا ليس خيال علمي – هذا مجرد يوم عادي في عالم GitHub!
ما يثيرني حقًا هو أن مهارات التعاون التي ستتعلمها؟ هذه هي نفس الأساليب التي تستخدمها الفرق في Google وMicrosoft وأفضل الشركات الناشئة كل يوم. أنت لا تتعلم مجرد أداة رائعة – أنت تتعلم اللغة السرية التي تجعل عالم البرمجيات بأكمله يعمل معًا.
ما يجعلني متحمسًا حقًا هو أن مهارات التعاون التي ستتعلمها؟ هذه هي نفس الأساليب التي تستخدمها الفرق في Google، Microsoft، والشركات الناشئة المفضلة لديك كل يوم. أنت لا تتعلم مجرد أداة رائعة – أنت تتعلم اللغة السرية التي تجعل عالم البرمجيات بأكمله يعمل معًا.
بجدية، بمجرد أن تختبر شعور أن يقوم شخص ما بدمج أول طلب سحب لك، ستفهم لماذا يصبح المطورون متحمسين جدًا للمصدر المفتوح. إنه مثل أن تكون جزءًا من أكبر مشروع فريق إبداعي في العالم!
بجدية، بمجرد أن تجرب شعور دمج أول طلب سحب لك، ستفهم لماذا يصبح المطورون متحمسين جدًا للمصدر المفتوح. إنه مثل أن تكون جزءًا من أكبر مشروع فريق إبداعي في العالم!
> [](https://www.youtube.com/watch?v=bFCM-PC3cu8)
السبب الرئيسي لوضع الأشياء على GitHub هو جعل التعاون مع المطورين الآخرين ممكنًا.
```mermaid
flowchart LR
A[🔍 Find Project] --> B[🍴 Fork Repository]
B --> C[📥 Clone to Local]
C --> D[🌿 Create Branch]
D --> E[✏️ Make Changes]
E --> F[💾 Commit Changes]
F --> G[📤 Push Branch]
G --> H[🔄 Create Pull Request]
H --> I{Maintainer Review}
I -->|✅ Approved| J[🎉 Merge!]
I -->|❓ Changes Requested| K[📝 Make Updates]
A[🔍 البحث عن المشروع] --> B[🍴 نسخ المستودع]
B --> C[📥 نسخ إلى الجهاز المحلي]
C --> D[🌿 إنشاء فرع]
D --> E[✏️ إجراء تغييرات]
E --> F[💾 حفظ التغييرات]
F --> G[📤 رفع الفرع]
G --> H[🔄 إنشاء طلب دمج]
H --> I{مراجعة المسؤول}
I -->|✅ تمت الموافقة| J[🎉 دمج!]
I -->|❓ طلب تغييرات| K[📝 إجراء تحديثات]
K --> F
J --> L[🧹 Clean Up Branches]
J --> L[🧹 تنظيف الفروع]
style A fill:#e3f2fd
style J fill:#e8f5e8
style L fill:#fff3e0
```
في مستودعك، انتقل إلى `Insights > Community` لترى كيف يقارن مشروعك بمعايير المجتمع الموصى بها.
هل تريد جعل مستودعك يبدو احترافيًا ومرحبًا؟ توجه إلى مستودعك وانقر على `Insights > Community`. هذه الميزة الرائعة تظهر لك كيف يقارن مشروعك بما يعتبره مجتمع GitHub "ممارسات مستودع جيدة".
> 🎯 **جعل مشروعك يلمع**: المستودع المنظم جيدًا مع وثائق جيدة يشبه وجود واجهة متجر نظيفة ومرحبة. إنه يخبر الناس أنك تهتم بعملك ويجعل الآخرين يرغبون في المساهمة!
> 🎯 **جعل مشروعك يلمع**: مستودع منظم جيدًا مع وثائق جيدة يشبه وجود واجهة متجر نظيفة ومرحبة. إنه يخبر الناس أنك تهتم بعملك ويجعل الآخرين يرغبون في المساهمة!
**إليك ما يجعل المستودع رائعًا:**
@ -421,9 +418,9 @@ flowchart LR
| **الوصف** | الانطباع الأول مهم! | يعرف الناس فورًا ما يفعله مشروعك |
| **README** | الصفحة الرئيسية لمشروعك | مثل دليل سياحي ودود للزوار الجدد |
| **إرشادات المساهمة** | يظهر أنك ترحب بالمساعدة | يعرف الناس بالضبط كيف يمكنهم مساعدتك |
> 💡 **نصيحة احترافية**: يوفر GitHub قوالب لجميع هذه الملفات. عند إنشاء مستودع جديد، تحقق من المربعات لإنشاء هذه الملفات تلقائيًا.
@ -433,29 +430,29 @@ flowchart LR
- **GitHub Actions** للاختبار والنشر التلقائي.
- **Dependabot** لتحديث التبعيات تلقائيًا.
💬 **إدارة المجتمع والمشاريع:**
💬 **المجتمع وإدارة المشاريع:**
- **GitHub Discussions** للمحادثات المجتمعية خارج نطاق القضايا.
- **GitHub Projects** لإدارة المشاريع بأسلوب كانبان.
- **قواعد حماية الفروع** لفرض معايير جودة الكود.
كل هذه الموارد ستفيد في استيعاب أعضاء الفريق الجدد. وهذه هي عادةً الأشياء التي ينظر إليها المساهمون الجدد قبل حتى النظر إلى الكود الخاص بك، لمعرفة ما إذا كان مشروعك هو المكان المناسب لهم لقضاء وقتهم.
كل هذه الموارد ستفيد في استقبال أعضاء الفريق الجدد. وهذه هي عادةً الأشياء التي ينظر إليها المساهمون الجدد قبل حتى النظر إلى الكود الخاص بك، لمعرفة ما إذا كان مشروعك هو المكان المناسب لقضاء وقتهم.
✅ ملفات README، على الرغم من أنها تستغرق وقتًا للإعداد، غالبًا ما يتم تجاهلها من قبل المسؤولين المشغولين. هل يمكنك العثور على مثال لملف وصف مفصل بشكل خاص؟ ملاحظة: هناك بعض [الأدوات التي تساعد في إنشاء ملفات README جيدة](https://www.makeareadme.com/) قد ترغب في تجربتها.
✅ ملفات README، على الرغم من أنها تستغرق وقتًا للإعداد، غالبًا ما يتم تجاهلها من قبل المسؤولين المشغولين. هل يمكنك العثور على مثال لواحد وصفي بشكل خاص؟ ملاحظة: هناك بعض [الأدوات التي تساعد في إنشاء ملفات README جيدة](https://www.makeareadme.com/) قد ترغب في تجربتها.
### المهمة: دمج بعض الكود
تساعد وثائق المساهمة الأشخاص على المساهمة في المشروع. تشرح أنواع المساهمات التي تبحث عنها وكيفية عمل العملية. سيحتاج المساهمون إلى المرور بسلسلة من الخطوات ليتمكنوا من المساهمة في مستودعك على GitHub:
تساعد وثائق المساهمة الأشخاص على المساهمة في المشروع. إنها تشرح أنواع المساهمات التي تبحث عنها وكيفية عمل العملية. سيحتاج المساهمون إلى المرور بسلسلة من الخطوات ليتمكنوا من المساهمة في مستودعك على GitHub:
1. **نسخ مستودعك** ربما تريد أن يقوم الناس بـ _نسخ_ مشروعك. النسخ يعني إنشاء نسخة من مستودعك على ملف تعريف GitHub الخاص بهم.
1. **تفرع مستودعك** ربما تريد أن يقوم الناس بـ _تفرع_ مشروعك. التفرع يعني إنشاء نسخة من مستودعك على ملف تعريف GitHub الخاص بهم.
1. **الاستنساخ**. من هناك سيقومون باستنساخ المشروع إلى جهازهم المحلي.
1. **إنشاء فرع**. ستطلب منهم إنشاء _فرع_ لعملهم.
1. **إنشاء فرع**. سترغب في أن تطلب منهم إنشاء _فرع_ لعملهم.
1. **تركيز التغيير على منطقة واحدة**. اطلب من المساهمين التركيز على مساهماتهم في شيء واحد في كل مرة - بهذه الطريقة تكون فرص أن تتمكن من _دمج_ عملهم أعلى. تخيل أنهم كتبوا إصلاح خطأ، أضافوا ميزة جديدة، وقاموا بتحديث عدة اختبارات - ماذا لو كنت تريد، أو يمكنك فقط تنفيذ 2 من 3، أو 1 من 3 تغييرات؟
✅ تخيل موقفًا تكون فيه الفروع ضرورية بشكل خاص لكتابة الكود الجيد وشحنه. ما هي حالات الاستخدام التي يمكنك التفكير فيها؟
✅ تخيل موقفًا تكون فيه الفروع ضرورية بشكل خاص لكتابة وشحن كود جيد. ما هي حالات الاستخدام التي يمكنك التفكير فيها؟
> ملاحظة، كن التغيير الذي تريد رؤيته في العالم، وقم بإنشاء فروع لعملك الخاص أيضًا. أي التزامات تقوم بها ستتم على الفرع الذي "تم التحقق منه" حاليًا. استخدم `git status` لمعرفة أي فرع هو.
> ملاحظة، كن التغيير الذي تريد رؤيته في العالم، وقم بإنشاء فروع لعملك الخاص أيضًا. أي التزامات تقوم بها سيتم تنفيذها على الفرع الذي "تم التحقق منه" حاليًا. استخدم `git status` لمعرفة أي فرع هو.
لنمر عبر سير عمل المساهم. افترض أن المساهم قد قام بالفعل بـ _نسخ_ و _استنساخ_ المستودع بحيث يكون لديه مستودع Git جاهز للعمل عليه، على جهازه المحلي:
لنمر عبر سير عمل المساهم. افترض أن المساهم قد قام بالفعل بـ _تفرع_ و _استنساخ_ المستودع بحيث يكون لديه مستودع Git جاهز للعمل عليه، على جهازه المحلي:
1. **إنشاء فرع**. استخدم الأمر `git branch` لإنشاء فرع يحتوي على التغييرات التي يعتزم المساهمة بها:
@ -463,7 +460,7 @@ flowchart LR
git branch [branch-name]
```
> 💡 **نهج حديث**: يمكنك أيضًا إنشاء والتبديل إلى الفرع الجديد في أمر واحد:
> 💡 **النهج الحديث**: يمكنك أيضًا إنشاء والتبديل إلى الفرع الجديد في أمر واحد:
```bash
git switch -c [branch-name]
```
@ -476,7 +473,7 @@ flowchart LR
> 💡 **ملاحظة حديثة**: `git switch` هو البديل الحديث لـ `git checkout` عند تغيير الفروع. إنه أكثر وضوحًا وأمانًا للمبتدئين.
1. **قم بالعمل**. في هذه المرحلة، تريد إضافة تغييراتك. لا تنس إخبار Git بذلك باستخدام الأوامر التالية:
1. **قم بالعمل**. في هذه المرحلة تريد إضافة تغييراتك. لا تنس إخبار Git بذلك باستخدام الأوامر التالية:
```bash
git add .
@ -485,21 +482,21 @@ flowchart LR
> ⚠️ **جودة رسالة الالتزام**: تأكد من إعطاء الالتزام اسمًا جيدًا، سواء من أجلك أو من أجل المسؤول عن المستودع الذي تساعد فيه. كن محددًا بشأن ما قمت بتغييره!
1. **دمج عملك مع فرع `main`**. في مرحلة ما تكون قد انتهيت من العمل وتريد دمج عملك مع عمل فرع `main`. قد يكون فرع `main` قد تغير في هذه الأثناء لذا تأكد أولاً من تحديثه إلى أحدث إصدار باستخدام الأوامر التالية:
1. **دمج عملك مع فرع `main`**. في مرحلة ما تكون قد انتهيت من العمل وتريد دمج عملك مع عمل فرع `main`. قد يكون فرع `main` قد تغير في هذه الأثناء لذا تأكد من تحديثه أولاً إلى الأحدث باستخدام الأوامر التالية:
```bash
git switch main
git pull
```
في هذه المرحلة تريد التأكد من أن أي _تعارضات_، وهي الحالات التي لا يستطيع Git بسهولة _دمج_ التغييرات، تحدث في فرع العمل الخاص بك. لذلك قم بتشغيل الأوامر التالية:
في هذه المرحلة تريد التأكد من أن أي _تعارضات_، حالات حيث لا يمكن لـ Git بسهولة _دمج_ التغييرات تحدث في فرع العمل الخاص بك. لذلك قم بتشغيل الأوامر التالية:
```bash
git switch [branch_name]
git merge main
```
أمر `git merge main` سيجلب جميع التغييرات من `main` إلى فرعك. نأمل أن تتمكن من المتابعة بسهولة. إذا لم يكن الأمر كذلك، سيخبرك VS Code بالمكان الذي يكون فيه Git _مرتبكًا_ وستقوم بتعديل الملفات المتأثرة لتحديد المحتوى الأكثر دقة.
الأمر `git merge main` سيجلب جميع التغييرات من `main` إلى فرعك. نأمل أن تتمكن من المتابعة فقط. إذا لم يكن الأمر كذلك، سيخبرك VS Code بالمكان الذي يكون فيه Git _مرتبكًا_ وتقوم فقط بتعديل الملفات المتأثرة لتحديد أي محتوى هو الأكثر دقة.
💡 **بديل حديث**: فكر في استخدام `git rebase` للحصول على تاريخ أنظف:
```bash
@ -513,35 +510,34 @@ flowchart LR
git push --set-upstream origin [branch-name]
```
الأمر أعلاه ينشئ الفرع على مستودعك المنسوخ.
الأمر أعلاه ينشئ الفرع على مستودعك المتفرع.
### 🤝 **اختبار مهارات التعاون: هل أنت جاهز للعمل مع الآخرين؟**
### 🤝 **فحص مهارات التعاون: هل أنت جاهز للعمل مع الآخرين؟**
**لنرى كيف تشعر بشأن التعاون:**
- هل فكرة النسخ وطلبات السحب أصبحت واضحة لك الآن؟
- ما هو الشيء الذي تريد ممارسته أكثر بشأن العمل مع الفروع؟
- ما مدى راحتك في المساهمة في مشروع شخص آخر؟
- هل فكرة التفرع وطلبات السحب أصبحت منطقية بالنسبة لك الآن؟
- ما هو الشيء الوحيد حول العمل مع الفروع الذي تريد ممارسته أكثر؟
- ما مدى شعورك بالراحة بشأن المساهمة في مشروع شخص آخر؟
```mermaid
mindmap
root((Git Collaboration))
root((التعاون باستخدام Git))
Branching
Feature branches
Bug fix branches
Experimental work
فروع الميزات
فروع إصلاح الأخطاء
العمل التجريبي
Pull Requests
Code review
Discussion
Testing
مراجعة الكود
المناقشة
الاختبار
Best Practices
Clear commit messages
Small focused changes
Good documentation
رسائل التزام واضحة
تغييرات صغيرة ومركزة
توثيق جيد
```
> **معزز الثقة**: كل مطور تعجب به كان يومًا ما متوترًا بشأن أول طلب سحب له. مجتمع GitHub مرحب جدًا بالمبتدئين!
> **تعزيز الثقة**: كل مطور تعجب به كان يومًا ما متوترًا بشأن أول طلب سحب له. مجتمع GitHub مرحب جدًا بالمبتدئين!
1. **افتح طلب سحب**. بعد ذلك، تريد فتح طلب سحب. تقوم بذلك عن طريق التنقل إلى المستودع المنسوخ على GitHub. سترى مؤشرًا على GitHub يسأل ما إذا كنت تريد إنشاء طلب سحب جديد، تضغط على ذلك وستنتقل إلى واجهة حيث يمكنك تغيير عنوان رسالة الالتزام، وإعطائها وصفًا أكثر ملاءمة. الآن سيرى المسؤول عن المستودع الذي نسخته هذا الطلب و _بإذن الله_ سيقدر ويقوم بـ _دمج_ طلب السحب الخاص بك. أنت الآن مساهم، تهانينا :)
1. **افتح طلب سحب**. بعد ذلك، تريد فتح طلب سحب. تقوم بذلك عن طريق الانتقال إلى المستودع المتفرع على GitHub. سترى مؤشرًا على GitHub حيث يسألك ما إذا كنت تريد إنشاء طلب سحب جديد، تنقر على ذلك ويتم نقلك إلى واجهة حيث يمكنك تغيير عنوان رسالة الالتزام، وإعطائها وصفًا أكثر ملاءمة. الآن سيرى المسؤول عن المستودع الذي قمت بتفرعه هذا الطلب و _أصابعك متقاطعة_ سيقدر ويقوم بـ _دمج_ طلب السحب الخاص بك. أنت الآن مساهم، ياي :)
💡 **نصيحة حديثة**: يمكنك أيضًا إنشاء طلبات السحب باستخدام GitHub CLI:
```bash
@ -554,142 +550,142 @@ mindmap
- اطلب مراجعين محددين.
- استخدم طلبات السحب المؤقتة للعمل الجاري.
- تأكد من اجتياز جميع فحوصات CI قبل طلب المراجعة.
1. **تنظيف العمل**. يُعتبر من الممارسات الجيدة أن تقوم بـ _تنظيف العمل_ بعد دمج طلب السحب بنجاح. يجب عليك تنظيف كل من الفرع المحلي والفرع الذي قمت بدفعه إلى GitHub. أولاً، دعنا نحذفه محليًا باستخدام الأمر التالي:
1. **تنظيف العمل**. يُعتبر من الممارسات الجيدة أن تقوم بـ _تنظيف العمل_ بعد دمج طلب السحب (PR) بنجاح. يجب عليك تنظيف كل من الفرع المحلي والفرع الذي قمت بدفعه إلى GitHub. أولاً، لنقم بحذفه محليًا باستخدام الأمر التالي:
```bash
git branch -d [branch-name]
```
تأكد من الذهاب إلى صفحة GitHub للمستودع المشتق بعد ذلك وإزالة الفرع البعيد الذي قمت بدفعه إليه.
`طلب السحب` يبدو كأنه مصطلح غريب لأنك في الواقع تريد دفع تغييراتك إلى المشروع. ولكن يجب على المسؤول (مالك المشروع) أو الفريق الأساسي أن ينظر في تغييراتك قبل دمجها مع الفرع "الرئيسي" للمشروع، لذا فأنت في الواقع تطلب قرار تغيير من المسؤول.
تأكد من الذهاب إلى صفحة GitHub الخاصة بالمستودع المتشعب بعد ذلك وإزالة الفرع البعيد الذي قمت بدفعه إليه.
طلب السحب هو المكان الذي يتم فيه مقارنة ومناقشة الفروقات التي تم إدخالها على فرع معين مع المراجعات، التعليقات، الاختبارات المدمجة، والمزيد. طلب السحب الجيد يتبع تقريبًا نفس قواعد رسالة الالتزام. يمكنك إضافة مرجع إلى مشكلة في متتبع المشاكل، عندما يكون عملك على سبيل المثال يحل مشكلة. يتم ذلك باستخدام `#` متبوعًا برقم المشكلة. على سبيل المثال `#97`.
`طلب السحب` قد يبدو مصطلحًا غريبًا لأنه في الواقع تريد دفع تغييراتك إلى المشروع. ولكن المالك (صاحب المشروع) أو الفريق الأساسي يحتاج إلى مراجعة تغييراتك قبل دمجها مع الفرع "الرئيسي" للمشروع، لذا فأنت في الحقيقة تطلب قرارًا بشأن التغيير من المالك.
طلب السحب هو المكان الذي يتم فيه مقارنة ومناقشة الفروقات التي تم إدخالها على فرع معين مع المراجعات، التعليقات، الاختبارات المدمجة، والمزيد. طلب السحب الجيد يتبع تقريبًا نفس قواعد رسالة الالتزام. يمكنك إضافة مرجع إلى مشكلة في متتبع القضايا، عندما تقوم مثلاً بحل مشكلة. يتم ذلك باستخدام `#` متبوعًا برقم المشكلة. على سبيل المثال `#97`.
🤞نتمنى أن تمر جميع الفحوصات بنجاح وأن يقوم مالك المشروع بدمج تغييراتك في المشروع🤞
قم بتحديث الفرع المحلي الحالي الذي تعمل عليه بجميع الالتزامات الجديدة من الفرع البعيد المقابل على GitHub:
قم بتحديث الفرع المحلي الحالي بجميع الالتزامات الجديدة من الفرع البعيد المقابل على GitHub:
`git pull`
## المساهمة في المصادر المفتوحة (فرصتك لإحداث تأثير!)
هل أنت مستعد لشيء سيذهلك تمامًا؟ 🤯 دعنا نتحدث عن المساهمة في مشاريع المصادر المفتوحة – وأنا أشعر بالقشعريرة فقط من التفكير في مشاركة هذا معك!
هل أنت مستعد لشيء سيذهلك تمامًا؟ 🤯 دعنا نتحدث عن المساهمة في مشاريع المصادر المفتوحة – وأنا أشعر بالقشعريرة فقط من التفكير في مشاركتها معك!
هذه فرصتك لتكون جزءًا من شيء استثنائي حقًا. تخيل تحسين الأدوات التي يستخدمها ملايين المطورين يوميًا، أو إصلاح خطأ في تطبيق يحبه أصدقاؤك. هذا ليس مجرد حلم – هذا هو ما تدور حوله مساهمة المصادر المفتوحة!
هذه فرصتك لتكون جزءًا من شيء استثنائي حقًا. تخيل تحسين الأدوات التي يستخدمها ملايين المطورين يوميًا، أو إصلاح خطأ في تطبيق يحبه أصدقاؤك. هذا ليس مجرد حلم – هذا هو جوهر المساهمة في المصادر المفتوحة!
ما يجعلني أشعر بالإثارة في كل مرة أفكر في ذلك: كل أداة كنت تتعلم بها – محرر الكود الخاص بك، الأطر التي سنستكشفها، حتى المتصفح الذي تقرأ فيه هذا – بدأت بشخص مثلك تمامًا يقوم بأول مساهمة له. ذلك المطور الرائع الذي بنى امتداد VS Code المفضل لديك؟ كان يومًا ما مبتدئًا ينقر على "إنشاء طلب سحب" بأيدٍ مرتجفة، تمامًا كما أنت على وشك القيام به.
إليك ما يجعلني أشعر بالحماس في كل مرة أفكر في الأمر: كل أداة كنت تتعلم بها – محرر الأكواد الخاص بك، الأطر التي سنستكشفها، وحتى المتصفح الذي تقرأ فيه هذا النص – بدأت بشخص مثلك تمامًا يقوم بأول مساهمة له. ذلك المطور الرائع الذي أنشأ امتداد VS Code المفضل لديك؟ كان يومًا ما مبتدئًا ينقر على "إنشاء طلب سحب" بيدين مرتجفتين، تمامًا كما ستفعل الآن.
وهنا الجزء الأكثر جمالًا: مجتمع المصادر المفتوحة يشبه أكبر عناق جماعي على الإنترنت. معظم المشاريع تبحث بنشاط عن القادمين الجدد ولديها مشاكل موسومة بـ "good first issue" خصيصًا للأشخاص مثلك! المسؤولون يشعرون بالحماس عندما يرون مساهمين جدد لأنهم يتذكرون خطواتهم الأولى.
والجزء الأكثر جمالًا: مجتمع المصادر المفتوحة يشبه أكبر عناق جماعي على الإنترنت. معظم المشاريع تبحث بنشاط عن القادمين الجدد ولديها قضايا موسومة بـ "good first issue" خصيصًا لأشخاص مثلك! يشعر المسؤولون بالحماس عندما يرون مساهمين جدد لأنهم يتذكرون خطواتهم الأولى.
```mermaid
flowchart TD
A[🔍 Explore GitHub] --> B[🏷️ Find "good first issue"]
B --> C[📖 Read Contributing Guidelines]
C --> D[🍴 Fork Repository]
D --> E[💻 Set Up Local Environment]
E --> F[🌿 Create Feature Branch]
F --> G[✨ Make Your Contribution]
G --> H[🧪 Test Your Changes]
H --> I[📝 Write Clear Commit]
I --> J[📤 Push & Create PR]
J --> K[💬 Engage with Feedback]
K --> L[🎉 Merged! You're a Contributor!]
L --> M[🌟 Find Next Issue]
A[🔍 استكشاف GitHub] --> B[🏷️ العثور على "مشكلة أولى جيدة"]
B --> C[📖 قراءة إرشادات المساهمة]
C --> D[🍴 استنساخ المستودع]
D --> E[💻 إعداد البيئة المحلية]
E --> F[🌿 إنشاء فرع الميزة]
F --> G[✨ قم بمساهمتك]
G --> H[🧪 اختبار التغييرات الخاصة بك]
H --> I[📝 كتابة التزام واضح]
I --> J[📤 دفع وإنشاء طلب دمج]
J --> K[💬 التفاعل مع الملاحظات]
K --> L[🎉 تم الدمج! أنت مساهم!]
L --> M[🌟 العثور على المشكلة التالية]
style A fill:#e1f5fe
style L fill:#c8e6c9
style M fill:#fff59d
```
أنت لا تتعلم البرمجة فقط هنا – أنت تستعد للانضمام إلى عائلة عالمية من البنائين الذين يستيقظون كل يوم وهم يفكرون "كيف يمكننا جعل العالم الرقمي أفضل قليلاً؟" مرحبًا بك في النادي! 🌟
أنت لا تتعلم البرمجة فقط هنا – بل تستعد للانضمام إلى عائلة عالمية من البُناة الذين يستيقظون كل يوم وهم يفكرون "كيف يمكننا جعل العالم الرقمي أفضل قليلاً؟" مرحبًا بك في النادي! 🌟
أولاً، دعنا نجد مستودعًا (أو **repo**) على GitHub يثير اهتمامك وترغب في المساهمة بتغيير فيه. ستحتاج إلى نسخ محتوياته إلى جهازك.
أولاً، دعنا نجد مستودعًا (أو **repo**) على GitHub يثير اهتمامك وترغب في المساهمة فيه. ستحتاج إلى نسخ محتوياته إلى جهازك.
✅ طريقة جيدة للعثور على مستودعات مناسبة للمبتدئين هي [البحث باستخدام الوسم 'good-first-issue'](https://github.blog/2020-01-22-browse-good-first-issues-to-start-contributing-to-open-source/).
✅ طريقة جيدة للعثور على مستودعات "مناسبة للمبتدئين" هي [البحث باستخدام الوسم 'good-first-issue'](https://github.blog/2020-01-22-browse-good-first-issues-to-start-contributing-to-open-source/).
هناك عدة طرق لنسخ الكود. إحدى الطرق هي "استنساخ" محتويات المستودع باستخدام HTTPS، SSH، أو باستخدام GitHub CLI (واجهة سطر الأوامر).
هناك عدة طرق لنسخ الأكواد. إحدى الطرق هي "استنساخ" محتويات المستودع باستخدام HTTPS، SSH، أو باستخدام GitHub CLI (واجهة سطر الأوامر).
افتح الطرفية الخاصة بك واستنسخ المستودع كالتالي:
افتح الطرفية الخاصة بك واستنسخ المستودع كالتالي:
```bash
# Using HTTPS
# استخدام HTTPS
git clone https://github.com/ProjectURL
# Using SSH (requires SSH key setup)
# استخدام SSH (يتطلب إعداد مفتاح SSH)
git clone git@github.com:username/repository.git
# Using GitHub CLI
# استخدام GitHub CLI
gh repo clone username/repository
```
للعمل على المشروع، انتقل إلى المجلد الصحيح:
للعمل على المشروع، انتقل إلى المجلد الصحيح:
`cd ProjectURL`
يمكنك أيضًا فتح المشروع بالكامل باستخدام:
- **[GitHub Codespaces](https://github.com/features/codespaces)** - بيئة تطوير سحابية من GitHub مع VS Code في المتصفح
- **[GitHub Desktop](https://desktop.github.com/)** - تطبيق واجهة المستخدم الرسومية لعمليات Git
- **[GitHub.dev](https://github.dev)** - اضغط على المفتاح `.` على أي مستودع GitHub لفتح VS Code في المتصفح
- **VS Code** مع امتداد طلبات السحب من GitHub
يمكنك أيضًا فتح المشروع بالكامل باستخدام:
- **[GitHub Codespaces](https://github.com/features/codespaces)** - بيئة تطوير سحابية من GitHub مع VS Code في المتصفح
- **[GitHub Desktop](https://desktop.github.com/)** - تطبيق واجهة رسومية لعمليات Git
- **[GitHub.dev](https://github.dev)** - اضغط على المفتاح `.` على أي مستودع GitHub لفتح VS Code في المتصفح
- **VS Code** مع امتداد طلبات السحب من GitHub
أخيرًا، يمكنك تنزيل الكود في مجلد مضغوط.
### بعض الأشياء المثيرة للاهتمام حول GitHub
يمكنك وضع نجمة، متابعة و/أو "استنساخ" أي مستودع عام على GitHub. يمكنك العثور على المستودعات التي وضعت لها نجمة في القائمة المنسدلة في الزاوية العلوية اليمنى. إنه مثل الإشارات المرجعية، ولكن للكود.
يمكنك وضع نجمة، متابعة أو "تشعب" أي مستودع عام على GitHub. يمكنك العثور على المستودعات التي وضعت لها نجمة في القائمة المنسدلة في الزاوية العلوية اليمنى. يشبه ذلك الإشارات المرجعية، ولكن للأكواد.
المشاريع لديها متتبع مشاكل، غالبًا على GitHub في علامة التبويب "Issues" ما لم يُذكر خلاف ذلك، حيث يناقش الناس المشاكل المتعلقة بالمشروع. وعلامة التبويب طلبات السحب هي المكان الذي يناقش فيه الناس ويستعرضون التغييرات التي قيد التنفيذ.
المشاريع لديها متتبع قضايا، غالبًا على GitHub في علامة التبويب "Issues" ما لم يُذكر خلاف ذلك، حيث يناقش الناس القضايا المتعلقة بالمشروع. وعلامة التبويب Pull Requests هي المكان الذي يناقش فيه الناس ويستعرضون التغييرات التي قيد التنفيذ.
قد يكون للمشاريع أيضًا مناقشات في المنتديات، قوائم البريد الإلكتروني، أو قنوات الدردشة مثل Slack، Discord أو IRC.
قد تحتوي المشاريع أيضًا على مناقشات في المنتديات، قوائم بريدية، أو قنوات دردشة مثل Slack، Discord أو IRC.
- **علامة التبويب Actions** - عرض سير العمل الآلي وخطوط CI/CD
- **علامة التبويب Insights** - تحليلات حول المساهمين، الالتزامات، وصحة المشروع
- **علامة التبويب Projects** - أدوات إدارة المشاريع المدمجة في GitHub
✅ ألقِ نظرة حول مستودع GitHub الجديد الخاص بك وجرب بعض الأشياء، مثل تعديل الإعدادات، إضافة معلومات إلى المستودع، إنشاء مشروع (مثل لوحة Kanban)، وإعداد إجراءات GitHub للتشغيل الآلي. هناك الكثير مما يمكنك القيام به!
✅ ألقِ نظرة حول مستودع GitHub الجديد الخاص بك وجرب بعض الأشياء، مثل تعديل الإعدادات، إضافة معلومات إلى المستودع، إنشاء مشروع (مثل لوحة Kanban)، وإعداد GitHub Actions للأتمتة. هناك الكثير لتفعله!
---
## 🚀 التحدي
## 🚀 التحدي
حسنًا، حان الوقت لاختبار مهاراتك الجديدة في GitHub! 🚀 إليك تحديًا سيجعل كل شيء يتضح بطريقة مرضية للغاية:
اجلب صديقًا (أو أحد أفراد العائلة الذي يسأل دائمًا عما تفعله بكل هذا "الأشياء المتعلقة بالحاسوب") وانطلقا في مغامرة برمجية تعاونية معًا! هنا حيث يحدث السحر الحقيقي – أنشئ مشروعًا، دعهم يستنسخونه، أنشئ بعض الفروع، وادمج التغييرات مثل المحترفين الذين أصبحتما عليه.
اجلب صديقًا (أو أحد أفراد العائلة الذي يسألك دائمًا عما تفعله بكل هذا "الأشياء الحاسوبية") وانطلقا في مغامرة ترميز تعاونية معًا! هنا حيث يحدث السحر الحقيقي – أنشئ مشروعًا، دعهم يتشعبونه، أنشئ بعض الفروع، وادمج التغييرات مثل المحترفين الذين أصبحتما عليه.
لن أكذب – ربما ستضحكون في مرحلة ما (خاصة عندما تحاولان تغيير نفس السطر)، ربما تخدشان رأسيكما في حيرة، لكن بالتأكيد ستحصلان على تلك اللحظات الرائعة "آها!" التي تجعل كل التعلم يستحق العناء. بالإضافة إلى ذلك، هناك شيء خاص حول مشاركة أول دمج ناجح مع شخص آخر – إنه مثل احتفال صغير بمدى تقدمكما!
لن أكذب – ربما تضحكان في مرحلة ما (خاصة عندما تحاولان تغيير نفس السطر)، وربما تحكان رأسيكما في حيرة، لكن بالتأكيد ستحصلان على تلك اللحظات الرائعة "آها!" التي تجعل كل التعلم يستحق العناء. بالإضافة إلى ذلك، هناك شيء خاص حول مشاركة أول دمج ناجح مع شخص آخر – إنه مثل احتفال صغير بمدى تقدمكما!
ليس لديك شريك برمجة بعد؟ لا تقلق على الإطلاق! مجتمع GitHub مليء بأشخاص مرحبين للغاية يتذكرون كيف كان الأمر عندما كانوا جددًا. ابحث عن مستودعات تحمل وسوم "good first issue" – إنها تقول أساسًا "مرحبًا بالمبتدئين، تعالوا تعلموا معنا!" كم هذا رائع؟
لا تملك شريكًا في البرمجة بعد؟ لا تقلق على الإطلاق! مجتمع GitHub مليء بأشخاص مرحبين للغاية يتذكرون كيف كان الأمر عندما كانوا مبتدئين. ابحث عن مستودعات تحمل وسم "good first issue" – إنها تقول أساسًا "مرحبًا بالمبتدئين، تعالوا تعلموا معنا!" كم هذا رائع؟
## اختبار ما بعد المحاضرة
## اختبار ما بعد المحاضرة
[اختبار ما بعد المحاضرة](https://ff-quizzes.netlify.app/web/en/)
## المراجعة ومواصلة التعلم
## المراجعة والاستمرار في التعلم
واو! 🎉 انظر إليك – لقد أتقنت أساسيات GitHub مثل بطل حقيقي! إذا شعرت أن عقلك ممتلئ قليلاً الآن، فهذا طبيعي تمامًا وبصراحة علامة جيدة. لقد تعلمت للتو أدوات استغرقني أسابيع لأشعر بالراحة معها عندما بدأت.
واو! 🎉 انظر إليك – لقد تغلبت على أساسيات GitHub مثل بطل حقيقي! إذا شعرت أن عقلك ممتلئ قليلاً الآن، فهذا طبيعي تمامًا وبصراحة علامة جيدة. لقد تعلمت أدوات استغرقني أسابيع لأشعر بالراحة معها عندما بدأت.
Git وGitHub قويان للغاية (بجدية، قويان جدًا)، وكل مطور أعرفه – بما في ذلك أولئك الذين يبدون كالسحرة الآن – كان عليهم التدرب والتعثر قليلاً قبل أن ينقر كل شيء. حقيقة أنك أكملت هذا الدرس تعني أنك بالفعل في طريقك لإتقان بعض من أهم الأدوات في مجموعة أدوات المطور.
Git وGitHub قويان للغاية (بجدية قويان)، وكل مطور أعرفه – بما في ذلك أولئك الذين يبدو أنهم سحرة الآن – كان عليهم أن يمارسوا ويتعثروا قليلاً قبل أن ينقر كل شيء. حقيقة أنك أكملت هذا الدرس تعني أنك بالفعل في طريقك لإتقان بعض من أهم الأدوات في مجموعة أدوات المطور.
إليك بعض الموارد الرائعة لمساعدتك على التدرب وتصبح أكثر روعة:
إليك بعض الموارد الرائعة لمساعدتك على الممارسة وتصبح أكثر روعة:
- [دليل المساهمة في برامج المصادر المفتوحة](https://opensource.guide/how-to-contribute/#how-to-submit-a-contribution) – خارطة طريقك لإحداث فرق
- [ورقة الغش لـ Git](https://training.github.com/downloads/github-git-cheat-sheet/) – احتفظ بها في متناول يدك للرجوع السريع!
- [دليل المساهمة في برامج المصادر المفتوحة](https://opensource.guide/how-to-contribute/#how-to-submit-a-contribution) – خارطة طريقك لإحداث فرق
- [ورقة غش Git](https://training.github.com/downloads/github-git-cheat-sheet/) – احتفظ بها في متناول يدك للرجوع السريع!
وتذكر: الممارسة تصنع التقدم، وليس الكمال! كلما استخدمت Git وGitHub، أصبح الأمر طبيعيًا أكثر. لقد أنشأت GitHub بعض الدورات التفاعلية الرائعة التي تتيح لك الممارسة في بيئة آمنة:
وتذكر: الممارسة تصنع التقدم، وليس الكمال! كلما استخدمت Git وGitHub، أصبح الأمر أكثر طبيعية. لقد أنشأت GitHub بعض الدورات التفاعلية المذهلة التي تتيح لك التدرب في بيئة آمنة:
- [مقدمة إلى GitHub](https://github.com/skills/introduction-to-github)
- [مقدمة إلى GitHub](https://github.com/skills/introduction-to-github)
- [التواصل باستخدام Markdown](https://github.com/skills/communicate-using-markdown)
**الوصف:** أنشئ مشروع تطوير ويب تعاوني يعرض سير العمل الكامل لـ GitHub الذي تعلمته في هذا الدرس. سيساعدك هذا التحدي على ممارسة إنشاء المستودعات، ميزات التعاون، وسير العمل الحديث لـ Git في سيناريو واقعي.
**المهمة:** أنشئ مستودع GitHub عام جديد لمشروع بسيط "موارد تطوير الويب". يجب أن يتضمن المستودع ملف README.md منظمًا بشكل جيد يسرد أدوات وموارد تطوير الويب المفيدة، مصنفة حسب الفئات (HTML، CSS، JavaScript، إلخ). قم بإعداد المستودع بمعايير المجتمع المناسبة بما في ذلك الترخيص، إرشادات المساهمة، ومدونة السلوك. أنشئ على الأقل فرعين للميزات: واحد لإضافة موارد CSS وآخر لموارد JavaScript. قم بعمل التزامات لكل فرع مع رسائل التزام وصفية، ثم أنشئ طلبات سحب لدمج التغييرات مرة أخرى إلى الفرع الرئيسي. قم بتمكين ميزات GitHub مثل المشاكل، المناقشات، وقم بإعداد سير عمل أساسي لـ GitHub Actions لفحوصات تلقائية.
**المهمة:** أنشئ مستودعًا عامًا جديدًا على GitHub لمشروع بسيط "موارد تطوير الويب". يجب أن يتضمن المستودع ملف README.md منظمًا جيدًا يسرد أدوات وموارد تطوير الويب المفيدة، مصنفة حسب الفئات (HTML، CSS، JavaScript، إلخ). قم بإعداد المستودع بمعايير المجتمع المناسبة بما في ذلك الترخيص، إرشادات المساهمة، ومدونة السلوك. أنشئ فرعين للميزات على الأقل: واحد لإضافة موارد CSS وآخر لموارد JavaScript. قم بعمل التزامات لكل فرع مع رسائل التزام وصفية، ثم أنشئ طلبات سحب لدمج التغييرات مرة أخرى إلى الفرع الرئيسي. قم بتمكين ميزات GitHub مثل القضايا، المناقشات، وقم بإعداد سير عمل GitHub Actions الأساسي لفحوصات آلية.
## المهمة
## المهمة
مهمتك، إذا اخترت قبولها: أكمل دورة [مقدمة إلى GitHub](https://github.com/skills/introduction-to-github) على GitHub Skills. ستتيح لك هذه الدورة التفاعلية ممارسة كل ما تعلمته في بيئة آمنة وموجهة. بالإضافة إلى ذلك، ستحصل على شارة رائعة عند الانتهاء! 🏅
**تشعر بالاستعداد لمزيد من التحديات؟**
- قم بإعداد مصادقة SSH لحساب GitHub الخاص بك (لا مزيد من كلمات المرور!)
- جرب استخدام GitHub CLI لعمليات Git اليومية
- أنشئ مستودعًا مع سير عمل GitHub Actions
- استكشف GitHub Codespaces بفتح هذا المستودع نفسه في محرر قائم على السحابة
**تشعر أنك مستعد لمزيد من التحديات؟**
- قم بإعداد مصادقة SSH لحساب GitHub الخاص بك (لا مزيد من كلمات المرور!)
- جرب استخدام GitHub CLI لعمليات Git اليومية الخاصةبك
- أنشئ مستودعًا مع سير عمل GitHub Actions
- استكشف GitHub Codespaces بفتح هذا المستودع نفسه في محرر قائم على السحابة
---
## 🚀 جدول زمني لإتقان GitHub الخاص بك
### ⚡ **ما يمكنك القيام به في الدقائق الخمس القادمة**
- [ ] ضع نجمة لهذا المستودع و3 مشاريع أخرى تثير اهتمامك
- [ ] قم بإعداد المصادقة الثنائية على حساب GitHub الخاص بك
- [ ] أنشئ README بسيط لأول مستودع لك
- [ ] تابع 5 مطورين يلهمك عملهم
### 🎯 **ما يمكنك إنجازه خلال هذه الساعة**
- [ ] أكمل اختبار ما بعد الدرس وفكر في رحلتك مع GitHub
- [ ] قم بإعداد مفاتيح SSH لمصادقة GitHub بدون كلمات مرور
- [ ] أنشئ أول التزام ذو معنى مع رسالة التزام رائعة
- [ ] استكشف علامة التبويب "استكشاف" في GitHub لاكتشاف المشاريع الرائجة
- [ ] مارس استنساخ مستودع وإجراء تغيير صغير
- [ ] ضع نجمة لهذا المستودع و3 مشاريع أخرى تهمك
- [ ] قم بإعداد المصادقة الثنائية على حساب GitHub الخاص بك
- [ ] أنشئ README بسيط لأول مستودع خاص بك
- [ ] تابع 5 مطورين يلهمك عملهم
### 🎯 **ما يمكنك تحقيقه خلال هذه الساعة**
- [ ] أكمل اختبار ما بعد الدرس وفكر في رحلتك مع GitHub
- [ ] قم بإعداد مفاتيح SSH لمصادقة GitHub بدون كلمة مرور
- [ ] أنشئ أول التزام ذو معنى مع رسالة التزام رائعة
- [ ] استكشف علامة التبويب "استكشاف" في GitHub لاكتشاف المشاريع الرائجة
- [ ] جرب GitHub Codespaces للتطوير القائم على السحابة
### 🌟 **تحولك الشهري**
- [ ] ساهم في 3 مشاريع مفتوحة المصدر مختلفة
- [ ] قم بتوجيه شخص جديد إلى GitHub (رد الجميل!)
- [ ] قم بإعداد سير عمل آلي باستخدام GitHub Actions
- [ ] أنشئ محفظة تعرض مساهماتك في GitHub
- [ ] شارك في Hacktoberfest أو أحداث مجتمعية مشابهة
- [ ] كن مسؤولاً عن مشروعك الخاص الذي يساهم فيه الآخرون
### 🎓 **فحص إتقان GitHub النهائي**
**احتفل بمدى تقدمك:**
- ما هو الشيء المفضل لديك في استخدام GitHub؟
- أي ميزة تعاون تثير حماسك أكثر؟
- ما مدى ثقتك الآن في المساهمة في المصادر المفتوحة؟
- ما هو أول مشروع تريد المساهمة فيه؟
```mermaid
journey
title Your GitHub Confidence Journey
section Today
Nervous: 3: You
Curious: 4: You
Excited: 5: You
section This Week
Practicing: 4: You
Contributing: 5: You
Connecting: 5: You
section Next Month
Collaborating: 5: You
Leading: 5: You
Inspiring Others: 5: You
title رحلة ثقتك بـ GitHub
section اليوم
متوتر: 3: أنت
فضولي: 4: أنت
متحمس: 5: أنت
section هذا الأسبوع
ممارسة: 4: أنت
مساهمة: 5: أنت
تواصل: 5: أنت
section الشهر القادم
تعاون: 5: أنت
قيادة: 5: أنت
إلهام الآخرين: 5: أنت
```
> 🌍 **مرحبًا بك في مجتمع المطورين العالمي!** لديك الآن الأدوات اللازمة للتعاون مع ملايين المطورين حول العالم. قد تبدو مساهمتك الأولى صغيرة، لكن تذكر - كل مشروع مفتوح المصدر كبير بدأ بشخص يقوم بأول التزام له. السؤال ليس إذا كنت ستحدث تأثيرًا، بل ما هو المشروع الرائع الذي سيستفيد من وجهة نظرك الفريدة أولاً! 🚀
> 🌍 **مرحبًا بك في مجتمع المطورين العالمي!** لديك الآن الأدوات للتعاون مع ملايين المطورين حول العالم. قد تبدو مساهمتك الأولى صغيرة، لكن تذكر - كل مشروع مفتوح المصدر كبير بدأ بشخص يقوم بأول التزام له. السؤال ليس ما إذا كنت ستحدث تأثيرًا، بل ما هو المشروع المذهل الذي سيستفيد من وجهة نظرك الفريدة أولاً! 🚀
تذكر: كل خبير كان يومًا ما مبتدئًا. أنت قادر على ذلك! 💪
تذكر: كل خبير كان يومًا مبتدئًا. أنت قادر على ذلك! 💪
---
<!-- CO-OP TRANSLATOR DISCLAIMER START -->
**إخلاء المسؤولية**:
تم ترجمة هذا المستند باستخدام خدمة الترجمة بالذكاء الاصطناعي [Co-op Translator](https://github.com/Azure/co-op-translator). بينما نسعى لتحقيق الدقة، يرجى العلم أن الترجمات الآلية قد تحتوي على أخطاء أو عدم دقة. يجب اعتبار المستند الأصلي بلغته الأصلية المصدر الرسمي. للحصول على معلومات حاسمة، يُوصى بالترجمة البشرية الاحترافية. نحن غير مسؤولين عن أي سوء فهم أو تفسيرات خاطئة تنشأ عن استخدام هذه الترجمة.
تم ترجمة هذا المستند باستخدام خدمة الترجمة بالذكاء الاصطناعي [Co-op Translator](https://github.com/Azure/co-op-translator). بينما نسعى لتحقيق الدقة، يرجى العلم أن الترجمات الآلية قد تحتوي على أخطاء أو عدم دقة. يجب اعتبار المستند الأصلي بلغته الأصلية المصدر الرسمي. للحصول على معلومات حاسمة، يُوصى بالترجمة البشرية الاحترافية. نحن غير مسؤولين عن أي سوء فهم أو تفسيرات خاطئة ناتجة عن استخدام هذه الترجمة.
[](https://GitHub.com/microsoft/Web-Dev-For-Beginners/pulls/)
[](https://GitHub.com/microsoft/Web-Dev-For-Beginners/pulls/)
تعلم أساسيات تطوير الويب من خلال دورة شاملة لمدة 12 أسبوعًا مقدمة من Microsoft Cloud Advocates. تتناول كل من الدروس الـ 24 JavaScript وCSS وHTML من خلال مشاريع عملية مثل الحدائق الزجاجية، إضافات المتصفح، وألعاب الفضاء. شارك في الاختبارات، المناقشات، والواجبات العملية. عزز مهاراتك وحسّن استيعابك للمعرفة من خلال منهجنا الفعّال القائم على المشاريع. ابدأ رحلتك في البرمجة اليوم!
تعلم أساسيات تطوير الويب من خلال دورة شاملة لمدة 12 أسبوعًا مقدمة من Microsoft Cloud Advocates. تتناول كل واحدة من الدروس الـ 24 مواضيع JavaScript وCSS وHTML من خلال مشاريع عملية مثل الحدائق الزجاجية، وإضافات المتصفح، وألعاب الفضاء. شارك في الاختبارات، والنقاشات، والواجبات العملية. عزز مهاراتك وحسن استيعابك للمعرفة من خلال منهجنا التعليمي القائم على المشاريع. ابدأ رحلتك في البرمجة اليوم!
انضم إلى مجتمع Azure AI Foundry على Discord
انضم إلى مجتمع Azure AI Foundry على Discord
[](https://discord.com/invite/ByRwuEEgH4)
**إذا كنت ترغب في دعم لغات إضافية، يمكنك الاطلاع على اللغات المدعومة [هنا](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)**
[](https://open.vscode.dev/microsoft/Web-Dev-For-Beginners)
[](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!
### 📣 إعلان - تحديات جديدة لوضع GitHub Copilot Agent لإكمالها!
تمت إضافة تحدٍ جديد، ابحث عن "تحدي وكيل GitHub Copilot 🚀" في معظم الفصول. هذا تحدٍ جديد لتكمله باستخدام GitHub Copilot ووضع الوكيل. إذا لم تستخدم وضع الوكيل من قبل، فهو قادر على إنشاء النصوص وتحرير الملفات، تشغيل الأوامر والمزيد.
تمت إضافة تحدٍ جديد، ابحث عن "تحدي GitHub Copilot Agent 🚀" في معظم الفصول. هذا تحدٍ جديد يمكنك إكماله باستخدام GitHub Copilot ووضع Agent. إذا لم تستخدم وضع Agent من قبل، فهو قادر على إنشاء النصوص وتحرير الملفات، وتشغيل الأوامر والمزيد.
### 📣 إعلان - _مشروع جديد للبناء باستخدام الذكاء الاصطناعي التوليدي_
### 📣 إعلان - _مشروع جديد للبناء باستخدام الذكاء الاصطناعي التوليدي_
تمت إضافة مشروع مساعد الذكاء الاصطناعي الجديد، تحقق منه [المشروع](./09-chat-project/README.md)
تمت إضافة مشروع مساعد الذكاء الاصطناعي الجديد، تحقق منه [المشروع](./09-chat-project/README.md)
### 📣 إعلان - _منهج جديد_ حول الذكاء الاصطناعي التوليدي لـ JavaScript تم إصداره للتو
### 📣 إعلان - _منهج جديد_ حول الذكاء الاصطناعي التوليدي لـ JavaScript تم إصداره للتو
> **المعلمون**، لقد قمنا [بتضمين بعض الاقتراحات](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** في أعلى الصفحة. سيؤدي ذلك إلى إنشاء مستودع جديد في حساب GitHub الخاص بك مع نسخة من المنهج.
اتبع هذه الخطوات:
1. **نسخ المستودع**: انقر على زر "Fork" في الزاوية العلوية اليمنى من هذه الصفحة.
#### تشغيل المنهج محليًا على جهاز الكمبيوتر الخاص بك
#### تشغيل المنهج محليًا على جهاز الكمبيوتر الخاص بك
لتشغيل هذا المنهج محليًا على جهاز الكمبيوتر الخاص بك، ستحتاج إلى محرر نصوص، متصفح وأداة سطر الأوامر. درسنا الأول، [مقدمة إلى لغات البرمجة وأدوات العمل](../../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).
توصيتنا هي استخدام [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** ونسخ الرابط:
1. استنسخ مستودعك إلى جهاز الكمبيوتر الخاص بك. يمكنك القيام بذلك بالنقر على زر **Code** ونسخ الرابط:
[CodeSpace](./images/createcodespace.png)
[CodeSpace](./images/createcodespace.png)
ثم افتح [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) وقم بتشغيل الأمر التالي، مع استبدال `<your-repository-url>` بالرابط الذي نسخته للتو:
ثم افتح [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) وقم بتشغيل الأمر التالي، مع استبدال `<your-repository-url>` بالرابط الذي نسخته للتو:
```bash
git clone <your-repository-url>
```
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) - لمعاينة صفحات HTML داخل Visual Studio Code
> * [Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot&WT.mc_id=academic-77807-sagibbon) - لمساعدتك في كتابة الكود بسرعة أكبر
> * [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، 48 اختبارًا إجمالاً، كل منها يحتوي على ثلاثة أسئلة. وهي متوفرة [هنا](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 and 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 باستخدام المتغيرات المخزنة في التخزين المحلي | [APIs، النماذج، والتخزين المحلي](./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 | تعلم الوراثة باستخدام الفئات والتكوين ونمط Pub/Sub، استعدادًا لبناء لعبة | [مقدمة في تطوير الألعاب المتقدم](./6-space-game/1-introduction/README.md) | Chris |
| 16 | [Space Game](./6-space-game/solution/README.md) | الرسم على اللوحة | تعلم واجهة برمجة التطبيقات Canvas، المستخدمة لرسم العناصر على الشاشة | [الرسم على اللوحة](./6-space-game/2-drawing-to-canvas/README.md) | Chris |
| 17 | [Space Game](./6-space-game/solution/README.md) | تحريك العناصر على الشاشة | اكتشاف كيفية اكتساب العناصر الحركة باستخدام الإحداثيات الكارتيسية وواجهة برمجة التطبيقات Canvas | [تحريك العناصر](./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) | العمل مع الذكاء الاصطناعي | تعلم كيفية بناء مساعد ذكاء اصطناعي خاص بك | [مشروع مساعد الذكاء الاصطناعي](./9-chat-project/README.md) | Chris |
| | اسم المشروع | المفاهيم التي يتم تدريسها | أهداف التعلم | الدرس المرتبط | المؤلف |
| 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 and 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 باستخدام المتغيرات المخزنة في التخزين المحلي | [APIs، النماذج، والتخزين المحلي](./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 | تعلم حول الوراثة باستخدام كل من الفئات والتكوين ونمط Pub/Sub، كتحضير لبناء لعبة | [مقدمة في تطوير الألعاب المتقدم](./6-space-game/1-introduction/README.md) | Chris |
| 16 | [Space Game](./6-space-game/solution/README.md) | الرسم على اللوحة | تعلم حول واجهة Canvas API، المستخدمة لرسم العناصر على الشاشة | [الرسم على اللوحة](./6-space-game/2-drawing-to-canvas/README.md) | Chris |
| 17 | [Space Game](./6-space-game/solution/README.md) | تحريك العناصر على الشاشة | اكتشاف كيفية تحريك العناصر باستخدام الإحداثيات الكارتيزية وواجهة Canvas API | [تحريك العناصر](./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) | العمل مع الذكاء الاصطناعي | تعلم كيفية بناء مساعد ذكاء اصطناعي خاص بك | [مشروع مساعد الذكاء الاصطناعي](./9-chat-project/README.md) | Chris |
## 🏫 طرق التدريس
## 🏫 أسلوب التدريس
تم تصميم منهجنا مع مبدأين رئيسيين في التدريس:
* التعلم القائم على المشاريع
* الاختبارات المتكررة
تم تصميم منهجنا بمبدأين رئيسيين في التدريس:
* التعلم القائم على المشاريع
* الاختبارات المتكررة
يُعلم البرنامج أساسيات JavaScript وHTML وCSS، بالإضافة إلى أحدث الأدوات والتقنيات التي يستخدمها مطورو الويب اليوم. سيحصل الطلاب على فرصة لتطوير خبرة عملية من خلال بناء لعبة كتابة، تيراريوم افتراضي، إضافة متصفح صديقة للبيئة، لعبة بأسلوب غزو الفضاء، وتطبيق مصرفي للشركات. بحلول نهاية السلسلة، سيكون لدى الطلاب فهم قوي لتطوير الويب.
يعلم البرنامج أساسيات JavaScript وHTML وCSS، بالإضافة إلى أحدث الأدوات والتقنيات التي يستخدمها مطورو الويب اليوم. سيحصل الطلاب على فرصة لتطوير خبرة عملية من خلال بناء لعبة كتابة، تيراريوم افتراضي، إضافة متصفح صديقة للبيئة، لعبة بأسلوب Space Invader، وتطبيق مصرفي للشركات. بحلول نهاية السلسلة، سيكون لدى الطلاب فهم قوي لتطوير الويب.
> 🎓 يمكنك أخذ الدروس الأولى في هذا المنهج كـ [مسار تعلم](https://docs.microsoft.com/learn/paths/web-development-101/?WT.mc_id=academic-77807-sagibbon) على Microsoft Learn!
> 🎓 يمكنك أخذ الدروس الأولى في هذا المنهج كـ [مسار تعلم](https://docs.microsoft.com/learn/paths/web-development-101/?WT.mc_id=academic-77807-sagibbon) على Microsoft Learn!
من خلال ضمان توافق المحتوى مع المشاريع، يتم جعل العملية أكثر جاذبية للطلاب وسيتم تعزيز الاحتفاظ بالمفاهيم. كما كتبنا عدة دروس تمهيدية في أساسيات JavaScript لتقديم المفاهيم، مقترنة بفيديو من مجموعة "[سلسلة المبتدئين: JavaScript](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript/?WT.mc_id=academic-77807-sagibbon)" من دروس الفيديو، التي ساهم بعض مؤلفيها في هذا المنهج.
من خلال ضمان توافق المحتوى مع المشاريع، يصبح العملية أكثر جاذبية للطلاب ويتم تعزيز الاحتفاظ بالمفاهيم. كما كتبنا عدة دروس تمهيدية في أساسيات JavaScript لتقديم المفاهيم، مقترنة بفيديو من مجموعة "[سلسلة المبتدئين: JavaScript](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript/?WT.mc_id=academic-77807-sagibbon)" من دروس الفيديو، التي ساهم بعض مؤلفيها في هذا المنهج.
بالإضافة إلى ذلك، يحدد اختبار منخفض المخاطر قبل الفصل نية الطالب نحو تعلم موضوع معين، بينما يضمن اختبار ثانٍ بعد الفصل مزيدًا من الاحتفاظ. تم تصميم هذا المنهج ليكون مرنًا وممتعًا ويمكن أخذه بالكامل أو جزئيًا. تبدأ المشاريع صغيرة وتصبح أكثر تعقيدًا بحلول نهاية دورة الـ 12 أسبوعًا.
بالإضافة إلى ذلك، يحدد اختبار منخفض المخاطر قبل الفصل نية الطالب نحو تعلم موضوع معين، بينما يضمن اختبار ثانٍ بعد الفصل مزيدًا من الاحتفاظ. تم تصميم هذا المنهج ليكون مرنًا وممتعًا ويمكن أخذه بالكامل أو جزئيًا. تبدأ المشاريع صغيرة وتصبح أكثر تعقيدًا بحلول نهاية الدورة التي تستمر 12 أسبوعًا.
بينما تجنبنا عمدًا تقديم أطر عمل JavaScript للتركيز على المهارات الأساسية المطلوبة كمطور ويب قبل اعتماد إطار عمل، فإن الخطوة التالية الجيدة لإكمال هذا المنهج ستكون تعلم Node.js عبر مجموعة أخرى من الفيديوهات: "[سلسلة المبتدئين: Node.js](https://channel9.msdn.com/Series/Beginners-Series-to-Nodejs/?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)".
يمكنك تشغيل هذا التوثيق دون اتصال باستخدام [Docsify](https://docsify.js.org/#/). قم باستنساخ هذا المستودع، [تثبيت Docsify](https://docsify.js.org/#/quickstart) على جهازك المحلي، ثم في المجلد الجذر لهذا المستودع، اكتب `docsify serve`. سيتم تقديم الموقع على المنفذ 3000 على localhost الخاص بك: `localhost:3000`.
يمكنك تشغيل هذا التوثيق دون اتصال باستخدام [Docsify](https://docsify.js.org/#/). قم بعمل Fork لهذا المستودع، [قم بتثبيت Docsify](https://docsify.js.org/#/quickstart) على جهازك المحلي، ثم في المجلد الجذر لهذا المستودع، اكتب `docsify serve`. سيتم تقديم الموقع على المنفذ 3000 على localhost الخاص بك: `localhost:3000`.
## 📘 PDF
## 📘 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).
## 🎒 دورات أخرى
## 🎒 دورات أخرى
فريقنا ينتج دورات أخرى! تحقق من:
فريقنا ينتج دورات أخرى! تحقق من:
### Azure / Edge / MCP / Agents
[](https://github.com/microsoft/AZD-for-beginners?WT.mc_id=academic-105485-koreyst)
### Azure / Edge / MCP / Agents
[](https://github.com/microsoft/AZD-for-beginners?WT.mc_id=academic-105485-koreyst)
إذا واجهت صعوبة أو كانت لديك أسئلة حول بناء تطبيقات الذكاء الاصطناعي، انضم إلى:
إذا واجهت صعوبة أو كانت لديك أسئلة حول بناء تطبيقات الذكاء الاصطناعي، انضم إلى المتعلمين الآخرين والمطورين ذوي الخبرة في مناقشات حول MCP. إنها مجتمع داعم حيث يتم الترحيب بالأسئلة ومشاركة المعرفة بحرية.
[](https://aka.ms/foundry/discord)
إذا كانت لديك ملاحظات حول المنتج أو أخطاء أثناء البناء، قم بزيارة:
[](https://aka.ms/foundry/forum)
[](https://aka.ms/foundry/forum)
## الترخيص
@ -249,5 +251,7 @@ CO_OP_TRANSLATOR_METADATA:
---
<!-- CO-OP TRANSLATOR DISCLAIMER START -->
**إخلاء المسؤولية**:
تم ترجمة هذا المستند باستخدام خدمة الترجمة بالذكاء الاصطناعي [Co-op Translator](https://github.com/Azure/co-op-translator). بينما نسعى لتحقيق الدقة، يرجى العلم أن الترجمات الآلية قد تحتوي على أخطاء أو عدم دقة. يجب اعتبار المستند الأصلي بلغته الأصلية المصدر الموثوق. للحصول على معلومات حاسمة، يُوصى بالترجمة البشرية الاحترافية. نحن غير مسؤولين عن أي سوء فهم أو تفسير خاطئ ينشأ عن استخدام هذه الترجمة.
تم ترجمة هذا المستند باستخدام خدمة الترجمة بالذكاء الاصطناعي [Co-op Translator](https://github.com/Azure/co-op-translator). بينما نسعى لتحقيق الدقة، يرجى العلم أن الترجمات الآلية قد تحتوي على أخطاء أو عدم دقة. يجب اعتبار المستند الأصلي بلغته الأصلية المصدر الموثوق. للحصول على معلومات حاسمة، يُوصى بالترجمة البشرية الاحترافية. نحن غير مسؤولين عن أي سوء فهم أو تفسير خاطئ ينشأ عن استخدام هذه الترجمة.
नमस्कार, भविष्यातील विकसक! 👋 जगभरातील लाखो कोडर्समध्ये सामील होण्यासाठी तयार आहात का? तुम्हाला GitHub ची ओळख करून देताना मला खूप आनंद होत आहे – हे प्रोग्रामर्ससाठी सोशल मीडिया प्लॅटफॉर्मसारखे आहे, फक्त इथे तुम्ही तुमच्या जेवणाचे फोटो शेअर करण्याऐवजी कोड शेअर करता आणि एकत्रितपणे अप्रतिम गोष्टी तयार करता!
नमस्कार, भविष्यातील विकसक! 👋 जगभरातील लाखो कोडर्समध्ये सामील होण्यासाठी तयार आहात का? तुम्हाला GitHub ची ओळख करून देताना मला खूप आनंद होत आहे – हे प्रोग्रामर्ससाठी सोशल मीडिया प्लॅटफॉर्मसारखे आहे, फक्त दुपारच्या जेवणाचे फोटो शेअर करण्याऐवजी, आम्ही कोड शेअर करत आहोत आणि एकत्रितपणे अद्भुत गोष्टी तयार करत आहोत!
मला जे खरोखर आश्चर्यचकित करते ते म्हणजे: तुमच्या फोनवरील प्रत्येक अॅप, तुम्ही भेट देणारी प्रत्येक वेबसाइट आणि तुम्ही वापरण्यास शिकणारी बहुतेक साधने GitHub सारख्या प्लॅटफॉर्मवर सहकार्य करणाऱ्या विकसकांच्या टीमद्वारे तयार केली गेली आहेत. तुम्हाला आवडणारे संगीत अॅप? तुमच्यासारख्या कोणीतरी त्यात योगदान दिले आहे. तुम्ही खेळत असलेला गेम? होय, कदाचित GitHub सहकार्याने तयार केलेला. आणि आता तुम्ही त्या अद्भुत समुदायाचा भाग बनण्यास शिकणार आहात!
माझ्या मनाला खरोखर आश्चर्यचकित करणारी गोष्ट म्हणजे: तुमच्या फोनवरील प्रत्येक अॅप, तुम्ही भेट देत असलेली प्रत्येक वेबसाइट आणि तुम्ही वापरण्यास शिकत असलेली बहुतेक साधने GitHub सारख्या प्लॅटफॉर्मवर सहकार्य करणाऱ्या विकसकांच्या टीमद्वारे तयार केली गेली आहेत. तुम्हाला आवडणारे संगीत अॅप? तुमच्यासारख्या कोणीतरी त्यात योगदान दिले आहे. तुम्ही खेळत असलेला खेळ? होय, कदाचित GitHub सहकार्याने तयार केलेला. आणि आता तुम्ही त्या अद्भुत समुदायाचा भाग बनण्यास शिकणार आहात!
मला माहित आहे की सुरुवातीला हे थोडेसे जास्त वाटू शकते – मी माझ्या पहिल्या GitHub पेजकडे पाहत असताना "हे सगळं काय आहे?" असे विचार करत होतो. पण गोष्ट अशी आहे: प्रत्येक विकसक नेमके तिथून सुरुवात करतो जिथे तुम्ही आत्ता आहात. या धड्याच्या शेवटी, तुमच्याकडे तुमचे स्वतःचे GitHub रिपॉझिटरी असेल (ते म्हणजे क्लाउडमधील तुमच्या वैयक्तिक प्रोजेक्टचे प्रदर्शन), आणि तुम्हाला तुमचे काम कसे जतन करायचे, इतरांसोबत कसे शेअर करायचे आणि लाखो लोक वापरत असलेल्या प्रोजेक्ट्समध्ये कसे योगदान द्यायचे हे माहित असेल.
मला माहित आहे की सुरुवातीला हे थोडे जास्त वाटू शकते –खरं सांगायचं तर, मी माझ्या पहिल्या GitHub पृष्ठाकडे पाहत होतो आणि विचार करत होतो "याचा अर्थ काय आहे?" पण गोष्ट अशी आहे: प्रत्येक विकसक नेमके तिथून सुरुवात करतो जिथे तुम्ही आहात. या धड्याच्या शेवटी, तुमच्याकडे तुमचे स्वतःचे GitHub रिपॉझिटरी असेल (ते म्हणजे क्लाउडमधील तुमचे वैयक्तिक प्रोजेक्ट शोकेस), आणि तुम्हाला तुमचे काम कसे जतन करायचे, इतरांसोबत कसे शेअर करायचे आणि लाखो लोक वापरत असलेल्या प्रोजेक्ट्समध्ये कसे योगदान द्यायचे हे माहित असेल.
आपण हा प्रवास एकत्रितपणे, एक पाऊल एकावेळी घेणार आहोत. घाई नाही, दबाव नाही – फक्त तुम्ही, मी आणि काही खूप छान साधने जी तुमचे नवीन मित्र बनणार आहेत!
आपण एकत्रितपणे हा प्रवास करू, एक पाऊल एकावेळी. घाई नाही, दबाव नाही – फक्त तुम्ही, मी आणि काही खरोखर छान साधने जी तुमचे नवीन सर्वोत्तम मित्र बनणार आहेत!
आम्ही खरोखर रोमांचक गोष्टींमध्ये जाण्यापूर्वी, तुमचा संगणक GitHub च्या जादूसाठी तयार करूया! हे तुमच्या कलात्मक साहित्याचे आयोजन करण्यासारखे आहे – एक उत्कृष्ट कलाकृती तयार करण्यापूर्वी योग्य साधने तयार असणे सर्व काही अधिक गुळगुळीत आणि खूप मजेदार बनवते.
आम्ही खरोखर रोमांचक गोष्टींमध्ये जाण्यापूर्वी, तुमचा संगणक GitHub च्या जादूसाठी तयार करूया! याला तुमचे कलात्मक साहित्य तयार करण्यासारखे समजा – योग्य साधने तयार असल्याने सर्व काही अधिक गुळगुळीत आणि खूप मजेदार होते.
मी तुम्हाला प्रत्येक सेटअप चरण वैयक्तिकरित्या मार्गदर्शन करणार आहे, आणि मी वचन देतो की ते पहिल्या दृष्टीक्षेपात जितके भयावह दिसते तितके नाही. काहीतरी लगेच क्लिक होत नसेल तर, ते पूर्णपणे सामान्य आहे! मी माझे पहिले विकास वातावरण सेट करत होतो आणि असे वाटले की मी प्राचीन लिपी वाचण्याचा प्रयत्न करत आहे. प्रत्येक विकसक नेमके तिथेच होता जिथे तुम्ही आत्ता आहात, विचार करत की ते योग्य करत आहेत का. स्पॉयलर अलर्ट: जर तुम्ही शिकत असाल तर तुम्ही आधीच योग्य करत आहात! 🌟
मी तुम्हाला प्रत्येक सेटअप चरण वैयक्तिकरित्या मार्गदर्शन करणार आहे, आणि मी वचन देतो की हे पहिल्या दृष्टीक्षेपात जितके भयानक वाटते तितके नाही. काहीतरी लगेच समजले नाही तर, ते पूर्णपणे सामान्य आहे! मी माझे पहिले विकास वातावरण सेट करत होतो आणि प्राचीन चित्रलिपी वाचण्याचा प्रयत्न करत असल्यासारखे वाटत होते. प्रत्येक विकसक नेमके तिथेच होता जिथे तुम्ही आहात, विचार करत की ते योग्य करत आहेत का. स्पॉयलर अलर्ट: जर तुम्ही शिकत असाल, तर तुम्ही आधीच योग्य करत आहात! 🌟
या धड्यात, आपण कव्हर करू:
या धड्यात, आम्ही कव्हर करू:
- तुमच्या मशीनवर केलेल्या कामाचा मागोवा घेणे
- तुमच्या मशीनवर केलेले काम ट्रॅक करणे
- इतरांसोबत प्रोजेक्ट्सवर काम करणे
- ओपन सोर्स सॉफ्टवेअरमध्ये योगदान कसे द्यावे
- ओपन सोर्स सॉफ्टवेअरमध्ये कसे योगदान द्यायचे
### पूर्वतयारी
तुमचा संगणक GitHub च्या जादूसाठी तयार करूया! काळजी करू नका – हा सेटअप तुम्हाला फक्त एकदाच करावा लागेल, आणि मग तुम्ही तुमच्या संपूर्ण कोडिंग प्रवासासाठी तयार असाल.
ठीक आहे, आपण पाया सुरू करूया! प्रथम, आपल्याला तपासावे लागेल की Git आधीच तुमच्या संगणकावर आहे का. Git मूलत: एक सुपर-स्मार्ट सहाय्यक असण्यासारखे आहे जो तुम्ही तुमच्या कोडमध्ये केलेला प्रत्येक बदल लक्षात ठेवतो –दर दोन सेकंदांनी Ctrl+S दाबण्यापेक्षा खूप चांगले (आपण सर्व तिथे होतो!).
ठीक आहे, आपण पाया सुरू करूया! प्रथम, आपल्याला तपासणे आवश्यक आहे की Git आधीच तुमच्या संगणकावर आहे का. Git मूलत: एक सुपर-स्मार्ट सहाय्यक असल्यासारखे आहे जो तुम्ही तुमच्या कोडमध्ये केलेला प्रत्येक बदल लक्षात ठेवतो –प्रत्येक दोन सेकंदांनी Ctrl+S दाबण्यापेक्षा खूप चांगले (आपण सर्व तिथे होतो!).
तुमच्या टर्मिनलमध्ये हा जादुई आदेश टाइप करून पाहूया की Git आधीच स्थापित आहे का:
Git आधीच स्थापित आहे का ते पाहण्यासाठी तुमच्या टर्मिनलमध्ये हा जादुई आदेश टाइप करा:
`git --version`
जर Git अजून तिथे नसेल, तर काळजी करू नका! फक्त [Git डाउनलोड करा](https://git-scm.com/downloads) आणि ते मिळवा. एकदा तुम्ही ते स्थापित केले की, आम्हाला Git ला योग्य प्रकारे तुमची ओळख करून द्यावी लागेल:
जर Git अद्याप तिथे नसेल, तर चिंता करू नका! फक्त [Git डाउनलोड करा](https://git-scm.com/downloads) आणि ते मिळवा. एकदा तुम्ही ते स्थापित केले की, आम्हाला Git ची योग्य ओळख करून द्यावी लागेल:
> 💡 **पहिल्यांदा सेटअप**: हे आदेश Git ला सांगतात की तुम्ही कोण आहात. ही माहिती तुम्ही केलेल्या प्रत्येक कमिटशी जोडली जाईल, त्यामुळे तुम्ही सार्वजनिकपणे शेअर करण्यास आरामदायक असलेले नाव आणि ईमेल निवडा.
@ -77,88 +76,87 @@ git config --list
तुमच्याकडे GitHub खाते, कोड एडिटर (जसे की Visual Studio Code) असणे आवश्यक आहे आणि तुम्हाला तुमचे टर्मिनल (किंवा: कमांड प्रॉम्प्ट) उघडावे लागेल.
[github.com](https://github.com/) वर जा आणि खाते तयार करा जर तुम्ही आधीच केले नसेल, किंवा लॉग इन करा आणि तुमची प्रोफाइल भरा.
[github.com](https://github.com/) वर जा आणि तुमचे खाते तयार करा जर तुम्ही आधीच केले नसेल, किंवा लॉग इन करा आणि तुमची प्रोफाइल भरा.
💡 **आधुनिक टिप**: [SSH keys](https://docs.github.com/en/authentication/connecting-to-github-with-ssh) सेट अप करण्याचा विचार करा किंवा पासवर्डशिवाय सोप्या प्रमाणीकरणासाठी [GitHub CLI](https://cli.github.com/) वापरा.
💡 **आधुनिक टिप**: [SSH कीज](https://docs.github.com/en/authentication/connecting-to-github-with-ssh) सेट अप करण्याचा विचार करा किंवा पासवर्डशिवाय सोप्या प्रमाणीकरणासाठी [GitHub CLI](https://cli.github.com/) वापरा.
✅ GitHub हा जगातील एकमेव कोड रिपॉझिटरी नाही; इतरही आहेत, पण GitHub सर्वात प्रसिद्ध आहे.
### तयारी
तुमच्याकडे तुमच्या स्थानिक मशीनवर (लॅपटॉप किंवा पीसी) कोड प्रोजेक्टसह एक फोल्डर आणि GitHub वर एक सार्वजनिक रिपॉझिटरी असणे आवश्यक आहे, जे इतरांच्या प्रोजेक्ट्समध्ये योगदान कसे द्यावे याचे उदाहरण म्हणून काम करेल.
तुमच्या स्थानिक मशीनवर (लॅपटॉप किंवा पीसी) कोड प्रोजेक्टसह एक फोल्डर आणि GitHub वर एक सार्वजनिक रिपॉझिटरी आवश्यक आहे, जे इतरांच्या प्रोजेक्ट्समध्ये योगदान कसे द्यायचे याचे उदाहरण म्हणून काम करेल.
### तुमचा कोड सुरक्षित ठेवणे
चला थोड्या वेळासाठी सुरक्षा बद्दल बोलूया – पण काळजी करू नका, आम्ही तुम्हाला घाबरवणाऱ्या गोष्टींनी भरून टाकणार नाही! या सुरक्षा पद्धती तुमची कार किंवा तुमचे घर लॉक करण्यासारख्या आहेत. ते सोपे सवयी आहेत ज्या दुसऱ्या स्वभावासारख्या बनतात आणि तुमचे कठोर परिश्रम सुरक्षित ठेवतात.
चला थोड्या वेळासाठी सुरक्षा बद्दल बोलूया – पण काळजी करू नका, आम्ही तुम्हाला भयानक गोष्टींनी गोंधळात टाकणार नाही! या सुरक्षा पद्धती तुमची कार किंवा तुमचे घर लॉक करण्यासारख्या आहेत. ते सोपे सवयी आहेत ज्या स्वाभाविक बनतात आणि तुमचे कठोर परिश्रम सुरक्षित ठेवतात.
आम्ही तुम्हाला सुरुवातीपासूनच GitHub सह काम करण्याचे आधुनिक, सुरक्षित मार्ग दाखवू. अशा प्रकारे, तुम्ही चांगल्या सवयी विकसित कराल ज्या तुमच्या कोडिंग करिअरमध्ये तुम्हाला चांगल्या प्रकारे सेवा देतील.
आम्ही तुम्हाला सुरुवातीपासून GitHub सह काम करण्याचे आधुनिक, सुरक्षित मार्ग दाखवू. यामुळे तुम्ही चांगल्या सवयी विकसित कराल ज्या तुमच्या कोडिंग करिअरमध्ये तुम्हाला चांगल्या प्रकारे सेवा देतील.
GitHub सह काम करताना, सुरक्षा सर्वोत्तम पद्धतींचे पालन करणे महत्त्वाचे आहे:
| सुरक्षा क्षेत्र | सर्वोत्तम पद्धत | का महत्त्वाचे आहे |
| **प्रमाणीकरण** | SSH कीज किंवा वैयक्तिक प्रवेश टोकन वापरा | पासवर्ड कमी सुरक्षित आहेत आणि टप्प्याटप्प्याने बंद केले जात आहेत |
| **दोन-घटक प्रमाणीकरण** | तुमच्या GitHub खात्यावर 2FA सक्षम करा | खात्याच्या संरक्षणाचा अतिरिक्त स्तर जोडतो |
| **रिपॉझिटरी सुरक्षा** | संवेदनशील माहिती कधीही कमिट करू नका | API कीज आणि पासवर्ड सार्वजनिक रिपॉझिटरीमध्ये कधीही असू नयेत |
| **डिपेंडेंसी व्यवस्थापन** | Dependabot अद्यतनांसाठी सक्षम करा | तुमच्या डिपेंडेंसी सुरक्षित आणि अद्ययावत ठेवते |
> ⚠️ **महत्त्वाची सुरक्षा आठवण**: API keys, पासवर्ड किंवा इतर संवेदनशील माहिती कोणत्याही रिपॉझिटरीमध्ये कधीही कमिट करू नका. संवेदनशील डेटा संरक्षित करण्यासाठी environment variables आणि `.gitignore` फाइल्स वापरा.
> ⚠️ **महत्त्वाची सुरक्षा आठवण**: API कीज, पासवर्ड किंवा इतर संवेदनशील माहिती कोणत्याही रिपॉझिटरीमध्ये कधीही कमिट करू नका. संवेदनशील डेटा संरक्षित करण्यासाठी पर्यावरणीय व्हेरिएबल्स आणि `.gitignore` फाइल्स वापरा.
> 💡 **प्रो टिप**: SSH keys पासवर्ड वारंवार टाइप करण्याची गरज दूर करतात आणि पारंपरिक प्रमाणीकरण पद्धतींपेक्षा अधिक सुरक्षित असतात.
> 💡 **प्रो टिप**: SSH कीज परत परत पासवर्ड टाइप करण्याची गरज दूर करतात आणि पारंपरिक प्रमाणीकरण पद्धतींपेक्षा अधिक सुरक्षित आहेत.
---
## तुमचा कोड प्रोप्रमाणे व्यवस्थापित करा
## तुमचा कोड व्यावसायिकासारखा व्यवस्थापित करा
ठीक आहे, आता गोष्टी खरोखर रोमांचक होणार आहेत! 🎉 आम्ही तुमचा कोड प्रोप्रमाणे ट्रॅक आणि व्यवस्थापित कसा करायचा ते शिकणार आहोत, आणि प्रामाणिकपणे सांगायचे तर, हे शिकवणे माझ्या आवडत्या गोष्टींपैकी एक आहे कारण हे खूप गेम-चेंजर आहे.
ठीक आहे, आता गोष्टी खरोखर रोमांचक होतात! 🎉 आम्ही तुमचा कोड व्यावसायिकांसारखा ट्रॅक आणि व्यवस्थापित कसा करायचा ते शिकणार आहोत, आणि प्रामाणिकपणे सांगायचे तर, हे शिकवणे माझ्या आवडत्या गोष्टींपैकी एक आहे कारण हे खूप गेम-चेंजर आहे.
कल्पना करा: तुम्ही एक अद्भुत कथा लिहित आहात, आणि तुम्हाला प्रत्येक ड्राफ्ट, प्रत्येक उत्कृष्ट संपादन आणि प्रत्येक "थांबा, हे तर अप्रतिम आहे!" क्षणाचा मागोवा ठेवायचा आहे. Git तुमच्या कोडसाठी नेमके हेच करते! हे सर्व काही लक्षात ठेवणारे सर्वात अविश्वसनीय टाइम-ट्रॅव्हलिंग नोटबुक असण्यासारखे आहे – प्रत्येक कीस्ट्रोक, प्रत्येक बदल, प्रत्येक "अरे, हे सगळं बिघडलं" क्षण जो तुम्ही त्वरित पूर्ववत करू शकता.
कल्पना करा: तुम्ही एक अद्भुत कथा लिहित आहात, आणि तुम्हाला प्रत्येक मसुदा, प्रत्येक उत्कृष्ट संपादन आणि प्रत्येक "थांबा, हे विलक्षण आहे!" क्षण ट्रॅक करायचे आहेत. Git तुमच्या कोडसाठी नेमके तेच करते! हे सर्वकाही लक्षात ठेवणारे सर्वात अविश्वसनीय वेळ प्रवास करणारे नोटबुक असल्यासारखे आहे – प्रत्येक कीस्ट्रोक, प्रत्येक बदल, प्रत्येक "अरे, यामुळे सर्व काही बिघडले" क्षण जो तुम्ही त्वरित पूर्ववत करू शकता.
मी प्रामाणिकपणे सांगतो – सुरुवातीला हे थोडेसे जास्त वाटू शकते. जेव्हा मी सुरुवात केली, तेव्हा मला वाटले "मी फक्त माझ्या फाइल्स सामान्यपणे का जतन करू शकत नाही?" पण यावर माझा विश्वास ठेवा: एकदा Git तुम्हाला समजला (आणि तो समजेल!), तुम्हाला एक प्रकाशाचा क्षण येईल जिथे तुम्ही विचार कराल "मी कधीही याशिवाय कोड कसा लिहिला?" हे असे आहे जसे तुम्ही उडू शकता हे शोधणे जेव्हा तुम्ही तुमच्या आयुष्यभर चालत होता!
मी प्रामाणिकपणे सांगतो – सुरुवातीला हे थोडे जास्त वाटू शकते. जेव्हा मी सुरुवात केली, तेव्हा मी विचार केला "मी माझ्या फाइल्स सामान्यपणे का जतन करू शकत नाही?" पण यावर माझा विश्वास ठेवा: एकदा Git तुमच्यासाठी क्लिक केल्यावर (आणि ते होईल!), तुम्हाला एक प्रकाशाचा क्षण येईल जिथे तुम्ही विचार कराल "मी कधीही याशिवाय कोड कसा केला?" हे असे आहे जसे तुम्हाला उडता येते हे शोधणे जेव्हा तुम्ही तुमच्या आयुष्यात सर्वत्र चालत होता!
समजा तुमच्याकडे स्थानिक स्तरावर काही कोड प्रोजेक्टसह एक फोल्डर आहे आणि तुम्हाला git - व्हर्जन कंट्रोल सिस्टम वापरून तुमच्या प्रगतीचा मागोवा सुरू करायचा आहे. काही लोक git वापरण्याची तुलना तुमच्या भविष्यातील स्वतःसाठी प्रेमपत्र लिहिण्याशी करतात. तुमचे कमिट संदेश दिवस, आठवडे किंवा महिने नंतर वाचताना तुम्हाला आठवेल की तुम्ही निर्णय का घेतला, किंवा बदल "रोलबॅक" करा - म्हणजे, जेव्हा तुम्ही चांगले "कमिट संदेश" लिहिता.
समजा तुमच्याकडे स्थानिकपणे काही कोड प्रोजेक्टसह एक फोल्डर आहे आणि तुम्हाला git - व्हर्जन कंट्रोल सिस्टम वापरून तुमची प्रगती ट्रॅक करायची आहे. काही लोक git वापरण्याची तुलना तुमच्या भविष्यातील स्वतःसाठी प्रेमपत्र लिहिण्याशी करतात. तुमचे कमिट संदेश काही दिवस, आठवडे किंवा महिने नंतर वाचताना तुम्हाला आठवेल की तुम्ही का निर्णय घेतला, किंवा "रोलबॅक" बदल – म्हणजे, जेव्हा तुम्ही चांगले "कमिट संदेश" लिहिता.
```mermaid
flowchart TD
A[📁 Your Project Files] --> B{Is it a Git Repository?}
B -->|No| C[git init]
B -->|Yes| D[Make Changes]
A[📁 तुमची प्रकल्प फाइल्स] --> B{हे Git रिपॉझिटरी आहे का?}
B -->|नाही| C[git init]
B -->|होय| D[बदल करा]
C --> D
D --> E[git add .]
E --> F["git commit -m 'message'"]
E --> F["git commit -m 'संदेश'"]
F --> G[git push]
G --> H[🌟 Code on GitHub!]
G --> H[🌟 GitHub वर कोड!]
H --> I{Want to collaborate?}
I -->|Yes| J[Fork & Clone]
I -->|No| D
J --> K[Create Branch]
K --> L[Make Changes]
H --> I{सहकार्य करू इच्छिता?}
I -->|होय| J[Fork & Clone]
I -->|नाही| D
J --> K[शाखा तयार करा]
K --> L[बदल करा]
L --> M[Pull Request]
M --> N[🎉 Contributing!]
M --> N[🎉 योगदान!]
style A fill:#fff59d
style H fill:#c8e6c9
style N fill:#ff4081,color:#fff
```
### कार्य: तुमचे पहिले रिपॉझिटरी तयार करा!
> 🎯 **तुमचे मिशन (आणि मला तुमच्यासाठी खूप उत्साह आहे!)**: आपण एकत्रितपणे तुमचे पहिले GitHub रिपॉझिटरी तयार करणार आहोत! येथे आपले काम पूर्ण झाल्यावर, तुमच्याकडे तुमच्या कोडसाठी इंटरनेटवर तुमचा स्वतःचा कोपरा असेल, आणि तुम्ही तुमचा पहिला "कमिट" केला असेल (ते म्हणजे तुमचे काम खूप स्मार्ट पद्धतीने जतन करणे).
> 🎯 **तुमचे मिशन (आणि मी तुमच्यासाठी खूप उत्सुक आहे!)**: आपण एकत्रितपणे तुमचे पहिले GitHub रिपॉझिटरी तयार करणार आहोत! येथे आपण संपविल्यानंतर, तुमच्याकडे तुमच्या कोडसाठी इंटरनेटवर तुमचा स्वतःचा कोपरा असेल, आणि तुम्ही तुमचा पहिला "कमिट" केला असेल (ते म्हणजे तुमचे काम खूप स्मार्ट पद्धतीने जतन करणे).
>
> हे खरोखर एक विशेष क्षण आहे – तुम्ही विकसकांच्या जागतिक समुदायात अधिकृतपणे सामील होणार आहात! माझे पहिले रिपॉझिटरी तयार करण्याचा थरार मला अजूनही आठवतो आणि विचार केला "वा, मी खरोखर हे करत आहे!"
> हे प्रामाणिकपणे खूप खास क्षण आहे – तुम्ही विकसकांच्या जागतिक समुदायात अधिकृतपणे सामील होणार आहात! माझ्या पहिल्या रिपॉझिटरी तयार करण्याचा थरार मला अजूनही आठवतो आणि विचार केला "वा, मी खरोखर हे करत आहे!"
चला हे साहस एकत्रितपणे, चरण-दर-चरण पार करूया. प्रत्येक भागासाठी तुमचा वेळ घ्या – घाई करण्यासाठी कोणतेही बक्षीस नाही, आणि मी वचन देतो की प्रत्येक चरण अर्थपूर्ण होईल. लक्षात ठेवा, तुम्ही प्रशंसा करत असलेला प्रत्येक कोडिंग सुपरस्टार एकदा नेमके तिथे बसला होता जिथे तुम्ही आहात, त्यांचे पहिले रिपॉझिटरी तयार करण्याच्या तयारीत. किती छान आहे ना?
चला एकत्रितपणे हा प्रवास करूया, चरण-दर-चरण. प्रत्येक भागासाठी तुमचा वेळ घ्या – घाई करण्यासाठी कोणतेही बक्षीस नाही, आणि मी वचन देतो की प्रत्येक चरण अर्थपूर्ण होईल. लक्षात ठेवा, तुम्ही प्रशंसा करत असलेला प्रत्येक कोडिंग सुपरस्टार एकदा नेमके तिथे बसला होता जिथे तुम्ही आहात, त्यांचे पहिले रिपॉझिटरी तयार करण्याच्या तयारीत. किती छान आहे ना?
> व्हिडिओ पहा
>
@ -166,25 +164,25 @@ flowchart TD
**चला हे एकत्र करूया:**
1. **GitHub वर तुमचे रिपॉझिटरी तयार करा**. GitHub.com वर जा आणि तो तेजस्वी हिरवा **नवीन** बटण (किंवा वरच्या उजव्या कोपऱ्यातील **+** चिन्ह) शोधा. त्यावर क्लिक करा आणि **नवीन रिपॉझिटरी** निवडा.
1. **GitHub वर तुमचे रिपॉझिटरी तयार करा**. GitHub.com वर जा आणि तो तेजस्वी हिरवा **नवीन** बटन (किंवा वरच्या उजव्या कोपऱ्यातील **+** चिन्ह) शोधा. त्यावर क्लिक करा आणि **नवीन रिपॉझिटरी** निवडा.
येथे काय करायचे:
1. तुमच्या रिपॉझिटरीला नाव द्या – ते तुमच्यासाठी अर्थपूर्ण असले पाहिजे!
1. तुम्हाला हवे असल्यास वर्णन जोडा (यामुळे इतरांना तुमचा प्रोजेक्ट कशाबद्दल आहे हे समजण्यास मदत होते)
1. तुम्हाला ते सार्वजनिक (सर्वांना दिसणारे) किंवा खाजगी (फक्त तुमच्यासाठी) हवे आहे का ते ठरवा
1. तुमच्या रिपॉझिटरीला नाव द्या – ते तुमच्यासाठी अर्थपूर्ण ठेवा!
1. तुम्हाला हवे असल्यास वर्णन जोडा (यामुळे इतरांना तुमचा प्रोजेक्ट काय आहे ते समजण्यास मदत होते)
1. तुम्हाला ते सार्वजनिक (सर्वजण ते पाहू शकतात) किंवा खाजगी (फक्त तुमच्यासाठी) हवे आहे का ते ठरवा
1. README फाइल जोडण्यासाठी बॉक्स तपासण्याची मी शिफारस करतो – ते तुमच्या प्रोजेक्टचे फ्रंट पेज आहे
1. **रिपॉझिटरी तयार करा** वर क्लिक करा आणि साजरा करा – तुम्ही तुमचे पहिले रिपॉझिटरी तयार केले! 🎉
1. **रिपॉझिटरी तयार करा** वर क्लिक करा आणि साजरा करा – तुम्ही तुमचे पहिले रिपॉझिटरी तयार केले आहे! 🎉
2. **तुमच्या प्रोजेक्ट फोल्डरकडे जा**. आता तुमचे टर्मिनल उघडूया (काळजी करू नका, ते दिसते तितके भयानक नाही!). आपल्याला आपल्या संगणकाला सांगावे लागेल की आपले प्रोजेक्ट फाइल्स कुठे आहेत. हा आदेश टाइप करा:
2. **तुमच्या प्रोजेक्ट फोल्डरमध्ये जा**. आता तुमचे टर्मिनल उघडूया (काळजी करू नका, ते दिसते तितके भयानक नाही!). आपल्याला आपल्या संगणकाला सांगावे लागेल की आपले प्रोजेक्ट फाइल्स कुठे आहेत. हा आदेश टाइप करा:
```bash
cd [name of your folder]
```
**आम्ही येथे काय करत आहोत:**
- आम्ही मूलत: सांगत आहोत "अरे संगणका, मला माझ्या प्रोजेक्ट फोल्डरमध्ये घेऊन जा"
- हे तुमच्या डेस्कटॉपवर विशिष्ट फोल्डर उघडण्यासारखे आहे, पण आम्ही ते मजकूर आदेशांसह करत आहोत
- `[name of your folder]` च्या जागी तुमच्या प्रोजेक्ट फोल्डरचे वास्तविक नाव बदला
- आम्ही मूलत: सांगत आहोत "अरे संगणक, मला माझ्या प्रोजेक्ट फोल्डरमध्ये घेऊन जा"
- हे तुमच्या डेस्कटॉपवरील विशिष्ट फोल्डर उघडण्यासारखे आहे, पण आम्ही ते मजकूर आदेशांसह करत आहोत
- `[तुमच्या फोल्डरचे नाव]` वास्तविक प्रोजेक्ट फोल्डरच्या नावाने बदला
- Git ने तुमच्या प्रोजेक्टमध्ये एक लपलेला `.git` फोल्डर तयार केला – तुम्हाला ते दिसणार नाही, पण ते तिथे आहे!
- तुमचा नियमित फोल्डर आता एक "रिपॉझिटरी" आहे जो तुम्ही केलेला प्रत्येक बदल ट्रॅक करू शकतो
- हे तुमच्या फोल्डरला सर्वकाही लक्षात ठेवण्यासाठी सुपरपॉवर देण्यासारखे आहे
- हे तुमच्या फोल्डरला सर्वकाही लक्षात ठेवण्याची सुपरपॉवर देण्यासारखे आहे
4. **काय चालले आहे ते तपासा**. चला पाहूया की Git सध्या तुमच्या प्रोजेक्टबद्दल काय विचार करत आहे:
4. **काय चालले आहे ते तपासा**. चला पाहूया की Git तुमच्या प्रोजेक्टबद्दल काय विचार करत आहे:
```bash
git status
@ -205,7 +203,7 @@ flowchart TD
**Git तुम्हाला काय सांगत आहे ते समजून घेणे:**
तुम्हाला असे काहीतरी दिसू शकते:
तुम्हाला असे काही दिसू शकते:
```output
Changes not staged for commit:
@ -216,12 +214,12 @@ flowchart TD
modified: file2.txt
```
**घाबरू नका! याचा अर्थ असा आहे:**
**घाबरू नका! याचा अर्थ काय आहे:**
- **लाल** रंगातील फाइल्स म्हणजे फाइल्स ज्यामध्ये बदल आहेत पण जतन करण्यासाठी तयार नाहीत
- **हिरव्या** रंगातील फाइल्स (जेव्हा तुम्ही त्यांना पाहता) जतन करण्यासाठी तयार आहेत
- Git तुम्हाला पुढे काय करता येईल याबद्दल नेमके सांगून मदत करत आहे
> 💡 **प्रो टिप**: `git status` आदेश तुमचा सर्वोत्तम मित्र आहे! तुम्हाला गोंधळ वाटत असताना ते वापरा. हे Git ला विचारण्यासारखे आहे "अरे, सध्या काय परिस्थिती आहे?"
> 💡 **प्रो टिप**: `git status` आदेश तुमचा सर्वोत्तम मित्र आहे! तुम्हाला काय चालले आहे याबद्दल गोंधळ वाटत असल्यास ते वापरा. Git ला विचारण्यासारखे आहे "अरे, सध्याची परिस्थिती काय आहे?"
5. **तुमच्या फाइल्स जतन करण्यासाठी तयार करा** (याला "स्टेजिंग" म्हणतात):
@ -230,9 +228,9 @@ flowchart TD
```
**आम्ही काय केले:**
- आम्ही Git ला सांगितले "अरे, मी माझ्या पुढील जतनामध्ये माझ्या सर्व फाइल्स समाविष्ट करू इच्छित आहे"
- `.` म्हणजे "या फोल्डरमधील सर्वकाही"
- आता तुमच्या फाइल्स "स्टेज केलेल्या" आहेत आणि पुढील चरणासाठी तयार आहेत
- आम्ही Git ला सांगितले "अरे, मी माझ्या फोल्डरमधील सर्व फाइल्स पुढील जतनामध्ये समाविष्ट करू इच्छितो"
- `.` म्हणजे "या फोल्डरमधील सर्वकाही"
- आता तुमच्या फाइल्स "स्टेज्ड" आहेत आणि पुढील चरणासाठी तयार आहेत
**तुम्हाला अधिक निवडक व्हायचे आहे का?** तुम्ही फक्त विशिष्ट फाइल्स जोडू शकता:
@ -242,49 +240,38 @@ flowchart TD
**तुम्हाला असे का करायचे आहे?**
- कधी कधी तुम्हाला संबंधित बदल एकत्रितपणे जतन करायचे असतात
- हे तुमचे काम तार्किक तुकड्यांमध्ये आयोजित करण्यात मदत करते
- काय बदलले आणि कधी हे समजणे सोपे बनवते
**तुमचे मन बदलले?** काळजी करू नका! तुम्ही फाइल्स अशा प्रकारे अनस्टेज करू शकता:
```bash
# Unstage everything
git reset
# Unstage just one file
git reset [file name]
```
- हे तुमचे काम तार्किक तुकड्यांमध्ये व्यवस्थित करण्यात मदत करते
- काय बदलले आणि कधी याचा अर्थ समजणे सोपे करते
काळ
**आपण काय केलं:**
- आपण आपल्या स्थानिक प्रकल्प आणि GitHub रेपॉजिटरी यांच्यात कनेक्शन तयार केलं
- "Origin" हा फक्त तुमच्या GitHub रेपॉजिटरीसाठी एक टोपणनाव आहे – जसं तुम्ही तुमच्या फोनमध्ये एखाद्या संपर्काला जतन करता
- आता तुमचा स्थानिक Git जाणतो की तुमचा कोड शेअर करण्यासाठी कुठे पाठवायचा आहे
**तुमचे मन बदलले?** काळजी करू नका! तुम्ही फाइल्स अशा प्रकारे
- आम्ही तुमच्या स्थानिक प्रोजेक्ट आणि GitHub रेपॉझिटरीमध्ये कनेक्शन तयार केले आहे.
- "Origin" हे तुमच्या GitHub रेपॉझिटरीसाठी एक टोपणनाव आहे – जसे फोनमध्ये संपर्क जोडणे.
- आता तुमच्या स्थानिक Git ला माहित आहे की कोड शेअर करण्यासाठी तो कुठे पाठवायचा आहे.
💡 **सोपं मार्ग**: जर तुमच्याकडे GitHub CLI इन्स्टॉल असेल, तर तुम्ही हे एका कमांडने करू शकता:
💡 **सोपा मार्ग**: जर तुमच्याकडे GitHub CLI इंस्टॉल असेल, तर तुम्ही हे एका कमांडमध्ये करू शकता:
```bash
gh repo create my-repo --public --push --source=.
```
8. **तुमचा कोड GitHub वर पाठवा** (मोठा क्षण!):
8. **तुमचा कोड GitHub वर पाठवा** (महत्त्वाचा क्षण!):
```bash
git push -u origin main
```
**🚀 हेच ते! तुम्ही तुमचा कोड GitHub वर अपलोड करत आहात!**
**काय घडतंय:**
- तुमचे commits तुमच्या संगणकावरून GitHub कडे जात आहेत
- `-u` फ्लॅग एक कायमस्वरूपी कनेक्शन सेट करतो ज्यामुळे भविष्यातील पुश करणे सोपे होते
- "main" हा तुमच्या प्राथमिक शाखेचे नाव आहे (मुख्य फोल्डरसारखे)
**काय होत आहे:**
- तुमचे commits तुमच्या संगणकावरून GitHub वर जात आहेत.
- `-u` फ्लॅग एक स्थायी कनेक्शन सेट करते जेणेकरून भविष्यातील पुश करणे सोपे होईल.
- "main" हा तुमच्या प्राथमिक शाखेचा नाव आहे (जसे मुख्य फोल्डर).
- यानंतर, तुम्ही फक्त `git push` टाइप करून भविष्यातील अपलोड करू शकता!
💡 **लहान टिप**: जर तुमच्या शाखेचं नाव काहीतरी वेगळं असेल (जसं "master"), तर ते नाव वापरा. तुम्ही `git branch --show-current` वापरून तपासू शकता.
💡 **लहान टिप**: जर तुमच्या शाखेचे नाव काही वेगळे असेल (जसे "master"), तर ते नाव वापरा. तुम्ही `git branch --show-current` वापरून तपासू शकता.
9. **तुमचा नवीन दैनंदिन कोडिंग रिदम** (आता हे व्यसन होईल!):
9. **तुमचा नवीन दैनिक कोडिंग रिदम** (हे खूपच मजेदार आहे!):
आता पासून, जेव्हा तुम्ही तुमच्या प्रकल्पात बदल कराल, तेव्हा तुम्हाला हा सोपा तीन-स्टेप डान्स करायचा आहे:
आता पुढे, जेव्हा तुम्ही तुमच्या प्रोजेक्टमध्ये बदल कराल, तेव्हा तुम्हाला हा सोपा तीन-स्टेप डान्स करायचा आहे:
```bash
git add .
@ -292,298 +279,302 @@ flowchart TD
git push
```
**हे तुमचं कोडिंग हार्टबीट बनेल:**
**हे तुमचे कोडिंग हार्टबीट बनते:**
- तुमच्या कोडमध्ये काही अप्रतिम बदल करा ✨
- `git add`ने त्यांना स्टेज करा ("हे Git, या बदलांकडे लक्ष द्या!")
- `git commit` आणि एक वर्णनात्मक संदेशासह त्यांना सेव्ह करा (भविष्यातील तुम्ही तुमचे आभार मानाल!)
- `git push` वापरून त्यांना जगासोबत शेअर करा 🚀
- पुन्हा करा – खरंच, हे श्वास घेण्याइतकं नैसर्गिक होईल!
- `git add`वापरून त्यांना stage करा ("Git, या बदलांकडे लक्ष द्या!")
- `git commit`वापरून त्यांना सेव्ह करा आणि एक वर्णनात्मक संदेश द्या (भविष्यातील तुम्ही तुमचे आभार मानाल!)
- `git push` वापरून ते जगासोबत शेअर करा 🚀
- पुन्हा करा – खरंच, हे श्वास घेण्याइतके नैसर्गिक बनते!
मला हा वर्कफ्लो खूप आवडतो कारण हे व्हिडिओ गेममध्ये अनेक सेव्ह पॉइंट्स असण्यासारखं आहे. तुम्हाला एखादा बदल आवडला? Commit करा! काही धोकादायक प्रयत्न करायचं आहे? हरकत नाही – जर काही चुकलं तर तुम्ही नेहमी तुमच्या शेवटच्या commit वर परत जाऊ शकता!
मला हा वर्कफ्लो आवडतो कारण हे व्हिडिओ गेममध्ये अनेक सेव्ह पॉइंट्स असण्यासारखे आहे. तुम्हाला आवडलेला बदल केला? Commit करा! काही धोकादायक प्रयत्न करायचे आहेत? काही हरकत नाही – जर गोष्टी बिघडल्या तर तुम्ही नेहमी तुमच्या शेवटच्या commit वर परत जाऊ शकता!
> 💡 **टिप**: तुम्हाला `.gitignore` फाइलचा अवलंब करायचा असेल, ज्यामुळे तुम्हाला ट्रॅक करायच्या नसलेल्या फाइल्स GitHub वर दिसणार नाहीत - जसं की, तुमच्या फोल्डरमध्ये असलेली नोट्स फाइल जी सार्वजनिक रेपॉजिटरीमध्ये असण्याची गरज नाही. तुम्ही `.gitignore` फाइल्ससाठी टेम्पलेट्स [.gitignore templates](https://github.com/github/gitignore) येथे शोधू शकता किंवा [gitignore.io](https://www.toptal.com/developers/gitignore) वापरून एक तयार करू शकता.
> 💡 **टिप**: तुम्ही `.gitignore` फाइल स्वीकारू इच्छित असाल जेणेकरून तुम्हाला ट्रॅक करायचे नाही असे फाइल्स GitHub वर दिसणार नाहीत - जसे की नोट्स फाइल जी तुम्ही त्याच फोल्डरमध्ये ठेवता पण सार्वजनिक रेपॉझिटरीवर त्याचे स्थान नाही. तुम्ही `.gitignore` फाइल्ससाठी टेम्पलेट्स [.gitignore templates](https://github.com/github/gitignore) येथे शोधू शकता किंवा [gitignore.io](https://www.toptal.com/developers/gitignore) वापरून एक तयार करू शकता.
### 🧠 **पहिल्या रेपॉजिटरी चेक-इन: कसं वाटलं?**
### 🧠 **पहिला रेपॉझिटरी चेक-इन: कसे वाटले?**
**थोडा वेळ साजरा करा आणि विचार करा:**
- तुमचा कोड पहिल्यांदा GitHub वर दिसल्यावर कसं वाटलं?
- कोणता टप्पा सर्वात गोंधळात टाकणारा वाटला, आणि कोणता आश्चर्यकारकपणे सोपा वाटला?
- तुम्ही `git add`, `git commit`, आणि `git push`यामधील फरक स्वतःच्या शब्दांत समजावून सांगू शकता का?
- तुमचा कोड GitHub वर पहिल्यांदा दिसल्यावर कसे वाटले?
- कोणता स्टेप सर्वात गोंधळात टाकणारा वाटला आणि कोणता आश्चर्यकारकपणे सोपा वाटला?
- तुम्ही तुमच्या शब्दांत `git add`, `git commit`, आणि `git push`मधील फरक स्पष्ट करू शकता का?
```mermaid
stateDiagram-v2
[*] --> LocalFiles: Create project
[*] --> LocalFiles: प्रकल्प तयार करा
LocalFiles --> Staged: git add .
Staged --> Committed: git commit
Committed --> GitHub: git push
GitHub --> [*]: Success! 🎉
GitHub --> [*]: यशस्वी! 🎉
note right of Staged
Files ready to save
फायली जतन करण्यासाठी तयार
end note
note right of Committed
Snapshot created
स्नॅपशॉट तयार केले
end note
```
> **लक्षात ठेवा**: अनुभवी डेव्हलपर्ससुद्धा कधी कधी अचूक कमांड्स विसरतात. हा वर्कफ्लो सवयीचा होण्यासाठी सराव लागतो - तुम्ही खूप चांगलं करत आहात!
> **लक्षात ठेवा**: अनुभवी डेव्हलपर्ससुद्धा कधी कधी अचूक कमांड्स विसरतात. हा वर्कफ्लो मसल मेमरी बनवण्यासाठी सराव आवश्यक आहे - तुम्ही उत्तम काम करत आहात!
#### आधुनिक Git वर्कफ्लो
या आधुनिक पद्धतींचा अवलंब करण्याचा विचार करा:
या आधुनिक पद्धती स्वीकारण्याचा विचार करा:
- **Conventional Commits**: `feat:`, `fix:`, `docs:`यासारख्या प्रमाणित कमिट संदेश स्वरूपाचा वापर करा. अधिक जाणून घ्या [conventionalcommits.org](https://www.conventionalcommits.org/) येथे.
- **Atomic commits**: प्रत्येक कमिट एकच तर्कसंगत बदल दर्शवेल याची खात्री करा.
एक उत्कृष्ट Git कमिट विषय ओळ खालील वाक्य पूर्ण करते:
जर लागू केले, तर हा कमिट <तुमचा विषय इथे> करेल.
एक उत्तम Git commit विषय ओळ खालील वाक्य पूर्ण करते:
जर लागू केले, तर हा commit <तुमचा विषय येथे>
विषयासाठी आज्ञार्थी, वर्तमानकाळाचा वापर करा: "change" नाही "changed" किंवा "changes".
विषयाप्रमाणेच, शरीरात (पर्यायी) देखील आज्ञार्थी, वर्तमानकाळाचा वापर करा. शरीरात बदलासाठी प्रेरणा समाविष्ट करावी आणि मागील वर्तनाशी याची तुलना करावी. तुम्ही `का` समजावत आहात, `कसे` नाही.
विषयासाठी imperative, present tense वापरा: "change" नाही "changed" किंवा "changes".
विषयासारखेच, body (पर्यायी) मध्येही imperative, present tense वापरा. body मध्ये बदलासाठी प्रेरणा समाविष्ट करा आणि यापूर्वीच्या वर्तनाशी तुलना करा. तुम्ही `का` स्पष्ट करत आहात, `कसे` नाही.
✅ काही वेळ काढून GitHub वर सर्फ करा. तुम्हाला एक खूप चांगला कमिट संदेश सापडतो का? तुम्हाला एक खूपच साधा सापडतो का? कमिट संदेशात कोणती माहिती सर्वात महत्त्वाची आणि उपयुक्त वाटते?
✅ काही मिनिटे GitHub वर फिरा. तुम्हाला एक खूपच चांगला commit संदेश सापडतो का? तुम्हाला एक खूपच साधा सापडतो का? commit संदेशामध्ये कोणती माहिती सर्वात महत्त्वाची आणि उपयुक्त वाटते?
## इतरांसोबत काम करणे (मजेदार भाग!)
तुमची टोपी धरून ठेवा कारण इथेच GitHub पूर्णपणे जादुई बनतो! 🪄 तुम्ही तुमचा स्वतःचा कोड व्यवस्थापित करण्यात निपुण झाला आहात, पण आता आपण माझ्या आवडत्या भागात प्रवेश करतो – जगभरातील अद्भुत लोकांसोबत सहकार्य करणे.
तुमची टोपी धरून ठेवा कारण GitHub येथे पूर्णपणे जादुई बनते! 🪄 तुम्ही तुमचा स्वतःचा कोड व्यवस्थापित करणे शिकला आहात, पण आता आम्ही माझा सर्वात आवडता भाग शिकणार आहोत – जगभरातील आश्चर्यकारक लोकांसोबत सहयोग करणे.
कल्पना करा: तुम्ही उद्या सकाळी उठता आणि पाहता की टोकियोमधील कोणीतरी तुमचा कोड सुधारला आहे. मग बर्लिनमधील कोणीतरी तुम्हाला अडचणीत टाकणारा बग दुरुस्त करतो. दुपारपर्यंत, साओ पाउलोमधील एक डेव्हलपर तुम्हाला कधीही विचारात न आलेली एक नवीन वैशिष्ट्य जोडतो. हे विज्ञानकथा नाही – हे फक्त GitHub विश्वातील एक सामान्य मंगळवार आहे!
कल्पना करा: तुम्ही उद्या उठता आणि पाहता की टोकियोमधील कोणीतरी तुमचा कोड सुधारला आहे. मग बर्लिनमधील कोणीतरी तुम्ही अडकलात त्या बगला दुरुस्त करतो. दुपारपर्यंत, साओ पाउलोमधील एक डेव्हलपर तुम्ही कधी विचारही केला नाही असा फिचर जोडतो. हे विज्ञान कल्पनारम्य नाही – हे फक्त GitHub विश्वातील एक सामान्य मंगळवार आहे!
मला खूप उत्साह येतो कारण तुम्ही आता शिकत असलेल्या सहकार्य कौशल्यांमुळे? हेच ते अचूक वर्कफ्लो आहेत जे Google, Microsoft, आणि तुमच्या आवडत्या स्टार्टअप्समधील टीम्स दररोज वापरतात. तुम्ही फक्त एक छान साधन शिकत नाही आहात – तुम्ही संपूर्ण सॉफ्टवेअर जगाला एकत्र काम करण्यास सक्षम करणारी गुप्त भाषा शिकत आहात.
मला खरोखरच उत्साहित करणारी गोष्ट म्हणजे तुम्ही शिकत असलेल्या सहयोग कौशल्य? ही EXACT तीच वर्कफ्लो आहेत जी Google, Microsoft आणि तुमच्या आवडत्या स्टार्टअप्समधील टीम्स दररोज वापरतात. तुम्ही फक्त एक छान टूल शिकत नाही आहात – तुम्ही संपूर्ण सॉफ्टवेअर जगाला एकत्र काम करण्यास सक्षम करणारी गुप्त भाषा शिकत आहात.
खरंच, जेव्हा तुम्हाला तुमचा पहिला pull request merge झाल्याचा आनंद होतो, तेव्हा तुम्हाला समजेल की डेव्हलपर्स ओपन सोर्सबद्दल इतके उत्साही का होतात. हे जगातील सर्वात मोठ्या, सर्वात सर्जनशील टीम प्रोजेक्टचा भाग असल्यासारखं आहे!
खरंच, जेव्हा तुम्हाला तुमचा पहिला pull request merge होण्याचा आनंद मिळतो, तेव्हा तुम्हाला समजेल की डेव्हलपर्स ओपन सोर्सबद्दल इतके उत्साही का होतात. हे जगातील सर्वात मोठ्या, सर्वात सर्जनशील टीम प्रोजेक्टचा भाग असल्यासारखे आहे!
> व्हिडिओ पहा
>
> [](https://www.youtube.com/watch?v=bFCM-PC3cu8)
> [](https://www.youtube.com/watch?v=bFCM-PC3cu8)
GitHub वर गोष्टी ठेवण्याचं मुख्य कारण म्हणजे इतर डेव्हलपर्ससोबत सहकार्य करणे शक्य होणे.
GitHub वर गोष्टी ठेवण्याचे मुख्य कारण म्हणजे इतर डेव्हलपर्ससोबत सहयोग करणे शक्य करणे.
```mermaid
flowchart LR
A[🔍 Find Project] --> B[🍴 Fork Repository]
B --> C[📥 Clone to Local]
C --> D[🌿 Create Branch]
D --> E[✏️ Make Changes]
E --> F[💾 Commit Changes]
F --> G[📤 Push Branch]
G --> H[🔄 Create Pull Request]
H --> I{Maintainer Review}
I -->|✅ Approved| J[🎉 Merge!]
I -->|❓ Changes Requested| K[📝 Make Updates]
A[🔍 प्रकल्प शोधा] --> B[🍴 रेपॉझिटरी फोर्क करा]
B --> C[📥 स्थानिकावर क्लोन करा]
C --> D[🌿 शाखा तयार करा]
D --> E[✏️ बदल करा]
E --> F[💾 बदल कमिट करा]
F --> G[📤 शाखा पुश करा]
G --> H[🔄 पुल विनंती तयार करा]
H --> I{रखवालदार पुनरावलोकन}
I -->|✅ मंजूर| J[🎉 विलीन करा!]
I -->|❓ बदलांची विनंती| K[📝 अद्यतने करा]
K --> F
J --> L[🧹 Clean Up Branches]
J --> L[🧹 शाखा साफ करा]
style A fill:#e3f2fd
style J fill:#e8f5e8
style L fill:#fff3e0
```
तुमच्या रेपॉझिटरीमध्ये, `Insights > Community` वर जा आणि तुमचा प्रोजेक्ट शिफारस केलेल्या समुदाय मानकांशी कसा तुलना करतो ते पहा.
तुमच्या रेपॉजिटरीमध्ये, `Insights > Community` ला जा आणि तुमचा प्रकल्प शिफारस केलेल्या समुदाय मानकांशी कसा तुलना करतो ते पहा.
तुमची रेपॉझिटरी व्यावसायिक आणि स्वागतार्ह दिसण्यासाठी तयार करायची आहे का? तुमच्या रेपॉझिटरीवर जा आणि `Insights > Community` वर क्लिक करा. ही छान फीचर तुम्हाला दाखवते की तुमचा प्रोजेक्ट GitHub समुदाय "चांगल्या रेपॉझिटरी पद्धती" मानतो त्याच्याशी कसा तुलना करतो.
तुमची रेपॉजिटरी व्यावसायिक आणि स्वागतार्ह दिसावी असं वाटतंय? तुमच्या रेपॉजिटरीमध्ये जा आणि `Insights > Community` वर क्लिक करा. ही छान वैशिष्ट्य तुम्हाला दाखवते की तुमचा प्रकल्प GitHub समुदायाच्या "चांगल्या रेपॉजिटरी पद्धतींशी" कसा तुलना करतो.
> 🎯 **तुमचा प्रोजेक्ट चमकदार बनवणे**: चांगल्या दस्तऐवजीकरणासह व्यवस्थित रेपॉझिटरी म्हणजे स्वच्छ, स्वागतार्ह स्टोअरफ्रंट असण्यासारखे आहे. हे लोकांना तुमच्या कामाची काळजी आहे असे सांगते आणि इतरांना योगदान देण्याची इच्छा निर्माण करते!
> 🎯 **तुमचा प्रकल्प चमकवा**: चांगल्या प्रकारे आयोजित केलेली रेपॉजिटरी आणि चांगल्या दस्तऐवजांसह, जणू काही स्वच्छ, स्वागतार्ह दुकानासारखी असते. हे लोकांना तुमच्या कामाबद्दल काळजी आहे हे सांगते आणि इतरांना योगदान देण्याची इच्छा निर्माण करते!
**एक रेपॉझिटरी उत्कृष्ट बनवते:**
**एक उत्कृष्ट रेपॉजिटरी कशी बनवायची:**
| काय जोडायचे | का महत्त्वाचे आहे | तुमच्यासाठी काय करते |
- **Branch protection rules** कोड गुणवत्ता मानक लागू करण्यासाठी
हे सर्व संसाधने नवीन टीम सदस्यांना onboard करण्यासाठी फायदेशीर ठरतील. आणि हेच ते प्रकार आहेत जे नवीन योगदानकर्ते तुमचा कोड पाहण्याआधी पाहतात, हे शोधण्यासाठी की तुमचा प्रकल्प त्यांचा वेळ खर्च करण्यासाठी योग्य आहे का.
हे सर्व संसाधने नवीन टीम सदस्यांना onboard करण्यासाठी फायदेशीर ठरतील. आणि हे सहसा नवीन योगदानकर्ते तुमचा कोड पाहण्याआधी पाहतात, हे शोधण्यासाठी की तुमचा प्रोजेक्ट त्यांचा वेळ खर्च करण्यासाठी योग्य जागा आहे का.
✅ README फाइल्स, जरी तयार करण्यात वेळ लागतो, तरीही व्यस्त मेंटेनर्सकडून अनेकदा दुर्लक्षित केल्या जातात. तुम्हाला एखाद्या विशेषतः वर्णनात्मक README चं उदाहरण सापडतं का? लक्षात ठेवा: [चांगल्या README तयार करण्यासाठी काही साधने](https://www.makeareadme.com/) आहेत जी तुम्हाला वापरायला आवडतील.
✅ README फाइल्स, जरी तयार करण्यासाठी वेळ लागतो, तरी व्यस्त मेंटेनर्सकडून अनेकदा दुर्लक्षित केल्या जातात. तुम्हाला विशेषतः वर्णनात्मक README सापडते का? लक्षात ठेवा: [चांगल्या README तयार करण्यासाठी टूल्स](https://www.makeareadme.com/) आहेत ज्याचा तुम्हाला प्रयत्न करायचा असेल.
### कार्य: काही कोड मर्ज करा
### कार्य: काही कोड merge करा
Contributing दस्तऐवज लोकांना प्रकल्पात योगदान देण्यास मदत करतो. यात तुम्ही कोणत्या प्रकारच्या योगदानाची अपेक्षा करता आणि प्रक्रिया कशी कार्य करते हे स्पष्ट केलं जातं. योगदानकर्त्यांना GitHub वर तुमच्या रेपॉजिटरीमध्ये योगदान देण्यासाठी काही टप्पे पार करावे लागतील:
Contributing दस्तऐवज लोकांना प्रोजेक्टमध्ये योगदान देण्यास मदत करतात. हे स्पष्ट करते की तुम्ही कोणत्या प्रकारचे योगदान शोधत आहात आणि प्रक्रिया कशी कार्य करते. योगदानकर्त्यांना GitHub वर तुमच्या रेपॉझिटरीमध्ये योगदान देण्यासाठी काही चरणांमधून जावे लागेल:
1. **तुमची रेपॉजिटरी Fork करणे**. तुम्हाला कदाचित लोकांना तुमचा प्रकल्प _fork_ करायला सांगायचं असेल. Forking म्हणजे त्यांच्या GitHub प्रोफाइलवर तुमच्या रेपॉजिटरीची प्रत तयार करणे.
1. **Clone**. त्यानंतर ते प्रकल्प त्यांच्या स्थानिक मशीनवर clone करतील.
1. **शाखा तयार करा**. तुम्हाला त्यांना त्यांच्या कामासाठी एक _शाखा_ तयार करायला सांगायचं आहे.
1. **त्यांचा बदल एका क्षेत्रावर केंद्रित करा**. योगदानकर्त्यांना एकावेळी एका गोष्टीवर लक्ष केंद्रित करण्यास सांगा - अशा प्रकारे त्यांचे काम _merge_ होण्याची शक्यता जास्त आहे. कल्पना करा की त्यांनी एक बग फिक्स लिहिला, एक नवीन वैशिष्ट्य जोडले, आणि अनेक चाचण्या अपडेट केल्या - काय होईल जर तुम्हाला, किंवा तुम्ही फक्त 2 पैकी 3, किंवा 1 पैकी 3 बदल लागू करू शकता?
1. **तुमच्या रेपॉझिटरीला fork करणे** तुम्हाला कदाचित लोकांना तुमचा प्रोजेक्ट _fork_ करायला सांगायचे असेल. Forking म्हणजे त्यांच्या GitHub प्रोफाइलवर तुमच्या रेपॉझिटरीची प्रत तयार करणे.
1. **Clone**. त्यानंतर ते प्रोजेक्ट त्यांच्या स्थानिक मशीनवर clone करतील.
1. **शाखा तयार करा**. तुम्हाला त्यांना त्यांच्या कामासाठी _शाखा_ तयार करायला सांगायचे आहे.
1. **त्यांचा बदल एका क्षेत्रावर केंद्रित करा**. योगदानकर्त्यांना एकावेळी एका गोष्टीवर त्यांचे योगदान केंद्रित करण्यास सांगा - त्यामुळे तुम्ही त्यांचे काम _merge_ करण्याची शक्यता जास्त आहे. कल्पना करा त्यांनी बग फिक्स लिहिला, नवीन फिचर जोडले आणि अनेक चाचण्या अपडेट केल्या - काय जर तुम्हाला 3 पैकी 2 किंवा 1 बदल लागू करायचे असतील?
✅ अशा परिस्थितीची कल्पना करा जिथे शाखा चांगला कोड लिहिण्यासाठी आणि पाठवण्यासाठी विशेषतः महत्त्वाच्या असतात. तुम्हाला कोणते उपयोग प्रकरणे सुचतात?
✅ अशा परिस्थितीची कल्पना करा जिथे शाखा चांगला कोड लिहिण्यासाठी आणि शिप करण्यासाठी विशेषतः महत्त्वाच्या आहेत. तुम्ही कोणते उपयोग प्रकरणे विचार करू शकता?
> लक्षात ठेवा, तुम्हाला जगात पाहायचा आहे तो बदल व्हा, आणि तुमच्या स्वतःच्या कामासाठीही शाखा तयार करा. तुम्ही केलेले कोणतेही कमिट्स तुम्ही सध्या "चेक आउट" केलेल्या शाखेत केले जातील. `git status` वापरून ती कोणती शाखा आहे ते पहा.
> लक्षात ठेवा, तुम्ही जगात पाहू इच्छित बदल व्हा आणि तुमच्या स्वतःच्या कामासाठी शाखा तयार करा. तुम्ही केलेले कोणतेही commits तुम्ही सध्या "चेक आउट" केलेल्या शाखेवर केले जातील. `git status` वापरून ती कोणती शाखा आहे ते पहा.
चला एक योगदानकर्ता वर्कफ्लो पाहू. गृहीत धरा की योगदानकर्त्याने आधीच रेपॉजिटरी _fork_ आणि _clone_ केली आहे, त्यामुळे त्यांच्याकडे स्थानिक मशीनवर काम करण्यासाठी Git रेपो तयार आहे:
चला योगदानकर्ता वर्कफ्लो पाहूया. गृहीत धरा की योगदानकर्त्याने आधीच रेपॉझिटरी _fork_ आणि _clone_ केली आहे त्यामुळे त्यांच्याकडे स्थानिक मशीनवर काम करण्यासाठी Git रेपॉझिटरी तयार आहे:
1. **शाखा तयार करा**. `git branch` कमांड वापरून एक शाखा तयार करा जी ते योगदान देऊ इच्छित असलेल्या बदलांचा समावेश करेल:
1. **शाखा तयार करा**. `git branch` कमांड वापरून शाखा तयार करा जी ते योगदान देऊ इच्छित असलेल्या बदलांचा समावेश करेल:
```bash
git branch [branch-name]
```
> 💡 **आधुनिक दृष्टिकोन**: तुम्ही एका कमांडमध्ये नवीन शाखा तयार करू शकता आणि त्यावर स्विच करू शकता:
> 💡 **आधुनिक पद्धत**: तुम्ही एका कमांडमध्ये नवीन शाखा तयार करू शकता आणि स्विच करू शकता:
```bash
git switch -c [branch-name]
```
1. **कामाच्या शाखेत स्विच करा**. निर्दिष्ट शाखेत स्विच करा आणि `git switch`सह कार्यरत निर्देशिका अपडेट करा:
1. **कामाच्या शाखेत स्विच करा**. निर्दिष्ट शाखेत स्विच करा आणि `git switch`वापरून कार्यरत निर्देशिका अपडेट करा:
```bash
git switch [branch-name]
```
> 💡 **आधुनिक टिप**: शाखा बदलताना `git switch` हे `git checkout` चे आधुनिक पर्याय आहे. हे अधिक स्पष्ट आणि नवशिक्यांसाठी सुरक्षित आहे.
> 💡 **आधुनिक टिप**: शाखा बदलताना `git switch` हे `git checkout` चे आधुनिक पर्याय आहे. हे स्पष्ट आणि सुरक्षीत आहे.
1. **काम करा**. या टप्प्यावर तुम्हाला तुमचे बदल जोडायचे आहेत. खालील कमांडसह Git ला त्याबद्दल सांगायला विसरू नका:
1. **काम करा**. या टप्प्यावर तुम्हाला तुमचे बदल जोडायचे आहेत. खालील कमांड्स वापरून Git ला त्याबद्दल सांगा:
```bash
git add .
git commit -m "my changes"
```
> ⚠️ **कमिट संदेश गुणवत्ता**: तुमच्या कमिटला चांगलं नाव द्या, तुमच्यासाठी आणि तुम्ही मदत करत असलेल्या रेपोच्या मेंटेनरसाठी. तुम्ही काय बदललं याबद्दल विशिष्ट व्हा!
> ⚠️ **Commit संदेश गुणवत्ता**: तुमच्या commit ला चांगले नाव द्या, तुमच्यासाठी आणि तुम्ही मदत करत असलेल्या रेपॉझिटरीच्या मेंटेनर साठी. तुम्ही काय बदलले याबद्दल विशिष्ट रहा!
1. **तुमचं काम `main` शाखेसोबत एकत्र करा**. एका टप्प्यावर तुम्ही काम पूर्ण करता आणि तुमचं काम `main` शाखेसोबत एकत्र करायचं असतं. दरम्यान `main` शाखा बदलली असेल, त्यामुळे खालील कमांडसह ती आधी नवीनतम स्थितीत अपडेट करा:
1. **तुमचे काम `main` शाखेसोबत एकत्र करा**. काही वेळाने तुम्ही काम पूर्ण करता आणि तुम्हाला तुमचे काम `main` शाखेसोबत एकत्र करायचे आहे. दरम्यान `main` शाखा बदलली असू शकते त्यामुळे खालील कमांड्स वापरून ती प्रथम नवीनतम अपडेट करा:
```bash
git switch main
git pull
```
या टप्प्यावर तुम्हाला खात्री करायची आहे की कोणतेही _conflicts_, जिथे Git सहजपणे _combine_ करू शकत नाही, ते तुमच्या कार्यरत शाखेत होतात. म्हणून खालील कमांड्स चालवा:
या टप्प्यावर तुम्हाला खात्री करायची आहे की कोणतेही _conflicts_, जिथे Git सहजपणे _combine_ करू शकत नाही ते तुमच्या कार्यरत शाखेत होतात. म्हणून खालील कमांड्स चालवा:
```bash
git switch [branch_name]
git merge main
```
`git merge main` कमांड `main` मधील सर्व बदल तुमच्या शाखेत आणेल. आशा आहे की तुम्ही फक्त पुढे जाऊ शकता. जर नाही, तर VS Code तुम्हाला सांगेल की Git कुठे _गोंधळलेला_ आहे आणि तुम्ही प्रभावित फाइल्स बदलून योग्य सामग्री निवडू शकता.
`git merge main` कमांड `main` मधील सर्व बदल तुमच्या शाखेत आणेल. आशा आहे की तुम्ही फक्त पुढे जाऊ शकता. जर नाही, तर VS Code तुम्हाला सांगेल की Git कुठे _confused_ आहे आणि तुम्ही प्रभावित फाइल्स बदलून सर्वात अचूक सामग्री सांगता.
💡 **आधुनिक पर्याय**: स्वच्छ इतिहासासाठी `git rebase` वापरण्याचा विचार करा:
```bash
git rebase main
```
हे तुमचे कमिट्स नवीनतम main शाखेच्या वर पुन्हा प्ले करते, एक रेषीय इतिहास तयार करते.
हे तुमच्या commits नवीनतम main शाखेवर पुन्हा प्ले करते, एक रेखीय इतिहास तयार करते.
1. **तुमचं काम GitHub वर पाठवा**. तुमचं काम GitHub वर पाठवणं म्हणजे दोन गोष्टी. तुमची शाखा तुमच्या forked रेपॉजिटरीवर पुश करा आणि नंतर एक PR (Pull Request) उघडा.
1. **तुमचे काम GitHub वर पाठवा**. तुमचे काम GitHub वर पाठवणे म्हणजे दोन गोष्टी. तुमची शाखा तुमच्या रेपॉझिटरीवर पुश करणे आणि नंतर PR, Pull Request उघडणे.
```bash
git push --set-upstream origin [branch-name]
```
वरील कमांड तुमच्या forked रेपॉजिटरीवर शाखा तयार करते.
वरील कमांड तुमच्या forked रेपॉझिटरीवर शाखा तयार करते.
### 🤝 **सहकार्य कौशल्य तपासणी: इतरांसोबत काम करण्यासाठी तयार आहात का?**
### 🤝 **सहयोग कौशल्य तपासणी: इतरांसोबत काम करण्यासाठी तयार?**
**सहकार्याबद्दल तुमचं कसं वाटतंय ते पाहूया:**
- Forking आणि pull requests ची कल्पना आता तुम्हाला समजली का?
**चला पाहूया की तुम्हाला सहयोगाबद्दल कसे वाटते:**
- तुम्हाला fork आणि pull requests ची कल्पना आता समजते का?
- शाखांसोबत काम करण्याबद्दल तुम्हाला कोणती गोष्ट अधिक सराव करायची आहे?
- इतरांच्या प्रकल्पात योगदान देण्याबद्दल तुम्हाला कितपत आत्मविश्वास वाटतो?
- तुम्हाला इतरांच्या प्रोजेक्टमध्ये योगदान देण्याबद्दल किती आरामदायक वाटते?
```mermaid
mindmap
root((Git Collaboration))
root((Git सहकार्य))
Branching
Feature branches
Bug fix branches
Experimental work
वैशिष्ट्य शाखा
बग फिक्स शाखा
प्रायोगिक काम
Pull Requests
Code review
Discussion
Testing
कोड पुनरावलोकन
चर्चा
चाचणी
Best Practices
Clear commit messages
Small focused changes
Good documentation
स्पष्ट कमिट संदेश
लहान लक्ष केंद्रित बदल
चांगले दस्तऐवजीकरण
```
> **आत्मविश्वास वाढवणारा**: तुम्ही प्रशंसा करत असलेला प्रत्येक डेव्हलपर त्यांच्या पहिल्या pull request बद्दल कधी तरी चिंतित होता. GitHub समुदाय नवख्या लोकांसाठी खूप स्वागतार्ह आहे!
> **आत्मविश्वास वाढवणारा**: तुम्ही ज्या प्रत्येक डेव्हलपरचं कौतुक करता, ते कधी ना कधी त्यांच्या पहिल्या pull request बद्दल चिंतित होते. GitHub समुदाय नवशिक्यांसाठी खूप स्वागतार्ह आहे!
1. **PR उघडा**. पुढे, तुम्हाला PR उघडायचा आहे. तुम्ही GitHub वर forked रेपॉझिटरीवर नेव्हिगेट करून ते करता. GitHub वर तुम्हाला नवीन PR तयार करायचे आहे का असे विचारणारा संकेत दिसेल, तुम्ही त्यावर क्लिक करता आणि तुम्हाला एक इंटरफेसवर नेले जाते जिथे तुम्ही commit संदेश शीर्षक बदलू शकता, त्याला अधिक योग्य वर्णन देऊ शकता. आता तुम्ही fork केलेल्या रेपॉझिटरीचा मेंटेनर हा PR पाहील आणि _fingers crossed_ ते तुमचा PR appreciate करतील आणि _merge_ करतील. तुम्ही आता योगदानकर्ता आहात, याय :)
1. **PR उघडा**. पुढे, तुम्हाला PR उघडायचं आहे. तुम्ही GitHub वर forked रेपॉजिटरीकडे जाऊन हे करू शकता. GitHub वर तुम्हाला एक सूचना दिसेल जिथे विचारलं जाईल की तुम्हाला नवीन PR तयार कराय
1. **स्वच्छता करा**. PR यशस्वीपणे मर्ज केल्यानंतर स्वच्छता करणे चांगली पद्धत मानली जाते. तुम्हाला तुमची स्थानिक शाखा आणि GitHub वर पुश केलेली शाखा दोन्ही स्वच्छ करायची असते. प्रथम, खालील कमांडसह ती स्थानिक स्तरावर हटवा:
💡 **आधुनिक टिप**: तुम्ही GitHub CLI वापरून PR देखील तयार करू शकता:
1. **स्वच्छता करा**. PR यशस्वीपणे मर्ज केल्यानंतर _स्वच्छता_ करणे चांगली सवय मानली जाते. तुम्हाला तुमची स्थानिक शाखा आणि GitHub वर पुश केलेली शाखा दोन्ही साफ करायची आहे. प्रथम, खालील कमांड वापरून ती स्थानिक स्तरावर हटवा:
```bash
git branch -d [branch-name]
```
नंतर GitHub वर फोर्क केलेल्या रेपोच्या पृष्ठावर जा आणि तुम्ही नुकतीच पुश केलेली रिमोट शाखा हटवा.
नंतर, फॉर्क केलेल्या रेपोच्या GitHub पृष्ठावर जा आणि तुम्ही नुकतीच पुश केलेली रिमोट शाखा हटवा.
`Pull request` हा शब्द थोडा विचित्र वाटतो कारण प्रत्यक्षात तुम्हाला तुमचे बदल प्रोजेक्टमध्ये पुश करायचे असतात. परंतु मेंटेनर (प्रोजेक्ट मालक) किंवा कोर टीमला तुमचे बदल प्रोजेक्टच्या "main" शाखेसोबत मर्ज करण्यापूर्वी विचार करणे आवश्यक असते, त्यामुळे तुम्ही प्रत्यक्षात मेंटेनरकडून बदलाचा निर्णय मागत आहात.
`Pull request` हा शब्द थोडा विचित्र वाटतो कारण प्रत्यक्षात तुम्हाला तुमचे बदल प्रोजेक्टमध्ये पुश करायचे असतात. परंतु प्रोजेक्टचा मालक किंवा कोर टीमला तुमचे बदल प्रोजेक्टच्या "main" शाखेत मर्ज करण्यापूर्वी विचार करणे आवश्यक आहे, त्यामुळे तुम्ही प्रत्यक्षात मालकाकडून बदलाचा निर्णय मागत आहात.
पुल रिक्वेस्ट ही एक जागा आहे जिथे शाखेवर केलेल्या बदलांची तुलना आणि चर्चा केली जाते, त्यात पुनरावलोकने, टिप्पण्या, एकत्रित चाचण्या आणि बरेच काही समाविष्ट असते. एक चांगला पुल रिक्वेस्ट साधारणपणे कमिट मेसेजसारखेच नियम पाळतो. तुम्ही तुमच्या कामाने एखाद्या समस्येचे निराकरण केले असल्यास, तुम्ही इश्यू ट्रॅकरमधील इश्यूचा संदर्भ जोडू शकता. हे `#` नंतर तुमच्या इश्यूचा क्रमांक वापरून केले जाते. उदाहरणार्थ `#97`.
Pull request ही शाखेत केलेल्या बदलांची तुलना आणि चर्चा करण्यासाठी जागा आहे, ज्यामध्ये पुनरावलोकने, टिप्पण्या, एकत्रित चाचण्या आणि बरेच काही समाविष्ट आहे. चांगला pull request साधारणपणे commit message सारखेच नियम पाळतो. जर तुमचे काम एखाद्या समस्येचे निराकरण करत असेल तर तुम्ही issue tracker मध्ये एखाद्या समस्येचा संदर्भ जोडू शकता. हे `#` आणि तुमच्या समस्येच्या क्रमांकासह केले जाते. उदाहरणार्थ `#97`.
🤞 बोटं क्रॉस करा की सर्व चेक्स पास होतील आणि प्रोजेक्ट मालक तुमचे बदल प्रोजेक्टमध्ये मर्ज करतील🤞
🤞बोटे क्रॉस करा की सर्व चाचण्या पास होतील आणि प्रोजेक्ट मालक तुमचे बदल प्रोजेक्टमध्ये मर्ज करतील🤞
तुमच्या स्थानिक कार्यरत शाखेत GitHub वरच्या संबंधित रिमोट शाखेतील सर्व नवीन कमिट्स अपडेट करा:
तुमच्या स्थानिक कार्यरत शाखेत GitHub वरील संबंधित रिमोट शाखेतील सर्व नवीन commits अपडेट करा:
`git pull`
## ओपन सोर्समध्ये योगदान देणे (तुमची प्रभाव टाकण्याची संधी!)
तुम्ही काहीतरी असे करण्यासाठी तयार आहात जे तुमच्या मनाला पूर्णपणे उडवून देईल? 🤯 चला ओपन सोर्स प्रोजेक्ट्समध्ये योगदान देण्याबद्दल बोलूया – आणि हे तुमच्यासोबत शेअर करताना मला खूप उत्साह वाटतो!
तुमच्या मनाला पूर्णपणे झपाटून टाकणाऱ्या गोष्टीसाठी तुम्ही तयार आहात का? 🤯 चला ओपन सोर्स प्रोजेक्ट्समध्ये योगदान देण्याबद्दल बोलूया – आणि हे तुमच्यासोबत शेअर करताना मला खूप उत्साह वाटतो!
ही तुमची संधी आहे काहीतरी खरोखरच असामान्य गोष्टीचा भाग बनण्याची. कल्पना करा की तुम्ही दररोज लाखो डेव्हलपर्स वापरत असलेल्या टूल्समध्ये सुधारणा करत आहात किंवा तुमच्या मित्रांना आवडणाऱ्या अॅपमधील बग दुरुस्त करत आहात. हे फक्त स्वप्न नाही – ओपन सोर्स योगदान याबद्दलच आहे!
ही तुमची काहीतरी विलक्षण गोष्टीचा भाग होण्याची संधी आहे. कल्पना करा की तुम्ही दररोज लाखो डेव्हलपर्स वापरत असलेल्या टूल्समध्ये सुधारणा करत आहात किंवा तुमच्या मित्रांना आवडणाऱ्या अॅपमधील बग दुरुस्त करत आहात. हे फक्त स्वप्न नाही –हेच ओपन सोर्स योगदान आहे!
मला प्रत्येक वेळी याचा विचार करताना रोमांच का येतो: तुम्ही शिकत असलेल्या प्रत्येक टूल – तुमचा कोड एडिटर, आपण एक्सप्लोर करणार असलेले फ्रेमवर्क, अगदी तुम्ही वाचत असलेला ब्राउझर – हे सर्व एखाद्या व्यक्तीने त्यांच्या पहिल्या योगदानासह सुरू केले. तुमच्या आवडत्या VS Code एक्सटेंशनचा तो प्रतिभावान डेव्हलपर? ते एकदा नवशिके होते ज्यांनी "create pull request" क्लिक केले होते, अगदी तुम्ही आता करणार आहात तसे.
आणि सर्वात सुंदर भाग म्हणजे: ओपन सोर्स समुदाय म्हणजे इंटरनेटचा सर्वात मोठा गट आलिंगन आहे. बहुतेक प्रोजेक्ट्स नवशिक्यांसाठी सक्रियपणे शोध घेतात आणि "good first issue" टॅग असलेल्या इश्यूज विशेषतः तुमच्यासारख्या लोकांसाठी असतात! मेंटेनर्स नवीन योगदानकर्ते पाहून खरोखरच उत्साहित होतात कारण त्यांना स्वतःचे पहिले पाऊल आठवते.
आणि सर्वात सुंदर भाग म्हणजे: ओपन सोर्स समुदाय म्हणजे इंटरनेटचा सर्वात मोठा गट आलिंगन आहे. बहुतेक प्रोजेक्ट्स नवशिक्यांसाठी सक्रियपणे शोध घेतात आणि "good first issue" टॅग असलेल्या समस्या विशेषतः तुमच्यासारख्या लोकांसाठी असतात! मालकांना नवीन योगदानकर्ते दिसले की खरोखर आनंद होतो कारण त्यांना स्वतःचे पहिले पाऊल आठवते.
```mermaid
flowchart TD
A[🔍 Explore GitHub] --> B[🏷️ Find "good first issue"]
B --> C[📖 Read Contributing Guidelines]
C --> D[🍴 Fork Repository]
D --> E[💻 Set Up Local Environment]
E --> F[🌿 Create Feature Branch]
F --> G[✨ Make Your Contribution]
G --> H[🧪 Test Your Changes]
H --> I[📝 Write Clear Commit]
I --> J[📤 Push & Create PR]
J --> K[💬 Engage with Feedback]
K --> L[🎉 Merged! You're a Contributor!]
L --> M[🌟 Find Next Issue]
A[🔍 GitHub एक्सप्लोर करा] --> B[🏷️ "चांगला पहिला मुद्दा" शोधा]
B --> C[📖 योगदान मार्गदर्शक वाचा]
C --> D[🍴 रेपॉझिटरी फोर्क करा]
D --> E[💻 स्थानिक वातावरण सेट करा]
E --> F[🌿 फीचर ब्रँच तयार करा]
F --> G[✨ आपले योगदान करा]
G --> H[🧪 आपले बदल तपासा]
H --> I[📝 स्पष्ट कमिट लिहा]
I --> J[📤 पुश करा आणि PR तयार करा]
J --> K[💬 अभिप्रायासह संवाद साधा]
K --> L[🎉 विलीन झाले! आपण योगदानकर्ता आहात!]
L --> M[🌟 पुढील मुद्दा शोधा]
style A fill:#e1f5fe
style L fill:#c8e6c9
style M fill:#fff59d
```
तुम्ही येथे कोड शिकत नाही आहात – तुम्ही बिल्डर्सच्या जागतिक कुटुंबात सामील होण्यासाठी तयार होत आहात जे दररोज उठून विचार करतात "डिजिटल जग थोडं चांगलं कसं बनवता येईल?" क्लबमध्ये स्वागत आहे! 🌟
तुम्ही येथे कोड शिकत नाही आहात – तुम्ही बिल्डर्सच्या जागतिक कुटुंबाचा भाग होण्यासाठी तयार होत आहात जे दररोज उठून विचार करतात "डिजिटल जग थोडेसे चांगले कसे बनवता येईल?" क्लबमध्ये स्वागत आहे! 🌟
प्रथम, GitHub वर तुम्हाला आवडणारा आणि ज्यामध्ये तुम्हाला बदल करायचा आहे असा रेपॉजिटरी (किंवा **repo**) शोधा. तुम्हाला त्याची सामग्री तुमच्या मशीनवर कॉपी करायची असेल.
✅ 'नवशिक्यांसाठी अनुकूल' रेपो शोधण्याचा एक चांगला मार्ग म्हणजे [टॅग 'good-first-issue' द्वारे शोधा](https://github.blog/2020-01-22-browse-good-first-issues-to-start-contributing-to-open-source/).
✅ 'नवशिक्यांसाठी अनुकूल' रेपॉजिटरी शोधण्याचा चांगला मार्ग म्हणजे [टॅग 'good-first-issue' द्वारे शोधा](https://github.blog/2020-01-22-browse-good-first-issues-to-start-contributing-to-open-source/).
कोड कॉपी करण्याचे अनेक मार्ग आहेत. एक मार्ग म्हणजे HTTPS, SSH किंवा GitHub CLI (कमांड लाइन इंटरफेस) वापरून रेपॉजिटरीची सामग्री "क्लोन" करणे.
कोड कॉपी करण्याचे अनेक मार्ग आहेत. एक मार्ग म्हणजे रेपॉजिटरीची सामग्री "क्लोन" करणे, HTTPS, SSH किंवा GitHub CLI (कमांड लाइन इंटरफेस) वापरून.
- **[GitHub.dev](https://github.dev)** - कोणत्याही GitHub रेपोवर `.` की प्रेस करा आणि ब्राउझरमध्ये VS Code उघडा
- **[GitHub.dev](https://github.dev)** - कोणत्याही GitHub रेपोवर `.` की दाबा आणि ब्राउझरमध्ये VS Code उघडा
- **VS Code** GitHub Pull Requests एक्सटेंशनसह
शेवटी, तुम्ही कोड झिप केलेल्या फोल्डरमध्ये डाउनलोड करू शकता.
### GitHub बद्दल काही अधिक मनोरंजक गोष्टी
तुम्ही GitHub वर कोणत्याही सार्वजनिक रेपॉजिटरीला स्टार, वॉच आणि/किंवा "fork" करू शकता. तुम्ही तुमच्या स्टार केलेल्या रेपॉजिटरी टॉप-राइट ड्रॉप-डाउन मेनूमध्ये शोधू शकता. हे बुकमार्किंगसारखे आहे, पण कोडसाठी.
तुम्ही GitHub वरील कोणत्याही सार्वजनिक रेपॉजिटरीला स्टार, वॉच आणि/किंवा "fork" करू शकता. तुम्ही तुमच्या स्टार केलेल्या रेपॉजिटरी टॉप-राइट ड्रॉप-डाउन मेनूमध्ये शोधू शकता. हे बुकमार्किंगसारखे आहे, पण कोडसाठी.
प्रोजेक्ट्समध्ये इश्यू ट्रॅकर असतो, मुख्यतः GitHub वर "Issues" टॅबमध्ये, जोपर्यंत वेगळे सांगितले नाही, जिथे लोक प्रोजेक्टशी संबंधित समस्यांवर चर्चा करतात. आणि Pull Requests टॅब ही जागा आहे जिथे लोक प्रगतीपथावर असलेल्या बदलांवर चर्चा आणि पुनरावलोकन करतात.
प्रोजेक्ट्समध्ये समस्या ट्रॅकर असतो, मुख्यतः GitHub वर "Issues" टॅबमध्ये, जोपर्यंत अन्यथा सूचित केले जात नाही, जिथे लोक प्रोजेक्टशी संबंधित समस्यांवर चर्चा करतात. आणि Pull Requests टॅब म्हणजे लोक प्रगतीपथावर असलेल्या बदलांवर चर्चा आणि पुनरावलोकन करतात.
प्रोजेक्ट्समध्ये फोरम, मेलिंग लिस्ट्स किंवा Slack, Discord किंवा IRC सारख्या चॅट चॅनेलमध्ये चर्चा असू शकते.
प्रोजेक्ट्समध्ये फोरम, मेलिंग लिस्ट किंवा Slack, Discord किंवा IRC सारख्या चॅट चॅनेलमध्ये चर्चा देखील असू शकते.
- **GitHub Sponsors** - मेंटेनर्सना आर्थिक मदत करा
- **GitHub Sponsors** - मालकांना आर्थिक मदत करा
- **Security tab** - असुरक्षितता अहवाल आणि सुरक्षा सल्लागार
- **Actions tab** - स्वयंचलित वर्कफ्लो आणि CI/CD पाइपलाइन्स पहा
- **Insights tab** - योगदानकर्ते, कमिट्स आणि प्रोजेक्टच्या आरोग्याबद्दल विश्लेषण
- **Projects tab** - GitHub चे अंगभूत प्रोजेक्ट व्यवस्थापन टूल्स
- **Actions tab** - स्वयंचलित वर्कफ्लो आणि CI/CD पाइपलाइन पहा
- **Insights tab** - योगदानकर्ते, commits आणि प्रोजेक्टच्या आरोग्याबद्दल विश्लेषण
- **Projects tab** - GitHub चे अंगभूत प्रोजेक्ट व्यवस्थापन साधने
✅ तुमच्या नवीन GitHub रेपोभोवती एक नजर टाका आणि काही गोष्टी करून पहा, जसे की सेटिंग्ज संपादित करणे, तुमच्या रेपोमध्ये माहिती जोडणे, प्रोजेक्ट तयार करणे (जसे की Kanban बोर्ड), आणि ऑटोमेशनसाठी GitHub Actions सेट करणे. तुम्ही खूप काही करू शकता!
✅ तुमच्या नवीन GitHub रेपोभोवती एक नजर टाका आणि काही गोष्टी करून पहा, जसे की सेटिंग्ज संपादित करणे, तुमच्या रेपोमध्ये माहिती जोडणे, प्रोजेक्ट तयार करणे (जसे की Kanban बोर्ड), आणि GitHub Actions स्वयंचलिततेसाठी सेट करणे. तुम्ही बरेच काही करू शकता!
---
## 🚀 आव्हान
ठीक आहे, तुमच्या नवीन GitHub सुपरपॉवर्सची चाचणी घेण्याची वेळ आली आहे! 🚀 येथे एक आव्हान आहे जे सर्वकाही सर्वात समाधानकारक मार्गाने क्लिक करेल:
ठीक आहे, तुमच्या नवीन GitHub सुपरपॉवर्सची चाचणी घेण्याची वेळ आली आहे! 🚀 येथे एक आव्हान आहे जे सर्वकाही सर्वात समाधानकारक मार्गाने स्पष्ट करेल:
तुमच्या मित्राला (किंवा त्या कुटुंबातील सदस्याला जो नेहमी विचारतो की तुम्ही या "कॉम्प्युटर गोष्टी"सह काय करत आहात) पकडा आणि एकत्र एक सहयोगी कोडिंग साहस सुरू करा! येथे खरी जादू घडते – एक प्रोजेक्ट तयार करा, त्यांना ते फोर्क करू द्या, काही शाखा तयार करा आणि तुम्ही प्रोफेशनल्ससारखे बदल मर्ज करा.
एखाद्या मित्राला (किंवा त्या कुटुंबातील सदस्याला जो नेहमी विचारतो की तुम्ही या "कॉम्प्युटर गोष्टी"सह काय करत आहात) पकडा आणि एकत्रित कोडिंग साहसावर जा! येथे खरी जादू घडते – एक प्रोजेक्ट तयार करा, त्यांना ते fork करू द्या, काही शाखा तयार करा आणि तुम्ही प्रोफेशनल्ससारखे बदल मर्ज करा.
मी खोटं बोलणार नाही – तुम्ही कदाचित एखाद्या वेळी हसाल (विशेषतः जेव्हा तुम्ही दोघे एकाच ओळीत बदल करण्याचा प्रयत्न करता), कदाचित गोंधळून जाल, परंतु तुम्हाला नक्कीच ते अद्भुत "अरे वा!" क्षण मिळतील ज्यामुळे सर्व शिक्षण सार्थक वाटेल. शिवाय, एखाद्या दुसऱ्या व्यक्तीसोबत पहिला यशस्वी मर्ज शेअर करण्यामध्ये काहीतरी खास आहे – हे तुम्ही किती पुढे आला आहात याचा एक छोटासा उत्सव आहे!
मी खोटे बोलणार नाही – तुम्ही कदाचित एखाद्या वेळी हसाल (विशेषतः जेव्हा तुम्ही दोघे एकाच ओळीत बदल करण्याचा प्रयत्न करता), कदाचित गोंधळात डोके खाजवता, परंतु तुम्हाला नक्कीच ते अद्भुत "आह!" क्षण मिळतील जे सर्व शिक्षणाचे मूल्य सिद्ध करतात. शिवाय, एखाद्या दुसऱ्या व्यक्तीसोबत पहिला यशस्वी मर्ज शेअर करण्यामध्ये काहीतरी खास आहे – हे तुम्ही किती पुढे आला आहात याचा छोटासा उत्सव आहे!
तुमच्याकडे अजून कोडिंग साथीदार नाही? काही हरकत नाही! GitHub समुदाय नवीन लोकांसाठी खूप स्वागतार्ह आहे ज्यांना नवीन असल्याचे कसे वाटते हे आठवते. "good first issue" लेबल असलेल्या रेपॉजिटरी शोधा – ते मूलतः म्हणत आहेत "अरे नवशिक्यांनो, आमच्यासोबत शिका!" हे किती छान आहे?
तुमच्याकडे अजून कोडिंग साथीदार नाही? काही हरकत नाही! GitHub समुदाय नवीन लोकांसाठी खूप स्वागतार्ह आहे ज्यांना नवीन असण्याचा अनुभव होता. "good first issue" लेबल असलेल्या रेपॉजिटरी शोधा – ते मूलतः म्हणत आहेत "अरे नवशिक्यांनो, आमच्यासोबत शिका!" किती छान आहे ना?
व्वा! 🎉 पाहा तुम्ही – तुम्ही GitHub मूलभूत गोष्टी जिंकल्या आहेत जसे की एक पूर्ण चॅम्पियन! जर तुमचा मेंदू सध्या थोडा भरलेला वाटत असेल, तर ते पूर्णपणे सामान्य आहे आणि प्रामाणिकपणे एक चांगले लक्षण आहे. तुम्ही नुकतेच असे टूल्स शिकले आहेत ज्यामुळे मला सुरुवातीला काही आठवडे लागले.
व्वा! 🎉 पाहा तुम्ही – तुम्ही GitHub मूलभूत गोष्टी जिंकल्या आहेत जसे की एक पूर्ण चॅम्पियन! जर तुमचे डोके सध्या थोडे भरलेले वाटत असेल, तर ते पूर्णपणे सामान्य आहे आणि प्रामाणिकपणे चांगले लक्षण आहे. तुम्ही नुकतेच असे टूल्स शिकले आहेत ज्यामुळे मला सुरुवातीला आरामदायक वाटण्यासाठी आठवडे लागले.
Git आणि GitHub खूप शक्तिशाली आहेत (म्हणजे, खरोखर शक्तिशाली), आणि मला माहित असलेल्या प्रत्येक डेव्हलपरला– ज्यांना आता जादूगार वाटतात –सराव करावा लागला आणि ते सर्व क्लिक होण्यापूर्वी थोडेसे गोंधळले. तुम्ही हा धडा पूर्ण केला आहे याचा अर्थ असा आहे की तुम्ही डेव्हलपरच्या टूलकिटमधील सर्वात महत्त्वाच्या टूल्समध्ये प्रभुत्व मिळवण्याच्या मार्गावर आहात.
Git आणि GitHub खूप शक्तिशाली आहेत (म्हणजे, खरोखर शक्तिशाली), आणि मला माहित असलेल्या प्रत्येक डेव्हलपर – ज्यांना आता जादूगार वाटतात –त्यांनी सराव केला आणि ते सर्व स्पष्ट होण्यापूर्वी थोडेसे गोंधळले. तुम्ही हा धडा पूर्ण केला आहे याचा अर्थ तुम्ही डेव्हलपरच्या टूलकिटमधील सर्वात महत्त्वाच्या टूल्समध्ये प्रभुत्व मिळवण्याच्या मार्गावर आहात.
तुम्हाला सराव करण्यात आणि आणखी आश्चर्यकारक बनवण्यात मदत करण्यासाठी येथे काही उत्कृष्ट संसाधने आहेत:
तुम्हाला सराव करण्यासाठी आणि आणखी अप्रतिम होण्यासाठी काही उत्कृष्ट संसाधने येथे आहेत:
- [ओपन सोर्स सॉफ्टवेअरमध्ये योगदान देण्याचा मार्गदर्शक](https://opensource.guide/how-to-contribute/#how-to-submit-a-contribution) – फरक करण्यासाठी तुमचा रोडमॅप
- [Git चीटशीट](https://training.github.com/downloads/github-git-cheat-sheet/) – जलद संदर्भासाठी हे सोबत ठेवा!
- [ओपन सोर्स सॉफ्टवेअरमध्ये योगदान देण्याचे मार्गदर्शन](https://opensource.guide/how-to-contribute/#how-to-submit-a-contribution) – फरक करण्यासाठी तुमचा रोडमॅप
- [Git cheatsheet](https://training.github.com/downloads/github-git-cheat-sheet/) – जलद संदर्भासाठी हे सोबत ठेवा!
आणि लक्षात ठेवा: सराव प्रगती करतो, परिपूर्णता नाही! तुम्ही Git आणि GitHub जितके अधिक वापराल तितके अधिक नैसर्गिक वाटेल. GitHub ने काही आश्चर्यकारक इंटरएक्टिव कोर्सेस तयार केले आहेत जे तुम्हाला सुरक्षित वातावरणात सराव करू देतात:
आणि लक्षात ठेवा: सराव प्रगती करतो, परिपूर्णता नाही! तुम्ही Git आणि GitHub जितके अधिक वापराल तितके अधिक नैसर्गिक होईल. GitHub ने काही आश्चर्यकारक इंटरएक्टिव कोर्सेस तयार केले आहेत जे तुम्हाला सुरक्षित वातावरणात सराव करू देतात:
- [GitHub ची ओळख](https://github.com/skills/introduction-to-github)
- [Markdown वापरून संवाद साधा](https://github.com/skills/communicate-using-markdown)
- [GitHub CLI दस्तऐवज](https://cli.github.com/manual/) – जेव्हा तुम्हाला कमांड-लाइन जादूगारासारखे वाटते
- [GitHub CLI दस्तऐवज](https://cli.github.com/manual/) – जेव्हा तुम्हाला कमांड-लाइन जादूगारासारखे वाटायचे असेल
- [GitHub Codespaces दस्तऐवज](https://docs.github.com/en/codespaces) – क्लाउडमध्ये कोड करा!
- [GitHub Actions दस्तऐवज](https://docs.github.com/en/actions) – सर्व गोष्टी स्वयंचलित करा
- [Git सर्वोत्तम पद्धती](https://www.atlassian.com/git/tutorials/comparing-workflows) – तुमच्या वर्कफ्लो गेमला स्तरावर आणा
- [Git सर्वोत्तम पद्धती](https://www.atlassian.com/git/tutorials/comparing-workflows) – तुमच्या वर्कफ्लो गेमला पुढे घ्या
## GitHub Copilot Agent Challenge 🚀
@ -661,57 +652,80 @@ Agent मोड वापरून खालील आव्हान पूर
**वर्णन:** तुम्ही या धड्यात शिकलेल्या संपूर्ण GitHub वर्कफ्लोचे प्रदर्शन करणारा सहयोगी वेब डेव्हलपमेंट प्रोजेक्ट तयार करा. हे आव्हान तुम्हाला रेपॉजिटरी तयार करणे, सहयोगी वैशिष्ट्ये आणि आधुनिक Git वर्कफ्लो वास्तविक-जगातील परिस्थितीत सराव करण्यास मदत करेल.
**प्रॉम्प्ट:** "Web Development Resources" प्रोजेक्टसाठी एक नवीन सार्वजनिक GitHub रेपॉजिटरी तयार करा. रेपॉजिटरीमध्ये HTML, CSS, JavaScript इत्यादी श्रेणींनुसार उपयुक्त वेब डेव्हलपमेंट टूल्स आणि संसाधनांची यादी असलेली चांगल्या प्रकारे संरचित README.md फाइल समाविष्ट असावी. रेपॉजिटरीला योग्य समुदाय मानकांसह सेट करा ज्यामध्ये परवाना, योगदान मार्गदर्शक तत्त्वे आणि आचारसंहिता समाविष्ट आहे. CSS संसाधने जोडण्यासाठी एक शाखा आणि JavaScript संसाधने जोडण्यासाठी दुसरी शाखा तयार करा. प्रत्येक शाखेत वर्णनात्मक कमिट मेसेजसह कमिट्स करा, नंतर बदल मुख्य शाखेत मर्ज करण्यासाठी पुल रिक्वेस्ट तयार करा. इश्यूज, डिस्कशन्स सारख्या GitHub वैशिष्ट्यांना सक्षम करा आणि स्वयंचलित चेकसाठी मूलभूत GitHub Actions वर्कफ्लो सेट करा.
**प्रॉम्प्ट:** "Web Development Resources" प्रोजेक्टसाठी एक नवीन सार्वजनिक GitHub रेपॉजिटरी तयार करा. रेपॉजिटरीमध्ये HTML, CSS, JavaScript इत्यादी श्रेणींनुसार उपयुक्त वेब डेव्हलपमेंट टूल्स आणि संसाधने सूचीबद्ध करणारी चांगल्या प्रकारे संरचित README.md फाइल समाविष्ट असावी. रेपॉजिटरीला योग्य समुदाय मानकांसह सेट करा ज्यामध्ये परवाना, योगदान मार्गदर्शक तत्त्वे आणि आचारसंहिता समाविष्ट आहे. CSS संसाधने जोडण्यासाठी एक शाखा आणि JavaScript संसाधने जोडण्यासाठी दुसरी शाखा तयार करा. प्रत्येक शाखेत वर्णनात्मक commit messages सह commits करा, नंतर बदल मुख्य शाखेत मर्ज करण्यासाठी pull requests तयार करा. Issues, Discussions सारख्या GitHub वैशिष्ट्यांना सक्षम करा आणि स्वयंचलित चाचण्यांसाठी GitHub Actions वर्कफ्लो सेट करा.
## असाइनमेंट
तुमचे मिशन, तुम्ही स्वीकारण्यास तयार असल्यास: GitHub Skills वर [GitHub ची ओळख](https://github.com/skills/introduction-to-github) कोर्स पूर्ण करा. हा इंटरएक्टिव कोर्स तुम्हाला सुरक्षित, मार्गदर्शित वातावरणात तुम्ही शिकलेल्या प्रत्येक गोष्टीचा सराव करू देईल. शिवाय, तुम्ही पूर्ण केल्यावर तुम्हाला एक छान बॅज मिळेल! 🏅
तुमचे मिशन, तुम्ही स्वीकारण्यास तयार असल्यास: GitHub Skills वरील [GitHub ची ओळख](https://github.com/skills/introduction-to-github) कोर्स पूर्ण करा. हा इंटरएक्टिव कोर्स तुम्हाला शिकलेल्या सर्व गोष्टी सुरक्षित, मार्गदर्शित वातावरणात सराव करू देईल. शिवाय, तुम्हाला पूर्ण झाल्यावर एक छान बॅज मिळेल! 🏅
- [ ] तुमच्या GitHub योगदानांचे प्रदर्शन करणारे पोर्टफोलिओ तयार करा
- [ ] Hacktoberfest किंवा तत्सम समुदाय कार्यक्रमांमध्ये सहभागी व्हा
- [ ] इतर लोक योगदान देत असलेल्या तुमच्या स्वतःच्या प्रोजेक्टचे मेंटेनर बना
- [ ] इतर लोक योगदान देत असलेल्या तुमच्या स्वतःच्या प्रोजेक्टचे मालक बना
### 🎓 **GitHub मास्टरी अंतिम तपासणी**
**तुम्ही किती पुढे आला आहात याचा उत्सव करा:**
- GitHub वापरण्याबद्दल तुमची आवडती गोष्ट
- GitHub वापरण्याबद्दल तुम्हाला सर्वात आवडते काय?
- तुम्हाला सर्वात रोमांचक वाटणारे सहयोगी वैशिष्ट्य कोणते आहे?
- ओपन सोर्समध्ये योगदान देण्याबद्दल तुम्हाला किती आत्मविश्वास वाटतो?
- तुम्हाला योगदान द्यायचे असलेले पहिले प्रोजेक्ट कोणते आहे?
```mermaid
journey
title तुमचा GitHub आत्मविश्वास प्रवास
section आज
घाबरलेले: 3: तुम्ही
उत्सुक: 4: तुम्ही
उत्साहित: 5: तुम्ही
section या आठवड्यात
सराव करत आहे: 4: तुम्ही
योगदान देत आहे: 5: तुम्ही
जोडत आहे: 5: तुम्ही
section पुढील महिना
सहकार्य करत आहे: 5: तुम्ही
नेतृत्व करत आहे: 5: तुम्ही
इतरांना प्रेरित करत आहे: 5: तुम्ही
```
> 🌍 **जागतिक डेव्हलपर समुदायात स्वागत आहे!** तुम्हाला आता जगभरातील लाखो डेव्हलपर्ससोबत सहयोग करण्याची साधने आहेत. तुमचे पहिले
---
<!-- CO-OP TRANSLATOR DISCLAIMER START -->
**अस्वीकरण**:
हा दस्तऐवज AI भाषांतर सेवा [Co-op Translator](https://github.com/Azure/co-op-translator) वापरून भाषांतरित करण्यात आला आहे. आम्ही अचूकतेसाठी प्रयत्नशील असलो तरी, कृपयास लक्षात ठेवा की स्वयंचलित भाषांतरे त्रुटी किंवा अचूकतेच्या अभावाने युक्त असू शकतात. मूळ भाषेतील दस्तऐवज हा अधिकृत स्रोत मानला जावा. महत्त्वाच्या माहितीसाठी, व्यावसायिक मानवी भाषांतराची शिफारस केली जाते. या भाषांतराचा वापर करून उद्भवलेल्या कोणत्याही गैरसमज किंवा चुकीच्या अर्थासाठी आम्ही जबाबदार राहणार नाही.
हा दस्तऐवज AI भाषांतर सेवा [Co-op Translator](https://github.com/Azure/co-op-translator) वापरून भाषांतरित करण्यात आला आहे. आम्ही अचूकतेसाठी प्रयत्नशील असलो तरी, कृपयास लक्षात ठेवा की स्वयंचलित भाषांतरांमध्ये त्रुटी किंवा अचूकतेचा अभाव असू शकतो. मूळ भाषेतील दस्तऐवज हा अधिकृत स्रोत मानला जावा. महत्त्वाच्या माहितीसाठी व्यावसायिक मानवी भाषांतराची शिफारस केली जाते. या भाषांतराचा वापर करून निर्माण झालेल्या कोणत्याही गैरसमज किंवा चुकीच्या अर्थासाठी आम्ही जबाबदार राहणार नाही.
मायक्रोसॉफ्ट क्लाउड अॅडव्होकेट्सद्वारे तयार केलेल्या 12 आठवड्यांच्या व्यापक कोर्ससह वेब विकासाची मूलभूत तत्त्वे शिका. प्रत्येक 24 धड्यांमध्ये जावास्क्रिप्ट, CSS आणि HTML यावर सखोल प्रकल्पांद्वारे चर्चा केली जाते जसे की टेरॅरियम्स, ब्राउझर एक्सटेंशन आणि स्पेस गेम्स. क्विझ, चर्चासत्रे आणि व्यावहारिक असाइनमेंट्ससह सहभाग घ्या. आमच्या प्रभावी प्रकल्प-आधारित शिक्षण पद्धतीसह तुमचे कौशल्य वाढवा आणि तुमचे ज्ञान टिकवून ठेवा. आजच तुमचा कोडिंग प्रवास सुरू करा!
मायक्रोसॉफ्ट क्लाउड अॅडव्होकेट्सद्वारे तयार केलेल्या 12 आठवड्यांच्या व्यापक कोर्ससह वेब विकासाची मूलभूत तत्त्वे शिका. प्रत्येक 24 धड्यांमध्ये जावास्क्रिप्ट, CSS आणि HTML यावर प्रकल्पांद्वारे सखोल चर्चा केली जाते, जसे की टेरॅरियम्स, ब्राउझर एक्सटेंशन्स आणि स्पेस गेम्स. क्विझ, चर्चा आणि व्यावहारिक असाइनमेंट्ससह सहभाग घ्या. प्रकल्प-आधारित शिक्षण पद्धतीसह तुमचे कौशल्य वाढवा आणि ज्ञान टिकवून ठेवा. आजच तुमचा कोडिंग प्रवास सुरू करा!
Azure AI Foundry Discord समुदायामध्ये सामील व्हा
[](https://discord.com/invite/ByRwuEEgH4)
**जर तुम्हाला अतिरिक्त भाषांमध्ये भाषांतर हवे असेल तर समर्थित भाषांची यादी [येथे](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) आहे**
[](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 Challenge 🚀" बहुतेक अध्यायांमध्ये शोधा. हे GitHub Copilot आणि Agent मोड वापरून पूर्ण करण्यासाठी एक नवीन आव्हान आहे. जर तुम्ही Agent मोड वापरला नसेल तर तो केवळ मजकूर तयार करण्यास सक्षम नाही तर फाइल्स तयार आणि संपादित करू शकतो, कमांड चालवू शकतो आणि बरेच काही करू शकतो.
नवीन आव्हान जोडले गेले आहे, "GitHub Copilot Agent Challenge 🚀" बहुतेक अध्यायांमध्ये शोधा. हे GitHub Copilot आणि Agent मोड वापरून पूर्ण करण्यासाठी एक नवीन आव्हान आहे. जर तुम्ही Agent मोड वापरला नसेल तर तो केवळ मजकूर तयार करण्यास सक्षम नाही तर फाइल्स तयार आणि संपादित करू शकतो, आदेश चालवू शकतो आणि बरेच काही करू शकतो.
### 📣 घोषणा - _Generative AI वापरून तयार करण्यासाठी नवीन प्रकल्प_
नवीन AI सहाय्यक प्रकल्प नुकताच जोडला आहे, तपासा [प्रकल्प](./09-chat-project/README.md)
नवीन AI सहाय्यक प्रकल्प नुकताच जोडला गेला आहे, तपासा [प्रकल्प](./09-chat-project/README.md)
### 📣 घोषणा - _नवीन अभ्यासक्रम_ JavaScript साठी Generative AI वर नुकताच प्रसिद्ध झाला
@ -81,42 +81,42 @@ Azure AI Foundry Discord समुदायामध्ये सामील
## 🌱 सुरुवात करणे
> **शिक्षक**, आम्ही [काही सूचना समाविष्ट केल्या आहेत](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://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 खात्यात अभ्यासक्रमाची प्रत असलेली नवीन रेपॉझिटरी तयार होईल.
तुमचे काम सहजपणे सेव्ह करण्यासाठी, तुमच्या GitHub खात्यात या रेपॉझिटरीची स्वतःची प्रत तयार करणे शिफारसीय आहे. तुम्ही पृष्ठाच्या शीर्षस्थानी **Use this template** बटणावर क्लिक करून हे करू शकता. यामुळे तुमच्या GitHub खात्यात अभ्यासक्रमाची प्रत असलेली नवीन रेपॉझिटरी तयार होईल.
या चरणांचे अनुसरण करा:
1. **रेपॉझिटरी फोर्क करा**: या पृष्ठाच्या वरच्या उजव्या कोपऱ्यातील "Fork" बटणावर क्लिक करा.
1. **रेपॉझिटरी फोर्क करा**: या पृष्ठाच्या वरच्या उजव्या कोपऱ्यात "Fork" बटणावर क्लिक करा.
तुमच्या रेपॉझिटरीच्या प्रतामध्ये, तुम्ही तयार केलेल्या**Code** बटणावर क्लिक करा आणि **Open with Codespaces** निवडा. यामुळे तुमच्यासाठी काम करण्यासाठी नवीन Codespace तयार होईल.
तुमच्या तयार केलेल्या रेपॉझिटरीच्या प्रतामध्ये, **Code** बटणावर क्लिक करा आणि **Open with Codespaces** निवडा. यामुळे तुमच्यासाठी काम करण्यासाठी नवीन Codespace तयार होईल.
#### तुमच्या संगणकावर स्थानिकपणे अभ्यासक्रम चालवणे
तुमच्या संगणकावर स्थानिकपणे अभ्यासक्रम चालवण्यासाठी, तुम्हाला टेक्स्ट एडिटर, ब्राउझर आणि कमांड लाइन टूलची आवश्यकता असेल. आमचा पहिला धडा, [प्रोग्रामिंग भाषांची ओळख आणि व्यापाराचे साधने](../../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) देखील समाविष्ट आहे. तुम्ही [इथे](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) Visual Studio Code डाउनलोड करू शकता.
1. तुमच्या रेपॉझिटरीला तुमच्या संगणकावर क्लोन करा. तुम्ही **Code** बटणावर क्लिक करून आणि URL कॉपी करून हे करू शकता:
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) उघडा आणि खालील कमांड चालवा, `<your-repository-url>` 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) उघडा आणि खालील आदेश चालवा, `<your-repository-url>` तुमच्या कॉपी केलेल्या URL ने बदला:
```bash
git clone <your-repository-url>
@ -126,135 +126,138 @@ Azure AI Foundry Discord समुदायामध्ये सामील
> शिफारस केलेले Visual Studio Code एक्सटेंशन्स:
>
> * [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer&WT.mc_id=academic-77807-sagibbon) - HTML पृष्ठ Visual Studio Code मध्ये प्रीव्ह्यू करण्यासाठी
> * [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) - कोड लवकर लिहिण्यास मदत करण्यासाठी
## 📂 प्रत्येक धड्यात समाविष्ट आहे:
- पर्यायी स्केच नोट
- पर्यायी पूरक व्हिडिओ
- ऐच्छिक स्केच नोट
- ऐच्छिक पूरक व्हिडिओ
- धड्यापूर्वीचा वॉर्मअप क्विझ
- लेखी धडा
- प्रकल्प-आधारित धड्यांसाठी, प्रकल्प कसा तयार करायचा याचे चरण-दर-चरण मार्गदर्शन
- प्रकल्प-आधारित धड्यांसाठी, प्रकल्प कसा तयार करायचा याचे चरण-दर-चरण मार्गदर्शक
> **क्विझबद्दल एक टीप**: सर्व क्विझ Quiz-app फोल्डरमध्ये समाविष्ट आहेत, प्रत्येक तीन प्रश्नांसह एकूण 48 क्विझ. ते [येथे](https://ff-quizzes.netlify.app/web/) उपलब्ध आहेत. Quiz app स्थानिक पातळीवर चालवता येते किंवा 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 मूलभूत गोष्टी | जावास्क्रिप्ट डेटा प्रकार | जावास्क्रिप्ट डेटा प्रकारांची मूलभूत माहिती | [डेटा प्रकार](./2-js-basics/1-data-types/README.md) | Jasmine |
| 05 | JS मूलभूत गोष्टी | फंक्शन्स आणि मेथड्स | अॅप्लिकेशनच्या लॉजिक फ्लोचे व्यवस्थापन करण्यासाठी फंक्शन्स आणि मेथड्सबद्दल जाणून घ्या | [फंक्शन्स आणि मेथड्स](./2-js-basics/2-functions-methods/README.md) | Jasmine आणि Christopher |
| 06 | JS मूलभूत गोष्टी | जावास्क्रिप्टसह निर्णय घेणे | निर्णय घेण्याच्या पद्धती वापरून तुमच्या कोडमध्ये अटी कशा तयार करायच्या ते जाणून घ्या | [निर्णय घेणे](./2-js-basics/3-making-decisions/README.md) | Jasmine |
| 07 | JS मूलभूत गोष्टी | ऍरे आणि लूप्स | जावास्क्रिप्टमध्ये ऍरे आणि लूप्स वापरून डेटा व्यवस्थापित करा | [ऍरे आणि लूप्स](./2-js-basics/4-arrays-loops/README.md) | Jasmine |
| 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) | जावास्क्रिप्ट क्लोजर्स, DOM मॅनिप्युलेशन | टेरॅरियमला ड्रॅग/ड्रॉप इंटरफेस म्हणून कार्य करण्यासाठी जावास्क्रिप्ट तयार करा, क्लोजर्स आणि DOM मॅनिप्युलेशनवर लक्ष केंद्रित करा | [जावास्क्रिप्ट क्लोजर्स, DOM मॅनिप्युलेशन](./3-terrarium/3-intro-to-DOM-and-closures/README.md) | Jen |
| 11 | [Typing Game](./4-typing-game/solution/README.md) | टायपिंग गेम तयार करा | तुमच्या जावास्क्रिप्ट अॅपच्या लॉजिकला चालवण्यासाठी कीबोर्ड इव्हेंट्स कसे वापरायचे ते जाणून घ्या | [इव्हेंट-ड्रिव्हन प्रोग्रामिंग](./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 कॉल करणे आणि स्थानिक स्टोरेजमध्ये व्हेरिएबल्स साठवणे | स्थानिक स्टोरेजमध्ये साठवलेल्या व्हेरिएबल्स वापरून API कॉल करण्यासाठी तुमच्या ब्राउझर एक्सटेंशनचे जावास्क्रिप्ट घटक तयार करा | [APIs, फॉर्म्स, आणि स्थानिक स्टोरेज](./5-browser-extension/2-forms-browsers-local-storage/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 कॉल करणे आणि स्थानिक स्टोरेजमध्ये व्हेरिएबल्स साठवणे | स्थानिक स्टोरेजमध्ये साठवलेल्या व्हेरिएबल्सचा वापर करून API कॉल करण्यासाठी तुमच्या ब्राउझर एक्सटेंशनचे JavaScript घटक तयार करा | [APIs, फॉर्म्स, आणि स्थानिक स्टोरेज](./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) | जावास्क्रिप्टसह अधिक प्रगत गेम विकास | गेम तयार करण्याच्या तयारीसाठी क्लासेस आणि कंपोझिशन वापरून इनहेरिटन्स आणि पब/सब पॅटर्नबद्दल जाणून घ्या | [प्रगत गेम विकासाची ओळख](./6-space-game/1-introduction/README.md) | Chris |
| 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) | कॅनव्हासवर रेखाटन | स्क्रीनवर घटक रेखाटण्यासाठी वापरल्या जाणाऱ्या कॅनव्हास API बद्दल जाणून घ्या | [कॅनव्हासवर रेखाटन](./6-space-game/2-drawing-to-canvas/README.md) | Chris |
| 17 | [Space Game](./6-space-game/solution/README.md) | स्क्रीनवर घटक हलवणे | घटकांना कसे गती मिळू शकते ते शोधा, कार्टेशियन कोऑर्डिनेट्स आणि कॅनव्हास API वापरून | [घटक हलवणे](./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 |
| 17 | [Space Game](./6-space-game/solution/README.md) | स्क्रीनवर घटक हलवणे | घटकांना कार्टेशियन कोऑर्डिनेट्स आणि कॅनव्हास API वापरून गती कशी मिळवता येते ते शोधा | [घटक हलवणे](./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 |
| 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 |
## 🏫 शिक्षण पद्धती
## 🏫 अध्यापनशास्त्र
आमचा अभ्यासक्रम दोन प्रमुख शिक्षण पद्धतींच्या तत्त्वांवर आधारित आहे:
आमचे अभ्यासक्रम दोन प्रमुख अध्यापनशास्त्रीय तत्त्वे लक्षात घेऊन डिझाइन केले गेले आहे:
* प्रकल्प-आधारित शिक्षण
* वारंवार क्विझ
कार्यक्रम जावास्क्रिप्ट, HTML, आणि CSS च्या मूलभूत गोष्टी तसेच आजच्या वेब विकसकांद्वारे वापरल्या जाणाऱ्या नवीनतम साधने आणि तंत्र शिकवतो. विद्यार्थ्यांना टायपिंग गेम, व्हर्च्युअल टेरॅरियम, पर्यावरणास अनुकूल ब्राउझर एक्सटेंशन, स्पेस-इनव्हेडर-शैलीतील गेम आणि व्यवसायांसाठी बँकिंग अॅप तयार करून व्यावहारिक अनुभव मिळवण्याची संधी मिळेल. मालिकेच्या शेवटी, विद्यार्थ्यांना वेब विकासाची ठोस समज प्राप्त होईल.
हा कार्यक्रम JavaScript, HTML, आणि CSS च्या मूलभूत गोष्टी तसेच आजच्या वेब विकसकांनी वापरलेली नवीनतम साधने आणि तंत्र शिकवतो. विद्यार्थ्यांना टायपिंग गेम, वर्च्युअल टेरॅरियम, पर्यावरणपूरक ब्राउझर एक्सटेंशन, स्पेस-इनव्हेडर-शैलीतील गेम आणि व्यवसायांसाठी बँकिंग अॅप तयार करून प्रत्यक्ष अनुभव मिळवण्याची संधी मिळेल. मालिकेच्या शेवटी, विद्यार्थ्यांना वेब डेव्हलपमेंटचे ठोस ज्ञान मिळाले असेल.
> 🎓 तुम्ही Microsoft Learn वर [Learn Path](https://docs.microsoft.com/learn/paths/web-development-101/?WT.mc_id=academic-77807-sagibbon) म्हणून या अभ्यासक्रमातील काही सुरुवातीचे धडे घेऊ शकता!
> 🎓 तुम्ही या अभ्यासक्रमातील पहिले काही धडे [Learn Path](https://docs.microsoft.com/learn/paths/web-development-101/?WT.mc_id=academic-77807-sagibbon) वर Microsoft Learn वर घेऊ शकता!
सामग्री प्रकल्पांशी संरेखित असल्याचे सुनिश्चित करून, प्रक्रिया विद्यार्थ्यांसाठी अधिक आकर्षक बनवली जाते आणि संकल्पनांचे धारणा वाढवले जाते. आम्ही जावास्क्रिप्टच्या मूलभूत गोष्टींच्या अनेक प्रारंभिक धडे लिहिले आहेत, ज्यामध्ये "[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 आठवड्यांच्या चक्राच्या शेवटी अधिकाधिक जटिल होतात.
याव्यतिरिक्त, वर्गापूर्वीचा कमी-जोखीम क्विझ विद्यार्थ्याच्या विषय शिकण्याच्या हेतूची स्थापना करतो, तर वर्गानंतरचा दुसरा क्विझ पुढील धारणा सुनिश्चित करतो. हा अभ्यासक्रम लवचिक आणि मजेदार बनवण्यासाठी डिझाइन केला गेला आहे आणि तो पूर्ण किंवा अंशतः घेतला जाऊ शकतो. प्रकल्प लहान सुरू होतात आणि 12 आठवड्यांच्या चक्राच्या शेवटी अधिकाधिक जटिल होतात.
आम्ही जावास्क्रिप्ट फ्रेमवर्क्सची ओळख टाळण्याचा हेतू ठेवला आहे जेणेकरून फ्रेमवर्क स्वीकारण्यापूर्वी वेब विकसक म्हणून आवश्यक मूलभूत कौशल्यांवर लक्ष केंद्रित करता येईल, या अभ्यासक्रम पूर्ण केल्यानंतर पुढील चांगले पाऊल म्हणजे Node.js बद्दल शिकणे, व्हिडिओंच्या आणखी एका संग्रहाद्वारे: "[Beginner Series to: Node.js](https://channel9.msdn.com/Series/Beginners-Series-to-Nodejs/?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](CODE_OF_CONDUCT.md) आणि [Contributing](CONTRIBUTING.md) मार्गदर्शक तत्त्वांना भेट द्या. आम्ही तुमच्या रचनात्मक अभिप्रायाचे स्वागत करतो!
## 🧭 ऑफलाइन प्रवेश
तुम्ही [Docsify](https://docsify.js.org/#/) वापरून हे दस्तऐवज ऑफलाइन चालवू शकता. या रेपोला फोर्क करा, तुमच्या स्थानिक मशीनवर [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) सापडेल.
## 🎒 इतर अभ्यासक्रम
आमची टीम इतर अभ्यासक्रम तयार करते! पहा:
<!-- CO-OP TRANSLATOR OTHER COURSES START -->
### Azure / Edge / MCP / Agents
[](https://github.com/microsoft/AZD-for-beginners?WT.mc_id=academic-105485-koreyst)
[](https://github.com/microsoft/edgeai-for-beginners?WT.mc_id=academic-105485-koreyst)
[](https://github.com/microsoft/edgeai-for-beginners?WT.mc_id=academic-105485-koreyst)
[](https://github.com/microsoft/mcp-for-beginners?WT.mc_id=academic-105485-koreyst)
[](https://github.com/microsoft/ai-agents-for-beginners?WT.mc_id=academic-105485-koreyst)
---
### जनरेटिव AI मालिका
[](https://github.com/microsoft/generative-ai-for-beginners?WT.mc_id=academic-105485-koreyst)
[-9333EA?style=for-the-badge&labelColor=E5E7EB&color=9333EA)](https://github.com/microsoft/Generative-AI-for-beginners-dotnet?WT.mc_id=academic-105485-koreyst)
[-C084FC?style=for-the-badge&labelColor=E5E7EB&color=C084FC)](https://github.com/microsoft/generative-ai-for-beginners-java?WT.mc_id=academic-105485-koreyst)
[-E879F9?style=for-the-badge&labelColor=E5E7EB&color=E879F9)](https://github.com/microsoft/generative-ai-with-javascript?WT.mc_id=academic-105485-koreyst)
### जनरेटिव AI मालिका
[](https://github.com/microsoft/generative-ai-for-beginners?WT.mc_id=academic-105485-koreyst)
[-9333EA?style=for-the-badge&labelColor=E5E7EB&color=9333EA)](https://github.com/microsoft/Generative-AI-for-beginners-dotnet?WT.mc_id=academic-105485-koreyst)
[-C084FC?style=for-the-badge&labelColor=E5E7EB&color=C084FC)](https://github.com/microsoft/generative-ai-for-beginners-java?WT.mc_id=academic-105485-koreyst)
[-E879F9?style=for-the-badge&labelColor=E5E7EB&color=E879F9)](https://github.com/microsoft/generative-ai-with-javascript?WT.mc_id=academic-105485-koreyst)
[](https://aka.ms/ml-beginners?WT.mc_id=academic-105485-koreyst)
[](https://aka.ms/datascience-beginners?WT.mc_id=academic-105485-koreyst)
[](https://aka.ms/ai-beginners?WT.mc_id=academic-105485-koreyst)
[](https://github.com/microsoft/Security-101?WT.mc_id=academic-96948-sayoung)
[](https://aka.ms/webdev-beginners?WT.mc_id=academic-105485-koreyst)
[](https://aka.ms/iot-beginners?WT.mc_id=academic-105485-koreyst)
[](https://github.com/microsoft/xr-development-for-beginners?WT.mc_id=academic-105485-koreyst)
[](https://github.com/microsoft/mastering-github-copilot-for-dotnet-csharp-developers?WT.mc_id=academic-105485-koreyst)
[](https://aka.ms/GitHubCopilotAI?WT.mc_id=academic-105485-koreyst)
[](https://github.com/microsoft/mastering-github-copilot-for-dotnet-csharp-developers?WT.mc_id=academic-105485-koreyst)
जर तुम्हाला अडचण आली किंवा AI अॅप्स तयार करण्याबद्दल काही प्रश्न असतील, तर येथे सामील व्हा:
जर तुम्हाला अडचण आली किंवा AI अॅप्स तयार करताना काही प्रश्न असतील, तर MCP बद्दल चर्चा करण्यासाठी शिकणारे आणि अनुभवी विकसकांसोबत सामील व्हा. ही एक सहायक समुदाय आहे जिथे प्रश्न विचारले जातात आणि ज्ञान मुक्तपणे सामायिक केले जाते.
[](https://aka.ms/foundry/discord)
जर तुम्हाला उत्पादनाबद्दल अभिप्राय द्यायचा असेल किंवा तयार करताना काही त्रुटी आढळल्यास येथे भेट द्या:
जर तुम्हाला उत्पादनाबद्दल अभिप्राय द्यायचा असेल किंवा तयार करताना त्रुटी आढळल्या तर भेट द्या:
[](https://aka.ms/foundry/forum)
हे रिपॉझिटरी MIT परवान्याअंतर्गत परवानाकृत आहे. अधिक माहितीसाठी [LICENSE](../../LICENSE) फाईल पहा.
या रिपॉझिटरीला MIT परवान्याखाली परवानगी दिली आहे. अधिक माहितीसाठी [LICENSE](../../LICENSE) फाइल पहा.
---
<!-- CO-OP TRANSLATOR DISCLAIMER START -->
**अस्वीकरण**:
हा दस्तऐवज AI भाषांतर सेवा [Co-op Translator](https://github.com/Azure/co-op-translator) वापरून भाषांतरित करण्यात आला आहे. आम्ही अचूकतेसाठी प्रयत्नशील असलो तरी कृपया लक्षात ठेवा की स्वयंचलित भाषांतरे त्रुटी किंवा अचूकतेच्या अभावाने युक्त असू शकतात. मूळ भाषेतील दस्तऐवज हा अधिकृत स्रोत मानला जावा. महत्त्वाच्या माहितीसाठी व्यावसायिक मानवी भाषांतराची शिफारस केली जाते. या भाषांतराचा वापर करून उद्भवलेल्या कोणत्याही गैरसमज किंवा चुकीच्या अर्थासाठी आम्ही जबाबदार राहणार नाही.
हा दस्तऐवज AI भाषांतर सेवा [Co-op Translator](https://github.com/Azure/co-op-translator) वापरून भाषांतरित करण्यात आला आहे. आम्ही अचूकतेसाठी प्रयत्नशील असलो तरी, कृपया लक्षात ठेवा की स्वयंचलित भाषांतरे त्रुटी किंवा अचूकतेच्या अभावाने युक्त असू शकतात. मूळ भाषेतील दस्तऐवज हा अधिकृत स्रोत मानला जावा. महत्त्वाच्या माहितीसाठी, व्यावसायिक मानवी भाषांतराची शिफारस केली जाते. या भाषांतराचा वापर करून उद्भवलेल्या कोणत्याही गैरसमज किंवा चुकीच्या अर्थासाठी आम्ही जबाबदार राहणार नाही.
माइक्रोसफ्ट क्लाउड एड्भोकेट्सद्वारा तयार गरिएको १२ हप्ताको व्यापक पाठ्यक्रम मार्फत वेब विकासको आधारभूत कुराहरू सिक्नुहोस्। प्रत्येक २४ पाठले जाभास्क्रिप्ट, CSS, र HTML मा व्यावहारिक परियोजनाहरू जस्तै टेरारियम, ब्राउजर एक्सटेन्सन, र स्पेस गेमहरू मार्फत गहिरो अध्ययन गराउँछ। क्विज, छलफल, र व्यावहारिक असाइनमेन्टहरूमा संलग्न हुनुहोस्। हाम्रो प्रभावकारी परियोजना-आधारित शिक्षण विधिबाट आफ्नो सीप सुधार गर्नुहोस् र ज्ञानको प्रतिधारणलाई अनुकूल बनाउनुहोस्। आजै आफ्नो कोडिङ यात्रा सुरु गर्नुहोस्!
माइक्रोसफ्ट क्लाउड एड्भोकेट्सद्वारा तयार गरिएको १२ हप्ताको व्यापक पाठ्यक्रम मार्फत वेब विकासको आधारभूत कुराहरू सिक्नुहोस्। प्रत्येक २४ पाठले जाभास्क्रिप्ट, CSS, र HTML मा व्यावहारिक परियोजनाहरू जस्तै टेरारियम, ब्राउजर एक्सटेन्सन, र स्पेस गेमहरू मार्फत गहिरो जानकारी दिन्छ। क्विज, छलफल, र व्यावहारिक असाइनमेन्टहरूमा संलग्न हुनुहोस्। हाम्रो प्रभावकारी परियोजना-आधारित शिक्षण विधि प्रयोग गरेर आफ्नो सीप सुधार गर्नुहोस् र ज्ञानको स्थायित्वलाई अनुकूल बनाउनुहोस्। आजै आफ्नो कोडिङ यात्रा सुरु गर्नुहोस्!
Azure AI Foundry Discord समुदायमा सामेल हुनुहोस्
[](https://discord.com/invite/ByRwuEEgH4)
**यदि तपाईं थप अनुवाद भाषाहरू चाहनुहुन्छ भने यहाँ सूचीबद्ध छन् [यहाँ](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)**
[](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 Challenge 🚀" खोज्नुहोस्। यो GitHub Copilot र Agent मोड प्रयोग गरेर पूरा गर्नका लागि नयाँ चुनौती हो। यदि तपाईंले पहिले Agent मोड प्रयोग गर्नुभएको छैन भने यो केवल पाठ सिर्जना गर्न मात्र होइन, फाइलहरू सिर्जना र सम्पादन गर्न, आदेशहरू चलाउन र थप गर्न सक्षम छ।
नयाँ चुनौती थपिएको छ, अधिकांश अध्यायहरूमा "GitHub Copilot Agent Challenge 🚀" खोज्नुहोस्। यो नयाँ चुनौती हो जुन तपाईंले GitHub Copilot र Agent मोड प्रयोग गरेर पूरा गर्न सक्नुहुन्छ। यदि तपाईंले पहिले Agent मोड प्रयोग गर्नुभएको छैन भने यो केवल टेक्स्ट उत्पन्न गर्न मात्र होइन, फाइलहरू सिर्जना र सम्पादन गर्न, कमाण्डहरू चलाउन र थप गर्न सक्षम छ।
### 📣 घोषणा - _Generative AI प्रयोग गरेर नयाँ परियोजना निर्माण गर्नुहोस्_
नयाँ AI सहायक परियोजना हालै थपिएको छ, यसलाई जाँच गर्नुहोस् [परियोजना](./09-chat-project/README.md)
नयाँ AI सहायक परियोजना हालै थपिएको छ, यसलाई जाँच गर्नुहोस् [project](./09-chat-project/README.md)
### 📣 घोषणा - _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) मा जानुहोस् र सुरु गर्नुहोस्!
प्रत्येक पाठमा पूरा गर्नका लागि असाइनमेन्ट, ज्ञान जाँच र चुनौती समावेश छ जसले तपाईंलाई निम्न विषयहरू सिक्न मार्गदर्शन गर्दछ:
- प्रम्प्टिङ र प्रम्प्ट इन्जिनियरिङ
- पाठ र छवि एप निर्माण
- खोज एपहरू
सुरु गर्नका लागि [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) तपाईंको प्रतिक्रिया चाहन्छौं!
**[शिक्षार्थीहरू](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) मा थप अध्ययन सामग्री अन्वेषण गर्न अत्यधिक सिफारिस गर्छौं।
### 📋 तपाईंको वातावरण सेटअप गर्दै
### 📋 आफ्नो वातावरण सेटअप गर्दै
यो पाठ्यक्रमसँग विकास वातावरण तयार छ! सुरु गर्दा तपाईं [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" बटनमा क्लिक गर्नुहोस्।
तपाईंले सिर्जना गरेको यस रिपोजिटरीको प्रतिलिपिमा, **Code** बटनमा क्लिक गर्नुहोस् र **Open with Codespaces** चयन गर्नुहोस्। यसले तपाईंलाई काम गर्नका लागि नयाँ Codespace सिर्जना गर्नेछ।
तपाईंले सिर्जना गरेको यस रिपोजिटरीको प्रतिलिपिमा, **Code** बटनमा क्लिक गर्नुहोस् र **Open with Codespaces** चयन गर्नुहोस्। यसले तपाईंलाई काम गर्न नयाँ Codespace सिर्जना गर्नेछ।
#### तपाईंको कम्प्युटरमा स्थानीय रूपमा पाठ्यक्रम चलाउँदै
#### आफ्नो कम्प्युटरमा स्थानीय रूपमा पाठ्यक्रम चलाउँदै
तपाईंको कम्प्युटरमा स्थानीय रूपमा यो पाठ्यक्रम चलाउनका लागि, तपाईंलाई टेक्स्ट एडिटर, ब्राउजर र कमाण्ड लाइन उपकरण आवश्यक हुनेछ। हाम्रो पहिलो पाठ, [प्रोग्रामिङ भाषाहरू र उपकरणहरूको परिचय](../../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) पनि समावेश छ। तपाईं [यहाँ](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) बाट Visual Studio Code डाउनलोड गर्न सक्नुहुन्छ।
1. तपाईंको रिपोजिटरीलाई तपाईंको कम्प्युटरमा क्लोन गर्नुहोस्। तपाईंले **Code** बटनमा क्लिक गरेर र URL प्रतिलिपि गरेर यो गर्न सक्नुहुन्छ:
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) खोल्नुहोस् र निम्न कमाण्ड चलाउनुहोस्, `<your-repository-url>` लाई तपाईंले प्रतिलिपि गरेको 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) खोल्नुहोस् र तलको कमाण्ड चलाउनुहोस्, `<your-repository-url>` लाई तपाईंले प्रतिलिपि गरेको URL सँग बदल्नुहोस्:
```bash
git clone <your-repository-url>
@ -126,8 +127,8 @@ Azure AI Foundry Discord समुदायमा सामेल हुनु
> सिफारिस गरिएको Visual Studio Code एक्सटेन्सनहरू:
>
> * [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer&WT.mc_id=academic-77807-sagibbon) - HTML पृष्ठहरूलाई Visual Studio Code भित्रै पूर्वावलोकन गर्न
> * [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) - तपाईंलाई छिटो कोड लेख्न मद्दत गर्न
## 📂 प्रत्येक पाठमा समावेश छ:
@ -142,38 +143,38 @@ Azure AI Foundry Discord समुदायमा सामेल हुनु
- असाइनमेन्ट
- [पाठ पछि क्विज](https://ff-quizzes.netlify.app/web/)
> **क्विजहरूको बारेमा नोट**: सबै क्विजहरू Quiz-app फोल्डरमा समावेश छन्, प्रत्येकमा तीन प्रश्न सहित 48 कुल क्विजहरू। तिनीहरू [यहाँ](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 |
| 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 and Christopher |
| 06 | JS आधारभूत कुरा | JS प्रयोग गरेर निर्णय लिने | निर्णय लिने विधिहरू प्रयोग गरेर आफ्नो कोडमा सर्तहरू सिर्जना गर्ने तरिका जान्नुहोस् | [निर्णय लिने](./2-js-basics/3-making-decisions/README.md) | Jasmine |
| 07 | JS आधारभूत कुरा | Arrays र लूपहरू | JavaScript मा डेटा प्रयोग गरेर Arrays र लूपहरूसँग काम गर्नुहोस् | [Arrays र लूपहरू](./2-js-basics/4-arrays-loops/README.md) | Jasmine |
| 08 | [Terrarium](./3-terrarium/solution/README.md) | HTML अभ्यासमा | अनलाइन Terrarium निर्माण गर्न HTML बनाउनुहोस्, लेआउट निर्माणमा ध्यान केन्द्रित गर्दै | [HTML को परिचय](./3-terrarium/1-intro-to-html/README.md) | Jen |
| 09 | [Terrarium](./3-terrarium/solution/README.md) | CSS अभ्यासमा | अनलाइन Terrarium लाई शैली दिन CSS बनाउनुहोस्, CSS को आधारभूत कुरा सहित पृष्ठलाई उत्तरदायी बनाउनेमा ध्यान केन्द्रित गर्दै | [CSS को परिचय](./3-terrarium/2-intro-to-css/README.md) | Jen |
| 10 | [Terrarium](./3-terrarium/solution/README.md) | JavaScript Closures, DOM हेरफेर | Terrarium लाई ड्र्याग/ड्रप इन्टरफेसको रूपमा कार्य गर्न JavaScript बनाउनुहोस्, Closures र DOM हेरफेरमा ध्यान केन्द्रित गर्दै | [JavaScript Closures, 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 कल गर्ने | [APIs, फारमहरू, र स्थानीय स्टोरेज](./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 प्रयोग गरेर थप उन्नत खेल विकास | खेल निर्माणको तयारीमा कक्षाहरू र संरचना प्रयोग गरेर उत्तराधिकारको बारेमा जान्नुहोस्, साथै Pub/Sub ढाँचाको बारेमा जान्नुहोस् | [उन्नत खेल विकासको परिचय](./6-space-game/1-introduction/README.md) | Chris |
| 16 | [Space Game](./6-space-game/solution/README.md) | क्यानभासमा चित्र बनाउने | स्क्रिनमा तत्वहरू चित्र बनाउन प्रयोग गरिने Canvas API को बारेमा जान्नुहोस् | [क्यानभासमा चित्र बनाउने](./6-space-game/2-drawing-to-canvas/README.md) | Chris |
| 17 | [Space Game](./6-space-game/solution/README.md) | स्क्रिनमा तत्वहरू सार्ने | तत्वहरूले Cartesian समन्वय र Canvas API प्रयोग गरेर गति कसरी प्राप्त गर्न सक्छन् जान्नुहोस् | [तत्वहरू सार्ने](./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 |
| 06 | JS आधारभूत कुरा | JS संग निर्णय लिने | निर्णय लिने विधिहरू प्रयोग गरेर आफ्नो कोडमा सर्तहरू कसरी सिर्जना गर्ने जान्नुहोस् | [निर्णय लिने](./2-js-basics/3-making-decisions/README.md) | Jasmine |
| 07 | JS आधारभूत कुरा | Arrays र लूपहरू | JavaScript मा डेटा संग काम गर्न Arrays र लूपहरू प्रयोग गर्नुहोस् | [Arrays र लूपहरू](./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 कल गर्दै र स्थानीय स्टोरेजमा भेरिएबलहरू भण्डारण गर्दै | स्थानीय स्टोरेजमा भण्डारण गरिएका भेरिएबलहरू प्रयोग गरेर API कल गर्न आफ्नो ब्राउजर एक्सटेन्सनको JavaScript तत्वहरू निर्माण गर्नुहोस् | [APIs, फारमहरू, र स्थानीय स्टोरेज](./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) | स्क्रिनमा तत्वहरू सार्दै | तत्वहरूले कार्टेसियन निर्देशांक र क्यानभास 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 |
## 🏫 शिक्षाशास्त्र
@ -181,22 +182,22 @@ Azure AI Foundry Discord समुदायमा सामेल हुनु
* परियोजना-आधारित सिकाइ
* बारम्बार क्विजहरू
कार्यक्रमले JavaScript, HTML, र CSS को आधारभूत कुरा, साथै आजका वेब विकासकर्ताहरूले प्रयोग गर्ने नवीनतम उपकरणहरू र प्रविधिहरू सिकाउँछ। विद्यार्थीहरूले टाइपिङ खेल, भर्चुअल Terrarium, वातावरणमैत्री ब्राउजर एक्सटेन्सन, स्पेस-इनभेडर शैलीको खेल, र व्यवसायहरूको लागि बैंकिङ अनुप्रयोग निर्माण गरेर व्यावहारिक अनुभव विकास गर्ने अवसर पाउनेछन्। श्रृंखला समाप्त हुँदा, विद्यार्थीहरूले वेब विकासको ठोस समझ प्राप्त गरेका हुनेछन्।
कार्यक्रमले JavaScript, HTML, र CSS को आधारभूत कुरा, साथै आजका वेब विकासकर्ताहरूले प्रयोग गर्ने नवीनतम उपकरणहरू र प्रविधिहरू सिकाउँछ। विद्यार्थीहरूले टाइपिङ खेल, भर्चुअल टेरारियम, वातावरणमैत्री ब्राउजर एक्सटेन्सन, स्पेस-इनभेडर शैलीको खेल, र व्यवसायहरूको लागि बैंकिङ एप निर्माण गरेर व्यावहारिक अनुभव विकास गर्ने अवसर पाउनेछन्। श्रृंखला समाप्त हुँदा, विद्यार्थीहरूले वेब विकासको ठोस समझ प्राप्त गरेका हुनेछन्।
> 🎓 तपाईं यस पाठ्यक्रमका केही प्रारम्भिक पाठहरू [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-हप्ताको चक्रको अन्त्यसम्ममा क्रमशः जटिल बन्छन्।
यसका साथै, कक्षाको अघि कम-जोखिमको क्विजले विद्यार्थीलाई विषयवस्तु सिक्नको लागि उद्देश्य सेट गर्दछ, जबकि कक्षापछि दोस्रो क्विजले थप अवधारण सुनिश्चित गर्दछ। यो पाठ्यक्रम लचिलो र रमाइलो बनाउन डिजाइन गरिएको हो र पूर्ण वा आंशिक रूपमा लिन सकिन्छ। परियोजनाहरू साना सुरु हुन्छन् र 12-हप्ताको चक्रको अन्त्यसम्ममा क्रमशः जटिल बन्छन्।
हामीले जानाजानी JavaScript फ्रेमवर्कहरू परिचय गराउनबाट बचेका छौं ताकि फ्रेमवर्क अपनाउनु अघि वेब विकासकर्ताको रूपमा आवश्यक आधारभूत सीपहरूमा ध्यान केन्द्रित गर्न सकियोस्। यो पाठ्यक्रम पूरा गरेपछि अर्को राम्रो कदम भनेको Node.js को बारेमा सिक्नु हो, अर्को भिडियो संग्रह मार्फत: "[Beginner Series to: Node.js](https://channel9.msdn.com/Series/Beginners-Series-to-Nodejs/?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](CODE_OF_CONDUCT.md) र [Contributing](CONTRIBUTING.md) दिशानिर्देशहरू भ्रमण गर्नुहोस्। हामी तपाईंको रचनात्मक प्रतिक्रिया स्वागत गर्दछौं!
> हाम्रो [Code of Conduct](CODE_OF_CONDUCT.md) र [Contributing](CONTRIBUTING.md) दिशानिर्देशहरू हेर्नुहोस्। हामी तपाईंको रचनात्मक प्रतिक्रिया स्वागत गर्दछौं!
## 🧭 अफलाइन पहुँच
तपाईं [Docsify](https://docsify.js.org/#/) प्रयोग गरेर यो दस्तावेज अफलाइन चलाउन सक्नुहुन्छ। यो रिपो Fork गर्नुहोस्, आफ्नो स्थानीय मेसिनमा [Docsify स्थापना गर्नुहोस्](https://docsify.js.org/#/quickstart), र त्यसपछि यस रिपोको मूल फोल्डरमा `docsify serve` टाइप गर्नुहोस्। वेबसाइट तपाईंको localhost मा पोर्ट 3000 मा सेवा गरिनेछ: `localhost:3000`।
तपाईं [Docsify](https://docsify.js.org/#/) प्रयोग गरेर यो दस्तावेज अफलाइन चलाउन सक्नुहुन्छ। यो रिपो फोर्क गर्नुहोस्, [Docsify स्थापना गर्नुहोस्](https://docsify.js.org/#/quickstart) आफ्नो स्थानीय मेसिनमा, र त्यसपछि यस रिपोको रूट फोल्डरमा `docsify serve` टाइप गर्नुहोस्। वेबसाइट तपाईंको localhost मा पोर्ट 3000 मा सेवा गरिनेछ: `localhost:3000`।
## 📘 PDF
@ -205,7 +206,7 @@ Azure AI Foundry Discord समुदायमा सामेल हुनु
## 🎒 अन्य पाठ्यक्रमहरू
हाम्रो टिमले अन्य पाठ्यक्रमहरू उत्पादन गर्दछ! हेर्नुहोस्:
हाम्रो टोलीले अन्य पाठ्यक्रमहरू उत्पादन गर्दछ! हेर्नुहोस्:
### Azure / Edge / MCP / Agents
[](https://github.com/microsoft/AZD-for-beginners?WT.mc_id=academic-105485-koreyst)
@ -238,16 +239,17 @@ Azure AI Foundry Discord समुदायमा सामेल हुनु
[](https://aka.ms/GitHubCopilotAI?WT.mc_id=academic-105485-koreyst)
[](https://github.com/microsoft/mastering-github-copilot-for-dotnet-csharp-developers?WT.mc_id=academic-105485-koreyst)
यदि तपाईं समस्यामा पर्नुहुन्छ वा एआई एप्स निर्माणको बारेमा कुनै प्रश्न छ भने, यहाँ सामेल हुनुहोस्:
यदि तपाईं अड्किनुहुन्छ वा एआई एप्स निर्माणको बारेमा कुनै प्रश्न छ भने, अन्य सिक्नेहरू र अनुभवी विकासकर्ताहरूसँग एमसीपीको बारेमा छलफलमा सामेल हुनुहोस्। यो सहयोगी समुदाय हो जहाँ प्रश्नहरू स्वागत गरिन्छ र ज्ञान स्वतन्त्र रूपमा साझा गरिन्छ।
[](https://aka.ms/foundry/discord)
यदि तपाईंलाई उत्पादनको प्रतिक्रिया दिनु छ वा निर्माणको क्रममा त्रुटिहरू छन् भने, यहाँ जानुहोस्:
यदि तपाईंलाई उत्पादनको प्रतिक्रिया दिनु छ वा निर्माण गर्दा त्रुटिहरू आउँछ भने, यहाँ जानुहोस्:
[](https://aka.ms/foundry/forum)
@ -255,5 +257,7 @@ Azure AI Foundry Discord समुदायमा सामेल हुनु
---
<!-- CO-OP TRANSLATOR DISCLAIMER START -->
**अस्वीकरण**:
यो दस्तावेज़ AI अनुवाद सेवा [Co-op Translator](https://github.com/Azure/co-op-translator) प्रयोग गरेर अनुवाद गरिएको छ। हामी शुद्धताको लागि प्रयास गर्छौं, तर कृपया ध्यान दिनुहोस् कि स्वचालित अनुवादहरूमा त्रुटि वा अशुद्धता हुन सक्छ। यसको मूल भाषा मा रहेको दस्तावेज़लाई आधिकारिक स्रोत मानिनुपर्छ। महत्वपूर्ण जानकारीको लागि, व्यावसायिक मानव अनुवाद सिफारिस गरिन्छ। यस अनुवादको प्रयोगबाट उत्पन्न हुने कुनै पनि गलतफहमी वा गलत व्याख्याको लागि हामी जिम्मेवार हुने छैनौं।
यो दस्तावेज AI अनुवाद सेवा [Co-op Translator](https://github.com/Azure/co-op-translator) प्रयोग गरेर अनुवाद गरिएको छ। हामी शुद्धताको लागि प्रयास गर्छौं, तर कृपया ध्यान दिनुहोस् कि स्वचालित अनुवादमा त्रुटिहरू वा अशुद्धताहरू हुन सक्छ। यसको मूल भाषामा रहेको दस्तावेजलाई आधिकारिक स्रोत मानिनुपर्छ। महत्वपूर्ण जानकारीको लागि, व्यावसायिक मानव अनुवाद सिफारिस गरिन्छ। यस अनुवादको प्रयोगबाट उत्पन्न हुने कुनै पनि गलतफहमी वा गलत व्याख्याको लागि हामी जिम्मेवार हुनेछैनौं।
[](https://github.com/microsoft/ai-agents-for-beginners?WT.mc_id=academic-105485-koreyst)
[](https://github.com/microsoft/ai-agents-for-beginners?WT.mc_id=academic-105485-koreyst)
[-9333EA?style=for-the-badge&labelColor=E5E7EB&color=9333EA)](https://github.com/microsoft/Generative-AI-for-beginners-dotnet?WT.mc_id=academic-105485-koreyst)
[-C084FC?style=for-the-badge&labelColor=E5E7EB&color=C084FC)](https://github.com/microsoft/generative-ai-for-beginners-java?WT.mc_id=academic-105485-koreyst)
[-E879F9?style=for-the-badge&labelColor=E5E7EB&color=E879F9)](https://github.com/microsoft/generative-ai-with-javascript?WT.mc_id=academic-105485-koreyst)
[-9333EA?style=for-the-badge&labelColor=E5E7EB&color=9333EA)](https://github.com/microsoft/Generative-AI-for-beginners-dotnet?WT.mc_id=academic-105485-koreyst)
[-C084FC?style=for-the-badge&labelColor=E5E7EB&color=C084FC)](https://github.com/microsoft/generative-ai-for-beginners-java?WT.mc_id=academic-105485-koreyst)
[-E879F9?style=for-the-badge&labelColor=E5E7EB&color=E879F9)](https://github.com/microsoft/generative-ai-with-javascript?WT.mc_id=academic-105485-koreyst)
[](https://aka.ms/foundry/discord)
[](https://aka.ms/foundry/forum)
Kamusta, hinaharap na developer! 👋 Handa ka na bang sumali sa milyon-milyong coder sa buong mundo? Talagang excited akong ipakilala sa iyo ang GitHub – isipin mo ito bilang social media platform para sa mga programmer, pero sa halip na magbahagi ng mga larawan ng tanghalian, nagbabahagi tayo ng code at gumagawa ng mga kamangha-manghang bagay nang sama-sama!
Kamusta, hinaharap na developer! 👋 Handa ka na bang sumali sa milyon-milyong coder sa buong mundo? Talagang excited akong ipakilala sa'yo ang GitHub – isipin mo ito bilang social media platform para sa mga programmer, pero imbes na magbahagi ng mga larawan ng pagkain, nagbabahagi tayo ng code at gumagawa ng mga kamangha-manghang bagay nang sama-sama!
Narito ang nakakabilib: bawat app sa iyong telepono, bawat website na binibisita mo, at karamihan sa mga tool na matututunan mong gamitin ay ginawa ng mga team ng developer na nagtutulungan sa mga platform tulad ng GitHub. Yung music app na mahal mo? May isang tulad mo na nag-ambag dito. Yung laro na hindi mo mabitawan? Oo, malamang ginawa gamit ang GitHub collaboration. At ngayon, IKAW ang matututo kung paano maging bahagi ng kamangha-manghang komunidad na iyon!
Narito ang nakakabilib: bawat app sa iyong telepono, bawat website na binibisita mo, at karamihan sa mga tool na matututunan mong gamitin ay ginawa ng mga team ng developer na nagtutulungan sa mga platform tulad ng GitHub. Yung music app na gustung-gusto mo? May isang tulad mo na nag-ambag dito. Yung laro na hindi mo mabitawan? Oo, malamang ginawa gamit ang GitHub collaboration. At ngayon, IKAW ang matututo kung paano maging bahagi ng kamangha-manghang komunidad na ito!
Alam ko na maaaring medyo nakakatakot ito sa simula – naaalala ko pa ang unang beses kong tumingin sa GitHub page at iniisip "Ano ang ibig sabihin ng lahat ng ito?" Pero ganito kasi: bawat developer ay nagsimula sa eksaktong posisyon mo ngayon. Sa pagtatapos ng araling ito, magkakaroon ka ng sarili mong GitHub repository (isipin mo ito bilang personal na showcase ng iyong proyekto sa cloud), at malalaman mo kung paano i-save ang iyong trabaho, ibahagi ito sa iba, at mag-ambag sa mga proyekto na ginagamit ng milyon-milyong tao.
Alam kong maaaring nakakatakot ito sa simula – naalala ko pa noong una kong tinitingnan ang GitHub page ko at iniisip, "Ano bang ibig sabihin ng lahat ng ito?" Pero ganito kasi 'yan: bawat developer ay nagsimula sa eksaktong lugar kung nasaan ka ngayon. Sa pagtatapos ng araling ito, magkakaroon ka ng sarili mong GitHub repository (isipin mo ito bilang personal na showcase ng iyong proyekto sa cloud), at malalaman mo kung paano i-save ang iyong trabaho, ibahagi ito sa iba, at mag-ambag sa mga proyektong ginagamit ng milyon-milyong tao.
Sama-sama nating tatahakin ang paglalakbay na ito, hakbang-hakbang. Walang pagmamadali, walang pressure – ikaw, ako, at ilang napakagandang tools na magiging bagong matalik mong kaibigan!
Sama-sama nating tatahakin ang paglalakbay na ito, hakbang-hakbang. Walang pagmamadali, walang pressure – ikaw, ako, at ilang napakagandang tool na magiging bago mong matalik na kaibigan!
> Sketchnote ni [Tomomi Imura](https://twitter.com/girlie_mac)
Bago tayo sumabak sa mga talagang exciting na bagay, ihanda muna natin ang iyong computer para sa GitHub magic! Isipin mo ito na parang inaayos ang iyong mga art supplies bago gumawa ng obra maestra – ang pagkakaroon ng tamang tools ay nagpapadali at mas masaya ang lahat.
Bago tayo sumabak sa mga nakakapanabik na bagay, ihanda muna natin ang iyong computer para sa GitHub magic! Isipin mo ito na parang inaayos mo ang iyong mga gamit sa sining bago gumawa ng obra maestra – ang pagkakaroon ng tamang mga tool ay nagpapadali at nagpapasaya sa lahat.
Sasamahan kita sa bawat hakbang ng setup, at ipinapangako ko na hindi ito kasing nakakatakot gaya ng maaaring isipin sa unang tingin. Kung may hindi agad maunawaan, normal lang iyon! Naalala ko pa ang unang beses kong mag-setup ng development environment at pakiramdam ko ay nagbabasa ako ng sinaunang hieroglyphics. Bawat developer ay dumaan sa eksaktong posisyon mo ngayon, iniisip kung tama ba ang ginagawa nila. Spoiler alert: kung nandito ka at nag-aaral, tama na ang ginagawa mo! 🌟
Sasamahan kita sa bawat hakbang ng setup, at ipinapangako kong hindi ito kasing hirap ng inaakala mo. Kung may hindi agad malinaw, normal lang 'yan! Naalala ko noong una kong inaayos ang development environment ko, parang nagbabasa ako ng sinaunang hieroglyphics. Bawat developer ay dumaan sa eksaktong nararamdaman mo ngayon, nagtataka kung tama ba ang ginagawa nila. Spoiler alert: kung nandito ka at nag-aaral, tama na ang ginagawa mo! 🌟
Sa araling ito, tatalakayin natin:
Sa araling ito, tatalakayin natin ang:
- paano subaybayan ang trabaho mo sa iyong computer
- paano makipagtulungan sa mga proyekto kasama ang iba
- pagsubaybay sa mga ginagawa mo sa iyong computer
- pakikipagtulungan sa mga proyekto kasama ang iba
- paano mag-ambag sa open source software
### Mga Kinakailangan
Ihanda natin ang iyong computer para sa GitHub magic! Huwag mag-alala –ang setup na ito ay isang beses mo lang gagawin, at pagkatapos ay handa ka na para sa buong coding journey mo.
Ihanda natin ang iyong computer para sa GitHub magic! Huwag mag-alala – isang beses mo lang kailangang gawin ang setup na ito, at pagkatapos ay handa ka na para sa buong coding journey mo.
Sige, simulan natin sa pundasyon! Una, kailangan nating tingnan kung naka-install na ang Git sa iyong computer. Ang Git ay parang super-smart na assistant na naaalala ang bawat pagbabago na ginawa mo sa iyong code – mas magaling kaysa sa paulit-ulit na pag-hit ng Ctrl+S bawat dalawang segundo (lahat tayo nagawa na iyon!).
Sige, simulan natin sa pundasyon! Una, kailangan nating tingnan kung naka-install na ang Git sa iyong computer. Ang Git ay parang super-smart na assistant na naaalala ang bawat pagbabago sa iyong code – mas magaling kaysa sa paulit-ulit na pag-hit ng Ctrl+S bawat dalawang segundo (aminin, nagawa na natin lahat 'yan!).
Tingnan kung naka-install na ang Git sa pamamagitan ng pag-type ng magic command na ito sa iyong terminal:
Tingnan natin kung naka-install na ang Git sa pamamagitan ng pag-type ng command na ito sa iyong terminal:
`git --version`
Kung wala pa ang Git, huwag mag-alala! Pumunta lang sa [download Git](https://git-scm.com/downloads) at kunin ito. Kapag na-install mo na, kailangan nating ipakilala ang Git sa iyo nang maayos:
Kung wala pa ang Git, walang problema! Pumunta lang sa [download Git](https://git-scm.com/downloads) at i-download ito. Kapag na-install mo na, kailangan nating ipakilala ang Git sa'yo nang maayos:
> 💡 **Unang Setup**: Ang mga command na ito ay nagsasabi sa Git kung sino ka. Ang impormasyong ito ay ilalagay sa bawat commit na gagawin mo, kaya pumili ng pangalan at email na komportable kang ibahagi sa publiko.
> 💡 **First Time Setup**: Ang mga command na ito ay nagsasabi sa Git kung sino ka. Ang impormasyong ito ay idadagdag sa bawat commit na gagawin mo, kaya pumili ng pangalan at email na komportable kang ibahagi sa publiko.
```bash
git config --global user.name "your-name"
git config --global user.email "your-email"
```
Para tingnan kung naka-configure na ang Git, maaari kang mag-type:
Para tingnan kung naka-configure na ang Git, maaari mong i-type:
```bash
git config --list
```
Kakailanganin mo rin ng GitHub account, isang code editor (tulad ng Visual Studio Code), at kailangan mong buksan ang iyong terminal (o: command prompt).
Kakailanganin mo rin ng GitHub account, isang code editor (tulad ng Visual Studio Code), at kailangang buksan ang iyong terminal (o: command prompt).
Pumunta sa [github.com](https://github.com/) at gumawa ng account kung wala ka pa, o mag-login at punan ang iyong profile.
Pumunta sa [github.com](https://github.com/) at gumawa ng account kung wala ka pa, o mag-login at punan ang iyong profile.
💡 **Modernong Tip**: Isaalang-alang ang pag-setup ng [SSH keys](https://docs.github.com/en/authentication/connecting-to-github-with-ssh) o paggamit ng [GitHub CLI](https://cli.github.com/) para sa mas madaling authentication nang walang password.
💡 **Modernong tip**: Isaalang-alang ang pag-setup ng [SSH keys](https://docs.github.com/en/authentication/connecting-to-github-with-ssh) o paggamit ng [GitHub CLI](https://cli.github.com/) para sa mas madaling authentication nang walang password.
✅ Hindi lang GitHub ang code repository sa mundo; may iba pa, pero ang GitHub ang pinakakilala.
### Paghahanda
Kakailanganin mo ng folder na may code project sa iyong lokal na makina (laptop o PC), at isang public repository sa GitHub, na magsisilbing halimbawa kung paano mag-ambag sa mga proyekto ng iba.
Kakailanganin mo ng folder na may code project sa iyong local machine (laptop o PC), at isang public repository sa GitHub, na magsisilbing halimbawa kung paano mag-ambag sa mga proyekto ng iba.
### Panatilihing Ligtas ang Iyong Code
Pag-usapan natin ang seguridad sandali – pero huwag mag-alala, hindi natin ito gagawing nakakatakot! Isipin mo ang mga security practices na ito na parang pag-lock ng iyong kotse o bahay. Simple lang ang mga ito, nagiging natural na ugali, at pinoprotektahan ang iyong pinaghirapan.
Pag-usapan natin ang seguridad saglit – pero huwag mag-alala, hindi ka namin bibigyan ng nakakatakot na impormasyon! Isipin mo ang mga security practices na ito na parang pagla-lock ng iyong kotse o bahay. Simple lang ang mga ito, pero nagiging natural na ugali at pinoprotektahan ang iyong pinaghirapan.
Ipapakita namin sa iyo ang modernong, secure na paraan ng paggamit ng GitHub mula sa simula. Sa ganitong paraan, makakabuo ka ng magagandang gawi na magagamit mo sa buong coding career mo.
Ipapakita namin sa'yo ang mga modernong, secure na paraan ng paggamit ng GitHub mula sa simula. Sa ganitong paraan, magkakaroon ka ng magagandang gawi na magagamit mo sa buong coding career mo.
Kapag gumagamit ng GitHub, mahalagang sundin ang mga best practices sa seguridad:
Kapag gumagamit ng GitHub, mahalagang sundin ang mga pinakamahusay na kasanayan sa seguridad:
| Security Area | Best Practice | Bakit Mahalaga |
| **Authentication** | Gumamit ng SSH keys o Personal Access Tokens | Mas hindi secure ang passwords at unti-unti nang inaalis |
| **Two-Factor Authentication** | I-enable ang 2FA sa iyong GitHub account | Nagdadagdag ng karagdagang proteksyon sa account |
| **Repository Security** | Huwag kailanman i-commit ang sensitibong impormasyon | Ang mga API keys at password ay hindi dapat nasa public repos |
| **Dependency Management** | I-enable ang Dependabot para sa updates | Pinapanatiling secure at updated ang iyong mga dependencies |
| **Repository Security** | Huwag kailanman mag-commit ng sensitibong impormasyon | Ang mga API keys at passwords ay hindi dapat nasa public repos |
| **Dependency Management** | I-enable ang Dependabot para sa updates | Pinapanatiling secure at up-to-date ang iyong dependencies |
> ⚠️ **Mahalagang Paalala sa Seguridad**: Huwag kailanman i-commit ang mga API keys, password, o iba pang sensitibong impormasyon sa anumang repository. Gumamit ng environment variables at `.gitignore` files para protektahan ang sensitibong data.
> ⚠️ **Paalala sa Seguridad**: Huwag kailanman mag-commit ng API keys, passwords, o iba pang sensitibong impormasyon sa anumang repository. Gumamit ng environment variables at `.gitignore` files para protektahan ang sensitibong data.
Okay, DITO na nagiging exciting ang lahat! 🎉 Matututo tayo kung paano subaybayan at pamahalaan ang iyong code na parang mga pro, at sa totoo lang, isa ito sa mga paborito kong ituro dahil sobrang game-changer nito.
Okay, DITO na nagiging exciting ang lahat! 🎉 Matututo tayo kung paano subaybayan at pamahalaan ang iyong code tulad ng mga propesyonal, at sa totoo lang, isa ito sa mga paborito kong ituro dahil sobrang laking tulong nito.
Isipin mo ito: nagsusulat ka ng isang kamangha-manghang kuwento, at gusto mong subaybayan ang bawat draft, bawat brilliant edit, at bawat "wait, ang galing nito!" moment sa daan. Iyan ang ginagawa ng Git para sa iyong code! Parang may pinaka-kamangha-manghang time-traveling notebook na naaalala ang LAHAT – bawat keystroke, bawat pagbabago, bawat "oops, nasira ang lahat" moment na maaari mong agad na balikan.
Isipin mo ito: nagsusulat ka ng isang kamangha-manghang kwento, at gusto mong subaybayan ang bawat draft, bawat brilliant na edit, at bawat "teka, ang galing nito!" na sandali. Ganyan mismo ang ginagawa ng Git para sa iyong code! Para itong time-traveling notebook na naaalala LAHAT – bawat pindot, bawat pagbabago, bawat "naku, nasira ko lahat" na sandali na maaari mong agad na balikan.
Aaminin ko – maaaring nakaka-overwhelm ito sa simula. Noong nagsimula ako, iniisip ko "Bakit hindi ko na lang i-save ang mga files ko nang normal?" Pero magtiwala ka sa akin: kapag naintindihan mo ang Git (at mangyayari ito!), magkakaroon ka ng lightbulb moment kung saan iisipin mo "Paano ako NAG-CODE nang wala ito?" Parang natuklasan mong kaya mong lumipad pagkatapos maglakad sa lahat ng lugar sa buong buhay mo!
Aaminin ko – maaaring nakakalito ito sa simula. Noong nagsimula ako, naisip ko, "Bakit hindi ko na lang i-save ang files ko ng normal?" Pero maniwala ka sa akin: kapag naintindihan mo na ang Git (at mangyayari 'yan!), magkakaroon ka ng lightbulb moment kung saan maiisip mo, "Paano ko nagawang mag-code nang wala ito dati?" Para kang natutong lumipad matapos maglakad lang buong buhay mo!
Halimbawa, mayroon kang folder na may code project at gusto mong simulan ang pagsubaybay sa iyong progreso gamit ang git - ang version control system. Ang iba ay ikinukumpara ang paggamit ng git sa pagsusulat ng love letter sa iyong hinaharap na sarili. Sa pagbabasa ng iyong commit messages ilang araw, linggo, o buwan pagkatapos, maaalala mo kung bakit mo ginawa ang isang desisyon, o "rollback" ang isang pagbabago – iyon ay, kapag nagsusulat ka ng magagandang "commit messages."
Halimbawa, may folder ka na may code project sa iyong computer at gusto mong simulan ang pagsubaybay sa iyong progreso gamit ang git – ang version control system. Ang paggamit ng git ay parang pagsusulat ng love letter para sa sarili mong hinaharap. Kapag binasa mo ang iyong mga commit message makalipas ang ilang araw, linggo, o buwan, maaalala mo kung bakit mo ginawa ang isang desisyon, o maibabalik mo ang isang pagbabago – basta't nagsusulat ka ng maayos na "commit messages."
```mermaid
flowchart TD
A[📁 Your Project Files] --> B{Is it a Git Repository?}
B -->|No| C[git init]
B -->|Yes| D[Make Changes]
A[📁 Iyong Mga File ng Proyekto] --> B{Ito ba ay isang Git Repository?}
B -->|Hindi| C[git init]
B -->|Oo| D[Gumawa ng Mga Pagbabago]
C --> D
D --> E[git add .]
E --> F["git commit -m 'message'"]
E --> F["git commit -m 'mensahe'"]
F --> G[git push]
G --> H[🌟 Code on GitHub!]
G --> H[🌟 Code sa GitHub!]
H --> I{Want to collaborate?}
I -->|Yes| J[Fork & Clone]
I -->|No| D
J --> K[Create Branch]
K --> L[Make Changes]
H --> I{Gusto bang makipagtulungan?}
I -->|Oo| J[Fork & Clone]
I -->|Hindi| D
J --> K[Gumawa ng Branch]
K --> L[Gumawa ng Mga Pagbabago]
L --> M[Pull Request]
M --> N[🎉 Contributing!]
M --> N[🎉 Nag-aambag!]
style A fill:#fff59d
style H fill:#c8e6c9
style N fill:#ff4081,color:#fff
```
### Gawain: Gumawa ng Iyong Unang Repository!
> 🎯 **Ang Iyong Misyon (at sobrang excited ako para sa iyo!)**: Gagawa tayo ng iyong unang GitHub repository nang magkasama! Sa oras na matapos tayo dito, magkakaroon ka ng sarili mong maliit na sulok sa internet kung saan nakatira ang iyong code, at magagawa mo ang iyong unang "commit" (developer speak para sa pag-save ng iyong trabaho sa napakatalinong paraan).
> 🎯 **Ang Iyong Misyon (at sobrang excited ako para sa'yo!)**: Gagawa tayo ng iyong unang GitHub repository nang magkasama! Sa pagtatapos nito, magkakaroon ka ng sarili mong maliit na sulok sa internet kung saan nakatira ang iyong code, at magagawa mo ang iyong unang "commit" (developer speak para sa matalinong paraan ng pag-save ng iyong trabaho).
>
> Ito ay talagang espesyal na sandali – opisyal ka nang sasali sa global na komunidad ng mga developer! Naalala ko pa ang thrill ng paggawa ng aking unang repo at iniisip "Wow, ginagawa ko talaga ito!"
> Ito ay talagang espesyal na sandali – opisyal ka nang sasali sa global na komunidad ng mga developer! Naalala ko pa ang thrill ng paggawa ng unang repo ko at iniisip, "Wow, ginagawa ko na talaga ito!"
Sama-sama nating lakbayin ang adventure na ito, hakbang-hakbang. Dahan-dahan sa bawat bahagi – walang premyo para sa pagmamadali, at ipinapangako ko na bawat hakbang ay magkakaroon ng kahulugan. Tandaan, bawat coding superstar na hinahangaan mo ay minsang nakaupo sa eksaktong posisyon mo, handang gumawa ng kanilang unang repository. Ang cool, di ba?
Sama-sama nating lakbayin ang adventure na ito, hakbang-hakbang. Dahan-dahan lang sa bawat bahagi – walang premyo sa pagmamadali, at ipinapangako kong bawat hakbang ay magkakaroon ng saysay. Tandaan, bawat coding superstar na hinahangaan mo ay minsang nakaupo sa eksaktong lugar kung nasaan ka ngayon, handang gumawa ng kanilang unang repository. Ang astig, 'di ba?
> Panoorin ang video
>
@ -169,33 +167,33 @@ Sama-sama nating lakbayin ang adventure na ito, hakbang-hakbang. Dahan-dahan sa
1. **Gumawa ng iyong repository sa GitHub**. Pumunta sa GitHub.com at hanapin ang maliwanag na berdeng **New** button (o ang **+** sign sa kanang itaas). I-click ito at piliin ang **New repository**.
Narito ang gagawin:
1. Bigyan ang iyong repository ng pangalan – gawing makabuluhan ito para sa iyo!
1. Magdagdag ng description kung gusto mo (makakatulong ito sa iba na maunawaan kung tungkol saan ang iyong proyekto)
1. Magdesisyon kung gusto mo itong public (makikita ng lahat) o private (para lang sa iyo)
1. Inirerekumenda kong i-check ang box para magdagdag ng README file – parang front page ng iyong proyekto
1. I-click ang **Create repository** at magdiwang –ginawa mo na ang iyong unang repo! 🎉
1. Bigyan ng pangalan ang iyong repository – gawing makabuluhan para sa'yo!
1. Magdagdag ng description kung gusto mo (makakatulong ito sa iba na maunawaan ang tungkol sa iyong proyekto)
1. Magdesisyon kung gusto mo itong public (makikita ng lahat) o private (para lang sa'yo)
1. Inirerekomenda kong i-check ang kahon para magdagdag ng README file – parang front page ito ng iyong proyekto
1. I-click ang **Create repository** at magdiwang – nagawa mo na ang iyong unang repo! 🎉
2. **Pumunta sa iyong project folder**. Ngayon buksan natin ang iyong terminal (huwag mag-alala, hindi ito kasing nakakatakot gaya ng hitsura nito!). Kailangan nating sabihin sa iyong computer kung nasaan ang iyong project files. I-type ang command na ito:
2. **Pumunta sa iyong project folder**. Ngayon, buksan natin ang iyong terminal (huwag mag-alala, hindi ito kasing nakakatakot ng itsura nito!). Kailangan nating sabihin sa iyong computer kung nasaan ang mga file ng iyong proyekto. I-type ang command na ito:
```bash
cd [name of your folder]
```
**Ang ginagawa natin dito:**
- Parang sinasabi natin "Hey computer, dalhin mo ako sa project folder ko"
- Parang binubuksan ang isang specific folder sa iyong desktop, pero ginagawa natin ito gamit ang text commands
- Parang sinasabi natin, "Hey computer, dalhin mo ako sa folder ng proyekto ko"
- Para itong pagbubukas ng isang partikular na folder sa iyong desktop, pero ginagawa natin ito gamit ang text commands
- Palitan ang `[name of your folder]` ng aktwal na pangalan ng iyong project folder
3. **Gawin ang iyong folder bilang Git repository**. Dito nangyayari ang magic! I-type:
3. **Gawing Git repository ang iyong folder**. Dito na nangyayari ang magic! I-type:
```bash
git init
```
**Narito ang nangyari (sobrang cool na bagay!):**
- Gumawa ang Git ng nakatagong `.git` folder sa iyong proyekto – hindi mo ito makikita, pero nandiyan ito!
- Ang iyong regular na folder ay ngayon isang "repository" na maaaring subaybayan ang bawat pagbabago na ginagawa mo
- Isipin mo ito na parang binibigyan ang iyong folder ng superpowers para maalala ang lahat
**Narito ang nangyari (astig na bagay!):**
- Gumawa ang Git ng nakatagong `.git` folder sa iyong proyekto – hindi mo ito makikita, pero nandiyan 'yan!
- Ang regular mong folder ay ngayon isang "repository" na maaaring subaybayan ang bawat pagbabago na gagawin mo
- Isipin mo ito na parang binibigyan mo ng superpowers ang iyong folder para maalala ang lahat
4. **Tingnan kung ano ang nangyayari**. Tingnan natin kung ano ang iniisip ng Git tungkol sa iyong proyekto ngayon:
@ -217,11 +215,11 @@ Sama-sama nating lakbayin ang adventure na ito, hakbang-hakbang. Dahan-dahan sa
```
**Huwag mag-panic! Narito ang ibig sabihin nito:**
- Ang mga file na **pula** ay mga file na may mga pagbabago pero hindi pa handang i-save
- Ang mga file na **berde** (kapag nakita mo sila) ay handa nang i-save
- Ang Git ay tumutulong sa pamamagitan ng pagsasabi kung ano ang maaari mong gawin sa susunod
- Ang mga file na **pula** ay mga file na may pagbabago pero hindi pa handang i-save
- Ang mga file na **berde** (kapag nakita mo na) ay handa nang i-save
- Tinutulungan ka ng Git sa pamamagitan ng pagsasabi kung ano ang maaari mong gawin sa susunod
> 💡 **Pro tip**: Ang `git status` command ay ang iyong matalik na kaibigan! Gamitin ito anumang oras na nalilito ka sa kung ano ang nangyayari. Parang tinatanong mo ang Git "Hey, ano ang sitwasyon ngayon?"
> 💡 **Pro tip**: Ang `git status` command ay ang iyong best friend! Gamitin ito anumang oras na nalilito ka sa nangyayari. Para itong pagtatanong sa Git, "Hey, ano na ang sitwasyon ngayon?"
5. **Ihanda ang iyong mga file para i-save** (tinatawag itong "staging"):
@ -230,32 +228,32 @@ Sama-sama nating lakbayin ang adventure na ito, hakbang-hakbang. Dahan-dahan sa
```
**Ang ginawa natin:**
- Sinabi natin sa Git "Hey, gusto kong isama LAHAT ng files ko sa susunod na save"
- Ang `.` ay parang sinasabi "lahat ng nasa folder na ito"
- Ngayon ang iyong mga file ay "staged" at handa na para sa susunod na hakbang
- Sinabi natin sa Git, "Hey, gusto kong isama LAHAT ng file ko sa susunod na save"
- Ang `.` ay parang sinasabi, "lahat sa folder na ito"
- Ngayon, ang iyong mga file ay "staged" at handa na para sa susunod na hakbang
**Gusto mo bang maging mas mapili?** Maaari mong idagdag ang specific na mga file lamang:
**Gusto mo bang maging mas pili?** Maaari kang magdagdag ng partikular na mga file:
```bash
git add [file or folder name]
```
**Bakit mo gustong gawin ito?**
- Minsan gusto mong i-save ang mga kaugnay na pagbabago nang sabay-sabay
- Minsan gusto mong i-save ang mga magkakaugnay na pagbabago nang sabay-sabay
- Nakakatulong ito sa pag-organisa ng iyong trabaho sa lohikal na mga bahagi
- Pinapadali ang pag-unawa kung ano ang nagbago at kailan
- Mas madaling maunawaan kung ano ang nagbago at kailan
**Nagbago ang isip mo?** Walang problema! Maaari mong alisin ang mga file sa staging gamit ito:
**Nagbago ang isip mo?** Walang problema! Maaari mong alisin sa stage ang mga file tulad nito:
```bash
# Unstage everything
# I-unstage ang lahat
git reset
# Unstage just one file
# I-unstage ang isang file lamang
git reset [file name]
```
Huwag mag-alala – hindi nito binubura ang iyong trabaho, tinatanggal lang nito ang mga file sa "ready to save" pile.
Huwag mag-alala – hindi nito binubura ang iyong trabaho, tinatanggal lang nito ang mga file sa "ready to save" na pile.
6. **I-save ang iyong trabaho nang permanente** (gawin ang iyong unang commit!):
@ -263,31 +261,32 @@ Sama-sama nating lakbayin ang adventure na ito, hakbang-hakbang. Dahan-dahan sa
git commit -m "first commit"
```
**🎉 Binabati kita! Ginawa mo na ang iyong unang commit!**
**🎉 Congratulations! Nagawa mo na ang iyong unang commit!**
**Narito ang nangyari:**
- Kinuha ng Git ang "snapshot" ng lahat ng iyong staged files sa eksaktong sandaling ito
- Ang iyong commit message na "first commit" ay nagpapaliwanag kung tungkol saan ang save point na ito
- Binigyan ng Git ang snapshot na ito ng unique ID para palaging mahanap mo ito sa hinaharap
- Opisyal mo nang nasimulan ang pagsubaybay sa kasaysayan ng iyong proyekto!
- Binigyan ng Git ang snapshot na ito ng unique ID para palagi mo itong mahanap sa hinaharap
- Opisyal mo nang sinimulan ang pagsubaybay sa kasaysayan ng iyong proyekto!
> 💡 **Mga susunod na commit messages**: Para sa iyong mga susunod na commit, maging mas descriptive! Sa halip na "updated stuff", subukang "Add contact form to homepage" o "Fix navigation menu bug". Magpapasalamat ang iyong hinaharap na sarili!
> 💡 **Mga susunod na commit message**: Para sa iyong mga susunod na commit, maging mas detalyado! Imbes na "updated stuff", subukang "Add contact form to homepage" o "Fix navigation menu bug". Pasasalamatan ka ng iyong future self!
7. **Ikonekta ang iyong lokal na proyekto sa GitHub**. Sa ngayon, ang iyong proyekto ay nasa iyong computer lamang. Ikonekta natin ito sa iyong GitHub repository para maibahagi mo ito sa mundo!
7. **Ikonekta ang iyong lokal na proyekto sa GitHub**. Sa ngayon, ang iyong proyekto ay nasa iyong computer lang. Ikonekta natin ito sa iyong GitHub repository para maibahagi mo ito sa mundo!
Una, pumunta sa iyong GitHub repository page at kopyahin ang URL. Pagkatapos bumalik dito at i-type:
Una, pumunta sa iyong GitHub repository page at kopyahin ang URL. Pagkatapos, bumalik dito at i-type:
(Palitan ang URL na iyon ng aktwal na URL ng iyong repository!)
**Ang ginawa natin:**
- Gumawa tayo ng koneksyon sa pagitan ng iyong lokal na proyekto at ng iyong GitHub repository.
- Ang "Origin" ay parang palayaw para sa iyong GitHub repository – parang pagdaragdag ng contact sa iyong telepono.
- Ngayon, alam na ng iyong lokal na Git kung saan ipapadala ang iyong code kapag handa ka nang ibahagi ito.
💡 **Mas madali**: Kung may naka-install kang GitHub CLI, magagawa mo ito gamit ang isang command:
**Narito ang ginawa natin:**
- Nilikha namin ang koneksyon sa pagitan ng iyong lokal na proyekto at ng iyong GitHub repository
- Ang "Origin" ay parang palayaw lang para sa iyong GitHub repository – parang pagdaragdag ng contact sa iyong telepono
- Ngayon, alam na ng iyong lokal na Git kung saan ipapadala ang iyong code kapag handa ka nang ibahagi ito
💡 **Mas Madaling Paraan**: Kung naka-install ang GitHub CLI sa iyong computer, magagawa mo ito gamit ang isang command:
```bash
gh repo create my-repo --public --push --source=.
```
@ -298,19 +297,19 @@ Sama-sama nating lakbayin ang adventure na ito, hakbang-hakbang. Dahan-dahan sa
git push -u origin main
```
**🚀 Ito na! Ina-upload mo ang iyong code sa GitHub!**
**Ano ang nangyayari:**
- Ang iyong mga commit ay naglalakbay mula sa iyong computer papunta sa GitHub.
- Ang `-u` flag ay nagse-set up ng permanenteng koneksyon para mas madali ang mga susunod na push.
- Ang "main" ay ang pangalan ng iyong pangunahing branch (parang pangunahing folder).
- Pagkatapos nito, maaari mo na lang gamitin ang `git push` para sa mga susunod na upload!
**🚀 Ito na! Ina-upload mo na ang iyong code sa GitHub!**
**Ano ang nangyayari:**
- Ang iyong mga commit ay naglalakbay mula sa iyong computer papunta sa GitHub
- Ang `-u` flag ay nagse-set up ng permanenteng koneksyon para mas madali ang mga susunod na push
- Ang "main" ay ang pangalan ng iyong pangunahing branch (parang pangunahing folder)
- Pagkatapos nito, maaari mo nang i-type ang `git push` para sa mga susunod na upload!
💡 **Mabilis na paalala**: Kung ang pangalan ng iyong branch ay iba (halimbawa, "master"), gamitin ang pangalan na iyon. Maaari mong i-check gamit ang `git branch --show-current`.
💡 **Mabilis na Paalala**: Kung ang pangalan ng iyong branch ay iba (halimbawa "master"), gamitin ang pangalan na iyon. Maaari mong i-check gamit ang `git branch --show-current`.
9. **Ang iyong bagong pang-araw-araw na coding rhythm** (dito na nagiging nakakaadik!):
9. **Ang iyong bagong coding rhythm araw-araw** (dito ka na maaadik!):
Simula ngayon, tuwing may babaguhin ka sa iyong proyekto, mayroon kang simpleng tatlong hakbang na gagawin:
Simula ngayon, tuwing may babaguhin ka sa iyong proyekto, mayroon kang simpleng tatlong hakbang na proseso:
```bash
git add .
@ -318,71 +317,71 @@ Simula ngayon, tuwing may babaguhin ka sa iyong proyekto, mayroon kang simpleng
git push
```
**Ito ang magiging tibok ng iyong coding:**
- Gumawa ng mga kahanga-hangang pagbabago sa iyong code ✨
- I-stage ang mga ito gamit ang `git add` ("Hey Git, pansinin mo ang mga pagbabagong ito!")
- I-save ang mga ito gamit ang `git commit` at maglagay ng detalyadong mensahe (magpapasalamat ka sa sarili mo sa hinaharap!)
- Ibahagi ang mga ito sa mundo gamit ang `git push` 🚀
- Ulitin lang – seryoso, magiging natural na ito tulad ng paghinga!
**Ito ang magiging coding heartbeat mo:**
- Gumawa ng mga kahanga-hangang pagbabago sa iyong code ✨
- I-stage ang mga ito gamit ang `git add` ("Hey Git, pansinin mo ang mga pagbabagong ito!")
- I-save ang mga ito gamit ang `git commit` at maglagay ng malinaw na mensahe (magpapasalamat ang future version mo!)
- Ibahagi ang mga ito sa mundo gamit ang `git push` 🚀
- Ulitin lang – seryoso, magiging natural na ito tulad ng paghinga!
Gusto ko ang workflow na ito dahil parang may maraming save points sa isang video game. May nagawa kang pagbabago na gusto mo? I-commit ito! Gusto mong subukan ang isang risky na bagay? Walang problema – palaging pwede kang bumalik sa huling commit kung may hindi maganda.
Gustung-gusto ko ang workflow na ito dahil parang mayroong maraming save points sa isang video game. Gumawa ng pagbabago na gusto mo? I-commit ito! Gusto mong subukan ang isang risky na bagay? Walang problema – palaging maaari kang bumalik sa iyong huling commit kung may hindi maganda.
> 💡 **Tip**: Baka gusto mo ring gumamit ng `.gitignore` file para maiwasan ang pag-track ng mga file na ayaw mong makita sa GitHub - tulad ng mga notes file na nasa parehong folder pero walang lugar sa isang public repository. Makakahanap ka ng mga template para sa `.gitignore` files sa [.gitignore templates](https://github.com/github/gitignore) o gumawa ng isa gamit ang [gitignore.io](https://www.toptal.com/developers/gitignore).
> 💡 **Tip**: Maaaring gusto mo ring gumamit ng `.gitignore` file para maiwasan ang mga file na hindi mo gustong i-track na lumitaw sa GitHub - tulad ng notes file na nasa parehong folder pero hindi dapat nasa public repository. Makakahanap ka ng mga template para sa `.gitignore` files sa [.gitignore templates](https://github.com/github/gitignore) o gumawa ng isa gamit ang [gitignore.io](https://www.toptal.com/developers/gitignore).
### 🧠 **Unang Check-in ng Repository: Ano ang Pakiramdam?**
**Maglaan ng sandali para magdiwang at magmuni-muni:**
- Ano ang pakiramdam na makita ang iyong code sa GitHub sa unang pagkakataon?
- Ano ang pakiramdam na makita ang iyong code na lumitaw sa GitHub sa unang pagkakataon?
- Aling hakbang ang pinaka-nakalilito, at alin ang nakakagulat na madali?
- Kaya mo bang ipaliwanag ang pagkakaiba ng `git add`, `git commit`, at `git push` sa sarili mong mga salita?
```mermaid
stateDiagram-v2
[*] --> LocalFiles: Create project
[*] --> LocalFiles: Gumawa ng proyekto
LocalFiles --> Staged: git add .
Staged --> Committed: git commit
Committed --> GitHub: git push
GitHub --> [*]: Success! 🎉
GitHub --> [*]: Tagumpay! 🎉
note right of Staged
Files ready to save
Mga file handa nang i-save
end note
note right of Committed
Snapshot created
Nilikha ang snapshot
end note
```
> **Tandaan**: Kahit ang mga bihasang developer ay minsan nakakalimutan ang eksaktong mga command. Ang pagbuo ng muscle memory para sa workflow na ito ay nangangailangan ng pagsasanay - mahusay ang ginagawa mo!
#### Modernong Git workflows
Isaalang-alang ang paggamit ng mga modernong praktis:
Isaalang-alang ang paggamit ng mga modernong kasanayan:
- **Conventional Commits**: Gumamit ng standardized na format ng commit message tulad ng `feat:`, `fix:`, `docs:`, atbp. Alamin pa sa [conventionalcommits.org](https://www.conventionalcommits.org/)
- **Atomic commits**: Gawin ang bawat commit na kumakatawan sa isang lohikal na pagbabago.
- **Frequent commits**: Mag-commit nang madalas na may detalyadong mga mensahe kaysa sa malalaking, bihirang mga commit.
- **Atomic commits**: Gawin ang bawat commit na kumakatawan sa isang lohikal na pagbabago
- **Frequent commits**: Mag-commit nang madalas na may malinaw na mga mensahe kaysa sa malalaking, bihirang mga commit
#### Mga mensahe ng commit
Ang isang mahusay na subject line ng Git commit ay kumukumpleto sa sumusunod na pangungusap:
Kung ilalapat, ang commit na ito ay <iyong subjectlinedito>
Kung ipapatupad, ang commit na ito ay <angiyong subjectlinedito>
Para sa subject, gumamit ng imperative, present tense: "baguhin" hindi "binago" o "binabago". Tulad ng sa subject, sa body (opsyonal) ay gumamit din ng imperative, present tense. Ang body ay dapat maglaman ng motibasyon para sa pagbabago at ikumpara ito sa nakaraang behavior. Ipinaliwanag mo ang `bakit`, hindi ang `paano`.
Para sa subject, gamitin ang imperative, present tense: "change" hindi "changed" o "changes".
Tulad ng sa subject, sa body (opsyonal) gamitin din ang imperative, present tense. Ang body ay dapat maglaman ng motibasyon para sa pagbabago at ikumpara ito sa nakaraang behavior. Ipinaliwanag mo ang `bakit`, hindi ang `paano`.
✅ Maglaan ng ilang minuto para mag-browse sa GitHub. Makakakita ka ba ng isang talagang mahusay na mensahe ng commit? Makakakita ka ba ng isang talagang minimal na mensahe? Anong impormasyon ang sa tingin mo ay pinaka-mahalaga at kapaki-pakinabang na ipahayag sa isang commit message?
✅ Maglaan ng ilang minuto para mag-surf sa GitHub. Makakakita ka ba ng isang mahusay na commit message? Makakakita ka ba ng isang napaka-minimal na mensahe? Anong impormasyon ang sa tingin mo ay pinaka-mahalaga at kapaki-pakinabang na ipahayag sa isang commit message?
## Pakikipagtulungan sa Iba (Ang Masayang Bahagi!)
Humanda ka dahil DITO nagiging sobrang kamangha-mangha ang GitHub! 🪄 Master mo na ang pamamahala sa sarili mong code, pero ngayon papasok tayo sa paborito kong bahagi – ang pakikipagtulungan sa mga kahanga-hangang tao mula sa iba't ibang bahagi ng mundo.
Hawakan ang iyong sombrero dahil DITO nagiging sobrang magical ang GitHub! 🪄 Master mo na ang pamamahala ng sarili mong code, pero ngayon papasok tayo sa paborito kong bahagi – ang pakikipagtulungan sa mga kahanga-hangang tao mula sa iba't ibang panig ng mundo.
Isipin ito: paggising mo bukas, may isang tao sa Tokyo na nagpa-improve ng iyong code habang natutulog ka. Pagkatapos, may isang tao sa Berlin na nag-ayos ng bug na matagal mo nang sinusubukan. Sa hapon, may developer sa São Paulo na nagdagdag ng feature na hindi mo man lang naisip. Hindi ito science fiction – ito lang ang normal na Martes sa GitHub universe!
Isipin ito: gumising ka bukas at makita na may isang tao sa Tokyo na nagpa-improve ng iyong code habang natutulog ka. Pagkatapos may isang tao sa Berlin na nag-ayos ng bug na matagal mo nang sinusubukan. Sa hapon, may developer sa São Paulo na nagdagdag ng feature na hindi mo man lang naisip. Hindi ito science fiction – ito lang ang normal na Martes sa GitHub universe!
Ang talagang nagpapasaya sa akin ay ang mga kasanayan sa pakikipagtulungan na matututunan mo? Ito ang EXACT na workflows na ginagamit ng mga team sa Google, Microsoft, at ng mga paborito mong startup araw-araw. Hindi ka lang natututo ng cool na tool – natututo ka ng lihim na wika na nagpapagana sa buong software world na magtulungan.
Ang talagang nagpapasaya sa akin ay ang mga kasanayan sa pakikipagtulungan na matututunan mo? Ito ang EXACT na workflows na ginagamit ng mga team sa Google, Microsoft, at ng mga paborito mong startup araw-araw. Hindi ka lang natututo ng cool na tool – natututo ka ng lihim na wika na nagpapagana sa buong mundo ng software.
Seryoso, kapag naranasan mo ang rush ng may nag-merge ng iyong unang pull request, maiintindihan mo kung bakit sobrang passionate ang mga developer tungkol sa open source. Parang bahagi ka ng pinakamalaking, pinaka-malikhain na team project sa mundo!
> Tingnan ang video
> Panoorin ang video
>
> [](https://www.youtube.com/watch?v=bFCM-PC3cu8)
@ -390,74 +389,73 @@ Ang pangunahing dahilan ng paglalagay ng mga bagay sa GitHub ay upang gawing pos
```mermaid
flowchart LR
A[🔍 Find Project] --> B[🍴 Fork Repository]
B --> C[📥 Clone to Local]
C --> D[🌿 Create Branch]
D --> E[✏️ Make Changes]
E --> F[💾 Commit Changes]
F --> G[📤 Push Branch]
G --> H[🔄 Create Pull Request]
H --> I{Maintainer Review}
I -->|✅ Approved| J[🎉 Merge!]
I -->|❓ Changes Requested| K[📝 Make Updates]
A[🔍 Hanapin ang Proyekto] --> B[🍴 I-fork ang Repository]
B --> C[📥 I-clone sa Lokal]
C --> D[🌿 Gumawa ng Sangay]
D --> E[✏️ Gumawa ng Mga Pagbabago]
E --> F[💾 I-commit ang Mga Pagbabago]
F --> G[📤 I-push ang Sangay]
G --> H[🔄 Gumawa ng Pull Request]
H --> I{Pagrepaso ng Tagapangalaga}
I -->|✅ Naaprubahan| J[🎉 I-merge!]
I -->|❓ Humiling ng Mga Pagbabago| K[📝 Gumawa ng Mga Update]
K --> F
J --> L[🧹 Clean Up Branches]
J --> L[🧹 Linisin ang Mga Sangay]
style A fill:#e3f2fd
style J fill:#e8f5e8
style L fill:#fff3e0
```
Sa iyong repository, pumunta sa `Insights > Community` para makita kung paano ikinukumpara ang iyong proyekto sa mga inirerekomendang pamantayan ng komunidad.
Sa iyong repository, mag-navigate sa `Insights > Community` para makita kung paano ikinukumpara ang iyong proyekto sa mga inirerekomendang pamantayan ng komunidad.
Gusto mo bang gawing propesyonal at welcoming ang iyong repository? Pumunta sa iyong repository at i-click ang `Insights > Community`. Ipinapakita ng cool na feature na ito kung paano ikinukumpara ang iyong proyekto sa kung ano ang itinuturing ng komunidad ng GitHub na "magandang praktis sa repository."
Gusto mo bang gawing propesyonal at welcoming ang iyong repository? Pumunta sa iyong repository at i-click ang `Insights > Community`. Ipinapakita ng cool na feature na ito kung paano ikinukumpara ang iyong proyekto sa kung ano ang itinuturing ng komunidad ng GitHub na "magandang repository practices."
> 🎯 **Pagpapaganda ng Iyong Proyekto**: Ang maayos na repository na may magandang dokumentasyon ay parang malinis, welcoming na storefront. Ipinapakita nito na mahalaga sa iyo ang iyong trabaho at nakakaengganyo sa iba na mag-contribute!
> 🎯 **Pagpapaganda ng Iyong Proyekto**: Ang maayos na repository na may magandang dokumentasyon ay parang malinis, welcoming na storefront. Ipinapakita nito na mahalaga sa iyo ang iyong trabaho at ginaganyak ang iba na mag-ambag!
**Narito ang mga bagay na nagpapaganda sa isang repository:**
| Ano ang Idadagdag | Bakit Mahalaga | Ano ang Nagagawa Nito para sa Iyo |
| **Description** | Mahalaga ang unang impresyon! | Malalaman agad ng mga tao kung ano ang ginagawa ng iyong proyekto |
| **README** | Front page ng iyong proyekto | Parang friendly na tour guide para sa mga bagong bisita |
| **Contributing Guidelines** | Ipinapakita na welcome ang tulong | Malalaman ng mga tao kung paano sila makakatulong sa iyo |
| **Code of Conduct** | Lumilikha ng friendly na espasyo | Lahat ay makakaramdam ng welcome na makilahok |
| **Code of Conduct** | Lumilikha ng friendly na espasyo | Lahat ay komportableng makilahok |
| **License** | Legal na kalinawan | Malalaman ng iba kung paano nila magagamit ang iyong code |
| **Security Policy** | Ipinapakita na responsable ka | Nagpapakita ng propesyonal na praktis |
| **Security Policy** | Ipinapakita na responsable ka | Nagpapakita ng propesyonal na kasanayan |
> 💡 **Pro Tip**: Nagbibigay ang GitHub ng mga template para sa lahat ng mga file na ito. Kapag gumagawa ng bagong repository, i-check ang mga kahon para awtomatikong makabuo ng mga file na ito.
> 💡 **Pro Tip**: Nagbibigay ang GitHub ng mga template para sa lahat ng mga file na ito. Kapag gumagawa ng bagong repository, i-check ang mga kahon para awtomatikong mag-generate ng mga file na ito.
**Mga Modernong Feature ng GitHub na Dapat Tuklasin:**
**Mga Modernong Feature ng GitHub na Tuklasin:**
🤖 **Automation & CI/CD:**
- **GitHub Actions** para sa automated testing at deployment
- **Dependabot** para sa automatic dependency updates
💬 **Komunidad at Pamamahala ng Proyekto:**
- **GitHub Discussions** para sa mga pag-uusap ng komunidad na lampas sa mga isyu
- **GitHub Projects** para sa kanban-style na pamamahala ng proyekto
- **Branch protection rules** para maipatupad ang mga pamantayan sa kalidad ng code
💬 **Community & Project Management:**
- **GitHub Discussions** para sa mga pag-uusap ng komunidad na lampas sa issues
- **GitHub Projects** para sa kanban-style na project management
- **Branch protection rules** para magpatupad ng code quality standards
Ang lahat ng mga resource na ito ay makakatulong sa onboarding ng mga bagong miyembro ng team. At ito ang mga bagay na karaniwang tinitingnan ng mga bagong contributor bago pa man tingnan ang iyong code, upang malaman kung ang iyong proyekto ay tamang lugar para sa kanila na gugulin ang kanilang oras.
Ang lahat ng mga resource na ito ay makakatulong sa onboarding ng mga bagong miyembro ng team. At ang mga ito ay karaniwang mga bagay na tinitingnan ng mga bagong contributor bago pa man tingnan ang iyong code, upang malaman kung ang iyong proyekto ay tamang lugar para sa kanila na maglaan ng oras.
✅ Ang mga README files, bagama't nangangailangan ng oras para ihanda, ay madalas na napapabayaan ng mga abalang maintainer. Makakakita ka ba ng halimbawa ng isang partikular na detalyado? Tandaan: may ilang [tools para tumulong gumawa ng magagandang README](https://www.makeareadme.com/) na maaaring gusto mong subukan.
✅ Ang README files, kahit na nangangailangan ng oras para ihanda, ay madalas na napapabayaan ng mga abalang maintainer. Makakakita ka ba ng halimbawa ng isang partikular na detalyado? Tandaan: mayroong ilang [tools para tumulong gumawa ng magagandang README](https://www.makeareadme.com/) na maaaring gusto mong subukan.
### Gawain: Mag-merge ng code
Ang mga contributing docs ay tumutulong sa mga tao na mag-contribute sa proyekto. Ipinapaliwanag nito kung anong uri ng mga kontribusyon ang hinahanap mo at kung paano gumagana ang proseso. Ang mga contributor ay kailangang dumaan sa isang serye ng mga hakbang upang makapag-contribute sa iyong repo sa GitHub:
Ang mga contributing docs ay tumutulong sa mga tao na mag-ambag sa proyekto. Ipinaliwanag nito kung anong uri ng mga kontribusyon ang hinahanap mo at kung paano gumagana ang proseso. Ang mga contributor ay kailangang dumaan sa isang serye ng mga hakbang upang makapag-ambag sa iyong repo sa GitHub:
1. **Forking your repo**. Malamang gusto mong ipa-_fork_ ang iyong proyekto sa mga tao. Ang forking ay nangangahulugan ng paggawa ng replica ng iyong repository sa kanilang GitHub profile.
1. **Clone**. Mula doon, i-clone nila ang proyekto sa kanilang lokal na makina.
1. **Create a branch**. Gusto mong hilingin sa kanila na gumawa ng _branch_ para sa kanilang trabaho.
1. **Focus their change on one area**. Hilingin sa mga contributor na i-concentrate ang kanilang kontribusyon sa isang bagay sa bawat pagkakataon - sa ganitong paraan mas mataas ang tsansa na ma-_merge_ ang kanilang trabaho. Isipin na gumawa sila ng bug fix, nagdagdag ng bagong feature, at nag-update ng ilang tests - paano kung gusto mo, o maaari mo lang i-implement ang 2 sa 3, o 1 sa 3 pagbabago?
1. **Forking ng iyong repo** Malamang gusto mong ipa-_fork_ ang iyong proyekto sa mga tao. Ang pag-fork ay nangangahulugan ng paggawa ng replica ng iyong repository sa kanilang GitHub profile.
1. **Clone**. Mula doon, i-clone nila ang proyekto sa kanilang lokal na makina.
1. **Gumawa ng branch**. Gusto mong hilingin sa kanila na gumawa ng _branch_ para sa kanilang trabaho.
1. **I-focus ang kanilang pagbabago sa isang lugar**. Hilingin sa mga contributor na i-concentrate ang kanilang kontribusyon sa isang bagay sa bawat pagkakataon - sa ganitong paraan mas mataas ang tsansa na ma-_merge_ ang kanilang trabaho. Isipin na gumawa sila ng bug fix, nagdagdag ng bagong feature, at nag-update ng ilang tests - paano kung gusto mo, o maaari mo lang i-implement ang 2 sa 3, o 1 sa 3 pagbabago?
✅ Isipin ang isang sitwasyon kung saan ang mga branch ay partikular na mahalaga sa pagsusulat at pagpapadala ng magandang code. Anong mga use case ang naiisip mo?
> Tandaan, maging ang pagbabago na gusto mong makita sa mundo, at gumawa ng mga branch para sa sarili mong trabaho. Ang anumang mga commit na gagawin mo ay gagawin sa branch na kasalukuyan mong "checked out". Gamitin ang `git status` para makita kung aling branch iyon.
Dumaan tayo sa workflow ng isang contributor. Ipagpalagay na ang contributor ay naka-_fork_ at naka-_clone_ na ang repo kaya mayroon silang Git repo na handa nang trabahuin sa kanilang lokal na makina:
Dumaan tayo sa isang contributor workflow. Ipagpalagay na ang contributor ay naka-_fork_ at naka-_clone_ na ang repo kaya mayroon na silang Git repo na handa nang trabahuin, sa kanilang lokal na makina:
1. **Gumawa ng branch**. Gamitin ang command na `git branch` para gumawa ng branch na maglalaman ng mga pagbabagong nais nilang i-contribute:
1. **Gumawa ng branch**. Gamitin ang command na `git branch` para gumawa ng branch na maglalaman ng mga pagbabago na balak nilang i-contribute:
```bash
git branch [branch-name]
@ -474,7 +472,7 @@ Dumaan tayo sa workflow ng isang contributor. Ipagpalagay na ang contributor ay
git switch [branch-name]
```
> 💡 **Modernong Paalala**: Ang `git switch` ay ang modernong kapalit ng `git checkout` kapag nagbabago ng branch. Mas malinaw at mas ligtas para sa mga baguhan.
> 💡 **Modernong Paalala**: Ang `git switch` ay ang modernong kapalit ng `git checkout` kapag nagpapalit ng branch. Mas malinaw at mas ligtas para sa mga baguhan.
1. **Gumawa ng trabaho**. Sa puntong ito gusto mong idagdag ang iyong mga pagbabago. Huwag kalimutang ipaalam ito sa Git gamit ang mga sumusunod na command:
@ -485,29 +483,29 @@ Dumaan tayo sa workflow ng isang contributor. Ipagpalagay na ang contributor ay
> ⚠️ **Kalidad ng Commit Message**: Siguraduhing magbigay ka ng magandang pangalan sa iyong commit, para sa iyong kapakanan at sa maintainer ng repo na tinutulungan mo. Maging specific sa kung ano ang binago mo!
1. **Pagsamahin ang iyong trabaho sa `main` branch**. Sa isang punto tapos ka na sa trabaho at gusto mong pagsamahin ang iyong trabaho sa `main` branch. Ang `main` branch ay maaaring nagbago sa pagitan kaya siguraduhing i-update muna ito sa pinakabago gamit ang mga sumusunod na command:
1. **Pagsamahin ang iyong trabaho sa `main` branch**. Sa puntong ito tapos ka na sa iyong trabaho at gusto mong pagsamahin ang iyong trabaho sa `main` branch. Ang `main` branch ay maaaring nagbago sa pagitan kaya siguraduhing i-update muna ito sa pinakabago gamit ang mga sumusunod na command:
```bash
git switch main
git pull
```
Sa puntong ito gusto mong tiyakin na ang anumang _conflicts_, mga sitwasyon kung saan hindi madaling ma-_combine_ ng Git ang mga pagbabago, ay mangyayari sa iyong working branch. Kaya't patakbuhin ang mga sumusunod na command:
Sa puntong ito gusto mong tiyakin na ang anumang _conflicts_, mga sitwasyon kung saan hindi madaling ma-_combine_ ng Git ang mga pagbabago ay mangyayari sa iyong working branch. Kaya't patakbuhin ang mga sumusunod na command:
```bash
git switch [branch_name]
git merge main
```
Ang `git merge main` command ay magdadala ng lahat ng pagbabago mula sa `main` papunta sa iyong branch. Sana ay maaari kang magpatuloy. Kung hindi, ipapakita sa iyo ng VS Code kung saan nalilito ang Git at babaguhin mo lang ang mga apektadong file upang sabihin kung aling content ang pinaka-tama.
Ang `git merge main` command ay magdadala ng lahat ng pagbabago mula sa `main` papunta sa iyong branch. Sana ay maaari ka nang magpatuloy. Kung hindi, sasabihin sa iyo ng VS Code kung saan nalilito ang Git at babaguhin mo lang ang mga apektadong file para sabihin kung aling content ang pinaka-tama.
💡 **Modernong alternatibo**: Isaalang-alang ang paggamit ng `git rebase` para sa mas malinis na history:
💡 **Modernong Alternatibo**: Isaalang-alang ang paggamit ng `git rebase` para sa mas malinis na history:
```bash
git rebase main
```
Ire-replay nito ang iyong mga commit sa ibabaw ng pinakabagong main branch, na lumilikha ng linear na history.
1. **I-upload ang iyong trabaho sa GitHub**. Ang pag-upload ng iyong trabaho sa GitHub ay nangangahulugan ng dalawang bagay. Ang pag-push ng iyong branch sa iyong repo at pagkatapos ay magbukas ng PR, Pull Request.
1. **Ipadala ang iyong trabaho sa GitHub**. Ang pagpapadala ng iyong trabaho sa GitHub ay nangangahulugan ng dalawang bagay. Ang pag-push ng iyong branch sa iyong repo at pagkatapos ay magbukas ng PR, Pull Request.
```bash
git push --set-upstream origin [branch-name]
@ -515,54 +513,53 @@ Dumaan tayo sa workflow ng isang contributor. Ipagpalagay na ang contributor ay
Ang command sa itaas ay lumilikha ng branch sa iyong forked repo.
### 🤝 **Pag-check ng Kasanayan sa Pakikipagtulungan: Handa Ka Na Bang Makipagtulungan?**
### 🤝 **Pag-check ng Kasanayan sa Pakikipagtulungan: Handa Ka Na Bang Makipagtulungan sa Iba?**
**Tingnan natin kung ano ang pakiramdam mo tungkol sa pakikipagtulungan:**
- Naiintindihan mo na ba ang ideya ng forking at pull requests?
- Ano ang isang bagay tungkol sa paggamit ng mga branch na gusto mong mas pag-aralan?
- Gaano ka komportable sa pag-contribute sa proyekto ng ibang tao?
- Ano ang isang bagay tungkol sa paggamit ng branches na gusto mong mas pagpraktisan?
- Gaano ka komportable sa pag-ambag sa proyekto ng ibang tao?
```mermaid
mindmap
root((Git Collaboration))
root((Git na Pakikipagtulungan))
Branching
Feature branches
Bug fix branches
Experimental work
Mga sangay ng tampok
Mga sangay ng pag-aayos ng bug
Eksperimental na trabaho
Pull Requests
Code review
Discussion
Testing
Best Practices
Clear commit messages
Small focused changes
Good documentation
Pagsusuri ng code
Talakayan
Pagsusuri
Mga Pinakamahusay na Kasanayan
Malinaw na mga mensahe ng commit
Maliit na nakatuong mga pagbabago
Magandang dokumentasyon
```
> **Pampalakas ng Kumpiyansa**: Ang bawat developer na hinahangaan mo ay minsang kinakabahan sa kanilang unang pull request. Ang komunidad ng GitHub ay sobrang welcoming sa mga baguhan!
> **Pampalakas ng loob**: Ang bawat developer na hinahangaan mo ay minsang kinakabahan sa kanilang unang pull request. Ang komunidad ng GitHub ay sobrang welcoming sa mga baguhan!
1. **Magbukas ng PR**. Susunod, gusto mong magbukas ng PR. Gawin mo ito sa pamamagitan ng pag-navigate sa forked repo sa GitHub. Makikita mo ang indikasyon sa GitHub kung saan tinatanong kung gusto mong gumawa ng bagong PR, i-click mo iyon at dadalhin ka sa interface kung saan maaari mong baguhin ang commit message title, magbigay ng mas angkop na deskripsyon. Ngayon makikita ng maintainer ng repo na na-fork mo ang PR na ito at _fingers crossed_ maa-appreciate nila at _merge_ ang iyong PR. Isa ka nang contributor, yay :)
1. **Magbukas ng PR**. Susunod, gusto mong magbukas ng PR. Gawin mo ito sa pamamagitan ng pagpunta sa forked repo sa GitHub. Makikita mo ang indikasyon sa GitHub kung saan tinatanong kung gusto mong gumawa ng bagong PR, i-click mo iyon at dadalhin ka sa interface kung saan maaari mong baguhin ang commit message title, magbigay ng mas angkop na deskripsyon. Ngayon makikita ng maintainer ng repo na na-fork mo ang PR na ito at _fingers crossed_ maa-appreciate nila at _merge_ ang iyong PR. Isa ka nang contributor, yay :)
💡 **Modernong tip**: Maaari ka ring gumawa ng PR gamit ang GitHub CLI:
💡 **Modernong Tip**: Maaari ka ring gumawa ng PR gamit ang GitHub CLI:
- I-link ang mga kaugnay na isyu gamit ang mga keyword tulad ng "Fixes #123".
- Magdagdag ng screenshots para sa mga pagbabago sa UI.
- Mag-request ng specific na reviewers.
- Gumamit ng draft PRs para sa work-in-progress.
- Siguraduhing pumasa ang lahat ng CI checks bago mag-request ng review.
🔧 **Mga Best Practices para sa PRs**:
- I-link ang mga kaugnay na issues gamit ang mga keyword tulad ng "Fixes #123"
- Magdagdag ng screenshots para sa mga pagbabago sa UI
- Mag-request ng specific na reviewers
- Gumamit ng draft PRs para sa work-in-progress
- Siguraduhing pumasa ang lahat ng CI checks bago mag-request ng review
1. **Linisin**. Itinuturing na magandang kasanayan ang _linisin_ pagkatapos mong matagumpay na ma-merge ang isang PR. Gusto mong linisin ang parehong lokal na branch mo at ang branch na na-push mo sa GitHub. Una, tanggalin ito sa lokal gamit ang sumusunod na utos:
```bash
git branch -d [branch-name]
```
Siguraduhing pumunta ka sa pahina ng GitHub para sa forked na repo at alisin ang remote branch na na-push mo dito.
Siguraduhing pumunta ka sa pahina ng GitHub para sa forked na repo at alisin ang remote branch na kakapush mo lang.
Ang `Pull request` ay tila nakakatawang termino dahil ang totoo ay gusto mong i-push ang mga pagbabago mo sa proyekto. Ngunit ang maintainer (may-ari ng proyekto) o core team ay kailangang isaalang-alang ang mga pagbabago mo bago ito i-merge sa "main" branch ng proyekto, kaya't talagang humihiling ka ng desisyon sa pagbabago mula sa maintainer.
Ang `Pull request` ay tila nakakatawang termino dahil ang totoo ay gusto mong i-push ang mga pagbabago mo sa proyekto. Ngunit ang maintainer (may-ari ng proyekto) o core team ay kailangang suriin ang mga pagbabago mo bago ito i-merge sa "main" branch ng proyekto, kaya't talagang humihiling ka ng desisyon sa pagbabago mula sa maintainer.
Ang pull request ay lugar para ikumpara at talakayin ang mga pagkakaiba na ipinakilala sa isang branch gamit ang mga review, komento, integrated tests, at iba pa. Ang isang mahusay na pull request ay sumusunod sa halos parehong mga patakaran tulad ng isang commit message. Maaari kang magdagdag ng reference sa isang isyu sa issue tracker, halimbawa kung ang trabaho mo ay nag-aayos ng isang isyu. Ginagawa ito gamit ang `#` na sinusundan ng numero ng isyu mo. Halimbawa, `#97`.
@ -574,53 +571,52 @@ I-update ang kasalukuyang lokal na working branch mo gamit ang lahat ng bagong c
## Pag-aambag sa Open Source (Ang Iyong Pagkakataon na Magkaroon ng Epekto!)
Handa ka na ba para sa isang bagay na magpapamangha sa iyo? 🤯 Pag-usapan natin ang pag-aambag sa mga open source na proyekto – at kinikilabutan ako sa tuwing iniisip kong ibahagi ito sa iyo!
Handa ka na ba para sa isang bagay na talagang magpapamangha sa iyo? 🤯 Pag-usapan natin ang pag-aambag sa mga open source na proyekto – at kinikilabutan ako sa tuwing iniisip kong ibahagi ito sa iyo!
Ito ang pagkakataon mo na maging bahagi ng isang bagay na tunay na kahanga-hanga. Isipin mong pinapabuti ang mga tool na ginagamit ng milyon-milyong mga developer araw-araw, o inaayos ang isang bug sa isang app na mahal ng mga kaibigan mo. Hindi lang ito pangarap – ito ang tungkol sa pag-aambag sa open source!
Ito ang pagkakataon mo na maging bahagi ng isang bagay na tunay na kahanga-hanga. Isipin mong pinapaganda ang mga tools na ginagamit ng milyon-milyong developer araw-araw, o inaayos ang isang bug sa isang app na mahal ng mga kaibigan mo. Hindi lang ito pangarap –ganito ang open source contribution!
Narito ang nagbibigay sa akin ng kilabot tuwing iniisip ko ito: bawat tool na natutunan mo – ang code editor mo, ang mga framework na pag-aaralan natin, kahit ang browser na binabasa mo ito– nagsimula sa isang tao na katulad mo na gumagawa ng kanilang unang kontribusyon. Ang magaling na developer na gumawa ng paborito mong VS Code extension? Sila rin ay minsang baguhan na nagki-click ng "create pull request" na nanginginig ang mga kamay, tulad ng gagawin mo.
Narito ang nagbibigay sa akin ng kilabot tuwing iniisip ko ito: bawat tool na natutunan mo – ang code editor mo, ang mga framework na pag-aaralan natin, kahit ang browser na binabasa mo ngayon– nagsimula sa isang tao na katulad mo na gumagawa ng kanilang unang kontribusyon. Ang magaling na developer na gumawa ng paborito mong VS Code extension? Sila rin ay minsang baguhan na nagki-click ng "create pull request" nang nanginginig ang mga kamay, tulad ng gagawin mo.
At narito ang pinakamagandang bahagi: ang open source na komunidad ay parang pinakamalaking group hug ng internet. Karamihan sa mga proyekto ay aktibong naghahanap ng mga baguhan at may mga isyung may tag na "good first issue" na partikular para sa mga tulad mo! Ang mga maintainer ay talagang nasasabik kapag nakikita nila ang mga bagong contributor dahil naaalala nila ang kanilang sariling unang hakbang.
At narito ang pinakamagandang bahagi: ang open source na komunidad ay parang pinakamalaking group hug sa internet. Karamihan sa mga proyekto ay aktibong naghahanap ng mga baguhan at may mga isyung may tag na "good first issue" na partikular para sa mga tulad mo! Ang mga maintainer ay talagang nasasabik kapag nakikita nila ang mga bagong contributor dahil naaalala nila ang kanilang sariling unang hakbang.
```mermaid
flowchart TD
A[🔍 Explore GitHub] --> B[🏷️ Find "good first issue"]
B --> C[📖 Read Contributing Guidelines]
C --> D[🍴 Fork Repository]
D --> E[💻 Set Up Local Environment]
E --> F[🌿 Create Feature Branch]
F --> G[✨ Make Your Contribution]
G --> H[🧪 Test Your Changes]
H --> I[📝 Write Clear Commit]
I --> J[📤 Push & Create PR]
J --> K[💬 Engage with Feedback]
K --> L[🎉 Merged! You're a Contributor!]
L --> M[🌟 Find Next Issue]
A[🔍 Mag-explore sa GitHub] --> B[🏷️ Maghanap ng "good first issue"]
B --> C[📖 Basahin ang Mga Alituntunin sa Pag-aambag]
C --> D[🍴 I-fork ang Repository]
D --> E[💻 I-set up ang Lokal na Kapaligiran]
E --> F[🌿 Gumawa ng Feature Branch]
F --> G[✨ Gawin ang Iyong Ambag]
G --> H[🧪 Subukan ang Iyong Mga Pagbabago]
H --> I[📝 Sumulat ng Malinaw na Commit]
I --> J[📤 I-push at Gumawa ng PR]
J --> K[💬 Makipag-ugnayan sa Feedback]
K --> L[🎉 Na-merge! Isa Ka Nang Contributor!]
L --> M[🌟 Maghanap ng Susunod na Isyu]
style A fill:#e1f5fe
style L fill:#c8e6c9
style M fill:#fff59d
```
Hindi ka lang natututo ng coding dito – naghahanda ka para sumali sa isang pandaigdigang pamilya ng mga tagabuo na gumigising araw-araw na iniisip "Paano natin mapapabuti ang digital na mundo?" Maligayang pagdating sa club! 🌟
Hindi ka lang natututo ng coding dito – naghahanda ka na sumali sa isang pandaigdigang pamilya ng mga tagabuo na gumigising araw-araw na iniisip "Paano natin mapapaganda ang digital na mundo?" Maligayang pagdating sa club! 🌟
Una, maghanap tayo ng repository (o **repo**) sa GitHub na interesado ka at kung saan gusto mong mag-ambag ng pagbabago. Gusto mong kopyahin ang nilalaman nito sa iyong makina.
✅ Isang magandang paraan para makahanap ng 'beginner-friendly' na mga repo ay ang [maghanap gamit ang tag na 'good-first-issue'](https://github.blog/2020-01-22-browse-good-first-issues-to-start-contributing-to-open-source/).
✅ Isang magandang paraan para makahanap ng 'beginner-friendly' na mga repo ay [maghanap gamit ang tag na 'good-first-issue'](https://github.blog/2020-01-22-browse-good-first-issues-to-start-contributing-to-open-source/).
May ilang paraan para kopyahin ang code. Isa sa mga paraan ay ang "clone" ng nilalaman ng repository, gamit ang HTTPS, SSH, o gamit ang GitHub CLI (Command Line Interface).
May ilang paraan para kopyahin ang code. Isa sa mga paraan ay "i-clone" ang nilalaman ng repository, gamit ang HTTPS, SSH, o gamit ang GitHub CLI (Command Line Interface).
Buksan ang terminal mo at i-clone ang repository tulad nito:
```bash
# Using HTTPS
# Gumagamit ng HTTPS
git clone https://github.com/ProjectURL
# Using SSH (requires SSH key setup)
# Gumagamit ng SSH (nangangailangan ng setup ng SSH key)
git clone git@github.com:username/repository.git
# Using GitHub CLI
# Gumagamit ng GitHub CLI
gh repo clone username/repository
```
@ -629,7 +625,7 @@ Para magtrabaho sa proyekto, lumipat sa tamang folder:
Maaari mo ring buksan ang buong proyekto gamit ang:
- **[GitHub Codespaces](https://github.com/features/codespaces)** - Cloud development environment ng GitHub na may VS Code sa browser
- **[GitHub Desktop](https://desktop.github.com/)** - GUI application para sa mga operasyon ng Git
- **[GitHub Desktop](https://desktop.github.com/)** - Isang GUI application para sa mga Git operations
- **[GitHub.dev](https://github.dev)** - Pindutin ang `.` key sa anumang GitHub repo para buksan ang VS Code sa browser
- **VS Code** na may GitHub Pull Requests extension
@ -637,11 +633,11 @@ Sa huli, maaari mong i-download ang code sa isang zipped folder.
### Ilang mga kawili-wiling bagay tungkol sa GitHub
Maaari kang mag-star, mag-watch, at/o "fork" ng anumang pampublikong repository sa GitHub. Makikita mo ang mga starred repositories mo sa drop-down menu sa kanang itaas. Parang bookmarking, pero para sa code.
Maaari kang mag-star, mag-watch, at/o "mag-fork" ng anumang pampublikong repository sa GitHub. Makikita mo ang mga starred repositories mo sa drop-down menu sa kanang itaas. Parang bookmarking, pero para sa code.
Ang mga proyekto ay may issue tracker, kadalasan sa GitHub sa "Issues" tab maliban kung may ibang indikasyon, kung saan tinatalakay ng mga tao ang mga isyu na may kaugnayan sa proyekto. At ang Pull Requests tab ay kung saan tinatalakay at nire-review ang mga pagbabago na nasa proseso.
Ang mga proyekto ay may issue tracker, kadalasan sa GitHub sa tab na "Issues" maliban kung may ibang indikasyon, kung saan tinatalakay ng mga tao ang mga isyu na may kaugnayan sa proyekto. At ang tab na Pull Requests ay kung saan tinatalakay at nire-review ang mga pagbabago na nasa proseso.
Ang mga proyekto ay maaaring may diskusyon sa mga forum, mailing lists, o chat channels tulad ng Slack, Discord o IRC.
Ang mga proyekto ay maaaring may diskusyon sa mga forum, mailing lists, o chat channels tulad ng Slack, Discord, o IRC.
🔧 **Mga modernong tampok ng GitHub**:
- **GitHub Discussions** - Built-in forum para sa mga pag-uusap ng komunidad
@ -657,62 +653,62 @@ Ang mga proyekto ay maaaring may diskusyon sa mga forum, mailing lists, o chat c
## 🚀 Hamon
Alright, oras na para subukan ang bago mong mga superpower sa GitHub! 🚀 Narito ang isang hamon na magpapaklik sa lahat ng natutunan mo sa pinaka-satisfying na paraan:
Sige, oras na para subukan ang bago mong GitHub superpowers! 🚀 Narito ang isang hamon na magpapakonekta sa lahat ng natutunan mo sa pinaka-satisfying na paraan:
Kumuha ng kaibigan (o miyembro ng pamilya na laging nagtatanong kung ano ang ginagawa mo sa "computer stuff" na ito) at magsimula ng isang collaborative coding adventure nang magkasama! Dito nangyayari ang tunay na mahika – gumawa ng proyekto, hayaan silang i-fork ito, gumawa ng ilang branches, at i-merge ang mga pagbabago tulad ng mga propesyonal na nagiging ikaw.
Maghanap ng kaibigan (o miyembro ng pamilya na laging nagtatanong kung ano ang ginagawa mo sa "computer stuff" na ito) at magsimula ng collaborative coding adventure nang magkasama! Dito nangyayari ang tunay na magic – gumawa ng proyekto, hayaan silang i-fork ito, gumawa ng mga branch, at i-merge ang mga pagbabago tulad ng mga propesyonal na nagiging ikaw.
Hindi ko itatago – malamang tatawa kayo sa isang punto (lalo na kapag pareho kayong nag-try na baguhin ang parehong linya), maaaring magkamot ng ulo sa pagkalito, ngunit tiyak na magkakaroon kayo ng mga kamangha-manghang "aha!" na sandali na nagpapahalaga sa lahat ng pag-aaral. Dagdag pa, may espesyal na bagay tungkol sa pagbabahagi ng unang matagumpay na merge sa iba – parang maliit na selebrasyon ng kung gaano kalayo na ang narating mo!
Hindi ko itatago – malamang tatawa kayo sa isang punto (lalo na kapag pareho kayong nag-try na baguhin ang parehong linya), maaaring magkamot ng ulo sa pagkalito, ngunit tiyak na magkakaroon kayo ng mga kamangha-manghang "aha!" moments na nagpapahalaga sa lahat ng pag-aaral. Dagdag pa, may espesyal na pakiramdam sa pagbabahagi ng unang matagumpay na merge sa iba – parang maliit na selebrasyon ng kung gaano kalayo na ang narating mo!
Wala pang coding buddy? Walang problema! Ang komunidad ng GitHub ay puno ng mga tao na sobrang welcoming at naaalala kung paano maging bago. Maghanap ng mga repository na may "good first issue" labels – parang sinasabi nila "Hey beginners, come learn with us!" Gaano ito kaganda?
Wala pang coding buddy? Walang problema! Ang komunidad ng GitHub ay puno ng mga tao na sobrang welcoming at naaalala kung paano maging bago. Maghanap ng mga repository na may "good first issue" labels – para bang sinasabi nila "Hey beginners, come learn with us!" Ang galing, di ba?
Whew! 🎉 Tingnan mo – na-master mo ang mga basics ng GitHub tulad ng isang tunay na champion! Kung pakiramdam mo ay medyo puno ang utak mo ngayon, normal lang iyon at sa totoo lang, magandang senyales. Natutunan mo ang mga tool na inabot ako ng ilang linggo para maging komportable.
Whew! 🎉 Tingnan mo – na-master mo na ang mga basics ng GitHub tulad ng isang tunay na champion! Kung pakiramdam mo ay medyo puno ang utak mo ngayon, normal lang iyon at sa totoo lang, magandang senyales. Natutunan mo ang mga tools na inabot ako ng ilang linggo para maging komportable.
Ang Git at GitHub ay sobrang makapangyarihan (seryoso, makapangyarihan), at bawat developer na kilala ko – kabilang ang mga mukhang wizard ngayon – ay kailangang magpraktis at magkamali bago ito tuluyang maunawaan. Ang katotohanan na natapos mo ang araling ito ay nangangahulugang nasa daan ka na para ma-master ang ilan sa pinakamahalagang tool sa toolkit ng isang developer.
Ang Git at GitHub ay sobrang makapangyarihan (seryoso, makapangyarihan), at bawat developer na kilala ko – kabilang ang mga mukhang wizard na ngayon – ay kailangang magpraktis at magkamali bago nila ito lubos na maunawaan. Ang katotohanan na natapos mo ang araling ito ay nangangahulugang nasa landas ka na para ma-master ang ilan sa pinakamahalagang tools sa toolkit ng isang developer.
Narito ang ilang kamangha-manghang resources para tulungan kang magpraktis at maging mas kahanga-hanga pa:
Narito ang ilang napakahusay na resources para tulungan kang magpraktis at maging mas kahanga-hanga pa:
- [Contributing to open source software guide](https://opensource.guide/how-to-contribute/#how-to-submit-a-contribution) – Ang roadmap mo para gumawa ng pagbabago
- [Git cheatsheet](https://training.github.com/downloads/github-git-cheat-sheet/) – Panatilihin ito para sa mabilisang reference!
At tandaan: ang praktis ay nagdudulot ng progreso, hindi perpeksyon! Habang mas ginagamit mo ang Git at GitHub, mas nagiging natural ito. Ang GitHub ay gumawa ng ilang kamangha-manghang interactive courses na nagpapahintulot sa iyo na magpraktis sa isang ligtas na kapaligiran:
At tandaan: ang praktis ay nagdudulot ng progreso, hindi perpeksyon! Habang mas ginagamit mo ang Git at GitHub, mas nagiging natural ito. Ang GitHub ay gumawa ng ilang kamangha-manghang interactive courses na nagbibigay-daan sa iyo na magpraktis sa isang ligtas na kapaligiran:
- [Introduction to GitHub](https://github.com/skills/introduction-to-github)
- [Communicate using Markdown](https://github.com/skills/communicate-using-markdown)
**Pakiramdam mo ba handa ka na para sa mas matitinding hamon? Tingnan ang mga modernong tool na ito:**
- [GitHub CLI documentation](https://cli.github.com/manual/) – Para sa mga gustong maging wizard sa command-line
**Pakiramdam mo ba ay adventurous? Subukan ang mga modernong tools na ito:**
- [GitHub CLI documentation](https://cli.github.com/manual/) – Para sa pakiramdam na parang wizard sa command-line
- [GitHub Codespaces documentation](https://docs.github.com/en/codespaces) – Mag-code sa cloud!
- [GitHub Actions documentation](https://docs.github.com/en/actions) – I-automate ang lahat ng bagay
- [Git best practices](https://www.atlassian.com/git/tutorials/comparing-workflows) – I-level up ang workflow mo
- [Git best practices](https://www.atlassian.com/git/tutorials/comparing-workflows) – I-level up ang workflow game mo
## Hamon ng GitHub Copilot Agent 🚀
Gamitin ang Agent mode para tapusin ang sumusunod na hamon:
**Deskripsyon:** Gumawa ng collaborative web development project na nagpapakita ng kumpletong GitHub workflow na natutunan mo sa araling ito. Ang hamon na ito ay tutulong sa iyo na magpraktis ng repository creation, collaboration features, at modern Git workflows sa isang real-world na senaryo.
**Deskripsyon:** Gumawa ng collaborative web development project na nagpapakita ng kumpletong GitHub workflow na natutunan mo sa araling ito. Ang hamon na ito ay tutulong sa iyo na magpraktis ng repository creation, collaboration features, at modern Git workflows sa isang real-world na sitwasyon.
**Prompt:** Gumawa ng bagong pampublikong GitHub repository para sa isang simpleng proyekto na "Web Development Resources". Ang repository ay dapat maglaman ng maayos na naka-istrukturang README.md file na naglilista ng mga kapaki-pakinabang na web development tools at resources, na nakaayos ayon sa mga kategorya (HTML, CSS, JavaScript, atbp.). I-set up ang repository na may tamang community standards kabilang ang isang lisensya, mga patnubay sa pag-aambag, at isang code of conduct. Gumawa ng hindi bababa sa dalawang feature branches: isa para sa pagdaragdag ng mga CSS resources at isa pa para sa mga JavaScript resources. Gumawa ng mga commits sa bawat branch na may mga deskriptibong commit messages, pagkatapos ay gumawa ng mga pull requests para i-merge ang mga pagbabago pabalik sa main. I-enable ang mga tampok ng GitHub tulad ng Issues, Discussions, at mag-set up ng basic na GitHub Actions workflow para sa automated checks.
**Prompt:** Gumawa ng bagong pampublikong GitHub repository para sa simpleng "Web Development Resources" na proyekto. Ang repository ay dapat may maayos na istrukturang README.md file na naglilista ng mga kapaki-pakinabang na web development tools at resources, na nakaayos ayon sa kategorya (HTML, CSS, JavaScript, atbp.). I-set up ang repository na may tamang community standards kabilang ang isang lisensya, contributing guidelines, at code of conduct. Gumawa ng hindi bababa sa dalawang feature branches: isa para sa pagdaragdag ng CSS resources at isa pa para sa JavaScript resources. Gumawa ng mga commits sa bawat branch na may mga deskriptibong commit messages, pagkatapos ay gumawa ng pull requests para i-merge ang mga pagbabago pabalik sa main. I-enable ang mga tampok ng GitHub tulad ng Issues, Discussions, at mag-set up ng basic na GitHub Actions workflow para sa automated checks.
## Takdang-Aralin
## Assignment
Ang misyon mo, kung pipiliin mong tanggapin ito: Tapusin ang [Introduction to GitHub](https://github.com/skills/introduction-to-github) course sa GitHub Skills. Ang interactive na kursong ito ay magpapahintulot sa iyo na magpraktis ng lahat ng natutunan mo sa isang ligtas, guided na kapaligiran. Dagdag pa, makakakuha ka ng cool na badge kapag natapos mo ito! 🏅
**Pakiramdam mo ba handa ka na para sa mas matitinding hamon?**
**Handa ka na ba para sa mas maraming hamon?**
- I-set up ang SSH authentication para sa GitHub account mo (wala nang passwords!)
- Subukan ang paggamit ng GitHub CLI para sa pang-araw-araw na Git operations
- Gumawa ng repository na may GitHub Actions workflow
- I-explore ang GitHub Codespaces sa pamamagitan ng pagbukas ng repository na ito sa isang cloud-based editor
- I-explore ang GitHub Codespaces sa pamamagitan ng pagbukas ng mismong repository na ito sa cloud-based editor
---
## 🚀 Timeline ng Iyong GitHub Mastery
## 🚀 Ang Iyong GitHub Mastery Timeline
### ⚡ **Ano ang Magagawa Mo sa Susunod na 5 Minuto**
- [ ] I-star ang repository na ito at 3 pang ibang proyekto na interesado ka
@ -721,7 +717,7 @@ Ang misyon mo, kung pipiliin mong tanggapin ito: Tapusin ang [Introduction to Gi
- [ ] I-follow ang 5 developer na nagbibigay inspirasyon sa iyo
### 🎯 **Ano ang Maaaring Makamit Mo sa Loob ng Isang Oras**
- [ ] Tapusin ang post-lesson quiz at pagnilayan ang GitHub journey mo
- [ ] Tapusin ang post-lesson quiz at pag-isipan ang GitHub journey mo
- [ ] I-set up ang SSH keys para sa password-free na GitHub authentication
- [ ] Gumawa ng unang meaningful commit na may mahusay na commit message
- [ ] I-explore ang "Explore" tab ng GitHub para matuklasan ang trending projects
@ -730,49 +726,50 @@ Ang misyon mo, kung pipiliin mong tanggapin ito: Tapusin ang [Introduction to Gi
### 📅 **Ang Iyong Lingguhang GitHub Adventure**
- [ ] Tapusin ang GitHub Skills courses (Introduction to GitHub, Markdown)
- [ ] Gumawa ng unang pull request sa isang open source na proyekto
- [ ] I-set up ang GitHub Pages site para ipakita ang mga gawa mo
- [ ] Mag-set up ng GitHub Pages site para ipakita ang mga gawa mo
- [ ] Sumali sa GitHub Discussions sa mga proyektong interesado ka
- [ ] Gumawa ng repository na may tamang community standards (README, License, atbp.)
- [ ] Subukan ang GitHub Codespaces para sa cloud-based development
### 🌟 **Ang Iyong Buwanang Transformasyon**
- [ ] Mag-ambag sa 3 iba't ibang open source na proyekto
- [ ] Mag-mentor ng isang bagong user sa GitHub (ibahagi ang kaalaman!)
- [ ] I-set up ang automated workflows gamit ang GitHub Actions
- [ ] Mag-mentor ng isang bagong user sa GitHub (ibahagi ang natutunan!)
- [ ] Mag-set up ng automated workflows gamit ang GitHub Actions
- [ ] Gumawa ng portfolio na nagpapakita ng mga kontribusyon mo sa GitHub
- [ ] Sumali sa Hacktoberfest o katulad na mga community events
- [ ] Maging maintainer ng sarili mong proyekto na inaambagan ng iba
### 🎓 **Huling Pagsusuri sa Iyong GitHub Mastery**
### 🎓 **Final GitHub Mastery Check-in**
**I-celebrate kung gaano kalayo na ang narating mo:**
**I-celebrate ang narating mo:**
- Ano ang paborito mong bagay tungkol sa paggamit ng GitHub?
- Aling tampok ng collaboration ang pinaka-nakakapukaw sa iyo?
- Aling collaboration feature ang pinaka-nakakapukaw sa iyo?
- Gaano ka na ka-kumpiyansa sa pag-aambag sa open source ngayon?
- Ano ang unang proyekto na gusto mong ambagan?
```mermaid
journey
title Your GitHub Confidence Journey
section Today
Nervous: 3: You
Curious: 4: You
Excited: 5: You
section This Week
Practicing: 4: You
Contributing: 5: You
Connecting: 5: You
section Next Month
Collaborating: 5: You
Leading: 5: You
Inspiring Others: 5: You
title Ang Iyong Paglalakbay sa Kumpiyansa sa GitHub
section Ngayon
Kabado: 3: Ikaw
Mausisa: 4: Ikaw
Nasasabik: 5: Ikaw
section Sa Linggong Ito
Nagpapraktis: 4: Ikaw
Nag-aambag: 5: Ikaw
Kumokonekta: 5: Ikaw
section Sa Susunod na Buwan
Nakikipagtulungan: 5: Ikaw
Nangunguna: 5: Ikaw
Nagbibigay Inspirasyon sa Iba: 5: Ikaw
```
> 🌍 **Maligayang pagdating sa pandaigdigang komunidad ng mga developer!** Ngayon ay mayroon ka nang mga tool para makipagtulungan sa milyon-milyong mga developer sa buong mundo. Ang unang kontribusyon mo ay maaaring mukhang maliit, ngunit tandaan - bawat malaking open source na proyekto ay nagsimula sa isang tao na gumagawa ng kanilang unang commit. Ang tanong ay hindi kung magkakaroon ka ng epekto, kundi kung anong kamangha-manghang proyekto ang unang makikinabang sa natatanging pananaw mo! 🚀
> 🌍 **Maligayang pagdating sa pandaigdigang komunidad ng developer!** Ngayon ay mayroon ka nang mga tools para makipagtulungan sa milyon-milyong developer sa buong mundo. Ang unang kontribusyon mo ay maaaring mukhang maliit, ngunit tandaan - bawat malaking open source na proyekto ay nagsimula sa isang tao na gumagawa ng kanilang unang commit. Ang tanong ay hindi kung magkakaroon ka ng epekto, kundi kung anong kamangha-manghang proyekto ang unang makikinabang sa natatanging pananaw mo! 🚀
Tandaan: bawat eksperto ay minsang baguhan. Kaya mo 'to! 💪
---
<!-- CO-OP TRANSLATOR DISCLAIMER START -->
**Paunawa**:
Ang dokumentong ito ay isinalin gamit ang AI translation service na [Co-op Translator](https://github.com/Azure/co-op-translator). Bagama't sinisikap naming maging tumpak, mangyaring tandaan na ang mga awtomatikong pagsasalin ay maaaring maglaman ng mga pagkakamali o hindi pagkakatugma. Ang orihinal na dokumento sa kanyang katutubong wika ang dapat ituring na opisyal na pinagmulan. Para sa mahalagang impormasyon, inirerekomenda ang propesyonal na pagsasalin ng tao. Hindi kami mananagot sa anumang hindi pagkakaunawaan o maling interpretasyon na dulot ng paggamit ng pagsasaling ito.
Ang dokumentong ito ay isinalin gamit ang AI translation service [Co-op Translator](https://github.com/Azure/co-op-translator). Bagamat sinisikap naming maging tumpak, pakatandaan na ang mga awtomatikong pagsasalin ay maaaring maglaman ng mga pagkakamali o hindi pagkakatugma. Ang orihinal na dokumento sa kanyang katutubong wika ang dapat ituring na opisyal na sanggunian. Para sa mahalagang impormasyon, inirerekomenda ang propesyonal na pagsasalin ng tao. Hindi kami mananagot sa anumang hindi pagkakaunawaan o maling interpretasyon na dulot ng paggamit ng pagsasaling ito.
# Web Development para sa mga Baguhan - Isang Kurikulum
# Web Development para sa mga Baguhan - Isang Kurikulum
Matutunan ang mga pangunahing kaalaman sa web development sa aming 12-linggong komprehensibong kurso mula sa Microsoft Cloud Advocates. Ang bawat isa sa 24 na aralin ay sumisid sa JavaScript, CSS, at HTML sa pamamagitan ng mga hands-on na proyekto tulad ng terrariums, browser extensions, at space games. Makilahok sa mga pagsusulit, talakayan, at praktikal na mga gawain. Paunlarin ang iyong kakayahan at pagbutihin ang iyong kaalaman gamit ang aming epektibong project-based na pamamaraan. Simulan ang iyong coding journey ngayon!
Matutunan ang mga pangunahing kaalaman sa web development gamit ang aming 12-linggong komprehensibong kurso mula sa Microsoft Cloud Advocates. Ang bawat isa sa 24 na aralin ay sumasaklaw sa JavaScript, CSS, at HTML sa pamamagitan ng mga praktikal na proyekto tulad ng terrariums, browser extensions, at space games. Makilahok sa mga pagsusulit, talakayan, at mga praktikal na gawain. Paunlarin ang iyong kakayahan at pagbutihin ang iyong kaalaman gamit ang aming epektibong project-based na pamamaraan. Simulan ang iyong coding journey ngayon!
Sumali sa Azure AI Foundry Discord Community
Sumali sa Azure AI Foundry Discord Community
[](https://discord.com/invite/ByRwuEEgH4)
Sundin ang mga hakbang na ito upang simulanang paggamit ng mga resources na ito:
1. **I-fork ang Repository**: I-click ang [](https://GitHub.com/microsoft/Web-Dev-For-Beginners/fork)
2. **I-clone ang Repository**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git`
3. [**Sumali sa Azure AI Foundry Discord at makipagkilala sa mga eksperto at kapwa developer**](https://discord.com/invite/ByRwuEEgH4)
Sundin ang mga hakbang na ito upang makapagsimula gamit ang mga resources na ito:
1. **I-Fork ang Repository**: I-click ang [](https://GitHub.com/microsoft/Web-Dev-For-Beginners/fork)
2. **I-Clone ang Repository**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git`
3. [**Sumali sa Azure AI Foundry Discord at makipagkita sa mga eksperto at kapwa developer**](https://discord.com/invite/ByRwuEEgH4)
### 🌐 Suporta sa Multi-Language
### 🌐 Suporta sa Iba't Ibang Wika
#### Sinusuportahan sa pamamagitan ng GitHub Action (Automated & Laging Napapanahon)
#### Sinusuportahan sa pamamagitan ng GitHub Action (Automated at Laging Napapanahon)
**Kung nais mong magkaroon ng karagdagang mga pagsasalin, ang mga sinusuportahang wika ay nakalista [dito](https://github.com/Azure/co-op-translator/blob/main/getting_started/supported-languages.md)**
**Kung nais mong magkaroon ng karagdagang mga pagsasalin, ang mga sinusuportahang wika ay nakalista [dito](https://github.com/Azure/co-op-translator/blob/main/getting_started/supported-languages.md)**
[](https://open.vscode.dev/microsoft/Web-Dev-For-Beginners)
[](https://open.vscode.dev/microsoft/Web-Dev-For-Beginners)
#### 🧑🎓 _Estudyante ka ba?_
#### 🧑🎓 _Estudyante ka ba?_
Bisitahin ang [**Student Hub page**](https://docs.microsoft.com/learn/student-hub/?WT.mc_id=academic-77807-sagibbon) kung saan makakahanap ka ng mga resources para sa mga baguhan, mga Student packs, at maging mga paraan upang makakuha ng libreng certificate voucher. Ito ang pahina na dapat mong i-bookmark at balikan paminsan-minsan dahil pinapalitan namin ang nilalaman buwan-buwan.
Bisitahin ang [**Student Hub page**](https://docs.microsoft.com/learn/student-hub/?WT.mc_id=academic-77807-sagibbon) kung saan makakahanap ka ng mga resources para sa mga baguhan, Student packs, at maging mga paraan upang makakuha ng libreng certificate voucher. Ito ang pahinang dapat mong i-bookmark at balikan paminsan-minsan dahil nagbabago ang nilalaman buwan-buwan.
### 📣 Anunsyo - Mga bagong hamon gamit ang GitHub Copilot Agent mode!
### 📣 Anunsyo - Mga Bagong Hamon gamit ang GitHub Copilot Agent mode!
May bagong hamon na idinagdag, hanapin ang "GitHub Copilot Agent Challenge 🚀" sa karamihan ng mga kabanata. Ito ay bagong hamon para sa iyo na kumpletuhin gamit ang GitHub Copilot at Agent mode. Kung hindi mo pa nagagamit ang Agent mode, ito ay may kakayahang hindi lang mag-generate ng text kundi maaari ring gumawa at mag-edit ng mga file, magpatakbo ng mga command, at marami pa.
May bagong hamon na idinagdag, hanapin ang "GitHub Copilot Agent Challenge 🚀" sa karamihan ng mga kabanata. Ito ay bagong hamon na maaari mong tapusin gamit ang GitHub Copilot at Agent mode. Kung hindi mo pa nagagamit ang Agent mode, kaya nitong hindi lang mag-generate ng text kundi pati gumawa at mag-edit ng mga file, magpatakbo ng mga command, at marami pa.
### 📣 Anunsyo - _Bagong Proyekto na gagawin gamit ang Generative AI_
### 📣 Anunsyo - _Bagong Proyekto gamit ang Generative AI_
May bagong AI Assistant project na idinagdag, tingnan ito [project](./09-chat-project/README.md)
Bagong AI Assistant project ang idinagdag, tingnan ito [project](./09-chat-project/README.md)
### 📣 Anunsyo - _Bagong Kurikulum_ sa Generative AI para sa JavaScript ayinilabas na
### 📣 Anunsyo - _Bagong Kurikulum_ sa Generative AI para sa JavaScript
Huwag palampasin ang aming bagong kurikulum sa Generative AI!
Huwag palampasin ang aming bagong Generative AI curriculum!
Bisitahin ang [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) upang magsimula!
Bisitahin ang [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) upang makapagsimula!
Ang bawat aralin ay may kasamang assignment na dapat kumpletuhin, isang knowledge check, at isang hamon upang gabayan ka sa pag-aaral ng mga paksa tulad ng:
- Prompting at prompt engineering
- Text at image app generation
- Search apps
Ang bawat aralin ay may kasamang gawain na dapat tapusin, pagsusuri ng kaalaman, at hamon upang gabayan ka sa pag-aaral ng mga paksa tulad ng:
- Prompting at prompt engineering
- Text at image app generation
- Search apps
Bisitahin ang [https://aka.ms/genai-js-course](../../[https:/aka.ms/genai-js-course) upang magsimula!
Bisitahin ang [https://aka.ms/genai-js-course](../../[https:/aka.ms/genai-js-course) upang makapagsimula!
## 🌱 Pagsisimula
## 🌱 Pagsisimula
> **Mga Guro**, nagdagdag kami ng [ilang mga mungkahi](for-teachers.md) kung paano gamitin ang kurikulum na ito. Gusto naming marinig ang inyong feedback [sa aming discussion forum](https://github.com/microsoft/Web-Dev-For-Beginners/discussions/categories/teacher-corner)!
> **Mga Guro**, nagdagdag kami ng [ilang mungkahi](for-teachers.md) kung paano gamitin ang kurikulum na ito. Gusto naming marinig ang inyong feedback [sa aming discussion forum](https://github.com/microsoft/Web-Dev-For-Beginners/discussions/categories/teacher-corner)!
**[Mga Mag-aaral](https://aka.ms/student-page/?WT.mc_id=academic-77807-sagibbon)**, para sa bawat aralin, magsimula sa pre-lecture quiz at sundan ito sa pagbabasa ng lecture material, pagkumpleto ng iba't ibang aktibidad, at suriin ang iyong kaalaman gamit ang post-lecture quiz.
**[Mga Mag-aaral](https://aka.ms/student-page/?WT.mc_id=academic-77807-sagibbon)**, para sa bawat aralin, magsimula sa pre-lecture quiz at sundan ito sa pagbabasa ng lecture material, pagtapos ng iba't ibang aktibidad, at suriin ang inyong kaalaman gamit ang post-lecture quiz.
Upang mapahusay ang iyong karanasan sa pag-aaral, makipag-ugnayan sa iyong mga kapwa mag-aaral upang magtulungan sa mga proyekto! Ang mga talakayan ay hinihikayat sa aming [discussion forum](https://github.com/microsoft/Web-Dev-For-Beginners/discussions) kung saan ang aming team ng mga moderator ay magagamit upang sagutin ang iyong mga tanong.
Upang mapahusay ang inyong karanasan sa pag-aaral, makipag-ugnayan sa inyong mga kapwa mag-aaral upang magtulungan sa mga proyekto! Ang mga talakayan ay hinihikayat sa aming [discussion forum](https://github.com/microsoft/Web-Dev-For-Beginners/discussions) kung saan ang aming team ng mga moderator ay handang sagutin ang inyong mga tanong.
Upang higit pang mapalawak ang iyong edukasyon, lubos naming inirerekomenda ang pag-explore sa [Microsoft Learn](https://learn.microsoft.com/users/wirelesslife/collections/p1ddcy5jwy0jkm?WT.mc_id=academic-77807-sagibbon) para sa karagdagang mga materyales sa pag-aaral.
Upang higit pang mapalawak ang inyong kaalaman, lubos naming inirerekomenda ang pag-explore sa [Microsoft Learn](https://learn.microsoft.com/users/wirelesslife/collections/p1ddcy5jwy0jkm?WT.mc_id=academic-77807-sagibbon) para sa karagdagang mga materyales sa pag-aaral.
### 📋 Pag-set up ng iyong environment
### 📋 Pagsasaayos ng iyong kapaligiran
Ang kurikulum na ito ay may development environment na handa na! Sa pagsisimula, maaari mong piliin na patakbuhin ang kurikulum sa isang [Codespace](https://github.com/features/codespaces/) (_isang browser-based, walang kailangang i-install na environment_), o lokal sa iyong computer gamit ang isang text editor tulad ng [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon).
Ang kurikulum na ito ay may handang development environment! Sa pagsisimula, maaari kang pumili na patakbuhin ang kurikulum sa isang [Codespace](https://github.com/features/codespaces/) (_isang browser-based, walang kailangang i-install na environment_), o lokal sa iyong computer gamit ang isang text editor tulad ng [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon).
#### Gumawa ng iyong repository
Upang madali mong mai-save ang iyong trabaho, inirerekomenda na gumawa ka ng sarili mong kopya ng repository na ito. Maaari mo itong gawin sa pamamagitan ng pag-click sa **Use this template** button sa itaas ng pahina. Ito ay gagawa ng bagong repository sa iyong GitHub account na may kopya ng kurikulum.
#### Gumawa ng iyong repository
Upang madali mong mai-save ang iyong trabaho, inirerekomenda na gumawa ka ng sariling kopya ng repository na ito. Magagawa mo ito sa pamamagitan ng pag-click sa **Use this template** na button sa itaas ng pahina. Ito ay lilikha ng bagong repository sa iyong GitHub account na may kopya ng kurikulum.
Sundin ang mga hakbang na ito:
1. **I-fork ang Repository**: I-click ang "Fork" button sa kanang-itaas na bahagi ng pahinang ito.
2. **I-clone ang Repository**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git`
Sundin ang mga hakbang na ito:
1. **I-Fork ang Repository**: I-click ang "Fork" button sa kanang itaas na bahagi ng pahinang ito.
2. **I-Clone ang Repository**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git`
#### Pagpapatakbo ng kurikulum sa isang Codespace
#### Pagpapatakbo ng kurikulum sa isang Codespace
Sa iyong kopya ng repository na ginawa mo, i-click ang **Code** button at piliin ang **Open with Codespaces**. Ito ay gagawa ng bagong Codespace para sa iyo upang magtrabaho.
Sa iyong kopya ng repository na iyong ginawa, i-click ang **Code** button at piliin ang **Open with Codespaces**. Ito ay lilikha ng bagong Codespace para sa iyo upang magtrabaho.
#### Pagpapatakbo ng kurikulum lokal sa iyong computer
#### Pagpapatakbo ng kurikulum nang lokal sa iyong computer
Upang patakbuhin ang kurikulum na ito lokal sa iyong computer, kakailanganin mo ng text editor, browser, at command line tool. Ang aming unang aralin, [Introduction to Programming Languages and Tools of the Trade](../../1-getting-started-lessons/1-intro-to-programming-languages), ay magpapaliwanag sa iba't ibang opsyon para sa bawat isa sa mga tool na ito upang mapili mo kung ano ang pinakamainam para sa iyo.
Upang patakbuhin ang kurikulum na ito nang lokal sa iyong computer, kakailanganin mo ng text editor, browser, at command line tool. Ang aming unang aralin, [Introduction to Programming Languages and Tools of the Trade](../../1-getting-started-lessons/1-intro-to-programming-languages), ay magpapaliwanag ng iba't ibang opsyon para sa bawat isa sa mga tool na ito upang makapili ka ng pinakaangkop para sa iyo.
Ang aming rekomendasyon ay gamitin ang [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) bilang iyong editor, na mayroon ding built-in na [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon). Maaari mong i-download ang Visual Studio Code [dito](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon).
Ang aming rekomendasyon ay gamitin ang [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) bilang iyong editor, na mayroon ding built-in na [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon). Maaari mong i-download ang Visual Studio Code [dito](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon).
1. I-clone ang iyong repository sa iyong computer. Maaari mo itong gawin sa pamamagitan ng pag-click sa **Code** button at pagkopya ng URL:
1. I-clone ang iyong repository sa iyong computer. Magagawa mo ito sa pamamagitan ng pag-click sa **Code** button at pagkopya ng URL:
[CodeSpace](./images/createcodespace.png)
[CodeSpace](./images/createcodespace.png)
Pagkatapos, buksan ang [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) sa loob ng [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) at patakbuhin ang sumusunod na command, palitan ang `<your-repository-url>` ng URL na kinopya mo:
Pagkatapos, buksan ang [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) sa loob ng [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) at patakbuhin ang sumusunod na command, palitan ang `<your-repository-url>` ng URL na iyong kinopya:
```bash
git clone <your-repository-url>
```
2. Buksan ang folder sa Visual Studio Code. Magagawa mo ito sa pamamagitan ng pag-click sa **File** > **Open Folder** at piliin ang folder na iyong na-clone.
2. Buksan ang folder sa Visual Studio Code. Maaari mo itong gawin sa pamamagitan ng pag-click sa **File** > **Open Folder** at piliin ang folder na kinopya mo.
> Mga inirerekomendang Visual Studio Code extensions:
>
> * [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer&WT.mc_id=academic-77807-sagibbon) - para ma-preview ang mga HTML page sa loob ng Visual Studio Code
> * [Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot&WT.mc_id=academic-77807-sagibbon) - para makatulong sa mas mabilis na paggawa ng code
> Inirerekomendang mga extension para sa Visual Studio Code:
>
> * [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer&WT.mc_id=academic-77807-sagibbon) - upang ma-preview ang mga HTML page sa loob ng Visual Studio Code
> * [Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot&WT.mc_id=academic-77807-sagibbon) - para tulungan kang magsulat ng code nang mas mabilis
## 📂 Bawat aralin ay naglalaman ng:
- opsyonal na sketchnote
- opsyonal na karagdagang video
- warmup quiz bago ang aralin
- paunang pagsusulit bago ang aralin
- nakasulat na aralin
- para sa mga araling nakabase sa proyekto, step-by-step na gabay kung paano buuin ang proyekto
- para sa mga araling nakabatay sa proyekto, mga gabay na hakbang-hakbang kung paano buuin ang proyekto
- pagsusuri ng kaalaman
- isang hamon
- karagdagang babasahin
- takdang-aralin
- [quiz pagkatapos ng aralin](https://ff-quizzes.netlify.app/web/)
- [pagsusulit pagkatapos ng aralin](https://ff-quizzes.netlify.app/web/)
> **Tungkol sa mga quiz**: Ang lahat ng quiz ay nasa folder ng Quiz-app, kabuuang 48 quiz na may tig-tatlong tanong bawat isa. Makikita ang mga ito [dito](https://ff-quizzes.netlify.app/web/) at maaaring patakbuhin ang quiz app nang lokal o i-deploy sa Azure; sundin ang mga tagubilin sa folder na `quiz-app`.
> **Tungkol sa mga pagsusulit**: Ang lahat ng pagsusulit ay nasa folder ng Quiz-app, kabuuang 48 pagsusulit na may tig-tatlong tanong bawat isa. Makukuha ang mga ito [dito](https://ff-quizzes.netlify.app/web/) at maaaring patakbuhin ang quiz app nang lokal o i-deploy sa Azure; sundin ang mga tagubilin sa folder na `quiz-app`.
## 🗃️ Mga Aralin
| | Pangalan ng Proyekto | Mga Konseptong Itinuturo | Mga Layunin sa Pagkatuto | Nakakabit na Aralin | May-akda |
| 01 | Pagsisimula | Panimula sa Programming at Mga Kasangkapan sa Trabaho | Matutunan ang mga pangunahing pundasyon ng karamihan sa mga programming language at ang software na tumutulong sa mga propesyonal na developer sa kanilang trabaho | [Panimula sa Programming Languages at Mga Kasangkapan sa Trabaho](./1-getting-started-lessons/1-intro-to-programming-languages/README.md) | Jasmine |
| 02 | Pagsisimula | Mga Pangunahing Kaalaman sa GitHub, kabilang ang pakikipagtulungan sa isang team | Paano gamitin ang GitHub sa iyong proyekto, paano makipagtulungan sa iba sa isang code base | [Panimula sa GitHub](./1-getting-started-lessons/2-github-basics/README.md) | Floor |
| 01 | Pagsisimula | Panimula sa Programming at Mga Kasangkapan sa Trabaho | Matutunan ang mga pangunahing pundasyon sa likod ng karamihan sa mga programming language at tungkol sa software na tumutulong sa mga propesyonal na developer sa kanilang trabaho | [Panimula sa Programming Languages at Mga Kasangkapan sa Trabaho](./1-getting-started-lessons/1-intro-to-programming-languages/README.md) | Jasmine |
| 02 | Pagsisimula | Mga Pangunahing Kaalaman sa GitHub, kabilang ang pakikipagtulungan sa isang koponan | Paano gamitin ang GitHub sa iyong proyekto, paano makipagtulungan sa iba sa isang code base | [Panimula sa GitHub](./1-getting-started-lessons/2-github-basics/README.md) | Floor |
| 03 | Pagsisimula | Accessibility | Matutunan ang mga pangunahing kaalaman sa web accessibility | [Mga Pangunahing Kaalaman sa Accessibility](./1-getting-started-lessons/3-accessibility/README.md) | Christopher |
| 04 | Mga Pangunahing Kaalaman sa JS | Mga Uri ng Data sa JavaScript | Ang mga pangunahing kaalaman sa mga uri ng data sa JavaScript | [Mga Uri ng Data](./2-js-basics/1-data-types/README.md) | Jasmine |
| 05 | Mga Pangunahing Kaalaman sa JS | Mga Function at Method | Matutunan ang tungkol sa mga function at method para pamahalaan ang daloy ng lohika ng isang application | [Mga Function at Method](./2-js-basics/2-functions-methods/README.md) | Jasmine at Christopher |
| 05 | Mga Pangunahing Kaalaman sa JS | Mga Function at Method | Matutunan ang tungkol sa mga function at method upang pamahalaan ang daloy ng lohika ng isang application | [Mga Function at Method](./2-js-basics/2-functions-methods/README.md) | Jasmine at Christopher |
| 06 | Mga Pangunahing Kaalaman sa JS | Paggawa ng Desisyon gamit ang JS | Matutunan kung paano gumawa ng mga kondisyon sa iyong code gamit ang mga pamamaraan sa paggawa ng desisyon | [Paggawa ng Desisyon](./2-js-basics/3-making-decisions/README.md) | Jasmine |
| 07 | Mga Pangunahing Kaalaman sa JS | Mga Array at Loop | Paggamit ng data gamit ang mga array at loop sa JavaScript | [Mga Array at Loop](./2-js-basics/4-arrays-loops/README.md) | Jasmine |
| 08 | [Terrarium](./3-terrarium/solution/README.md) | HTML sa Praktika | Bumuo ng HTML para lumikha ng isang online terrarium, na nakatuon sa paggawa ng layout | [Panimula sa HTML](./3-terrarium/1-intro-to-html/README.md) | Jen |
| 09 | [Terrarium](./3-terrarium/solution/README.md) | CSS sa Praktika | Bumuo ng CSS para i-style ang online terrarium, na nakatuon sa mga pangunahing kaalaman sa CSS kabilang ang paggawa ng responsive na pahina | [Panimula sa CSS](./3-terrarium/2-intro-to-css/README.md) | Jen |
| 10 | [Terrarium](./3-terrarium/solution/README.md) | Mga JavaScript Closures, Manipulasyon ng DOM | Bumuo ng JavaScript para gawing drag/drop interface ang terrarium, na nakatuon sa closures at manipulasyon ng DOM | [Mga JavaScript Closures, Manipulasyon ng DOM](./3-terrarium/3-intro-to-DOM-and-closures/README.md) | Jen |
| 11 | [Typing Game](./4-typing-game/solution/README.md) | Bumuo ng Typing Game | Matutunan kung paano gamitin ang mga keyboard event para patakbuhin ang lohika ng iyong JavaScript app | [Event-Driven Programming](./4-typing-game/typing-game/README.md) | Christopher |
| 12 | [Green Browser Extension](./5-browser-extension/solution/README.md) | Paggamit ng Mga Browser | Matutunan kung paano gumagana ang mga browser, ang kanilang kasaysayan, at kung paano i-scaffold ang mga unang elemento ng isang browser extension | [Tungkol sa Mga Browser](./5-browser-extension/1-about-browsers/README.md) | Jen |
| 13 | [Green Browser Extension](./5-browser-extension/solution/README.md) | Pagbuo ng form, pagtawag sa API at pag-iimbak ng mga variable sa local storage | Bumuo ng mga elemento ng JavaScript ng iyong browser extension para tumawag sa API gamit ang mga variable na nakaimbak sa local storage | [Mga API, Form, at Local Storage](./5-browser-extension/2-forms-browsers-local-storage/README.md) | Jen |
| 14 | [Green Browser Extension](./5-browser-extension/solution/README.md) | Mga background process sa browser, pagganap ng web | Gamitin ang mga background process ng browser para pamahalaan ang icon ng extension; matutunan ang tungkol sa pagganap ng web at ilang mga optimization upang mapabuti ito | [Mga Background Task at Pagganap](./5-browser-extension/3-background-tasks-and-performance/README.md) | Jen |
| 15 | [Space Game](./6-space-game/solution/README.md) | Mas Advanced na Pagbuo ng Laro gamit ang JavaScript | Matutunan ang tungkol sa Inheritance gamit ang parehong Classes at Composition at ang Pub/Sub pattern, bilang paghahanda sa pagbuo ng laro | [Panimula sa Advanced na Pagbuo ng Laro](./6-space-game/1-introduction/README.md) | Chris |
| 16 | [Space Game](./6-space-game/solution/README.md) | Pag-drawing sa canvas | Matutunan ang tungkol sa Canvas API, na ginagamit para mag-drawing ng mga elemento sa screen | [Pag-drawing sa Canvas](./6-space-game/2-drawing-to-canvas/README.md) | Chris |
| 17 | [Space Game](./6-space-game/solution/README.md) | Paggalaw ng mga elemento sa screen | Tuklasin kung paano makakakuha ng motion ang mga elemento gamit ang cartesian coordinates at ang Canvas API | [Paggalaw ng mga Elemento](./6-space-game/3-moving-elements-around/README.md) | Chris |
| 18 | [Space Game](./6-space-game/solution/README.md) | Pagtukoy ng banggaan | Gawin ang mga elemento na magbanggaan at mag-react sa isa't isa gamit ang keypresses at magbigay ng cooldown function para matiyak ang pagganap ng laro | [Pagtukoy ng Banggaan](./6-space-game/4-collision-detection/README.md) | Chris |
| 19 | [Space Game](./6-space-game/solution/README.md) | Pagpapanatili ng score | Gumawa ng mga kalkulasyon sa matematika batay sa status at pagganap ng laro | [Pagpapanatili ng Score](./6-space-game/5-keeping-score/README.md) | Chris |
| 07 | Mga Pangunahing Kaalaman sa JS | Mga Array at Loop | Magtrabaho gamit ang data gamit ang mga array at loop sa JavaScript | [Mga Array at Loop](./2-js-basics/4-arrays-loops/README.md) | Jasmine |
| 08 | [Terrarium](./3-terrarium/solution/README.md) | HTML sa Praktika | Bumuo ng HTML upang lumikha ng isang online na terrarium, na nakatuon sa paggawa ng layout | [Panimula sa HTML](./3-terrarium/1-intro-to-html/README.md) | Jen |
| 09 | [Terrarium](./3-terrarium/solution/README.md) | CSS sa Praktika | Bumuo ng CSS upang i-style ang online na terrarium, na nakatuon sa mga pangunahing kaalaman sa CSS kabilang ang paggawa ng page na responsive | [Panimula sa CSS](./3-terrarium/2-intro-to-css/README.md) | Jen |
| 10 | [Terrarium](./3-terrarium/solution/README.md) | Mga JavaScript Closures, DOM Manipulation | Bumuo ng JavaScript upang gawing drag/drop interface ang terrarium, na nakatuon sa closures at DOM manipulation | [Mga JavaScript Closures, DOM Manipulation](./3-terrarium/3-intro-to-DOM-and-closures/README.md) | Jen |
| 11 | [Typing Game](./4-typing-game/solution/README.md) | Bumuo ng Typing Game | Matutunan kung paano gamitin ang mga keyboard event upang magmaneho ng lohika ng iyong JavaScript app | [Event-Driven Programming](./4-typing-game/typing-game/README.md) | Christopher |
| 12 | [Green Browser Extension](./5-browser-extension/solution/README.md) | Paggawa gamit ang Mga Browser | Matutunan kung paano gumagana ang mga browser, ang kanilang kasaysayan, at kung paano i-scaffold ang mga unang elemento ng isang browser extension | [Tungkol sa Mga Browser](./5-browser-extension/1-about-browsers/README.md) | Jen |
| 13 | [Green Browser Extension](./5-browser-extension/solution/README.md) | Paggawa ng form, pagtawag sa API at pag-iimbak ng mga variable sa local storage | Bumuo ng mga elemento ng JavaScript ng iyong browser extension upang tumawag sa API gamit ang mga variable na nakaimbak sa local storage | [Mga API, Form, at Local Storage](./5-browser-extension/2-forms-browsers-local-storage/README.md) | Jen |
| 14 | [Green Browser Extension](./5-browser-extension/solution/README.md) | Mga proseso sa background sa browser, web performance | Gamitin ang mga proseso sa background ng browser upang pamahalaan ang icon ng extension; matutunan ang tungkol sa web performance at ilang mga optimization upang mapabuti | [Mga Background Task at Performance](./5-browser-extension/3-background-tasks-and-performance/README.md) | Jen |
| 15 | [Space Game](./6-space-game/solution/README.md) | Mas Advanced na Game Development gamit ang JavaScript | Matutunan ang tungkol sa Inheritance gamit ang parehong Classes at Composition at ang Pub/Sub pattern, bilang paghahanda sa paggawa ng laro | [Panimula sa Advanced Game Development](./6-space-game/1-introduction/README.md) | Chris |
| 16 | [Space Game](./6-space-game/solution/README.md) | Pag-drawing sa canvas | Matutunan ang tungkol sa Canvas API, na ginagamit upang mag-drawing ng mga elemento sa screen | [Pag-drawing sa Canvas](./6-space-game/2-drawing-to-canvas/README.md) | Chris |
| 17 | [Space Game](./6-space-game/solution/README.md) | Paggalaw ng mga elemento sa screen | Tuklasin kung paano makakakuha ng galaw ang mga elemento gamit ang cartesian coordinates at ang Canvas API | [Paggalaw ng mga Elemento](./6-space-game/3-moving-elements-around/README.md) | Chris |
| 18 | [Space Game](./6-space-game/solution/README.md) | Pagtukoy ng banggaan | Gawing magbanggaan at mag-react ang mga elemento sa isa't isa gamit ang keypresses at magbigay ng cooldown function upang matiyak ang performance ng laro | [Pagtukoy ng Banggaan](./6-space-game/4-collision-detection/README.md) | Chris |
| 19 | [Space Game](./6-space-game/solution/README.md) | Pagpapanatili ng score | Gumawa ng mga kalkulasyon sa matematika batay sa status at performance ng laro | [Pagpapanatili ng Score](./6-space-game/5-keeping-score/README.md) | Chris |
| 20 | [Space Game](./6-space-game/solution/README.md) | Pagtatapos at pag-restart ng laro | Matutunan ang tungkol sa pagtatapos at pag-restart ng laro, kabilang ang paglilinis ng mga asset at pag-reset ng mga halaga ng variable | [Kondisyon ng Pagtatapos](./6-space-game/6-end-condition/README.md) | Chris |
| 21 | [Banking App](./7-bank-project/solution/README.md) | Mga HTML Template at Route sa isang Web App | Matutunan kung paano gumawa ng scaffold ng arkitektura ng isang multipage website gamit ang routing at HTML template | [Mga HTML Template at Route](./7-bank-project/1-template-route/README.md) | Yohan |
| 22 | [Banking App](./7-bank-project/solution/README.md) | Pagbuo ng Login at Registration Form | Matutunan ang tungkol sa pagbuo ng mga form at paghawak ng mga validation routine | [Mga Form](./7-bank-project/2-forms/README.md) | Yohan |
| 23 | [Banking App](./7-bank-project/solution/README.md) | Mga Pamamaraan ng Pagkuha at Paggamit ng Data | Paano dumadaloy ang data papasok at palabas ng iyong app, paano ito kunin, iimbak, at itapon | [Data](./7-bank-project/3-data/README.md) | Yohan |
| 24 | [Banking App](./7-bank-project/solution/README.md) | Mga Konsepto ng State Management | Matutunan kung paano pinapanatili ng iyong app ang estado nito at kung paano ito pamahalaan sa pamamagitan ng programa | [State Management](./7-bank-project/4-state-management/README.md) | Yohan |
| 25 | [Browser/VScode Code](../../8-code-editor) | Paggamit ng VScode | Matutunan kung paano gamitin ang code editor| [Gamitin ang VScode Code Editor](./8-code-editor/1-using-a-code-editor/README.md) | Chris |
| 26 | [AI Assistants](./9-chat-project/README.md) | Paggamit ng AI | Matutunan kung paano bumuo ng sarili mong AI assistant | [AI Assistant project](./9-chat-project/README.md) | Chris |
| 21 | [Banking App](./7-bank-project/solution/README.md) | Mga HTML Template at Route sa Web App | Matutunan kung paano gumawa ng scaffold ng arkitektura ng isang multipage website gamit ang routing at HTML template | [Mga HTML Template at Route](./7-bank-project/1-template-route/README.md) | Yohan |
| 22 | [Banking App](./7-bank-project/solution/README.md) | Bumuo ng Login at Registration Form | Matutunan ang tungkol sa paggawa ng mga form at paghawak ng mga validation routine | [Mga Form](./7-bank-project/2-forms/README.md) | Yohan |
| 23 | [Banking App](./7-bank-project/solution/README.md) | Mga Paraan ng Pagkuha at Paggamit ng Data | Paano dumadaloy ang data papasok at palabas ng iyong app, paano ito kunin, iimbak, at itapon | [Data](./7-bank-project/3-data/README.md) | Yohan |
| 24 | [Banking App](./7-bank-project/solution/README.md) | Mga Konsepto ng State Management | Matutunan kung paano pinapanatili ng iyong app ang estado at kung paano ito pamahalaan sa programmatically | [State Management](./7-bank-project/4-state-management/README.md) | Yohan |
| 25 | [Browser/VScode Code](../../8-code-editor) | Paggawa gamit ang VScode | Matutunan kung paano gamitin ang code editor| [Gamitin ang VScode Code Editor](./8-code-editor/1-using-a-code-editor/README.md) | Chris |
| 26 | [AI Assistants](./9-chat-project/README.md) | Paggawa gamit ang AI | Matutunan kung paano bumuo ng sarili mong AI assistant | [AI Assistant project](./9-chat-project/README.md) | Chris |
## 🏫 Pedagohiya
Ang aming kurikulum ay idinisenyo gamit ang dalawang pangunahing prinsipyo ng pedagohiya:
* pagkatuto na nakabase sa proyekto
* madalas na mga quiz
Ang aming kurikulum ay dinisenyo gamit ang dalawang pangunahing prinsipyo ng pedagohiya:
* pagkatuto na nakabatay sa proyekto
* madalas na pagsusulit
Ang programa ay nagtuturo ng mga pundasyon ng JavaScript, HTML, at CSS, pati na rin ang mga pinakabagong kasangkapan at teknik na ginagamit ng mga web developer ngayon. Magkakaroon ng pagkakataon ang mga estudyante na magkaroon ng hands-on na karanasan sa pamamagitan ng pagbuo ng typing game, virtual terrarium, eco-friendly browser extension, space-invader-style na laro, at banking app para sa mga negosyo. Sa pagtatapos ng serye, magkakaroon ang mga estudyante ng matibay na kaalaman sa web development.
Ang programa ay nagtuturo ng mga pundasyon ng JavaScript, HTML, at CSS, pati na rin ang mga pinakabagong kasangkapan at teknik na ginagamit ng mga web developer ngayon. Magkakaroon ang mga mag-aaral ng pagkakataon na magkaroon ng hands-on na karanasan sa pamamagitan ng paggawa ng typing game, virtual terrarium, eco-friendly browser extension, space-invader-style na laro, at banking app para sa mga negosyo. Sa pagtatapos ng serye, magkakaroon ang mga mag-aaral ng matibay na pag-unawa sa web development.
> 🎓 Maaari mong kunin ang unang ilang aralin sa kurikulum na ito bilang isang [Learn Path](https://docs.microsoft.com/learn/paths/web-development-101/?WT.mc_id=academic-77807-sagibbon) sa Microsoft Learn!
Sa pamamagitan ng pagtiyak na ang nilalaman ay naaayon sa mga proyekto, ang proseso ay nagiging mas nakakaengganyo para sa mga estudyante at ang pagkatuto ng mga konsepto ay mas mapapalakas. Nagsulat din kami ng ilang mga panimulang aralin sa mga pangunahing kaalaman sa JavaScript upang ipakilala ang mga konsepto, na sinamahan ng isang video mula sa "[Beginners Series to: JavaScript](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript/?WT.mc_id=academic-77807-sagibbon)" na koleksyon ng mga video tutorial, ang ilan sa mga may-akda nito ay nag-ambag sa kurikulum na ito.
Sa pamamagitan ng pagtiyak na ang nilalaman ay naaayon sa mga proyekto, ang proseso ay nagiging mas nakakaengganyo para sa mga mag-aaral at ang pagkatuto ng mga konsepto ay mas mapapalakas. Nagsulat din kami ng ilang mga panimulang aralin sa mga pangunahing kaalaman sa JavaScript upang ipakilala ang mga konsepto, na ipinares sa isang video mula sa "[Beginners Series to: JavaScript](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript/?WT.mc_id=academic-77807-sagibbon)" na koleksyon ng mga video tutorial, ang ilan sa mga may-akda nito ay nag-ambag sa kurikulum na ito.
Bukod dito, ang isang mababang-stakes na quiz bago ang klase ay nagtatakda ng intensyon ng estudyante patungo sa pag-aaral ng isang paksa, habang ang pangalawang quiz pagkatapos ng klase ay mas nagpapalakas ng retention. Ang kurikulum na ito ay idinisenyo upang maging flexible at masaya at maaaring kunin nang buo o bahagi lamang. Ang mga proyekto ay nagsisimula sa maliit at nagiging mas kumplikado sa pagtatapos ng 12-linggong siklo.
Bukod dito, ang isang mababang-panganib na pagsusulit bago ang klase ay nagtatakda ng intensyon ng mag-aaral patungo sa pag-aaral ng isang paksa, habang ang pangalawang pagsusulit pagkatapos ng klase ay mas nagpapalakas ng pagkatuto. Ang kurikulum na ito ay dinisenyo upang maging flexible at masaya at maaaring kunin nang buo o bahagi lamang. Ang mga proyekto ay nagsisimula sa maliit at nagiging mas kumplikado sa pagtatapos ng 12-linggong siklo.
Habang sinadya naming iwasan ang pagpapakilala ng mga JavaScript framework upang magtuon sa mga pangunahing kasanayan na kinakailangan bilang isang web developer bago mag-adopt ng framework, isang magandang susunod na hakbang pagkatapos makumpleto ang kurikulum na ito ay ang pag-aaral tungkol sa Node.js sa pamamagitan ng isa pang koleksyon ng mga video: "[Beginner Series to: Node.js](https://channel9.msdn.com/Series/Beginners-Series-to-Nodejs/?WT.mc_id=academic-77807-sagibbon)".
Habang sinadya naming iwasan ang pagpapakilala ng mga JavaScript framework upang magtuon sa mga pangunahing kasanayan na kinakailangan bilang isang web developer bago magpatibay ng framework, ang isang magandang susunod na hakbang pagkatapos makumpleto ang kurikulum na ito ay ang pag-aaral tungkol sa Node.js sa pamamagitan ng isa pang koleksyon ng mga video: "[Beginner Series to: Node.js](https://channel9.msdn.com/Series/Beginners-Series-to-Nodejs/?WT.mc_id=academic-77807-sagibbon)".
> Bisitahin ang aming [Code of Conduct](CODE_OF_CONDUCT.md) at [Contributing](CONTRIBUTING.md) na mga alituntunin. Malugod naming tinatanggap ang inyong mga nakabubuong feedback!
> Bisitahin ang aming [Code of Conduct](CODE_OF_CONDUCT.md) at [Contributing](CONTRIBUTING.md) na mga alituntunin. Malugod naming tinatanggap ang iyong nakabubuong feedback!
## 🧭 Offline na access
@ -203,18 +203,18 @@ Ang PDF ng lahat ng mga aralin ay makikita [dito](https://microsoft.github.io/We
## 🎒 Iba Pang Kurso
Ang aming team ay gumagawa ng iba pang mga kurso! Tingnan:
Ang aming koponan ay gumagawa ng iba pang mga kurso! Tingnan:
### Azure / Edge / MCP / Agents
[](https://github.com/microsoft/AZD-for-beginners?WT.mc_id=academic-105485-koreyst)
[](https://github.com/microsoft/edgeai-for-beginners?WT.mc_id=academic-105485-koreyst)
[](https://github.com/microsoft/mcp-for-beginners?WT.mc_id=academic-105485-koreyst)
[](https://github.com/microsoft/ai-agents-for-beginners?WT.mc_id=academic-105485-koreyst)
[](https://github.com/microsoft/edgeai-for-beginners?WT.mc_id=academic-105485-koreyst)
[](https://github.com/microsoft/mcp-for-beginners?WT.mc_id=academic-105485-koreyst)
[](https://github.com/microsoft/ai-agents-for-beginners?WT.mc_id=academic-105485-koreyst)
---
### Serye ng Generative AI
[](https://github.com/microsoft/generative-ai-for-beginners?WT.mc_id=academic-105485-koreyst)
### Generative AI Series
[](https://github.com/microsoft/generative-ai-for-beginners?WT.mc_id=academic-105485-koreyst)
[-9333EA?style=for-the-badge&labelColor=E5E7EB&color=9333EA)](https://github.com/microsoft/Generative-AI-for-beginners-dotnet?WT.mc_id=academic-105485-koreyst)
[-C084FC?style=for-the-badge&labelColor=E5E7EB&color=C084FC)](https://github.com/microsoft/generative-ai-for-beginners-java?WT.mc_id=academic-105485-koreyst)
[-E879F9?style=for-the-badge&labelColor=E5E7EB&color=E879F9)](https://github.com/microsoft/generative-ai-with-javascript?WT.mc_id=academic-105485-koreyst)
@ -222,37 +222,38 @@ Ang aming team ay gumagawa ng iba pang mga kurso! Tingnan:
---
### Pangunahing Pag-aaral
[](https://aka.ms/ml-beginners?WT.mc_id=academic-105485-koreyst)
[](https://aka.ms/datascience-beginners?WT.mc_id=academic-105485-koreyst)
[](https://aka.ms/ai-beginners?WT.mc_id=academic-105485-koreyst)
[](https://github.com/microsoft/Security-101?WT.mc_id=academic-96948-sayoung)
[](https://aka.ms/webdev-beginners?WT.mc_id=academic-105485-koreyst)
[](https://aka.ms/iot-beginners?WT.mc_id=academic-105485-koreyst)
[](https://github.com/microsoft/xr-development-for-beginners?WT.mc_id=academic-105485-koreyst)
[](https://aka.ms/ml-beginners?WT.mc_id=academic-105485-koreyst)
[](https://aka.ms/datascience-beginners?WT.mc_id=academic-105485-koreyst)
[](https://aka.ms/ai-beginners?WT.mc_id=academic-105485-koreyst)
[](https://github.com/microsoft/Security-101?WT.mc_id=academic-96948-sayoung)
[](https://aka.ms/webdev-beginners?WT.mc_id=academic-105485-koreyst)
[](https://aka.ms/iot-beginners?WT.mc_id=academic-105485-koreyst)
[](https://github.com/microsoft/xr-development-for-beginners?WT.mc_id=academic-105485-koreyst)
---
### Serye ng Copilot
[](https://aka.ms/GitHubCopilotAI?WT.mc_id=academic-105485-koreyst)
[](https://github.com/microsoft/mastering-github-copilot-for-dotnet-csharp-developers?WT.mc_id=academic-105485-koreyst)
### Copilot Series
[](https://aka.ms/GitHubCopilotAI?WT.mc_id=academic-105485-koreyst)
[](https://github.com/microsoft/mastering-github-copilot-for-dotnet-csharp-developers?WT.mc_id=academic-105485-koreyst)
Kung ikaw ay nahihirapan o may mga tanong tungkol sa paggawa ng mga AI apps, sumali sa:
Kung ikaw ay nahihirapan o may mga katanungan tungkol sa paggawa ng mga AI apps, sumali sa mga kapwa mag-aaral at mga bihasang developer sa mga talakayan tungkol sa MCP. Isa itong suportadong komunidad kung saan malugod na tinatanggap ang mga tanong at malayang ibinabahagi ang kaalaman.
[](https://aka.ms/foundry/discord)
Kung ikaw ay may feedback sa produkto o nakakaranas ng mga error habang gumagawa, bisitahin:
Kung mayroon kang feedback sa produkto o mga error habang gumagawa, bisitahin:
[](https://aka.ms/foundry/forum)
Ang repository na ito ay lisensyado sa ilalim ng MIT license. Tingnan ang [LICENSE](../../LICENSE) file para sa karagdagang impormasyon.
Ang repositoryong ito ay lisensyado sa ilalim ng MIT license. Tingnan ang [LICENSE](../../LICENSE) file para sa karagdagang impormasyon.
---
<!-- CO-OP TRANSLATOR DISCLAIMER START -->
**Paunawa**:
Ang dokumentong ito ay isinalin gamit ang AI translation service na [Co-op Translator](https://github.com/Azure/co-op-translator). Bagama't sinisikap naming maging tumpak, mangyaring tandaan na ang mga awtomatikong pagsasalin ay maaaring maglaman ng mga pagkakamali o hindi pagkakatugma. Ang orihinal na dokumento sa kanyang katutubong wika ang dapat ituring na mapagkakatiwalaang pinagmulan. Para sa mahalagang impormasyon, inirerekomenda ang propesyonal na pagsasalin ng tao. Hindi kami mananagot sa anumang hindi pagkakaunawaan o maling interpretasyon na dulot ng paggamit ng pagsasaling ito.
Ang dokumentong ito ay isinalin gamit ang AI translation service [Co-op Translator](https://github.com/Azure/co-op-translator). Bagamat sinisikap naming maging tumpak, mangyaring tandaan na ang mga awtomatikong pagsasalin ay maaaring maglaman ng mga pagkakamali o hindi pagkakatugma. Ang orihinal na dokumento sa kanyang katutubong wika ang dapat ituring na mapagkakatiwalaang pinagmulan. Para sa mahalagang impormasyon, inirerekomenda ang propesyonal na pagsasalin ng tao. Hindi kami mananagot sa anumang hindi pagkakaunawaan o maling interpretasyon na dulot ng paggamit ng pagsasaling ito.
مائیکروسافٹ کلاؤڈ ایڈووکیٹس کے 12 ہفتوں کے جامع کورس کے ذریعے ویب ڈیولپمنٹ کے بنیادی اصول سیکھیں۔ ہر ایک 24 اسباق جاوا اسکرپٹ، سی ایس ایس، اور ایچ ٹی ایم ایل کو عملی منصوبوں جیسے کہ ٹیراریئم، براؤزر ایکسٹینشنز، اور اسپیس گیمز کے ذریعے سکھاتے ہیں۔ کوئزز، مباحثے، اور عملی اسائنمنٹس کے ذریعے مشغول ہوں۔ اپنی مہارتوں کو بہتر بنائیں اور ہمارے مؤثر پروجیکٹ پر مبنی تدریسی طریقہ کار کے ساتھ اپنے علم کو بہتر بنائیں۔ آج ہی اپنے کوڈنگ کے سفر کا آغاز کریں!
مائیکروسافٹ کلاؤڈ ایڈووکیٹس کے 12 ہفتوں کے جامع کورس کے ساتھ ویب ڈیولپمنٹ کی بنیادی باتیں سیکھیں۔ 24 اسباق میں سے ہر ایک جاوا اسکرپٹ، سی ایس ایس، اور ایچ ٹی ایم ایل کو عملی منصوبوں جیسے ٹیراریئمز، براؤزر ایکسٹینشنز، اور اسپیس گیمز کے ذریعے سکھاتا ہے۔ کوئزز، مباحثے، اور عملی اسائنمنٹس کے ساتھ شامل ہوں۔ اپنی مہارتوں کو بہتر بنائیں اور ہمارے مؤثر پروجیکٹ پر مبنی طریقہ کار کے ساتھ اپنے علم کو بہتر بنائیں۔ آج ہی اپنے کوڈنگ کے سفر کا آغاز کریں!
Azure AI Foundry Discord کمیونٹی میں شامل ہوں
[](https://discord.com/invite/ByRwuEEgH4)
**اگر آپ اضافی زبانوں کی ترجمہ کی حمایت چاہتے ہیں تو یہاں درج ہیں [یہاں](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) موجود ہے۔**
[](https://open.vscode.dev/microsoft/Web-Dev-For-Beginners)
#### 🧑🎓 _کیا آپ طالب علم ہیں؟_
[**Student Hub صفحہ**](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 Challenge 🚀" کو زیادہ تر ابواب میں تلاش کریں۔ یہ ایک نیا چیلنج ہے جسے آپ GitHub Copilot اور Agent موڈ کا استعمال کرتے ہوئے مکمل کر سکتے ہیں۔ اگر آپ نے پہلے Agent موڈ استعمال نہیں کیا ہے تو یہ نہ صرف متن تیار کرنے کی صلاحیت رکھتا ہے بلکہ فائلیں بنانے اور ترمیم کرنے، کمانڈز چلانے اور مزید کام کرنے کی صلاحیت بھی رکھتا ہے۔
نیا چیلنج شامل کیا گیا ہے، زیادہ تر ابواب میں "GitHub Copilot Agent Challenge 🚀" تلاش کریں۔ یہ ایک نیا چیلنج ہے جو آپ GitHub Copilot اور Agent موڈ کا استعمال کرتے ہوئے مکمل کر سکتے ہیں۔ اگر آپ نے پہلے Agent موڈ استعمال نہیں کیا تو یہ نہ صرف متن تیار کر سکتا ہے بلکہ فائلیں بنا اور ایڈٹ کر سکتا ہے، کمانڈز چلا سکتا ہے اور مزید بھی۔
### 📣 اعلان - _نیا پروجیکٹ جنریٹو AI کا استعمال کرتے ہوئے بنانے کے لیے_
### 📣 اعلان - _نیا پروجیکٹ جنریٹو AI کے ساتھ بنانے کے لیے_
نیا AI اسسٹنٹ پروجیکٹ ابھی شامل کیا گیا، اسے دیکھیں [پروجیکٹ](./09-chat-project/README.md)
نیا AI اسسٹنٹ پروجیکٹ ابھی شامل کیا گیا ہے، اسے دیکھیں [پروجیکٹ](./09-chat-project/README.md)
### 📣 اعلان - _نیا نصاب_ جنریٹو AI برائے جاوا اسکرپٹ ابھی جاری کیا گیا
ہمارا نیا جنریٹو 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) پر جائیں اور شروع کریں!
ہر سبق میں ایک اسائنمنٹ شامل ہے، ایک علم کی جانچ اور ایک چیلنج جو آپ کو سکھانے والے موضوعات پر رہنمائی کرتا ہے جیسے:
ہر سبق میں ایک اسائنمنٹ شامل ہے، ایک علم کی جانچ اور ایک چیلنج جو آپ کو سکھائے گا:
- پرامپٹنگ اور پرامپٹ انجینئرنگ
- متن اور تصویر ایپ جنریشن
- سرچ ایپس
شروع کرنے کے لیے [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" بٹن پر کلک کریں۔
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 بنائے گا۔
اس نصاب کو اپنے کمپیوٹر پر مقامی طور پر چلانے کے لیے، آپ کو ایک ٹیکسٹ ایڈیٹر، ایک براؤزر اور ایک کمانڈ لائن ٹول کی ضرورت ہوگی۔ ہمارا پہلا سبق، [پروگرامنگ زبانوں اور ٹولز کا تعارف](../../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) کو یہاں سے ڈاؤن لوڈ کر سکتے ہیں۔
ہماری سفارش ہے کہ آپ [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) بھی شامل ہے۔ آپ [یہاں](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) سے Visual Studio Code ڈاؤن لوڈ کر سکتے ہیں۔
1. اپنی ریپوزیٹری کو اپنے کمپیوٹر پر کلون کریں۔ آپ **Code** بٹن پر کلک کرکے اور URL کو کاپی کرکے ایسا کر سکتے ہیں:
1. اپنی ریپوزٹری کو اپنے کمپیوٹر پر کلون کریں۔ آپ یہ**Code** بٹن پر کلک کرکے اور URL کو کاپی کرکے کر سکتے ہیں:
[CodeSpace](./images/createcodespace.png)
@ -120,86 +118,84 @@ Azure AI Foundry Discord کمیونٹی میں شامل ہوں
git clone <your-repository-url>
```
2. فولڈر کو Visual Studio Code میں کھولیں۔ آپ **File** > **Open Folder** پر کلک کرکے اور وہ فولڈر منتخب کرکے ایسا کر سکتے ہیں جو آپ نے ابھی کلون کیا ہے۔
2. فولڈر کو Visual Studio Code میں کھولیں۔ آپ یہ **File** > **Open Folder** پر کلک کرکے اور وہ فولڈر منتخب کرکے کر سکتے ہیں جو آپ نے ابھی کلون کیا ہے۔
> تجویز کردہ Visual Studio Code ایکسٹینشنز:
>
> * [لائیو سرور](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer&WT.mc_id=academic-77807-sagibbon) - HTML صفحات کو Visual Studio Code میں پیش کرنے کے لیے
> * [کوپائلٹ](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 فولڈر میں موجود ہیں، کل 48 کوئز، ہر ایک میں تین سوالات۔ یہ [یہاں](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) | جیسمن |
| 02 | شروعات | GitHub کی بنیادی باتیں، ٹیم کے ساتھ کام کرنا شامل ہے | اپنے پروجیکٹ میں GitHub کا استعمال کیسے کریں، کوڈ بیس پر دوسروں کے ساتھ تعاون کیسے کریں | [GitHub کا تعارف](./1-getting-started-lessons/2-github-basics/README.md) | فلور |
| 04 | JS کی بنیادی باتیں | جاوا اسکرپٹ ڈیٹا کی اقسام | جاوا اسکرپٹ ڈیٹا کی اقسام کی بنیادی باتیں | [ڈیٹا کی اقسام](./2-js-basics/1-data-types/README.md) | جیسمن |
| 05 | JS کی بنیادی باتیں | فنکشنز اور طریقے | ایپلیکیشن کے منطق کے بہاؤ کو منظم کرنے کے لیے فنکشنز اور طریقوں کے بارے میں سیکھیں | [فنکشنز اور طریقے](./2-js-basics/2-functions-methods/README.md) | جیسمن اور کرسٹوفر |
| 06 | JS کی بنیادی باتیں | JS کے ساتھ فیصلے کرنا | فیصلہ سازی کے طریقوں کا استعمال کرتے ہوئے اپنے کوڈ میں حالات پیدا کرنے کا طریقہ سیکھیں | [فیصلے کرنا](./2-js-basics/3-making-decisions/README.md) | جیسمن |
| 07 | JS کی بنیادی باتیں | Arrays اور Loops | جاوا اسکرپٹ میں Arrays اور Loops کا استعمال کرتے ہوئے ڈیٹا کے ساتھ کام کریں | [Arrays اور Loops](./2-js-basics/4-arrays-loops/README.md) | جیسمن |
| 08 | [Terrarium](./3-terrarium/solution/README.md) | HTML عملی طور پر | آن لائن Terrarium بنانے کے لیے HTML بنائیں، لے آؤٹ بنانے پر توجہ مرکوز کریں | [HTML کا تعارف](./3-terrarium/1-intro-to-html/README.md) | جین |
| 09 | [Terrarium](./3-terrarium/solution/README.md) | CSS عملی طور پر | آن لائن Terrarium کو اسٹائل کرنے کے لیے CSS بنائیں، CSS کی بنیادی باتوں پر توجہ مرکوز کریں بشمول صفحہ کو جوابدہ بنانا | [CSS کا تعارف](./3-terrarium/2-intro-to-css/README.md) | جین |
| 10 | [Terrarium](./3-terrarium/solution/README.md) | جاوا اسکرپٹ Closures، DOM میں تبدیلی | Terrarium کو Drag/Drop انٹرفیس کے طور پر کام کرنے کے لیے جاوا اسکرپٹ بنائیں، Closures اور DOM میں تبدیلی پر توجہ مرکوز کریں | [جاوا اسکرپٹ Closures، DOM میں تبدیلی](./3-terrarium/3-intro-to-DOM-and-closures/README.md) | جین |
| 11 | [Typing Game](./4-typing-game/solution/README.md) | ایک Typing Game بنائیں | اپنے جاوا اسکرپٹ ایپ کی منطق کو چلانے کے لیے کی بورڈ ایونٹس کا استعمال کیسے کریں | [ایونٹ پر مبنی پروگرامنگ](./4-typing-game/typing-game/README.md) | کرسٹوفر |
| 01 | شروعات | پروگرامنگ کا تعارف اور پیشہ ورانہ اوزار | زیادہ تر پروگرامنگ زبانوں کے بنیادی اصولوں اور سافٹ ویئر کے بارے میں جانیں جو پیشہ ور ڈویلپرز کو ان کا کام کرنے میں مدد کرتا ہے | [پروگرامنگ زبانوں اور پیشہ ورانہ اوزار کا تعارف](./1-getting-started-lessons/1-intro-to-programming-languages/README.md) | جیسمن |
| 02 | شروعات | GitHub کی بنیادی باتیں، ٹیم کے ساتھ کام کرنا | اپنے پروجیکٹ میں GitHub کا استعمال کیسے کریں، کوڈ بیس پر دوسروں کے ساتھ تعاون کیسے کریں | [GitHub کا تعارف](./1-getting-started-lessons/2-github-basics/README.md) | فلور |
| 04 | جاوا اسکرپٹ کی بنیادی باتیں | جاوا اسکرپٹ ڈیٹا کی اقسام | جاوا اسکرپٹ ڈیٹا کی اقسام کی بنیادی باتیں | [ڈیٹا کی اقسام](./2-js-basics/1-data-types/README.md) | جیسمن |
| 05 | جاوا اسکرپٹ کی بنیادی باتیں | فنکشنز اور طریقے | ایپلیکیشن کے لاجک فلو کو منظم کرنے کے لیے فنکشنز اور طریقوں کے بارے میں جانیں | [فنکشنز اور طریقے](./2-js-basics/2-functions-methods/README.md) | جیسمن اور کرسٹوفر |
| 06 | جاوا اسکرپٹ کی بنیادی باتیں | جاوا اسکرپٹ کے ساتھ فیصلے کرنا | فیصلہ سازی کے طریقوں کا استعمال کرتے ہوئے اپنے کوڈ میں حالات پیدا کرنا سیکھیں | [فیصلے کرنا](./2-js-basics/3-making-decisions/README.md) | جیسمن |
| 07 | جاوا اسکرپٹ کی بنیادی باتیں | Arrays اور Loops | جاوا اسکرپٹ میں ڈیٹا کے ساتھ کام کریں Arrays اور Loops کا استعمال کرتے ہوئے | [Arrays اور Loops](./2-js-basics/4-arrays-loops/README.md) | جیسمن |
| 08 | [Terrarium](./3-terrarium/solution/README.md) | HTML کا عملی استعمال | ایک آن لائن Terrarium بنانے کے لیے HTML بنائیں، لے آؤٹ بنانے پر توجہ مرکوز کریں | [HTML کا تعارف](./3-terrarium/1-intro-to-html/README.md) | جین |
| 09 | [Terrarium](./3-terrarium/solution/README.md) | CSS کا عملی استعمال | آن لائن Terrarium کو اسٹائل کرنے کے لیے CSS بنائیں، CSS کی بنیادی باتوں پر توجہ مرکوز کریں بشمول صفحہ کو ریسپانسیو بنانا | [CSS کا تعارف](./3-terrarium/2-intro-to-css/README.md) | جین |
| 10 | [Terrarium](./3-terrarium/solution/README.md) | جاوا اسکرپٹ Closures، DOM میں تبدیلی | Terrarium کو ایک ڈریگ/ڈراپ انٹرفیس کے طور پر کام کرنے کے لیے جاوا اسکرپٹ بنائیں، Closures اور DOM میں تبدیلی پر توجہ مرکوز کریں | [جاوا اسکرپٹ Closures، DOM میں تبدیلی](./3-terrarium/3-intro-to-DOM-and-closures/README.md) | جین |
| 11 | [Typing Game](./4-typing-game/solution/README.md) | ایک Typing Game بنائیں | اپنے جاوا اسکرپٹ ایپ کی منطق کو چلانے کے لیے کی بورڈ ایونٹس کا استعمال کرنا سیکھیں | [ایونٹ پر مبنی پروگرامنگ](./4-typing-game/typing-game/README.md) | کرسٹوفر |
| 12 | [Green Browser Extension](./5-browser-extension/solution/README.md) | براؤزرز کے ساتھ کام کرنا | براؤزرز کیسے کام کرتے ہیں، ان کی تاریخ، اور براؤزر ایکسٹینشن کے پہلے عناصر کو کیسے تیار کریں | [براؤزرز کے بارے میں](./5-browser-extension/1-about-browsers/README.md) | جین |
| 13 | [Green Browser Extension](./5-browser-extension/solution/README.md) | ایک فارم بنانا، API کو کال کرنا اور متغیرات کو مقامی اسٹوریج میں محفوظ کرنا | اپنے براؤزر ایکسٹینشن کے جاوا اسکرپٹ عناصر کو متغیرات کا استعمال کرتے ہوئے API کو کال کرنے کے لیے بنائیں | [APIs، فارم، اور مقامی اسٹوریج](./5-browser-extension/2-forms-browsers-local-storage/README.md) | جین |
| 14 | [Green Browser Extension](./5-browser-extension/solution/README.md) | براؤزر میں پس منظر کے عمل، ویب کی کارکردگی | ایکسٹینشن کے آئیکن کو منظم کرنے کے لیے براؤزر کے پس منظر کے عمل کا استعمال کریں؛ ویب کی کارکردگی اور کچھ اصلاحات کے بارے میں سیکھیں | [پس منظر کے کام اور کارکردگی](./5-browser-extension/3-background-tasks-and-performance/README.md) | جین |
| 15 | [Space Game](./6-space-game/solution/README.md) | جاوا اسکرپٹ کے ساتھ مزید جدید گیم ڈویلپمنٹ | گیم بنانے کی تیاری میں Classes اور Composition اور Pub/Sub پیٹرن کا استعمال کرتے ہوئے Inheritance کے بارے میں سیکھیں | [جدید گیم ڈویلپمنٹ کا تعارف](./6-space-game/1-introduction/README.md) | کرس |
| 16 | [Space Game](./6-space-game/solution/README.md) | کینوس پر ڈرائنگ | کینوس API کے بارے میں سیکھیں، جو اسکرین پر عناصر کو ڈرائنگ کرنے کے لیے استعمال ہوتا ہے | [کینوس پر ڈرائنگ](./6-space-game/2-drawing-to-canvas/README.md) | کرس |
| 13 | [Green Browser Extension](./5-browser-extension/solution/README.md) | ایک API کو کال کرنے اور متغیرات کو لوکل اسٹوریج میں محفوظ کرنے کے لیے فارم بنانا | اپنے براؤزر ایکسٹینشن کے جاوا اسکرپٹ عناصر کو ایک API کو کال کرنے کے لیے بنائیں، لوکل اسٹوریج میں محفوظ متغیرات کا استعمال کریں | [APIs، فارم، اور لوکل اسٹوریج](./5-browser-extension/2-forms-browsers-local-storage/README.md) | جین |
| 14 | [Green Browser Extension](./5-browser-extension/solution/README.md) | براؤزر میں بیک گراؤنڈ پروسیسز، ویب کی کارکردگی | براؤزر کے بیک گراؤنڈ پروسیسز کا استعمال کرتے ہوئے ایکسٹینشن کے آئیکن کو منظم کریں؛ ویب کی کارکردگی اور کچھ اصلاحات کے بارے میں جانیں | [بیک گراؤنڈ ٹاسکس اور کارکردگی](./5-browser-extension/3-background-tasks-and-performance/README.md) | جین |
| 15 | [Space Game](./6-space-game/solution/README.md) | جاوا اسکرپٹ کے ساتھ مزید جدید گیم ڈویلپمنٹ | گیم بنانے کی تیاری میں کلاسز اور کمپوزیشن دونوں کا استعمال کرتے ہوئے وراثت کے بارے میں جانیں اور Pub/Sub پیٹرن کے بارے میں جانیں | [جدید گیم ڈویلپمنٹ کا تعارف](./6-space-game/1-introduction/README.md) | کرس |
| 16 | [Space Game](./6-space-game/solution/README.md) | کینوس پر ڈرائنگ | کینوس API کے بارے میں جانیں، جو اسکرین پر عناصر کو ڈرائنگ کرنے کے لیے استعمال ہوتا ہے | [کینوس پر ڈرائنگ](./6-space-game/2-drawing-to-canvas/README.md) | کرس |
| 17 | [Space Game](./6-space-game/solution/README.md) | اسکرین پر عناصر کو حرکت دینا | دریافت کریں کہ عناصر کارٹیسین کوآرڈینیٹس اور کینوس API کا استعمال کرتے ہوئے حرکت کیسے حاصل کر سکتے ہیں | [عناصر کو حرکت دینا](./6-space-game/3-moving-elements-around/README.md) | کرس |
| 18 | [Space Game](./6-space-game/solution/README.md) | تصادم کا پتہ لگانا | عناصر کو ایک دوسرے سے ٹکرانے اور ردعمل دینے کے لیے بنائیں، کی پریسز کا استعمال کریں اور گیم کی کارکردگی کو یقینی بنانے کے لیے کولڈاؤن فنکشن فراہم کریں | [تصادم کا پتہ لگانا](./6-space-game/4-collision-detection/README.md) | کرس |
| 18 | [Space Game](./6-space-game/solution/README.md) | تصادم کا پتہ لگانا | عناصر کو ایک دوسرے سے ٹکرانے اور ردعمل دینے کے لیے بنائیں، کی پریسز کا استعمال کریں اور گیم کی کارکردگی کو یقینی بنانے کے لیے کولڈاؤن فنکشن فراہم کریں | [تصادم کا پتہ لگانا](./6-space-game/4-collision-detection/README.md) | کرس |
| 19 | [Space Game](./6-space-game/solution/README.md) | اسکور رکھنا | گیم کی حیثیت اور کارکردگی کی بنیاد پر ریاضی کے حسابات انجام دیں | [اسکور رکھنا](./6-space-game/5-keeping-score/README.md) | کرس |
| 20 | [Space Game](./6-space-game/solution/README.md) | گیم کو ختم کرنا اور دوبارہ شروع کرنا | گیم کو ختم کرنے اور دوبارہ شروع کرنے کے بارے میں سیکھیں، بشمول اثاثوں کو صاف کرنا اور متغیرات کی اقدار کو دوبارہ ترتیب دینا | [اختتامی شرط](./6-space-game/6-end-condition/README.md) | کرس |
| 21 | [Banking App](./7-bank-project/solution/README.md) | HTML ٹیمپلیٹس اور ویب ایپ میں روٹس | روٹنگ اور HTML ٹیمپلیٹس کا استعمال کرتے ہوئے ایک ملٹی پیج ویب سائٹ کی آرکیٹیکچر کا خاکہ کیسے تیار کریں | [HTML ٹیمپلیٹس اور روٹس](./7-bank-project/1-template-route/README.md) | یوہان |
| 22 | [Banking App](./7-bank-project/solution/README.md) | لاگ ان اور رجسٹریشن فارم بنائیں | فارم بنانے اور توثیق کے معمولات کو سنبھالنے کے بارے میں سیکھیں | [فارمز](./7-bank-project/2-forms/README.md) | یوہان |
| 23 | [Banking App](./7-bank-project/solution/README.md) | ڈیٹا کو حاصل کرنے اور استعمال کرنے کے طریقے | آپ کے ایپ میں ڈیٹا کیسے بہتا ہے، اسے کیسے حاصل کریں، اسٹور کریں، اور ضائع کریں | [ڈیٹا](./7-bank-project/3-data/README.md) | یوہان |
| 24 | [Banking App](./7-bank-project/solution/README.md) | اسٹیٹ مینجمنٹ کے تصورات | آپ کا ایپ اسٹیٹ کو کیسے برقرار رکھتا ہے اور اسے پروگرام کے ذریعے کیسے منظم کریں | [اسٹیٹ مینجمنٹ](./7-bank-project/4-state-management/README.md) | یوہان |
| 25 | [براؤزر/VScode کوڈ](../../8-code-editor) | VScode کے ساتھ کام کرنا | کوڈ ایڈیٹر کا استعمال کیسے کریں سیکھیں| [VScode کوڈ ایڈیٹر کا استعمال کریں](./8-code-editor/1-using-a-code-editor/README.md) | کرس |
| 26 | [AI اسسٹنٹس](./9-chat-project/README.md) | AI کے ساتھ کام کرنا | اپنا AI اسسٹنٹ بنانے کا طریقہ سیکھیں | [AI اسسٹنٹ پروجیکٹ](./9-chat-project/README.md) | کرس |
| 20 | [Space Game](./6-space-game/solution/README.md) | گیم کو ختم کرنا اور دوبارہ شروع کرنا | گیم کو ختم کرنے اور دوبارہ شروع کرنے کے بارے میں جانیں، بشمول اثاثوں کو صاف کرنا اور متغیر اقدار کو دوبارہ ترتیب دینا | [اختتامی حالت](./6-space-game/6-end-condition/README.md) | کرس |
| 21 | [Banking App](./7-bank-project/solution/README.md) | ایک ویب ایپ میں HTML ٹیمپلیٹس اور روٹس | ایک ملٹی پیج ویب سائٹ کی آرکیٹیکچر کا خاکہ بنانے کے لیے روٹنگ اور HTML ٹیمپلیٹس کا استعمال کرنا سیکھیں | [HTML ٹیمپلیٹس اور روٹس](./7-bank-project/1-template-route/README.md) | یوہان |
| 22 | [Banking App](./7-bank-project/solution/README.md) | لاگ ان اور رجسٹریشن فارم بنائیں | فارم بنانے اور توثیق کے معمولات کو سنبھالنے کے بارے میں جانیں | [فارمز](./7-bank-project/2-forms/README.md) | یوہان |
| 23 | [Banking App](./7-bank-project/solution/README.md) | ڈیٹا کو حاصل کرنے اور استعمال کرنے کے طریقے | آپ کی ایپ میں ڈیٹا کیسے بہتا ہے، اسے کیسے حاصل کریں، اسٹور کریں، اور ضائع کریں | [ڈیٹا](./7-bank-project/3-data/README.md) | یوہان |
| 24 | [Banking App](./7-bank-project/solution/README.md) | اسٹیٹ مینجمنٹ کے تصورات | آپ کی ایپ اسٹیٹ کو کیسے برقرار رکھتی ہے اور اسے پروگرام کے ذریعے کیسے منظم کیا جائے | [اسٹیٹ مینجمنٹ](./7-bank-project/4-state-management/README.md) | یوہان |
| 25 | [Browser/VScode Code](../../8-code-editor) | VScode کے ساتھ کام کرنا | کوڈ ایڈیٹر کا استعمال سیکھیں| [VScode کوڈ ایڈیٹر کا استعمال کریں](./8-code-editor/1-using-a-code-editor/README.md) | کرس |
| 26 | [AI Assistants](./9-chat-project/README.md) | AI کے ساتھ کام کرنا | اپنا AI اسسٹنٹ بنانے کا طریقہ سیکھیں | [AI اسسٹنٹ پروجیکٹ](./9-chat-project/README.md) | کرس |
## 🏫 تدریسی اصول
ہمارا نصاب دو اہم تدریسی اصولوں کے ساتھ تیار کیا گیا ہے:
ہمارا نصاب دو اہم تدریسی اصولوں کے ساتھ ڈیزائن کیا گیا ہے:
* پروجیکٹ پر مبنی سیکھنا
* بار بار کوئز
یہ پروگرام جاوا اسکرپٹ، HTML، اور CSS کے بنیادی اصولوں کے ساتھ ساتھ آج کے ویب ڈویلپرز کے استعمال کردہ جدید ترین آلات اور تکنیکوں کو سکھاتا ہے۔ طلباء کو ٹائپنگ گیم، ورچوئل Terrarium، ماحول دوست براؤزر ایکسٹینشن، اسپیس انویڈر اسٹائل گیم، اور کاروباروں کے لیے بینکنگ ایپ بنانے کے ذریعے عملی تجربہ حاصل کرنے کا موقع ملے گا۔ اس سیریز کے اختتام تک، طلباء ویب ڈویلپمنٹ کی ٹھوس سمجھ حاصل کر چکے ہوں گے۔
یہ پروگرام جاوا اسکرپٹ، HTML، اور CSS کے بنیادی اصولوں کے ساتھ ساتھ آج کے ویب ڈویلپرز کے ذریعہ استعمال ہونے والے جدید ترین اوزار اور تکنیکوں کو سکھاتا ہے۔ طلباء کو ایک ٹائپنگ گیم، ورچوئل Terrarium، ماحول دوست براؤزر ایکسٹینشن، اسپیس انویڈر اسٹائل گیم، اور کاروبار کے لیے ایک بینکنگ ایپ بنانے کے ذریعے عملی تجربہ حاصل کرنے کا موقع ملے گا۔ اس سیریز کے اختتام تک، طلباء ویب ڈویلپمنٹ کی ایک مضبوط سمجھ حاصل کر لیں گے۔
> 🎓 آپ اس نصاب کے پہلے چند اسباق کو Microsoft Learn پر [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) کے طور پر لے سکتے ہیں!
پروجیکٹس کے ساتھ مواد کو ہم آہنگ کرنے کو یقینی بنا کر، طلباء کے لیے عمل کو زیادہ دلچسپ بنایا گیا ہے اور تصورات کی یادداشت کو بڑھایا جائے گا۔ ہم نے جاوا اسکرپٹ کی بنیادی باتوں میں کئی ابتدائی اسباق بھی لکھے ہیں تاکہ تصورات کو متعارف کرایا جا سکے، "[Beginners Series to: JavaScript](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript/?WT.mc_id=academic-77807-sagibbon)" ویڈیو ٹیوٹوریلز کے مجموعہ سے ایک ویڈیو کے ساتھ جوڑا گیا، جن کے کچھ مصنفین نے اس نصاب میں تعاون کیا۔
پروجیکٹس کے ساتھ مواد کو ہم آہنگ کر کے، عمل کو طلباء کے لیے زیادہ مشغول بنایا گیا ہے اور تصورات کی یادداشت کو بڑھایا جائے گا۔ ہم نے جاوا اسکرپٹ کی بنیادی باتوں میں کئی ابتدائی اسباق بھی لکھے ہیں تاکہ تصورات کو متعارف کرایا جا سکے، جنہیں "[Beginners Series to: JavaScript](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript/?WT.mc_id=academic-77807-sagibbon)" ویڈیو ٹیوٹوریلز کے مجموعہ کی ویڈیو کے ساتھ جوڑا گیا ہے، جن کے کچھ مصنفین نے اس نصاب میں تعاون کیا ہے۔
اس کے علاوہ، کلاس سے پہلے ایک کم دباؤ والا کوئز طالب علم کے ارادے کو کسی موضوع کو سیکھنے کی طرف متعین کرتا ہے، جبکہ کلاس کے بعد دوسرا کوئز مزید یادداشت کو یقینی بناتا ہے۔ یہ نصاب لچکدار اور تفریحی ہونے کے لیے ڈیزائن کیا گیا تھا اور اسے مکمل یا جزوی طور پر لیا جا سکتا ہے۔ پروجیکٹس چھوٹے شروع ہوتے ہیں اور 12 ہفتے کے سائیکل کے اختتام تک بتدریج پیچیدہ ہو جاتے ہیں۔
جبکہ ہم نے جاوا اسکرپٹ فریم ورک کو متعارف کرانے سے جان بوجھ کر گریز کیا ہے تاکہ فریم ورک اپنانے سے پہلے ویب ڈویلپر کے طور پر درکار بنیادی مہارتوں پر توجہ مرکوز کی جا سکے، اس نصاب کو مکمل کرنے کے بعد اگلا اچھا قدم 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](CODE_OF_CONDUCT.md) اور [Contributing](CONTRIBUTING.md) رہنما اصول دیکھیں۔ ہم آپ کی تعمیری رائے کا خیر مقدم کرتے ہیں!
جبکہ ہم نے جاوا اسکرپٹ فریم ورک کو متعارف کرانے سے جان بوجھ کر گریز کیا ہے تاکہ فریم ورک اپنانے سے پہلے ایک ویب ڈویلپر کے طور پر درکار بنیادی مہارتوں پر توجہ مرکوز کی جا سکے، اس نصاب کو مکمل کرنے کے بعد ایک اچھا اگلا قدم 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](CODE_OF_CONDUCT.md) اور [Contributing](CONTRIBUTING.md) رہنما خطوط ملاحظہ کریں۔ ہم آپ کی تعمیری رائے کا خیرمقدم کرتے ہیں!
## 🧭 آف لائن رسائی
آپ اس دستاویزات کو آف لائن [Docsify](https://docsify.js.org/#/) کا استعمال کرتے ہوئے چلا سکتے ہیں۔ اس ریپو کو فورک کریں، [Docsify انسٹال کریں](https://docsify.js.org/#/quickstart) اپنی مقامی مشین پر، اور پھر اس ریپو کے روٹ فولڈر میں، `docsify serve` ٹائپ کریں۔ ویب سائٹ آپ کے لوکل ہوسٹ پر پورٹ 3000 پر پیش کی جائے گی: `localhost:3000`.
## 📘 PDF
آپ اس دستاویزات کو آف لائن [Docsify](https://docsify.js.org/#/) کا استعمال کرتے ہوئے چلا سکتے ہیں۔ اس ریپو کو فورک کریں، [Docsify انسٹال کریں](https://docsify.js.org/#/quickstart) اپنی مقامی مشین پر، اور پھر اس ریپو کے روٹ فولڈر میں، `docsify serve` ٹائپ کریں۔ ویب سائٹ آپ کے لوکل ہوسٹ پر پورٹ 3000 پر پیش کی جائے گی: `localhost:3000`۔
تمام اسباق کا PDF [یہاں](https://microsoft.github.io/Web-Dev-For-Beginners/pdf/readme.pdf) پایا جا سکتا ہے۔
## 📘 پی ڈی ایف
تمام اسباق کی ایک پی ڈی ایف [یہاں](https://microsoft.github.io/Web-Dev-For-Beginners/pdf/readme.pdf) دستیاب ہے۔
## 🎒 دیگر کورسز
@ -207,45 +203,45 @@ Azure AI Foundry Discord کمیونٹی میں شامل ہوں
### Azure / Edge / MCP / Agents
[](https://github.com/microsoft/AZD-for-beginners?WT.mc_id=academic-105485-koreyst)
[](https://github.com/microsoft/edgeai-for-beginners?WT.mc_id=academic-105485-koreyst)
[](https://github.com/microsoft/mcp-for-beginners?WT.mc_id=academic-105485-koreyst)
[](https://github.com/microsoft/ai-agents-for-beginners?WT.mc_id=academic-105485-koreyst)
[](https://github.com/microsoft/edgeai-for-beginners?WT.mc_id=academic-105485-koreyst)
[](https://github.com/microsoft/mcp-for-beginners?WT.mc_id=academic-105485-koreyst)
[](https://github.com/microsoft/generative-ai-for-beginners?WT.mc_id=academic-105485-koreyst)
[-9333EA?style=for-the-badge&labelColor=E5E7EB&color=9333EA)](https://github.com/microsoft/Generative-AI-for-beginners-dotnet?WT.mc_id=academic-105485-koreyst)
[-C084FC?style=for-the-badge&labelColor=E5E7EB&color=C084FC)](https://github.com/microsoft/generative-ai-for-beginners-java?WT.mc_id=academic-105485-koreyst)
[-E879F9?style=for-the-badge&labelColor=E5E7EB&color=E879F9)](https://github.com/microsoft/generative-ai-with-javascript?WT.mc_id=academic-105485-koreyst)
### جنریٹیو اے آئی سیریز
[](https://github.com/microsoft/generative-ai-for-beginners?WT.mc_id=academic-105485-koreyst)
[-9333EA?style=for-the-badge&labelColor=E5E7EB&color=9333EA)](https://github.com/microsoft/Generative-AI-for-beginners-dotnet?WT.mc_id=academic-105485-koreyst)
[-C084FC?style=for-the-badge&labelColor=E5E7EB&color=C084FC)](https://github.com/microsoft/generative-ai-for-beginners-java?WT.mc_id=academic-105485-koreyst)
[-E879F9?style=for-the-badge&labelColor=E5E7EB&color=E879F9)](https://github.com/microsoft/generative-ai-with-javascript?WT.mc_id=academic-105485-koreyst)
---
### بنیادی تعلیم
[](https://aka.ms/ml-beginners?WT.mc_id=academic-105485-koreyst)
[](https://aka.ms/datascience-beginners?WT.mc_id=academic-105485-koreyst)
[](https://aka.ms/ai-beginners?WT.mc_id=academic-105485-koreyst)
[](https://github.com/microsoft/Security-101?WT.mc_id=academic-96948-sayoung)
[](https://aka.ms/webdev-beginners?WT.mc_id=academic-105485-koreyst)
[](https://aka.ms/iot-beginners?WT.mc_id=academic-105485-koreyst)
[](https://github.com/microsoft/xr-development-for-beginners?WT.mc_id=academic-105485-koreyst)
[](https://aka.ms/ml-beginners?WT.mc_id=academic-105485-koreyst)
[](https://aka.ms/iot-beginners?WT.mc_id=academic-105485-koreyst)
[](https://aka.ms/GitHubCopilotAI?WT.mc_id=academic-105485-koreyst)
[](https://github.com/microsoft/mastering-github-copilot-for-dotnet-csharp-developers?WT.mc_id=academic-105485-koreyst)
[](https://aka.ms/GitHubCopilotAI?WT.mc_id=academic-105485-koreyst)
اگر آپ کو اے آئی ایپس بنانے میں کوئی مسئلہ ہو یا سوال ہو تو شامل ہوں:
اگر آپ کسی مسئلے میں پھنس جائیں یا اے آئی ایپلیکیشنز بنانے کے بارے میں سوالات ہوں، تو دیگر سیکھنے والوں اور تجربہ کار ڈویلپرز کے ساتھ ایم سی پی پر گفتگو میں شامل ہوں۔ یہ ایک معاون کمیونٹی ہے جہاں سوالات کا خیرمقدم کیا جاتا ہے اور علم آزادانہ طور پر شیئر کیا جاتا ہے۔
[](https://aka.ms/foundry/discord)
اگر آپ کو پروڈکٹ کے بارے میں رائے دینی ہو یا کوئی خرابی ہو تو یہاں جائیں:
اگر آپ کو پروڈکٹ کے بارے میں رائے دینی ہو یا بلڈنگ کے دوران کوئی مسئلہ ہو تو یہاں جائیں:
[](https://aka.ms/foundry/forum)
@ -253,5 +249,7 @@ Azure AI Foundry Discord کمیونٹی میں شامل ہوں
---
**ڈسکلیمر**:
یہ دستاویز AI ترجمہ سروس [Co-op Translator](https://github.com/Azure/co-op-translator) کا استعمال کرتے ہوئے ترجمہ کی گئی ہے۔ ہم درستگی کے لیے کوشش کرتے ہیں، لیکن براہ کرم آگاہ رہیں کہ خودکار ترجمے میں غلطیاں یا غیر درستیاں ہو سکتی ہیں۔ اصل دستاویز کو اس کی اصل زبان میں مستند ذریعہ سمجھا جانا چاہیے۔ اہم معلومات کے لیے، پیشہ ور انسانی ترجمہ کی سفارش کی جاتی ہے۔ ہم اس ترجمے کے استعمال سے پیدا ہونے والی کسی بھی غلط فہمی یا غلط تشریح کے ذمہ دار نہیں ہیں۔
<!-- CO-OP TRANSLATOR DISCLAIMER START -->
**اعلانِ لاتعلقی**:
یہ دستاویز AI ترجمہ سروس [Co-op Translator](https://github.com/Azure/co-op-translator) کا استعمال کرتے ہوئے ترجمہ کی گئی ہے۔ ہم درستگی کے لیے کوشش کرتے ہیں، لیکن براہ کرم آگاہ رہیں کہ خودکار ترجمے میں غلطیاں یا غیر درستیاں ہو سکتی ہیں۔ اصل دستاویز کو اس کی اصل زبان میں مستند ذریعہ سمجھا جانا چاہیے۔ اہم معلومات کے لیے، پیشہ ور انسانی ترجمہ کی سفارش کی جاتی ہے۔ ہم اس ترجمے کے استعمال سے پیدا ہونے والی کسی بھی غلط فہمی یا غلط تشریح کے ذمہ دار نہیں ہیں۔
softchris
4 weeks ago
committed by
GitHub