تصميم مواقع الانترنت (Web)

Description
تصميم مواقع الانترنت (html css js) ?? رابط القناة الربح من الانترنت https://t.me/mo97221
للتواصل معي https://t.me/MS_97221
We recommend to visit

القناة الرسمية والموثقة لـ أخبار وزارة التربية العراقية.
أخبار حصرية كل مايخص وزارة التربية العراقية.
تابع جديدنا لمشاهدة احدث الاخبار.
سيتم نقل احدث الاخبار العاجلة.
رابط مشاركة القناة :
https://t.me/DX_75

Last updated 1 year, 5 months ago

القناة الرسمية لابن بابل
الحساب الرسمي الموثق على فيسبوك: https://www.facebook.com/Ibnbabeledu?mibextid=ZbWKwL

الحساب الرسمي الموثق على يوتيوب :https://youtube.com/@iraqed4?si=dTWdGI7dno-qOtip

بوت القناة ( @MARTAZA79BOT

Last updated 3 months ago

Last updated 1 month, 1 week ago

1 month, 1 week ago

سلام عليكم ...شباب اريد شخص مثلا يغير خلفية صورة عدا الجسم منو يعرف بالفوتوشوب يراسلني
@MS_97221

2 months ago

السلام عليكم
انا من غزة وعندي مشروع برمجة تطبيقات
والوضع عننا صعب والشمس ما بتطلع وبنشحن بصعوبة وما في شحن لابتوبات
والجوال لما ينشحن بينشحن ل20 بالمية وبالدور
الله يرضى عنكم دنيا واخرة تساعدوني بهاد المشروع
احنا بندرس بوضع صعب وخصوصا تخصصنا صعب بالحرب لانه مش متوفر كهربا واحنا بحصار
مطلوب نعمله بشاشات كونسول
عبرنامج مايكروسوفت فيجول ستوديو
ربنا يجزيكم الخير ويوقف معكم بكل ظروفكم الصعبة ويرزقكم بناس خير متلكم

2 months ago
4 months, 3 weeks ago
بعض المواقع التي يمكنك استخدامها لصنع …

بعض المواقع التي يمكنك استخدامها لصنع تطبيقات باستخدام أكواد HTML، CSS، وJavaScript مجانًا:

  1. PhoneGap
    (https://phonegap.com/):
    - يسمح لك بإنشاء تطبيقات موبايل هجينة باستخدام HTML وCSS وJavaScript.
    - يدعم العديد من المميزات مثل الوصول إلى أجهزة الهاتف (الكاميرا، الموقع، إلخ).

  2. AppGyver:
    - منصة مجانية تسمح لك ببناء تطبيقات موبايل باستخدام أدوات مرئية مع القدرة على إضافة كود HTML وJavaScript.
    - لا يتطلب خبرة برمجية عالية ويتيح لك إنشاء تطبيقات متقدمة.

  3. [Appery.io](http://Appery.io/):
    - يوفر بيئة تطوير تطبيقات تعتمد على HTML5 وCSS3 وJavaScript.
    - يمكنك من استخدام واجهة سحب وإفلات وتصميم تطبيقات مخصصة.

  4. Ionic Framework:
    - يمكنك استخدام HTML وCSS وJavaScript لإنشاء تطبيقات هجينة قابلة للتشغيل على Android وiOS.
    - يوفر مكتبة غنية من المكونات الجاهزة لتسريع عملية التطوير.

  5. Thunkable:
    - منصة تتيح لك إنشاء تطبيقات بدون أكواد، ولكن يمكن تخصيص بعض الأكواد مثل HTML وJavaScript للحصول على مميزات متقدمة.

هذه المنصات تقدم خدمات مجانية مع إمكانية استخدام أكواد HTML، ويمكنك البدء بتجربتها لتطوير تطبيقك.

5 months ago
5 months ago
6 months ago

خارطة جميلة لإختيار مسار محدد في البرمجة .

6 months, 1 week ago

عناصر إضافية في HTML:
1. <meta>:
- يُستخدم لتحديد بيانات الميتا (Meta Data) عن الصفحة، مثل الوصف، الكلمات المفتاحية، نوع الترميز. مثال:




  1. :
    - عنصر حاوية (Container) يُستخدم لتجميع العناصر معًا. لا يؤثر على التنسيق الافتراضي ولكن يُستخدم مع CSS لتنسيق المحتوى.
    html

    عنوان فرعي

    فقرة داخل div.

  2. :
    - عنصر مضمن (Inline) يُستخدم لتجميع جزء من النص معًا. لا يؤثر على التنسيق الافتراضي ولكن يُستخدم مع CSS لتنسيق النص.

```

هذا نص عادي و هذا النص باللون الأحمر.

```

### CSS (Cascading Style Sheets)

خصائص إضافية في CSS:
1. التخطيط المرن (Flexbox):
- يُستخدم لتصميم تخطيطات مرنة وسهلة التحكم.

```
.container {
display: flex;
flex-direction: row; / يمكن أن تكون column أيضًا /
justify-content: center; / يمكن أن تكون flex-start أو flex-end أو space-between أو space-around /
align-items: center; / يمكن أن تكون flex-start أو flex-end أو stretch /
}

```

  1. التحولات (Transitions):
    - تُستخدم لإضافة تأثيرات تغيير سلسة عند تغيير الأنماط.

```
.box {
width: 100px;
height: 100px;
background-color: blue;
transition: background-color 0.5s; / التغير في لون الخلفية سيستغرق 0.5 ثانية /
}

.box:hover {
background-color: red;
}

```

  1. الرسوم المتحركة (Animations):
    - تُستخدم لإنشاء تأثيرات متحركة.

```
@keyframes example {
from {background-color: red;}
to {background-color: yellow;}
}

.animated-box {
width: 100px;
height: 100px;
background-color: red;
animation-name: example;
animation-duration: 4s;
}

```

### JavaScript (JS)

مفاهيم إضافية في JavaScript:
1. استعلام عناصر DOM:
- يمكن الوصول إلى العناصر بطرق متعددة.

```
// الوصول إلى العناصر بواسطة id
var element = document.getElementById("myElement");

// الوصول إلى العناصر بواسطة class
var elements = document.getElementsByClassName("myClass");

// الوصول إلى العناصر بواسطة tag
var elements = document.getElementsByTagName("p");

// الوصول إلى العناصر بواسطة CSS selectors
var element = document.querySelector(".myClass");
var elements = document.querySelectorAll(".myClass");

```

  1. التعامل مع الأحداث (Events):
    - يمكن الاستماع للأحداث المختلفة على العناصر.

```
var button = document.getElementById("myButton");
button.addEventListener("click", function() {
alert("تم النقر على الزر!");
});

```

  1. التعامل مع النماذج (Forms):
    - يمكن التحقق من صحة النماذج ومعالجة البيانات.

```

```

#لا_تنسى_دعائكم_بالخير_لنا_ولكم

6 months, 1 week ago

أساليب كتابة الكود في جافاسكربت
بدايةً عليك معرفة أن كود الجافاسكربت عبارة عن مجموعة أوامر ( Statements ) يتم تنفيذها بالترتيب الموضوعة فيه.
طالما أن الأوامر مكتوبة بشكل صحيح فإنه سيتم تنفيذها بشكل كامل، أما إذا كان يوجد أمر ما مكتوب بشكل خاطئ فإنه لن يتم تنفيذه و لن يتم تنفيذ أي أمر موضوع بعده.

حساسية الأحرف
جافاسكربت تطبق مفهوم حساسية الأحرف ( Case Sensitivity ) و هذا يعني أنها تميز بين الأحرف الكبيرة و الأحرف الصغيرة.

مثال: note و Note ليسا شيئاً واحداً.

أسماء المعرّفات
جافاسكربت تعتمد أسلوب Camel Case في كتابة أسماء الأشياء التي يتم تعريفها. لذا إستخدم الأحرف الصغيرة عند اختيار أسماء للمتغيرات أو للدوال و في حال كان الإسم يتألف من أكثر من كلمة فإبدأ أول كلمة بحرف صغير و كل كلمة بعدها إبدأها بحرف كبير.

أمثلة
في حال كان الإسم يتألف من كلمة واحدة.

var age;
في حال كان الإسم يتألف من أكثر من كلمة.

var firstName;

الفاصلة المنقوطة
في جافاسكربت يعتبر وضع فاصلة منقوطة ; في نهاية كل أمر هو شيء اختياري يمكنك فعله و يمكنك تجاهله. بالرغم من أن وضع فاصلة منقوطة هو أمر اختياري إلا أننا ننصحك دائماً بأن تضعها فهذا الأمر يساعدك على ترتيب الكود و معرفة أين ينتهي كل أمر و قد يجنبك الوقوع في مشكلة تداخل الأوامر التي أنت بغنى عنها.

أمثلة
var name = 'Mhamad';
var country = 'Lebanon';

المسافات الفارغة
في جافاسكربت المسافات الفارغة و الأسطر الفارغة لا تسبب مشكلة في الكود و لكن عليك استخدامها بشكل مناسب يساعدك في قراءة الكود.

أمثلة
لاحظ كم هو مريح للنظر أن تبعد رمز المساواة عن الإسم و القيمة.

var language = 'Arabic';
و لاحظ كم هو سيء للنظر أن تلصق رمز المساواة بالإسم و القيمة.

var language='Arabic';

التعليقات
نستخدم التعليقات لنضع ملاحظات حول الكود الذي كتبناه فقط، لكي لا ننسى كيف برمجنا الكود في حال أردنا مراجعته أو التعديل عليه بعد وقت طويل. و بالطبع التعليقات لا تؤثر إطلاقاً على الكود المكتوب.

في جافاسكربت يوجد أسلوبين لوضع التعليقات:

تعليق على سطر واحد.
تعليق على عدة أسطر.
أمثلة
في حال كان التعليق يتألف من سطر واحد, نضع الرمز // قبل كتابة التعليق.

// this is a one line comment تعليق يتألف من سطر واحد
في حال كان التعليق يتألف من عدة أسطر، نبدأ التعليق بالرمز / و ننهيه بالرمز /.

/
This is multlines comment
هذا التعليق يتألف من عدة أسطر
/
الأحرف المستخدمة في وضع الأسماء في جافاسكربت
أي إسم نضعه لمتغير، دالة، كلاس، كائن إلخ.. يسمى identifier في البرمجة.
في جافاسكربت كل عنصر نريد تعريفه علينا إعطاءه إسم خاص لم نقم باستخدامه من قبل.

8 months, 3 weeks ago

اريد شخص ثقة وينشرلكم عن التصميم الويب وبفهمكم مفاهيم وشروحات @MS_97221

We recommend to visit

القناة الرسمية والموثقة لـ أخبار وزارة التربية العراقية.
أخبار حصرية كل مايخص وزارة التربية العراقية.
تابع جديدنا لمشاهدة احدث الاخبار.
سيتم نقل احدث الاخبار العاجلة.
رابط مشاركة القناة :
https://t.me/DX_75

Last updated 1 year, 5 months ago

القناة الرسمية لابن بابل
الحساب الرسمي الموثق على فيسبوك: https://www.facebook.com/Ibnbabeledu?mibextid=ZbWKwL

الحساب الرسمي الموثق على يوتيوب :https://youtube.com/@iraqed4?si=dTWdGI7dno-qOtip

بوت القناة ( @MARTAZA79BOT

Last updated 3 months ago

Last updated 1 month, 1 week ago