مقدمة لتطوير الشبكة

HTML 5 logo on an iPhone smartphone with app icons around it in a cloud
مرحبا بكم في شبكة الإنترنت.

مرة أخرى في بلدي اليوم (حسنا, قبل يوم لي), كانت مهنة المطور على شبكة الإنترنت واحدة منخفضة. في المرتبة أدناه جرو كاره ولكن قبل يانكيز مروحة على مقياس الشرف المهنية. بسبب كل العلامات والصور الشفافية هل كنا, كنا ينظر إليها على أنها قراصنة الخام مع عدم وجود شعور جماليات.

جيد, نحن ربما لا تزال تفتقر إلى الحس الجمالي, ولكن كما وضعت ويب بحيث ديه مهنة المطور على شبكة الإنترنت. في هذه الأيام هناك عدد لا يحصى من أدوات يمكننا استخدامها لجعل مكتوبة جيدا, معايير المطابقة, وجميلة (حسنا, ربما ليس ذلك مشاركة واحدة) صفحات الويب. معظم المواقع الرائعة التي تستخدم اليوم (المكونات وقح: بما في ذلك هذا واحد) يتم بناؤها باستخدام هذه الأدوات.

وقد سمح لنا سرب من الأدوات على المتصفح نهاية لنا لخلق الأشياء على شبكة الإنترنت التي كانت لا يمكن تصورها فقط 10 منذ سنوات, مثل عدد لا يحصى من الشبكات الاجتماعية يدعي أنه أفضل وسيلة لإضاعة وقتك, “حار” البدء التكنولوجيا يدعي أحدثت ثورة في شيء وهذا ما تم بالفعل ألف مرة, واستنساخ الطيور الغاضبة بدعوى أن تكون أسوأ قليلا فقط من الأصلي. كل شيء على شبكة الإنترنت. ولذلك ربما يكون هذه الأدوات لم يذهب إلى أبعد من الاستخدامات.

فما هي هذه الأدوات المدهشة لقد تم الحديث عن? تقود الطريق كانت (بصراحة مذهلة) اللغات يسمى HTML5, CSS3, وجافا سكريبت, أنا الذي لقب 3 الفرسان للwebocalypse. هنا نظرة على كل واحد:

HTML

HTML (المعروف بشكل صحيح كما لغة توصيف النص التشعبي; يمكنك ان ترى لماذا الناس الذين لا يريدون لتبدو سيئة فقط استخدام اختصار) هو اللغة المستخدمة لوضع صفحات الويب. انقر بزر الماوس الأيمن على هذه الصفحة وانقر “عرض المصدر”. هذا هو HTML التي تستخدم هذه الصفحة.

أساسيا, HTML هي مجموعة من به, التي المتصفح يفسر ويحدد. مثلا, ننظر إلى هذا الكود:

<ع>أنا لا أعرف عنك, لكني أحب أزرار الضغط.</ع>

<ر>

<زر>انقر لي!</زر>

هذا الكود قد التفاف النص في فقرة (ال <ع> العلامة يبدأ فقرة, ال </ع> علامة تنتهي الفقرة.) هناك خط فاصل (ال <ر>) ثم زر يمكنك النقر فوق لقلبك ومضمون. سوف متصفحك يكمن ذلك على الشاشة بالنسبة لك.

ذلك أن كل شيء حسن وجيد. ولكن إذا كان لديك شيء سوى HTML, you get a webpage that looks like it came straight out of the 1990’s. لم يأت الكثير من الخير للخروج من هذا العقد على أي حال (تسريحات الشعر, موسيقى, إلخ) ولكن الانتظار! هناك المزيد!

CSS

اختصار أخرى. الصيف. CSS لتقف على أوراق الأنماط المتتالية, الذي قليلا من تسمية خاطئة لأنها لا تتالي حقا (أيا كان ذلك يعني… انها رمز الكمبيوتر, لا شلال!) CSS هي اللغة المستخدمة لصفحات الويب على غرار. هذا, أيضا, ما فسره متصفحك.

