لوحة المتصدرين
المحتوى الأكثر حصولًا على سمعة جيدة
المحتوى الأعلى تقييمًا في 03/18/23 في كل الموقع
-
الإصدار 1.0.0
6131 تنزيل
تعد Node.js بيئة تشغيل مفتوحة المصدر يمكن خلالها تنفيذ شيفرات مكتوبة بلغة جافاسكربت JavaScript دون الحاجة إلى متصفح ويب، وبذلك لم يعد المتصفح المشغل الوحيد والحصري لها ما فتح الآفاق لاستخدام جافاسكربت في مختلف المجالات وليس فقط في تطوير الواجهات الأمامية front-end لصفحات ومواقع الويب وإضافة الفاعلية عليها مع لغة HTML ولغة CSS، وتُستعمل Node.js عادةً في تطوير الواجهات الخلفية لتطبيقات ومواقع الويب عبر بناء خوادم ويب خلفية كما يمكن استعمالها لتطوير أدوات وبرامج تعمل من سطر الأوامر. ستتعلم في هذا الكتاب أساسيات البرمجة باستخدام Node.js بأسلوب عملي تطبيقي إذ ستبني خلال هذا الكتاب عدة تطبيقات وخوادم ويب مختلفة، وستصبح قادرًا في نهايته على كتابة برامج تستخدم مختلف ميزات Node.js منها التنفيذ الغير متزامن والتعامل مع الأحداث والتحكم بالعمليات وإدارة الوحدات. كما سيتطرق الكتاب إلى بعض المواضيع المتقدمة في البرمجة منها كيفية تنقيح تطبيقات Node.js وتصحيح الأخطاء فيها باستخدام الأدوات المتوفرة سواءً في نود نفسها أو في المتصفح عبر أدوات التطوير DevTools، وأيضًا كيفية كتابة وحدات اختبار unite tests لوظائف التطبيق للتأكد من عملها وفق المطلوب. الكتاب موجه لمن يريد تعلم مجال تطوير الواجهات الخلفية back-end أو مجال التطوير الشامل full stack كما يتطلب أن تملك خبرة أساسية على الأقل بلغة جافاسكربت إذ سيركز الكتاب على شرح بيئة Node.js وميزاتها واستخدامها ولن يشرح لغة جافاسكربت التي ستُستعمل في كل الكتاب، فإن لم يكن لديك خبرة بهذه اللغة، ننصحك بقراءة كتاب البرمجة بلغة جافاسكربت أولًا ثم هذا الكتاب. هذا الكتاب مُترجم عن كتاب How To Code in Node.js بواسطة موقع DigitalOcean وقد ساهم به مجموعة مؤلفين من فريق Stack Abuse وهو مرخص بموجب رخصة المشاع الإبداعي Creative Commons «نسب المُصنَّف - غير تجاري - الترخيص بالمثل 4.0». يمكنك قراءة فصول الكتاب على شكل مقالات من هذه الصفحة، «دليل تعلم Node.js»، أو مباشرة مما يلي: كتابة أول برنامج في بيئة Node.js وتنفيذه استخدام الوضع التفاعلي REPL في Node.js إدارة الوحدات البرمجية في Node.js باستخدام npm وملف package.json إنشاء وحدات برمجية Modules في Node.js طرق كتابة شيفرات غير متزامنة التنفيذ في Node.js اختبار الوحدات البرمجية باستخدام Mocha و Assert في Node.js إنشاء خادم ويب في Node.js باستخدام الوحدة HTTP استخدام المخازن المؤقتة Buffers في Node.js استخدام مرسل الأحداث Event emitter في Node.js تنقيح أخطاء Node.js باستخدام المنقح debugger وأدوات المطور DevTools التعامل مع العمليات الأبناء Child Process في Node.js التعامل مع الملفات باستخدام الوحدة fs في Node.js التعامل مع طلبات HTTP في Node.js1 نقطة -
في البداية هناك تفاوتات كبيرة في المميزات والعيوب والاستخدامات المناسبة. Node.js Node.js هو إطار عمل مبني على محرك JavaScript V8، ويستخدم لبناء تطبيقات الويب الحديثة التي تعتمد على الوقت الحقيقي والإرسال المستمر للبيانات، وغالبًا ما يستخدم في تطبيقات الشبكات والدردشة والألعاب الحية وتطبيقات الميديا. وبالتالي تتميز Node.js بالسرعة والقدرة على التعامل مع حمولات عالية والتحكم في الإدخال/الإخراج. كما يوفر أيضًا مجموعة كبيرة من المكتبات والأدوات لتطوير التطبيقات بسهولة. Laravel Laravel هو إطار عمل PHP شائع ويستخدم لبناء تطبيقات الويب المتكاملة. ويتميز Laravel بسهولة الاستخدام والمرونة والتحكم الكبير في قواعد البيانات. كما يوفر أيضًا مجموعة كبيرة من المكتبات والأدوات لتطوير التطبيقات بسهولة، وتدعم Laravel البرمجة الكائنية ونظام توجيه متقدم ويتكامل بسلاسة مع مكتبات الجافاسكريبت. ولذلك عندما يتعلق الأمر بالأداء، فإن Node.js يتفوق على Laravel، حيث تعمل Node.js بشكل متزامن ويمكنها التعامل مع عدد كبير من الطلبات بسرعة عالية، بينما يعمل Laravel بشكل متزامن وقد يتأخر في التعامل مع حمولة عالية من الطلبات. ومع ذلك، فإن Laravel يتميز بتوفير العديد من الأدوات والمكتبات التي تسهل عملية التطوير، ويعتبر من أفضل إطارات العمل لبناء تطبيقات الويب المتكاملة. لكن الأمر ليس بتلك البساطة، فهناك الكثير من العوامل التي لم يتم ذكرها وستؤثر على إختيارك. فبالنسبة لمشروع كبير يحتوي على معاملات حساسة وكبيرة، فإنه يمكن استخدام كلا الإطارين، ولكن يجب اختيار الإطار الذي يتناسب مع احتياجات المشروع بشكل أفضل. على سبيل المثال، إذا كانت سرعة الاستجابة والقدرة على التعامل مع الطلبات الكبيرة هي الأولوية، فقد يكون Node.js الخيار الأفضل. ومع ذلك، إذا كانت المتطلبات تتطلب القدرة على العمل مع قواعد بيانات كبيرة ومعقدة وإمكانية الوصول إلى المعلومات بسهولة، فقد يكون Laravel الخيار الأفضل. ومع ذلك، يجب ملاحظة أن الأداء ليس العامل الوحيد الذي يجب النظر إليه، بل يجب أيضًا النظر إلى المرونة والملاءمة للاحتياجات المحددة للمشروع كما أشرت.1 نقطة
-
أحاول البدء بمشروع React باستخدام الأمر : npm init react-app firstreactapp لكن دوما يظهر لي هذا الخطأ: npm ERR! code ERR_SOCKET_TIMEOUT npm ERR! network Socket timeout npm ERR! network This is a problem related to network connectivity. npm ERR! network In most cases you are behind a proxy or have bad network settings. npm ERR! network npm ERR! network If you are behind a proxy, please make sure that the npm ERR! network 'proxy' config is set properly. See: 'npm help config' npm ERR! A complete log of this run can be found in: npm ERR! C:\npm-cache\_logs\2023-03-18T18_52_50_147Z-debug-0.log Aborting installation. npm install --no-audit --save --save-exact --loglevel error react react-dom react-scripts cra-template has failed. Deleting generated file... node_modules Deleting generated file... package.json Deleting shadiapp/ from C:\Users\hp\Desktop Done. بحثت عن حلول من النت و جربتها لكن الخطأ نفسه يتكرر، وهذه هي المحاولات: 1- npm install -g create-react-app npx create-react-app hello-world 2- npm cache clean --force 3- npx create-react-app@latest my-app --use-npm 4- npm install npm@latest -g 5- create-react-app projectname --save 6- تحميل نسخة جديدة من Node. 7- npm config set fetch-retry-mintimeout 20000 npm config set fetch-retry-maxtimeout 120000 وفي كل مرة تظهر رسالة الخطأ نفسها عند البدء علما اني لااستخدم بروكسي، لكن الانترنت بطيء. هل هي مشكلة في بطء النت ؟1 نقطة
-
بالطبع من الممكن أن تكون المشكلة هي بطء الاتصال بالإنترنت الخاص بك. فيجب التأكد من إتصال الإنترنت بعمل إعادة تشغيل للراوتر أو تجربة إتصال إنترنت آخر أو تشغيل VPN أو تغيير إعدادات الـ DNS الخاصة بإتصال الإنترنت إلى: 1.1.1.1 1.0.0.1 يمكنك أيضًا المحاولة باستخدام الأمر التالي بدلاً من استخدام npm init react-app: npx create-react-app my-app ,هذا الأمر يعمل على تثبيت مشروع React جديد دون الحاجة إلى استخدام npm init react-app. والأفضل استخدام Vite في تثبيت react فهو أسرع بمراحل من webpack الذي يتم تثبيته عند استخدام الأمر npx create-react-app my-app. ولاستخدام Vite لتثبيت React قم باستخدام الأمر التالي: # npm في حالة الإصدار 6 من npm create vite@latest my-react-app --template react # npm في حالة الإصدار 7 أو أعلى من npm create vite@latest my-react-app -- --template react مع استبدال my-react-app باسم المشروع الخاص بك.1 نقطة
-
الطريقة الأولي يمكن أن تكون المشكلة في إصدار npm جرب تنفيذ الأمر التالي. npm i -g npm@8.5.1 الطريقة الثانية يمكن أن يكون سبب المشكلة هو بطئ النت لديك لذلك قم بتنفيذ هذه الأوامر. npm config set fetch-retry-mintimeout 20000 npm config set fetch-retry-maxtimeout 1200001 نقطة
-
السلام عليكم ورحمة الله وبركاته اللغة java تطبيق اندرويد قمت بإنشاء ملف pdf باستخدام Pdfdocument عند الانتهاء من الانشاء اغلقت الملف pdfdocument.finishPage() الان اريد فتح الملف في تطبيق pdf كيف اقوم بذلك؟1 نقطة
-
السلام عليكم. أريد القيام بفلترة بواسطة checkbox حسب نوع منتجات قمت بجلبها بواسطة api. أولا قمت بتحديد أنواع المنتجات // Categories Array const categories = products.map(product => product.category) .reduce((acc,item) => ((acc.includes(item)) ? acc : [...acc,item]),[]) ثم قمت بتكوين مصفوفة تحتوي نوع المنتج الذي أريد إخياره const [selected, setSelected] = useState([]); const handleCheck = (e) => { const { value, checked } = e.target; if (checked === true) { setSelected((pre) => [...pre, value]); } else { setSelected((pre) => [...pre.filter((item) => item !== value)]); } } الآن تأتي عملية الفلترة let checked = products.filter(item => selected.indexOf(item.category) !== -1) المشكلة التي واجهتني هي في كيفية عرض المنتجات الدي إخترتها حيث قمت ب: if (checked.length === 0) { setProducts(products) } else { setProducts(checked) } لكن هذا الكود لايظهر شيئا. شكرا على المساعدة.1 نقطة
-
يمكنك استخدام الكود التالي: const filtered = (selected.length === 0) ? products : products.filter(item => selected.includes(item.category)) وبهذا الشكل، إذا لم يتم تحديد أي صنف، فستعود المنتجات كما هي، وإذا تم تحديد أي صنف، فسيتم تصفية المنتجات بناءً على الصنف المحدد. بالنسبة للمتغيرات الإضافية التي كنت قد استخدمتها سابقًا، يمكنك الاستغناء عنها بسهولة من خلال تطبيق العبارة السابقة مباشرة في الدالة الخاصة بالفلترة.1 نقطة
-
انا مبتدأ في لارفيل أريد أن أنشيء موقع للاحداث والفعاليات وكل حدث له تاريخ معين وينتهي يتم عرضه في الصفحة الرئيسية واريد الزوار يدخلون يسجلون اسمهم ويضعون الإيميل للتسجيل في الحدث1 نقطة
-
يمكنك استخدام Laravel لبناء موقع للاحداث والفعاليات. سيكون عليك العمل على الخطوات التالية: إنشاء قاعدة بيانات تحتوي على جدول للأحداث وجدول للزوار. إنشاء نموذج Event و Visitor باستخدام الأمر php artisan make:model وتعريف العلاقة بينهما في الملفات Model. إنشاء وحدات تحكم (Controllers) لإدارة الأحداث والزوار باستخدام الأمر php artisan make:controller وتحديد الوظائف المطلوبة. إنشاء العرض الرئيسي (Home page) وعرض الأحداث التي لم تنته بعد باستخدام الدالة where في الاستعلام عن قاعدة البيانات. إنشاء العرض الخاص بتسجيل الزوار لحدث معين، يمكنك استخدام الدالة create في وحدة التحكم لإنشاء سجل جديد في جدول الزوار. إضافة نموذج الزوار وحقول الإدخال المطلوبة مثل اسم الزائر والبريد الإلكتروني وحقل الحدث. عرض قائمة بجميع الزوار المسجلين في الحدث باستخدام الدالة get في الاستعلام عن قاعدة البيانات. تحديد العلاقة بين جدول الأحداث وجدول الزوار باستخدام المفتاح الأجنبي في قاعدة البيانات. إضافة حماية للصفحات التي يتم الوصول إليها بعد تسجيل الدخول باستخدام ال Middleware. إضافة نظام تسجيل الدخول والتحقق من صحة بيانات المستخدمين بإستخدام Laravel Authentication. تلك هي بعض الخطوات الأساسية لإنشاء موقع للاحداث والفعاليات باستخدام Laravel. يجب عليك دراسة Laravel بشكل أكبر لتفهم الأمور بشكل أفضل وتطوير مهاراتك.1 نقطة
-
ممكن أن تستخدم الميديا كويري للشاشات الكبيرة وممكن أن تبدأ في الشاشات الصغيرة من خلال الميديا كويري .1 نقطة
-
هل هذا يعني ان استخدم الميديا كويري مع الشاشات الاكبر واجعل الجوال الاساس1 نقطة
-
من الطبيعي جداً مواجهة هذه الصعوبات في بداية تعلمك لتقنيات المهمة مثل جعل الصفحة متجاوبة مع جميع الشاشات ، لكن هناك ممارسات يمكنك تتبعها من أجل جعل الموقع مستجيب مع الشاشات :- بالإضافة إلى ما أخبر به المدرب عبدالباسط يمكنك عمل التالي : استخدم إطار عمل سريع الاستجابة: هناك العديد من الأطر المتجاوبة المتاحة ، مثل Bootstrap و Foundation ، والتي يمكن أن تساعدك في إنشاء تصميم سريع الاستجابة بشكل أسرع وأسهل. التصميم مع مراعاة الأجهزة المحمولة: بحيث أن تصفح المواقع أصبح الأن أكثر من خلال الأجهزة المحمولة، من المهم التصميم مع وضع الجوّال في الاعتبار. ابدأ بتصميم الجوّال أولاً ، حيث تصمم نسخة الجوال من موقعك أولاً ثم ترقى إلى أحجام الشاشات الأكبر.1 نقطة
-
يعتبر التجاوبية أصبحت أسهل من قبل بفضل استخدام التقنيات الجديدة مثل استخدام نظام شبكي grid system أو ال flexbox لترتيب العناصر بشكل منظم ومرن من خلال استخدامهما يمكنك بكل سهولة جعل التصميم متجاوب بدون كتابة media query واحدة . استخدام وسائط الإعلام media queries لتطبيق قواعد CSS مختلفة بناء على خصائص الجهاز، مثل العرض والارتفاع. استخدام صور وأيقونات vector-based أو responsive images لضمان جودة عالية وحجم مناسب على كافة الشاشات. استخدام وحدات القياس النسبية حيث تساعد بشكل كبير في تحسين تجاوبية الموقع دراسة الخطوات السابقة بشكل مفصل يمكن أن يجعلك لا تستخد أي media query أبداً أي سيصبح الموقع متجاوب بدون تعديل منك النقاشات التالية بها العديد من الحلول1 نقطة
-
اخي الفاضل يمكنك استخدام دالة تقوم بعملية الفلترة وترجع القائمة هنا في هذا الكود استخدمت ال text input لتسهيل الشرح ويمكنك استخدام المبدأ على اي شيء بعدها تم جلب البيانات من الapi في useEffect وتقوم بعمل تحديث للstate المسمى list عن طريق updateList وعند عمل تغيير في قيمة البحث (او ال checkbox) يتم تحديث قيمة الstate المسمى filter داخل الدالة المسؤولة عن التجاوب مع حدث التغيير handleSearch وفي دالة searching يتم النظر في قيمة الfilter اذا كانت لها قيمة (او selected) يتم فلترة القائمة واعادة الlist الجديدة اما اذا لم يكن هناك فلتر محدد فيتم ارجاع القائمة الاصلية ويتم عمل map على القيمة المرجعة من دالة searching لاحظ استعمال التعبير cardsList?.map باستخدام ? حيث تنبه الكود انه اذا كانت القائمة فارغة فلا يطبق عملية الmap (في حالة لم يتم جلب البيانات او كانت البيانات فارغة اصلا) import React, { useEffect, useState } from 'react'; import css from './App.module.css'; import axios from 'axios'; const Card = ({id, credit_card_type, credit_card_expiry_date, credit_card_number}) => { return ( <div className={css.card}> <h4>{credit_card_type}</h4> <p>{credit_card_number}</p> <strong>{credit_card_expiry_date}</strong> </div> ); }; function App() { const [filter, setFilter] = useState(''); const [list, updateList] = useState(null); useEffect(() => { const getCards = async () => { const response = await axios.get("https://random-data-api.com/api/v2/credit_cards",{ params:{ size:10 } }) updateList(response.data) } getCards(); },[]); const handleSearch = (e) => { setFilter(e.target.value); } const searching = () => { if(filter){ return list.filter(item => item.credit_card_type.toLowerCase().includes(filter.toLowerCase())); } else { return list; } } const cardsList = searching(); const cards = cardsList?.map(item => ( <Card key={item.id} {...item} /> )); return ( <> <input type="search" placeholder="Search" onChange={handleSearch} value={filter} /> <div className={css.container}> {cards} </div> </> ); } export default App;1 نقطة
-
يمكنك استخدام هذا الكود. {checked.forEach((product) => ( <div key={product.id}> <h3>{product.name}</h3> <p>{product.description}</p> </div> ))} في هذا المثال، يتم استخدام forEach() لعرض المنتجات المختارة. يتم تحويل كل عنصر في مصفوفة checked إلى عنصر JSX يتم عرضه في الصفحة. يمكنك استخدام أي عنصر JSX تريده لعرض المنتجات المختارة، ولكن يجب تحديد مفتاح فريد لكل عنصر. أتمنى أن يكون هذا مفيدًا! أخبرني إذا كان لديك أي أسئلة أخرى.1 نقطة
-
وعليكم السلام، أرجو منك قراءة الدليل التالي لتثبيت بايثون 3 على macOS، وإذا واجهتك أية مشاكل لا تتردي في السؤال هنا.1 نقطة
-
إذا التقى شخصان في قرى الهيمالايا، حيِّا أحدهما الآخر قائلًا: "هل جسدك معافى؟" وأما في اليابان فقد ينحنيان أحيانًا، وفي عُمان يطبع كلّ منهما قبلة على أنف الآخر بعد التصافح، في كمبوديا وتايلاند، يضمّ كلّ منهما يديه وكأنّه يدعو. كل هذه الوسائل هي "بروتوكولات" للتواصل، أي سلسلة بسيطة من الرموز ذات المعنى والّتي تمهّد لتبادل حديث مُفيد. في عالم الويب، لدينا بروتوكول فعّال جدًّا على مستوى التّطبيقات يُمهّد الحواسيب حول العالم لتبادل الأحاديث النّافعة، واسمه Hypertext Transfer Protocol، أو HTTP اختصارًا؛ وهو بروتوكول يُصنّف ضمن طبقة التّطبيقات فوق TCP/IP، وهو أيضًا بروتوكول للتواصل. كثيرًا ما يغيب شرح HTTP في دروس التصميم والتطوير للويب، وهذا أمرٌ مُخزٍ: ففهمه يُعينك في تحسين تفاعل المستخدم وتحقيق أداء أفضل للموقع وإنشساء أدوات فعّالة لإدارة المعلومات على الويب. هذا المقال هو الجزء الأول من سلسلة تهدف إلى تعليم أساسيّات HTTP، وكيف يمكن استخدامه بفعّاليّة أكبر. سنطّلع في هذا الدّرس على محلّ HTTP من الإنترنت. ما معنى بروتوكول تواصل؟ قبل الدّخول في التفاصيل، لنتخيّل موقفًا بسيطًا يحدث فيه تواصل بين طرفين، ولكي يحدث هذا التواصل، فإن على الطّرفين (برنامجين كانا أم جهازين أم شخصين... إلخ.) أن يتّفقا على: الصياغة (تنسيق البيانات) الدلالات (معلومات التحكم والتعامل مع الأخطاء) التوقيت (تطابق السرعة والتتالي) عندما يلتقى اثنان، فإنّهما يتفاهمان من خلال بروتوكل تواصل: ففي اليابان مثلًا، يؤدي أحدهما حركة جسدية، كأن يحني ظهره. وهذه هي الصياغة المعتمدة في التواصل. وفي عادات اليابان، تدل حركة الانحناء هذه (وحركات أخرى مشابهة) على التّحيّة. وبحركة انحناء أحد الشخصين للآخر تنطلق سلسلة من الأحداث بينهما مرتبة بتوقيت معيّن. يتركّب بروتوكل التواصل عبر الشبكات من المكوّنات ذاتها. فأمّا الصّياغة فهي سلسلة من الحروف كالكلمات المفتاحيّة المُستخدمة في كتابة البروتوكول، وأمّا الدلالات فهي المعاني المُرتبطة بكلّ من هذه الكلمات، وأمّا التوقيت فهو ترتيب تبادل هذه الكلمات بين الطّرفين. ما محلّ HTTP من الإنترنت؟ يقوم HTTP نفسه فوق بروتوكولات أخرى. فعند الاتصال بموقع ويب مثل www.example.org، يستخدم وكيل المستخدم (user agent) مجموعة بروتوكولات TCP/IP، والتي صُمّمت في عام 1970 مؤلّفة من 4 طبقات: طبقة الوصلة (Link)، والتي تصف الوصول إلى الوسيط المادّي (كاستخدام بطاقة الشبكة مثلًا) طبقة الإنترنت، والتي تصف كيفيّة تغليف البيانات وتوجيهها (IP أو Internet Protocol) طبقة النقل (Transport)، والتي تصف كيفية نقل البيانات من نقطة الانطلاق إلى الوجهة (TCP وUDP) طبقة التطبيقات (Application)، والتي تصف معنى وصياغة الرسائل المنقولة (HTTP) فـ HTTP إذًا هو بروتوكول على مستوى التطبيقات يقوم على الطبقات السابقة، لا تنسَ هذه الفكرة. يُساعد فصل هذا النّموذج في طبقات على تطوير أجزاءه بصورة منفصلة دون الحاجة لإعادة تصميمها جميعًا. فمثلًا، يمكن تطوير TCP، باعتباره بروتوكولًا في طبقة النّقل، دون الحاجة لتعديل HTTP كونه برتوكولًا في طبقة التّطبيقات. لكن الواقع العمليّ يجعل التفاصيل أكثر تعقيدًا عند الحاجة للوصول إلى تواصل ذي أداء عالٍ. سنركّز في الأجزاء الأولى من هذه السّلسلة على فصل الطّبقات كما هو مُعرَّف في نموذج TCP/IP. صُمِّم HTTP بغرض تبادل المعلومات بين برنامجين من خلال رسائل تُسمّى رسائل HTTP، وتؤثّر طريقة تشكيل هذه الرسائل في العميل (client) والخادوم (server) والأطراف الوسيطة (كالخواديم الوكيلة proxies). لنتواصل مع خادوم! يُعتبر المنفذ رقم 80 المنفذ المبدئيّ للاتّصال بخواديم الويب، ويمكن التأكّد من ذلك بتجربة نُجريها من الطّرفيّة. افتح الطّرفية (أو سطر الأوامر) وجرّب الاتصال بـ www.opera.com على المنفذ 80 مُستخدمًا الأمر التالي: telnet www.opera.com 80 من المُفترض أن يكون الناتج: Trying 195.189.143.147... Connected to front.opera.com. Escape character is '^]'. Connection closed by foreign host. كما نرى فإن الطرفيّة تحاول الاتصال بالخادوم ذي عنوان IP 195.189.143.147. إن لم نفعل شيئًا آخر سيغلق الخادوم الاتصال بنفسه. من الممكن بالطّبع استخدام منفذ آخر بل وحتّى بروتوكول تواصل آخر، ولكن هذه هي الإعدادات الشّائعة. لنتحدّث بلغة HTTP! لنحاول ثانية التواصل مع الخادوم. أدخل الرسالة التالية في الطرفية (أو سطر الأوامر): telnet www.opera.com 80 ما إن يُؤسّس الاتصال، اكتب رسالة HTTP التالية بسرعة (قبل أن يُغلق الخادوم الاتصال بنفسه)، ثم اضغط Enter مرّتين: GET / HTTP/1.1 Host: www.opera.com تُحدّد هذه الرسالة: GET: أي أننا نريد "الحصول على" تمثيل البيانات. /: أي أنّ المعلومات التي نريدها مخزنة في جذر الموقع. HTTP/1.1: أي أننا نتحدث ببروتوكول HTTP ذي الإصدارة 1.1. Host:: أي أننا نريد الوصول إلى الموقع المُحدّد. www.opera.com: اسم الموقع هو www.opera.com. على الخادوم الآن أن يُجيب طلبنا. من المفترض أن تمتلئ نافذة الطرفية بمحتوى مشابه لما يلي: HTTP/1.1 200 OK Date: Wed, 23 Nov 2011 19:41:37 GMT Server: Apache Content-Type: text/html; charset=utf-8 Set-Cookie: language=none; path=/; domain=www.opera.com; expires=Thu, 25-Aug-2011 19:41:38 GMT Set-Cookie: language=en; path=/; domain=.opera.com; expires=Sat, 20-Nov-2021 19:41:38 GMT Vary: Accept-Encoding Transfer-Encoding: chunked <!DOCTYPE html> <html lang="en"> ... يقول الخادوم هنا: "أنا أتحدث HTTP الإصدارة 1.1. نجحَ طلبك، لذا أجبت بالرمز 200." الكلمة OK ليست إلزامية والهدف منها شرح معنى الرمز للبشر - وهي تُشير في حالتنا إلى أن الأمور تسير على ما يرام وأن رسالتنا قُبلت. يلي ذلك سلسلة من "ترويسات HTTP" التي تُرسل لتصف الرسالة، وكيف يجب أن تُفهم. أخيرًا نجد محتويات الصفحة المُستضافة على جذر الموقع، والّتي تبدأ بـ <!DOCTYPE html>.1 نقطة
