Skip to content

Commit f2c9ceb

Browse files
Merge pull request #21 from Aissaoui-Ahmed/examples
[DONE] EXAMPLES
2 parents c1601f2 + 4119774 commit f2c9ceb

File tree

13 files changed

+40
-40
lines changed

13 files changed

+40
-40
lines changed

src/v2/examples/commits.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
---
2-
title: GitHub Commits
2+
title: مساهمات GitHub
33
type: examples
44
order: 1
55
---
66

7-
> This example fetches latest Vue.js commits data from GitHub's API and displays them as a list. You can switch between the master and dev branches.
7+
> هذا المثال يقوم بجلب أحدث بيانات مساهمات Vue.js من GitHub [API](https://github.com/softvenue/i18n/blob/master/i18n.json#L53) وعرضهم في قائمة. يمكنك التنقل بين فروع master و dev.
88
99
<iframe width="100%" height="500" src="https://jsfiddle.net/yyx990803/c5g8xnar/embedded/result,html,js,css" allowfullscreen="allowfullscreen" frameborder="0"></iframe>

src/v2/examples/deepstream.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
---
2-
title: Realtime with deepstreamHub
2+
title: الوقت الحقيقي بواسطة deepstreamHub
33
type: examples
44
order: 9
55
---
66

7-
> This example uses [deepstreamHub](https://deepstreamhub.com/) to synchronize realtime data, send events and make remote procedure calls between clients (you can try opening it in multiple browser windows).
7+
> في هذا المثال نستعمل [deepstreamHub](https://deepstreamhub.com/) لمزامنة البيانات في الوقت الحقيقي، إرسال الأحداث وعمل نداءات عن بعد بين العملاء (يمكنك محاولة فتحه في نوافذ متصفح متعددة).
88
99
<iframe width="100%" height="500" src="https://jsfiddle.net/yyx990803/ff0sp9hw/embedded/result,html,js,css" allowfullscreen="allowfullscreen" frameborder="0"></iframe>

src/v2/examples/elastic-header.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
---
2-
title: Elastic Header
2+
title: الترويس المرن
33
type: examples
44
order: 7
55
---

src/v2/examples/firebase.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
---
2-
title: Firebase + Validation
2+
title: Firebase + التحقق
33
type: examples
44
order: 10
55
---
66

7-
> This example uses [Firebase](https://firebase.google.com/) as the data persistence backend and syncs between clients in real time (you can try opening it in multiple browser tabs). In addition, it performs instant validation using computed properties and triggers CSS transitions when adding/removing items.
7+
> في هذا المثال نستخدم [Firebase](https://firebase.google.com/) مداوم للبيانات في الخلفية ومزامنة بين العملاء في الوقت الحقيقي (يمكنك محاولة فتحه في علامات تبويب متصفح متعددة). بالإضافة إلى ذلك، فإنه يقوم بالتحقق من البيانات باستعمال الخاصيات المحسوبة وتشغيل إنتقالات CSS عند إضافة/حذف العناصر.
88
99
<iframe width="100%" height="500" src="https://jsfiddle.net/chrisvfritz/pyLbpzzx/embedded/result,html,js,css" allowfullscreen="allowfullscreen" frameborder="0"></iframe>

src/v2/examples/grid-component.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
---
2-
title: Grid Component
2+
title: شبكة المكون
33
type: examples
44
order: 3
55
---
66

7-
> This is an example of creating a reusable grid component and using it with external data.
7+
> هذا مثال لإنشاء شبكة مكون قابلة لإعادة الإستخدام وإستخدامها مع البيانات الخارجية.
88
99
<iframe width="100%" height="500" src="https://jsfiddle.net/Tertia/vbyon64p/6/embedded/result,html,js,css" allowfullscreen="allowfullscreen" frameborder="0"></iframe>

src/v2/examples/hackernews.md

Lines changed: 15 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,10 @@
11
---
2-
title: HackerNews Clone
2+
title: نسخة من HackerNews
33
type: examples
44
order: 12
55
---
66

7-
> This is a HackerNews clone built upon HN's official Firebase API, Vue 2.0 + Vue Router + Vuex, with server-side rendering.
7+
> هذا مثال على نسخة من HackerNews مبني على API الرسمي الخاص بـHackerNews مع Vue 2.0، Vue Router + Vuex، مع تصيير من جهة الخادم.
88
99
{% raw %}
1010
<div style="max-width: 600px;">
@@ -14,22 +14,22 @@ order: 12
1414
</div>
1515
{% endraw %}
1616

17-
> [Live Demo](https://vue-hn.herokuapp.com/)
18-
> Note: the demo may need some spin up time if nobody has accessed it for a certain period.
17+
> [عرض توضيحي حي](https://vue-hn.herokuapp.com/)
18+
> ملاحظة: قد يحتاج العرض التوضيحي لبعض الوقت في الدوران إذا لم يصل إليه أحد لفترة معينة.
1919
>
20-
> [[Source](https://github.com/vuejs/vue-hackernews-2.0)]
20+
> [[المصدر](https://github.com/vuejs/vue-hackernews-2.0)]
2121
22-
## Features
22+
## ميزات
2323

24-
- Server Side Rendering
25-
- Vue + Vue Router + Vuex working together
26-
- Server-side data pre-fetching
27-
- Client-side state & DOM hydration
28-
- Single-file Vue Components
29-
- Hot-reload in development
30-
- CSS extraction for production
31-
- Real-time List Updates with FLIP Animation
24+
- تصيير من جهة الخادم
25+
- Vue + Vue Router + Vuex للعمل معا
26+
- بيانات جهة الخادم قبل جلبها
27+
- حالة جهة المستخدم & إماهة DOM
28+
- مكون Vue للملف الوحيد
29+
- Hot-reload قيد التطوير
30+
- استخلاص CSS للانتاج
31+
- الوقت الحقيقي لتحديث قائمة مع تأثير القلب
3232

33-
## Architecture Overview
33+
## نظرة عامة عن هندسة
3434

3535
<img width="973" alt="Hackernew clone architecture overview" src="../../images/hn-architecture.png">

src/v2/examples/index.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
---
2-
title: Markdown Editor
2+
title: محرر Markdown
33
type: examples
44
order: 0
55
---
66

7-
> Dead simple Markdown editor.
7+
> مثال بسيط عن محرر Markdown.
88
99
<iframe width="100%" height="500" src="https://jsfiddle.net/chrisvfritz/0dzvcf4d/embedded/result,html,js,css" allowfullscreen="allowfullscreen" frameborder="0"></iframe>

src/v2/examples/modal.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
---
2-
title: Modal Component
2+
title: نموذج عن مكون
33
type: examples
44
order: 6
55
---
66

7-
> Features used: component, prop passing, content insertion, transitions.
7+
> الميزات المستخدمة: مكون، إرسال خصائص، إدراج محتوى، التحولات.
88
99
<iframe width="100%" height="500" src="https://jsfiddle.net/yyx990803/mwLbw11k/embedded/result,html,js,css" allowfullscreen="allowfullscreen" frameborder="0"></iframe>

src/v2/examples/select2.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
---
2-
title: Wrapper Component
2+
title: المكون المغلف
33
type: examples
44
order: 8
55
---
66

7-
> In this example we are integrating a 3rd party jQuery plugin (select2) by wrapping it inside a custom component.
7+
> في هذا المثال سندرج إضافة خارجية jQuery (select2) عن طريق تغليفها داخل مكون مخصص.
88
99
<iframe width="100%" height="500" src="https://jsfiddle.net/chrisvfritz/d131Lebj/embedded/result,html,js,css" allowfullscreen="allowfullscreen" frameborder="0"></iframe>

src/v2/examples/svg.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
---
2-
title: SVG Graph
2+
title: الرسم البياني باستخدام SVG
33
type: examples
44
order: 5
55
---
66

7-
> This example showcases a combination of custom component, computed property, two-way binding and SVG support.
7+
> هذا المثال يعرض حالات لمكون مخصص، خاصية المحسوبة، طريقتي الربط و ودعم SVG.
88
99
<iframe width="100%" height="500" src="https://jsfiddle.net/yyx990803/mhrckqgq/embedded/result,html,js,css" allowfullscreen="allowfullscreen" frameborder="0"></iframe>

0 commit comments

Comments
 (0)