new arabic /getting-started.md (withastro#1212)

Co-authored-by: Chris Swithinbank <[email protected]>

src/pages/ar/getting-started.md

@@ -1,79 +1,108 @@
 ---
 layout: ~/layouts/MainLayout.astro
+setup: |
+    import Button from '../../components/Button.astro'
+    import ContributorList from '../../components/ContributorList.astro'
+    import PackageManagerTabs from '~/components/tabs/PackageManagerTabs.astro'
 title: باشر بالبدأ
 dir: rtl
 ---
+#### ما هو أسترو؟
 
-Astro هو باني موقع ثابت. تعرف أكثر حول ماهية Astro من خلال [صفحتنا الرئيسية](https://astro.build/) أو نشرة [الإصدارات](https://astro.build/blog/introducing-astro). تُعد هذه الصفحة نُبذة موجزة للتوثيق الخاص بـAstro وأيضًا لكل المصادر التي تتعلق به.
+أسترو هو إطار عمل متكامل لإنشاء المواقع بشكل أسرع، لتركز على محتوى الموقع أكثر.
 
-إن كنت تتطلع عن ملخص سريع حول ما هو Astro بشكلٍ عام؟ [تفقد صفحتنا الرئيسية.](https://astro.build/blog/introducing-astro)
+#### أهم المميزات
 
-## جرب Astro
+* **Component Islands (جُزر المكونات)**: هو أسلوب جديد في تصميم وتطوير صفحات الويب لإنشاء مواقع سريعة.
 
-أبسط طريقة لتجرب Astro هي بتنفيذ أمر `npm create astro@latest` في داخل مُجلد جديد على جهازك، وسيقوم Astro CLI بمُساعدتك على بدأ مشروع Astro جديد.
+* **مبدأ Server-first API**: محتوى مُصير مسبقًا على جهة السيرفر، يصل لمستخدمي موقعك.
 
-لتباشر البدأ باستخدام Astro من خلال 5 خطوات سريعة وبسيطة، تفقد [دليل البدأ-بسرعة](/ar/install/auto/).
+* **صفر-جافاسكربت افتراضيًا**: لا يضيف أسترو ملفات جافاسكربت تُبطئ تحميل صفحتك.
 
-أو إقرأ [دليل التثبيت](/ar/install/manual/) إن كنت تريد الغوص في عملية تهيئة Astro.
+* **جاهز للنشر على الحافة**: تستطيع نشر موقعك على خدمات الحوسبة الحافية (edge runtime) مثل Deno أو Cloudflare.
 
-### أمثلة على بعض المشاريع
+* **قابلية التخصيص**: Tailwind, MDX, وغيرها الكثير... متاحة لتختار بينها وتدمجها مع موقعك.
 
-أن كنت تفضل التعلم عن طريق الأمثلة، ألقي نظرةٍ على [مكتبة الأمثلة الشاملة](https://github.com/withastro/astro/tree/main/examples) المتواجدة على Github.
+* **محايد لإطارات عمل الواجهات**: استخدم أي أطار عمل تفضله React, Preact, Svelte, Vue, Solid, Lit وغيرها.
 
-بمقدورك الإطلاع على أي من هذه الأمثلة وتجربتها مُباشرةً على جهازك،
-فقط نفذ الأمر <code ltr="left">npm create astro@latest</code> متبوعًا بـ
-`--template`. الإشارة `--template` أيضًا تدعم الامثلة الخارجية التي يصنعها المجتمع
+## جرب أسترو من على متصفحك
 
-```bash
-# أمر تهيئة أحد القوالب الرسمية التي يوفرها استرو
-npm create astro@latest -- --template [OFFICIAL_EXAMPLE_NAME]
-# أمر تهيئة القوالب الخارجية التي يوفرها المُجتمع
-npm create astro@latest -- --template [GITHUB_USER]/[REPO_NAME]
-npm create astro@latest -- --template [GITHUB_USER]/[REPO_NAME]/path/to/example
-```
+من خلال [astro.new](https://astro.new/) تستطيع اختيار قالب من بين عشرات القوالب المتوفرة لتبدا تجربتك. إلعب وجرب أسترو بشكل كامل من على متصفحك!
 
-### جربه على المُتصفح
+<div style="display: flex; flex-wrap: wrap; gap: 0.5rem;">
+    <Button href="https://astro.new/basics?on=stackblitz">تجربة سريعة!</Button>
+    <Button variant="outline" href="https://astro.new/">تفقد القوالب المتوفرة ←</Button>
+</div>
 
-إن كنت مهتمًا وتريد اللعب وتجربة Astro على المتصفح، بمقدورك استخدام online code playground، جرب قالب مشروعنا "Hello World" على [CodeSandbox](https://codesandbox.io/s/astro-template-hugb3).
+## أبدأ مشروعك الاول مع أسترو
 
-_ملحوظة: بعض المُميزات مُقتصرة على CodeSandbx (مثلاً: التحديث السريع "Fast Refresh") حاليًا._
+<PackageManagerTabs>
+  <Fragment slot="npm">
+  ```shell
+  # أنشئ مشروع جديد عبر npm
+  npm create astro@latest
+  ```
+  </Fragment>
+  <Fragment slot="pnpm">
+  ```shell
+  # أنشئ مشروع جديد عبر pnpm
+  pnpm create astro@latest
+  ```
+  </Fragment>
+  <Fragment slot="yarn">
+  ```shell
+  # أنشئ مشروع جديد عبر yarn
+  yarn create astro
+  ```
+  </Fragment>
+</PackageManagerTabs>
 
-## تعلمُ Astro
+تصفح الدليل [خطوات التثبيت](/ar/install/auto/) لتأخذ نظرة كاملة عن كيفية تثبيت أسترو خطوة بخطوة، عبر مُدير الحزم الذي تفضل استخدامه.
 
-يأتي العديد الأشخاص من خلفياتِ تعلم مُختلفة إلى Astro، أيًا كانت طريقة التعليم التي تفضلها سواءً أكنت تفضل الطريقة النظرية أو الطريقة العملية، نتمنى أن تجد هذا القسم مفيدًا.
 
-- إن كُنت تُفضل **التعلم من خلال التجربة العملية**، أبدأ من خلال [مكتبتنا للأمثلة](https://github.com/withastro/astro/tree/main/examples).
-- إن كُنت تُفضل **التعلم من خلال الفهم خطوةً بخطوة**، أبدأ من خلال [دليل المفاهيم الأساسية والإرشادات](/ar/core-concepts/project-structure/).
+## تعلم أسترو
 
-مثل أي تقنيةٍ ليست بمألوفة، Astro يأتيك بمنحنى تعليمي مختلف بعض الشيء، ولكن على أي حال، مع بعض الصبر والممارسة، نحن متأكدون بأنك _ستتأقلم معه_ في وقتٍ هين دون أن تشعر.
+طَالع الأمثلة، لأهم المفاهيم الأساسية في أسترو
 
-### تعلمُ تركيب <code dir="ltr">.astro</code> النحوي (syntax)
+📚 [أنشئ أول صفحة](/ar/core-concepts/astro-pages/) في موقعك.
 
-مع بدأ تعلمك لـAstro ستلاحظ العديد من الملفات التي تنتهي بصيغة <code dir="ltr">.astro</code> هي ملفات مكتوبة بـ Astro’s Component Syntax والتي تعد: طريقة كتابة مشابهة جدًا لملفات HTML يستخدمها Astro في القوالب.
-صممت هذه الصيغة لتكون قريبة ومشابهة للـ HTML و JSX، إن كنت تعرف أحدهما فستتأقلم مع <code dir="ltr">.astro</code> بسهولة.
+📚 أقرأ أكثر عن [هيكل تصميم مشاريع](/ar/core-concepts/project-structure/) أسترو.
 
-تفقد دليلنا المساعد [مكونات Astro](/ar/core-concepts/astro-components/) سيكون مدخل يساعدك على تعلم Astro syntax، ويعد أفضل طريقة للتعلم.
+📚 تعلم أكثر عن [file-based routing](/ar/core-concepts/routing/) في أسترو.
 
-### مرجع للـAPI
+*... تفقد التوثيق الكامل للـ API التي يوفرها أسترو عبر خانة  **مراجع** أعلى الصفحة.*
 
-يُفيدك هذا الجزء من التوثيق حينما تريد الإطلاع أكثر بشأن تفاصيل Astro API. على سبيل المثال، يتضمن [مرجع الإعداد](/ar/reference/configuration-reference/) قائمة لكل الإعدادات الممكنة المتاحة لكي تستخدمها. [المكونات المصممة مسبقًا](/ar/reference/api-reference/#built-in-components) تتضمن قائمة بكل العناصر الرئيسية مثل <span dir="ltr">`<Markdown />` و `<Code />`</span>.
+## أبحر مع أسترو
 
-### إصدارات التوثيق
+🧰 أبدأ مشروعك القادم باستخدام إحدى [القوالب المبنية مسبقًا](https://astro.build/themes/).
 
-هذا التوثيق يُسلط الضوء دومًا على أخر إصدار مستقر من Astro، وريثما نصل إلى إصدار 1.0 الرئيسي سنقوم بإضافة القابلية لتصفح اللإصدارات المختلفة من التوثيق.
+🧰 
+خصص موقعك، عبر عشرات الإضافات التي يوفرها أسترو ومجتمعه، [تصفح الإضافات](https://astro.build/integrations/).
 
-## أبقى مُطلعًا
+🧰 ألهم نفسك وغذي بصرك عبر زيارة صفحة [معرض المشاريع](https://astro.build/showcase/) التي تمت عبر أسترو.
 
-حساب [@astrodotbuild](https://twitter.com/astrodotbuild) على تويتر هو المصدر الرسمي لأخر المُستجدات من فريق Astro.
+*... تفقد [دليل التعامل مع الإضافات](/ar/guides/integrations-guide/)*.
 
-ونحن أيضًا نُعد نشرة إصدارات ونعلن عنها في [مُجتمعنا على ديسكورد](https://astro.build/chat) على قناة <span dir="ltr">#announcements</span>
+## انضم إلى المجتمع
 
-ليست كل إصدارات Astro تملك تدوينة نشرةٍ خاصة بها، لكن ستجد سجلًا للتغيرات في ملف [`CHANGELOG.md` في مستودع Astro](https://github.com/withastro/astro/blob/main/packages/astro/CHANGELOG.md).
+انضم إلى مجتمع [أسترو على ديسكورد](https://astro.build/chat/) للمشاركة، والحصول على المساعدة من مجتمعنا النشط والودود.
 
-## شيءٌ ما ناقص؟
+💬 رحب، وعرف بنفسك على قناة `#introduce-yourself`!
 
-إن كان هناك شيءُ ما غير مُوثق أو لو كنت تشعر بالحيرة والإرتباك من جزءٍ معين في التوثيق، لا تتردد في [رفع طلب خطبٌ ما في ملف التوثيق](https://github.com/withastro/astro/issues/new/choose)، مع اقتراحك للتحسين، أو قم بتغريد تغريدةٍ إلى حسابنا على تويتر [@astrodotbuild](https://twitter.com/astrodotbuild)، نحب سماع آرائك!
+💬 أطرح أسئلتك على فريق المساعدة في قناة `#support-threads`!
 
-## التَقدِير
+💬 شاركنا أعمالك التي صنعتها عبر أسترو على قناة `#showcase`!
 
-دليل باشر بالبدأ معتمدٌ على دليل البدأ الخاص بـ[React](https://ar.reactjs.org/).
+## طالع أكثر
+
+[مدونة أسترو](https://astro.build/blog/)
+
+[سجل تغيرات أسترو](https://github.com/withastro/astro/blob/main/packages/astro/CHANGELOG.md)
+
+[دليل الترقية بين الإصدارات](/ar/migrate/)
+
+## المساهمة
+
+أنت تُطالع هذا التوثيق بفضل كل هؤلاء الذين ساهموا، [انضم إلينا في GitHub!](https://github.com/withastro/docs)
+
+<ContributorList githubRepo="withastro/docs" />