CSS و HTML العمل معا – HTML يجعل تخطيط للصفحة, CSS يعطيها مسحة ل. تخيل بناء منزل: يوفر HTML إطار خشبية باهتة ولكنها ضرورية, CSS يضيف ألوان النيون والأثاث ملتوي.

CSS هي لغة جميلة واضحة: لعلامة HTML معينة (مثل فقرة), يمكنك تحديد قيم لفئات نمط مختلف. سوف متصفحك قراءة CSS وتطبيقه على جميع علامات مطابقة HTML. مثلا:

ع {

لون: أحمر;

حجم الخط: 16مقصف;

}

وذلك في كل فقرة (الاشياء في HTML <ع> به) سوف يكون أحمر ويكون الخط 16 بكسل في حجمها. إذا كنت لاحظت, هذه هي بعض من نفس الأنماط التي يمكن استخدامها في Microsoft Word وغيرها من التطبيقات.

وحتى الآن وضعت صفحات الويب الخاص بها وأنها تبدو جميلة. ولكن هنا الشيء: هذا هو كل ما يفعلونه. انهم مجرد الجلوس هناك، وتبدو جميلة. وهو أمر عظيم وجميع, ولكن مستخدمي شبكة الإنترنت تريد المزيد. انهم يريدون الرسوم المتحركة الهوى. انهم يريدون النوافذ المنبثقة (حسنا, ربما فعلوا مرة أخرى في 2002, لكنني استطرادا.) انهم يريدون أزرار من شأنها أن تفعل الاشياء عند الضغط عليها.

حول ذلك مشاركة واحدة – هذا هو قضية. يمكنك جعل <زر> في HTML, ويمكن النقر فوقه كل أسبوع, لكنها لا تفعل أي شيء في أي وقت قريب. إذا كنت تريد أن الزر ل, أوه لا أعرف, تحرك الفيل عبر الشاشة ومهاجمة شيء, ثم كنت بحاجة الى شيء أكثر.

جافا سكريبت

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

مثل أي لغة برمجة, جافا سكريبت هي سلسلة من الأوامر التي تجعل المتغيرات واستخدام وظائف. الجزء باردة حول جافا سكريبت (جيد, بارد مثل لغة برمجة يمكن أن يكون) هو أنه يمكنك الوصول إلى تلك العناصر HTML (مثل الفقرات والأزرار) والأنماط CSS (مثل لون الخط وحجمه) وتغييرها. ننظر إلى هذا الرمز:

الفقرة قد = $('ع');

paragraph.css('اللون','الأزرق');

وهذا شفرة جافا سكريبت تجد كل الفقرات في الصفحة – ال $ علامة تخبر المتصفح للعثور على جميع عناصر مطابقة, و'ع’ يعني أنه يحتاج إلى اختيار الفقرات (تذكر <ع> عنصر من HTML?) ثم يمكنك تخزين الفقرات إلى متغير, والأمر المتصفح لتغيير نمط اللون CSS ل أزرق.

ما أجد للاهتمام (ثانية, هذا هو كل شيء من وجهة نظر “webdev”) هو كيف يعمل بأناقة اللغات الثلاث معا. أن السطر الأخير من جافا سكريبت تفاعلوا مع الصفحة في HTML وCSS تستخدم لنمط عليه. انها ليست مثل اللغات هذه ليست سوى عناصر مختلفة من نفس الشيء – انهم واحد ونفس, جوانب مختلفة من نفس الجهاز المدهش.

صوت رائعة? وأعتقد أنه لا. هذا مجرد جزء من الجمال على شبكة الإنترنت.

نشرت من قبل

نيل ميهتا

كلية هارفارد. المطور على شبكة الإنترنت. في وقت ما الفيلسوف. البيسبول المنافق.

One thought on “مقدمة لتطوير الشبكة”

  1. نجاح باهر فوجئت لمعرفة ان يو كتبوه, بعمل جيد هو الرصاص طيفة إلى هذا بالنسبة لي قبل أن تذهب إلى الحزم برمجة الويب سوير.

ترك الرد