[Powered by Google Translate] [সপ্তাহ 9, ক্রমাগত]
[ডেভিড জে Malan - হার্ভার্ড বিশ্ববিদ্যালয়]
[এটি CS50. - CS50.TV]
>> এটি CS50. এই সপ্তাহে 9 শেষে. আপনাকে অনেক ধন্যবাদ.
অবশেষে. 9 সপ্তাহ. আমি পেয়েছি.
আজ আমরা ওয়েব প্রোগ্রামিং সম্পর্কে আমাদের কথোপকথন অবিরত
চূড়ান্ত প্রকল্পের দিকে নজর দিয়ে, আপনি আছে কারণ না কিছু ওয়েব ভিত্তিক না
প্রকল্পের জন্য চূড়ান্ত কিন্তু কারণ চূড়ান্ত প্রকল্পের জন্য অথবা পরে CS50
অবশ্যই এই দিক থেকে আধুনিক সফ্টওয়্যার যাচ্ছে.
এবং এখনো এটা আসলে একটা সহজ বিষয় না.
আসলে, hardest জিনিষ না এক নকশা দৃষ্টিভঙ্গি.
>> নকশা দ্বারা উদাহরণস্বরূপ, আসলে আমরা ইউজার ইন্টারফেস গড় পেয়ে
অথবা ব্যবহারকারীর অভিজ্ঞতা অধিকার.
আমি অনুমান করা - এবং আমরা একটি সাম্প্রতিক সমস্যা সেট থেকে জানা
যখন আপনি একটি কয়েক সফ্টওয়্যার কিছু টুকরা সম্পর্কে আপনার পিত্তশূল বেদনা কালে
অথবা হার্ডওয়্যার যে infuriates উপর ক্যাম্পাস অথবা বন্ধ কিনা আপনি, -
সেখানে আউট সাইটের অনেক আছে, আছে আউট আছে হার্ডওয়্যার অনেক,
তজ্জাতীয় sucks.
কিন্তু বাস্তবতা হল যে জিনিস আছে এখনো ব্যবহার করার সহজ অথচ শক্তিশালী হয়
একটি খুব কঠিন চ্যালেঞ্জ.
তাই আমি জোসেফ এবং টমি সম্পর্কে পর্যন্ত এখানে যোগদানের জন্য আজ জিজ্ঞাসা
যাতে আমরা একটি কথোপকথন থাকতে পারে, উভয় সম্পর্কে নকশা
এবং কি ধরণের চিন্তার প্রসেস আপনার মাথার মধ্যে দিয়ে যাচ্ছিলেন শুরু করা উচিত
যখন আপনি আপনার প্রকল্পের চূড়ান্ত ডিজাইন, আপনার ভবিষ্যতে চেষ্টা.
টমি এর সাহায্যে এবং তারপর আমরা বাস্তবায়ন বিবরণ কিছু তাকান করব.
কিভাবে কাগজে বা আপনার মত আপনি কিছু দৃষ্টি থাকতে পারে
তারপর আপনি যে চালানো programmatically পারেন
প্রযুক্তি এবং কিছু কৌশল ব্যবহার করে আমরা শুরু করেছি বলছি,
যেমন জাভাস্ক্রিপ্ট এবং কিছু এমনকি নতুন যথা, AJAX, অ্যাসিঙ্ক্রোনাস জাভাস্ক্রিপ্ট.
আপনি যে সকল একটি ইউজার ইন্টারফেসের আরো গতিশীল তৈরি করা যাবে
দ্বারা আনয়ন একটি সার্ভার থেকে কার্যক্রমে আরো এবং আরো তথ্য.
তাই আমরা যারা টুকরো কিছু দেখতে ভাল আজ করব.
হিসাবে একটি সরাইয়া, যদি আপনি কম্পিউটার বিজ্ঞান মধ্যে মনোযোগ আগ্রহী
অথবা কম্পিউটার বিজ্ঞানে minoring, জানি যে এই শুক্রবার দুপুরে
ম্যাক্সওয়েল Dworkin 221 সালে করা একটি পিজা ইভেন্ট থাকবে
যেখানে আপনি কম্পিউটার বিজ্ঞান বিষয়ে জানার জন্য একটি আরো বিট করতে পারেন.
দরজা আউট আপনার উপায় আজ আপনি হার্ভার্ড এ বাছাই একটি CS যাও বেসরকারী গাইড আপ করতে পারবেন.
আমরা বাইরে ট্র্যাশ ক্যান এটা কোমর উচ্চতা এ রেখে দেব
তাই যে আপনি যদি এই দখল এবং CS সম্পর্কে আরো একটু জানতে চাই,
যে আপনার জন্য আছে হিসাবে সপ্তাহে 0 সালে হবে.
এছাড়াও আপনি যদি CS50 লাঞ্চ জন্য 1:15 অপরাহ্ন আমাদের সঙ্গে যোগদান এই শুক্রবার চাই,
আগাইয়া যাও cs50.net/lunch.
আরও ঝামেলা ছাড়া, আমি দিতে শিক্ষণ সহকর্মী জোসেফ Ong আপনি.
হাই. [সাধুবাদ]
ধন্যবাদ.
প্রথমবার আমি ডিজাইন সম্পর্কে শিখেছি এখানে একটি বর্গ নামক CS179 ছিল.
>> এ সময় অধ্যাপক বলেন অন্য অধ্যাপক আমাদের সম্পর্কে বিবরণ
এবং যারা একটি হোটেল কুটনীতিকরা FAUCETS ব্যবহৃত ছিল.
সম্পর্কে কেউ কি বাম 2 knobs বলতে পারেন এবং অধিকার কি?
[ছাত্রদের] গরম এবং ঠান্ডা. >> গরম এবং ঠান্ডা. গুড.
সাধারণত আপনি কি আশা, অধিকার?
চুঙ্গি ব্যবহার করে পরে এই অধ্যাপক একটি ঝরনা নিতে চায়, এবং তিনি এই ব্যবহার আয়.
তিনি মনে বাম এবং ডান পাশ গরম এবং ঠান্ডা করার জন্য ডান,?
কিন্তু আসলে কি এই সম্পর্কে কেউ কি বলতে পারেন?
কোন হাত?
[শ্রবণাতীত ছাত্র প্রতিক্রিয়া] >> ওয়ান পরামর্শ হল?
[শ্রবণাতীত ছাত্র প্রতিক্রিয়া] >> তাপমাত্রা?
সুতরাং তাদের মধ্যে একজন এবং অন্যান্য তাপমাত্রা নিয়ন্ত্রন? >> [ছাত্রদের] জল চাপ.
জল চাপ. গুড.
এই অধ্যাপক মধ্যে এই পদচারনা এবং, তারা চিন্তা গরম এবং ঠান্ডা নিয়ন্ত্রণ করা হয়,
সঠিক, যা তিনি মনে গরম, সব পথ আপ জন্য সক্রিয়
কারণ তিনি একটা গরম শাওয়ার নিতে চায়.
ওয়েল, এই সত্যিই মেলে না, তাই তিনি এই খুব মজা না পায় অভিজ্ঞতা
হচ্ছে একটি ঠান্ডা ঝরনা মধ্যে, এবং আমরা সব কি যে ভালো মনে জানি.
এটি একটি নকশা খুঁত একটি উদাহরণ.
মানে আমি কি দ্বারা যে কোনো কল থেকে তার প্রত্যাশা
কি কি ঝরনা বেরিয়ে আসেন মেলে,
যা তার জন্য দু: খজনক যে ধরনের.
সুতরাং এই একটি নকশা খুঁত বাস্তব জীবনে যে এরকম একটি উদাহরণ.
কিন্তু আমরা অন্যান্য বেশী সমস্ত প্রকারের হিসাবে দেখতে ভাল.
আমরা সম্ভবত MBTA সিস্টেমের ভক্ত না.
এটি একটি লন্ডনের পাতাল রেল আসলে সিস্টেম, যা বলে, "এই বাটন ব্যবহার না."
কেন আছে এমনকি এটি? কেন আমরা এমনকি যত্ন?
আমি যখন একটি ছাগলছানা, ঘর হচ্ছে এক উপলব্ধি কারিগরি,
যখনই কম্পিউটার ক্র্যাশ করবে, আমার মায়ের সম্পর্কে আসতে হবে,
দেখাচ্ছে এই পর্দা সম্পর্কে এবং সম্পর্কে জিজ্ঞাসা করে কি ঘটেছে.
>> এমনকি এর মানে কি আমি জানি না.
[হাস্য] কি?
[হাস্য]
কখনও কখনও আমরা সফটওয়্যার ডেভেলপারদের মত মনে হয় ঠিক আছে trolling আমাদের.
ব্যবহারকারী হিসাবে আমরা, ভালো থাকেন "? কি করছেন কেউ কেউ আমাদের জানাতে হবে."
এই সব নকশা একটি বিষয় আসে নিচে.
ডিজাইন, হিসাবে আমরা দেখতে পারেন, বিশুদ্ধরূপে হয় নন্দনতত্ব সম্পর্কে না,
এটি কিভাবে যে চেহারা সম্বন্ধে না.
আমরা এখানে দেখতে যে আসলে এই পপ আপ এখানে একটু বেশী সুন্দর সুন্দর দেখায়.
এই পটভূমিতে একটি ড্রপ ছায়া আছে, এটি সীমানা যাওয়া radiuses আছে.
এটি বেশ ধরনের.
এটা কারণ এর ফলে ব্যবহারকারী বন্ধুত্বপূর্ণ না পরিকল্পিত সত্যিই ভাল না.
যে সামান্য পপ আপ আপ আসে যে কোনো তথ্য দিতে না সত্যিই সম্পর্কে
কি দেয়া হবে, এটি ব্যবহারকারী হিসাবে কিছু না বলতে সম্পর্কে
যে ত্রুটি সম্পর্কে কিভাবে পুনরুদ্ধার.
আমরা যে নকশা নয় সম্পর্কে ভাবতে চাই.
প্রথমত, এটা নন্দনতত্ব না.
তবে এটাও আপনার অ্যাপ্লিকেশন ঠাসাঠাসি অপ্রয়োজনীয় কার্যকারিতা টন না.
আপনি যদি একজন থাই রেস্টুরেন্ট, আপনি সম্ভবত একই সময়ে একটা দাঁতের ডাক্তার হতে চাই না.
এবং ফেসবুক প্রশ্নের সাথে, অনেক মানুষ এটা ব্যবহার করা
এবং এটি ছিল সত্যিই কি তারা ভবন ছিল কোর না.
এবং তাই এর সম্পর্কে মনে এত জিনিস পরিমাণ না চমৎকার
যে আপনি আপনার আবেদন কিন্তু মান স্থাপন করছি
এবং কিভাবে আপনি যে ব্যবহারকারীর অভিজ্ঞতা আরও ভালো করছেন
আপনি কি ইতিমধ্যে আছে উপর দ্বারা আসলে উন্নতি.
>> সংক্ষেপে ইন, নকশা আমাদেরকে বলে কি আমরা গড়ে তুলতে হবে.
উদাহরণস্বরূপ, যদি আমরা কিছু জিনিস যা আমাদের আপ অনুসন্ধান যাক ঘর তৈরী করছি,
উদাহরণের জন্য Google ভালো,, সে ব্যাপারে আমরা এমনভাবে করবেন
যে ব্যবহারকারীর ক্লিকের প্রচুর তারা কী চান পেতে গ্রহণ করার প্রয়োজন,
অথবা একটি উপায়ে আমরা এটি করতে হবে যেমন জন্য Google তাত্ক্ষনিক বা স্বয়ংসম্পূর্ণ সঙ্গে,
যা আপনাকে আমাদের ফলাফল ও আমাদের দ্রুত পেতে পারি?
প্রকৌশল জড়িত থাকে, ভালো টমি দেখাতে, আসলে এটি নির্মাণ হবে.
নকশা ধরনের প্রচুর আছে.
উদাহরণস্বরূপ, যদি আপনি কিছু ঘর তৈরী করছি কিছু স্থাপন যাও
একটি তৃতীয় বিশ্ব দেশ যেখানে অনেক বিদ্যুত বা যে অনেক প্রযুক্তি আছে না,
আপনি কি আপনার ঘর তৈরী করছি ডিজাইন আছে
একটা উপায় আছে যে সহজে মানুষ অ্যাক্সেস দেয়.
কিন্তু কি আছে অন্যান্য নকশা সিদ্ধান্ত অসুস্থ হতে পারে
বা ভালো কিছু জড়িত হতে পারে?
হাঁ. আমি একটা হাত দেখতে.
[শ্রবণাতীত ছাত্র প্রতিক্রিয়া] >> রাইট. ঠিক. বিশেষ ব্যবহারকারীদের জন্য এক জিনিস.
মানুষের সম্পর্কে অনেক না, মনে করি না "কি আমার ব্যবহারকারীদের সম্পর্কে?"
ভালো হয় আদর্শের চরম.
আমি ব্যবহারকারীরা তাদের অক্ষমতা আছে যা আমি চিন্তা করছি না পারে আছে
এবং আমি শুধু সাধারণ ব্যবহারকারীর জন্য নকশা সম্পর্কে চিন্তা করছি.
ইন্টারনেট হচ্ছে আজকাল সবাই দ্বারা ব্যবহারযোগ্য,
এবং আমি যাদের জন্য হিসাবে ভাল নকশা করা উচিত.
কি অন্য নকশা সিদ্ধান্ত অসুস্থ করতে পারে?
হ্যাঁ. >> [ছাত্রদের] খরচ.
খরচ. খুব ভাল.
আরেকটা জিনিস আমরা আমাদের পরিকল্পনা সিদ্ধান্তের ওপর বেস খরচ হতে পারে.
যদি আমরা একটি ব্যবসা, আপনি যা উত্পাদন করে অনেক খরচ না বিল্ড করতে চান
কিন্তু একটি বিশেষ করে উচ্চ খরচে বা মুনাফা আমাদের কিছু পেতে পারেন বিক্রী করতে পারে.
>> এগুলি সব নকশা বিভিন্ন ধরনের, কিন্তু যখন আমরা কিছু করছি ইন্টারনেটের ভবন
অথবা যখন আমরা কিছু যে সম্ভবত এখন পর্যন্ত নির্মাণের খরচ আছে যে অনেক না ঘর তৈরী করছি,
ইন্টারনেট অ্যাপ্লিকেশন যেমন - আপনি তা অনেক মূলধন নিক্ষেপ করা হবে না
যাতে কিছু যে আসলে কাজ করতে -
আমরা কি আদৌ উদ্বিগ্ন হয় আরো সম্পর্কে ব্যবহারকারীর অভিজ্ঞতা.
আমরা এই ব্যবহারকারী কেন্দ্রিক নকশা কল.
মূলত কি ব্যবহারকারী কেন্দ্রিক নকশা জড়িত থাকে আপনার ব্যবহারকারীদের জুতা হয় নিজের নির্বাণ.
যদি আমি কি করছি নির্মাণের জন্য কেউ সাইন আপ,
তারা আমার বিশেষ আবেদন স্পষ্টত করেছি মনের মধ্যে একটি লক্ষ্য সঙ্গে আসা,
তারা সম্পূর্ণ একটি টাস্ক সঙ্গে চান.
এবং আপনার কাজ হয় না শুধুমাত্র তাদের যে টাস্ক সম্পূর্ণ সাহায্য
কিন্তু তাদের সাথে এমনভাবে যা দক্ষ, স্বজ্ঞাত যে টাস্ক সম্পূর্ণ সাহায্য,
এবং, কিছু ব্যক্তি হিসাবে ওইখানে বলেন, প্রবেশযোগ্য.
দক্ষতা মানে কি?
দক্ষতা মানে কত তাড়াতাড়ি আমার ইউজার ইন্টারফেসের জন্য টাস্ক দেওয়া আমার সম্পূর্ণ.
এটা অনেক ক্লিকের জন্য তাদের কাছ থেকে অন্য এক জায়গায় পেতে সময় লাগবে?
এটা কি ক্লান্তিকর? না তারা ক্রমাগত কর্ম সঞ্চালন প্রচুর আছে?
আমরা যতটা সম্ভব দক্ষ হিসাবে যে প্রক্রিয়া করতে চাই
তাই তারা যেসব যারা অসুস্থ না আছে.
জন্য intuitiveness হিসাবে, যে যেমন হয়, যদি কোনো ব্যবহারকারী দেখায় আমার ইন্টারফেস আপ,
এটা সহজ করার জন্য তাদের থেকে জায়গায় পেতে?
এটা সহজ করার জন্য তাদের আউট জিনিসটা কি তারা আমার ইন্টারফেসে ক্লিক আছে
যাতে তাদের লক্ষ্য বা টাস্ক যে তারা অর্জন করতে চান অর্জন যাও?
>> এবং পরিশেষে, হিসাবে এক ব্যক্তির ওইদিকে বলেন, অভিগম্যতা খুবই গুরুত্বপূর্ণ.
[পুরুষ স্পিকার] এটা দৃষ্টি ভালো জিনিসের জন্য অভিগম্যতা আসে,
পছন্দ না আমি আসলে একজন অন্ধ জন্য কিছু ডিজাইন?
ওহ. যারা এ সব দেখতে পারে না, আমরা কিছু বলা স্ক্রিন রিডার আছে.
আপনি কি কি করতে হবে আপনার একটি উপায়ে আপনার ওয়েবসাইট নির্মাণ করা উচিত
যে, উদাহরণস্বরূপ, নির্দিষ্ট প্রযুক্তি কি আমরা কল -
এখন অনেক জিনিস আছে.
আমি মনে করি পর্দা নামক JAWS পাঠক আছে.
এইসব জিনিস অনেক নির্ভর কি আমরা এলাকা নিয়ম কল
যাতে ব্যবহারকারী যাও যাও আউট পড়া কি পাতা উপস্থিত ছিলেন.
সেইসব মানুষ ছাড়া যারা দেখতে পারছি না, আপনি নিশ্চিত করা প্রয়োজন যে এই স্ক্রিন রিডার
আসলে বাছাই পৃষ্ঠায় কন্টেন্ট আপ করতে পারেন এবং আপনার ব্যবহারকারীদের আসলে দেখাতে পারেন,
যদি আপনি না দেখতে পারেন, অন্তত আপনি এখনও পৃষ্ঠায় কন্টেন্ট বুঝতে পারেন.
হাঁ. ঠিক আছে.
ভাল ডিজাইন সম্পর্কে যথেষ্ট কথা বলা. এর খারাপ ডিজাইন সম্পর্কে কথা বলা যাক.
এই জিনিস যে আপনি না করা উচিত.
Craigslist সঙ্গে তাদের অভিজ্ঞতা সম্পর্কে কেউ কি আমাকে বলতে পারবেন
এবং তারা কি মনে করেন এই নকশা সম্পর্কে এত বড় হয় না?
হ্যাঁ. >> [ছাত্রদের] আমি মনে করি এর এক এলাকায় আছে অনেক শব্দ.
অনেক শব্দ, ডান? সম্পূর্ণরূপে অপ্রতিরোধ্য.
আপনি এই পৃষ্ঠাটির আসা এবং আপনি একটি জিনিষ সমগ্র এখানে আপ গুচ্ছ সঙ্গে দেখলেও করছি
এমনকি আপনি কোন ব্যাপার হতে পারে না.
উদাহরণস্বরূপ, আপনি একটি রাষ্ট্র যে এই অক্ষর দিয়ে শুরু না বাস.
চলুন শুরু করা যাক বলতে আপনি টেক্সাস বা কিছু না.
>> সব পাতা নিচে অবস্থান করতে হয় পেতে স্ক্রল উপায় আছে.
বস্টন থেকে আমি আছি তাই, আমাকে ম্যাসাচুসেটস দেখুন. কোথায় ম্যাসাচুসেটস?
ওহ, এটা ঠিক এখানে. ওহ, এটা বস্টন. ঠিক আছে.
চলুন বস্টন তাকান. [হাস্য]
চমত্কার অপ্রতিরোধ্য, ডান?
ওইখানে বিশ্রী জিনিস. [হাস্য]
চলুন শুরু করা যাক বলতে আমি কোথাও জন্য বেঁচে থাকার খুঁজছি.
কত মানুষ আসলে ব্যবহার Craigslist? আপনার টন.
চমত্কার খারাপ উপায় এই সময়ে, যাও চেহারা কিন্তু এর এই যাক আছে.
Img এবং মাংসখণ্ডের মধ্যে পার্থক্য কি? সম্পর্কে যে কেউ বলতে পারবেন?
এটা আসলে কোন পার্থক্য.
তারা হুবহু একই জিনিস মানে, কিন্তু তারা তাদের জন্য আলাদা কিছু কারণ জন্য লেবেল আছে.
যদি আমি আছে ক্লিক করুন, পাতা কিছু ঘটবে.
আসলে আমাকে খোঁজো ক্লিক করে আবার কিছু ঘটতে জন্য আছে.
কি একটা ভালো নকশা সিদ্ধান্ত যে সেখানে করা সম্ভব হতে পারে?
যদি আমি যে ফিল্টার ক্লিক করছি, আমি সম্ভবত সেই বিশেষ কর্ম দ্বারা ফিল্টার করতে চান
অথবা যে নির্দিষ্ট বিষয়শ্রেণীতে.
সুতরাং পরিবর্তে আবার খোঁজো টিপুন হচ্ছে, আমি ঠিক ফিল্টারিং স্বয়ংক্রিয় ভাবে পারে
গুগুল শৈলী যেখানে তারা অবিলম্বে কি ধরণের.
[Malan] কিন্তু হিসাবে আমরা তাদের দূর পর্যন্ত আছে শারীরিকভাবে পেশ করা পাচ্ছি না ফরম না
আঘাত কমপক্ষে অথবা একটি বাটন ক্লিক করে লিখুন?
হিসাবে আপনি তাদের দেখা করেছি যতদূর, আপনি আসলে যারা এই ধরনের জিনিস আছে Submit বাটনে ক্লিক করুন.
>> কিন্তু টমি হিসাবে একটি দ্বিতীয় আপনাকে দেখাতে হবে, সেগুলো আসলে সেখানে আপনার জন্য উপায়
যেমন যে সময় আপনি যে জিনিস ক্লিক করুন এবং এটি স্বয়ংক্রিয়ভাবে পাঠাতে পারেন
একটি AJAX অনুরোধ কি আমরা কল এবং তথ্য ফিরে পেতে পারেন এবং আপনার ফলাফল তাত্ক্ষণিকভাবে ফিল্টার.
লোকের জন্য এই ইন্টারফেসের সাথে ভুল টন আছে.
[Malan] আপনি কেমব্রিজ জন্য অনুসন্ধান করতে পারবেন?
এখানে এখন পর্যন্ত কিছু সামান্য ব্যতিক্রমী যেখানে আপনি কেমব্রিজ যত্নশীল
এবং এখনো আপনি WESTFORD, স্প্রিং হিল, পশ্চিম নিউটন এবং ভালো পেয়ে থাকেন.
সম্ভবত না আদর্শ. >> সম্ভবত আদর্শ না.
আমি কিভাবে এই বিশেষ পাতা ব্যবহারকারী এর অভিজ্ঞতা কে সর্বোত্তম করে তুলতে সক্ষম হবেন?
হ্যাঁ. >> [ছাত্রদের] নির্দেশনা.
ঠিক আছে. ইন্দ্রিয় কিরুপ নির্দেশাবলী?
উদাহরণস্বরূপ, [ছাত্রদের], প্রথমবার ব্যবহারকারীরা তাদের কি Craigslist হয় না এমনকি জানেন না জন্য একটি বিষয়
বা আপনি কি করতে অনুমিত করছি না.
রাইট. তাই ব্যাখ্যা কি Craigslist এই পৃষ্ঠাতে হয় গুরুত্বপূর্ণ.
আমরা আসলে কি জন ব্যবহারকারী এই পাতার জন্য আসলে বলতে পারেন.
যদি আমি এই না গিয়ে, আমি একটি অবস্থানে আভা দেখতে. আমি কি তারা মানে না এমনকি জানি না.
কিন্তু আরো গুরুত্বপূর্ণ, ঠিক এই ইন্টারফেসের দিকে তাকিয়ে আছে,
মনে রাখবেন আমি একটা টন স্ক্রল করে নিচে একটি বিশেষ সম্প্রদায় খুঁজে ছিল
যে আমি আসলে এই বিষয়ে যত্ন.
একটি দ্রুত উপায় আমি যে যেত না কি? হ্যাঁ.
[ছাত্রদের] তাদের আপ ভাগ মধ্যে পূর্ব, পশ্চিম অঞ্চলে. >> ঠিক আছে.
আমি আরো বিভাগ সেটি সম্পর্কে দ্রুত নির্ধারণ করতে সাহায্য করতে পারে সেগুলি বিভক্ত করা যায়নি
কিভাবে যে নির্দিষ্ট অবস্থান পেতে.
[ছাত্রদের] একটি ড্রপ ডাউন তালিকায় রাখুন. >> রাইট. ঠিক আছে.
আমি একটি ড্রপ ডাউন মেনু ব্যবহার কারণ আমরা একটি জিনিষ নির্দিষ্ট হতে পারে
এবং আমরা একটি ড্রপ ডাউন মেনু তাদের দেখাতে পারে.
এই ভাবে এটি পর্দায় এত স্থান না লাগতে.
কিন্তু যে এর চেয়ে আরও ভাল হয়, আমরা কি করতে পারি?
হ্যাঁ. >> [শ্রবণাতীত ছাত্র প্রতিক্রিয়া] >> যে আবার আপনি কি বলতে পারেন? >> [ছাত্রদের] খোঁজো বাক্স.
হ্যাঁ, অনুসন্ধান বাক্সে. দারুণ.
আসলে আমরা কি করতে পারি যদি আমরা স্লাইড, অনুসন্ধান বক্সে পিছনে তাকান.
স্বয়ংসম্পূর্ণ. অত্যন্ত সহজ উপায় ফলাফল যে আপনি কি জানেন মাধ্যমে অনুসন্ধান করতে একটি সেট আছে.
যদি আমি শুরু BO টাইপ, শুধু দেখাতে সমস্ত ফলাফল যে তাদের BO ভিতর আছে আমার.
এইভাবে আমি এক বিশেষ আমি যেতে চান খুব সহজেই খুঁজে পেতে পারেন
পরিবর্তে এই বড় তালিকার মধ্যে স্ক্রোল হচ্ছে.
>> এগুলি সত্যিই কম ঝুলন্ত ফলের সমস্ত প্রকারের যে কেউ Craigslist রূপায়ণকারী হয়
আসলে ওয়েবসাইটে তাদের নির্দিষ্ট ব্যবহারকারীর জন্য অনেক বেশি ভালো উপর অভিজ্ঞতা করতে পারেন.
ঠিক আছে. ওয়েবসাইটের সম্পর্কে যথেষ্ট খারাপ কথা বলা.
যাক এর ফেসবুক সম্পর্কে কথা বলুন.
যখন ফেসবুক বেরিয়ে আসেন, এবং বিশেষ করে ফেসবুক ফটো,
সময় যা ঠিক একই জিনিস না পারে এ অন্যান্য পরিষেবাগুলি প্রচুর ছিল.
তারা আপনার ফটো অ্যালবাম সংগঠিত হতে পারে.
আপনি কি কি করতে পারে আপনার সেট সেগুলি ভাল হিসাবে সংগঠিত হতে পারে.
আপনি তারিখ অনুযায়ী তাদের সংগঠিত হতে পারে. আপনি সব জিনিসের বিশেষ যেত না.
কিন্তু কেউ জানেন না কি ফেসবুক ফটো সময় এটি মুক্তি পায় এ বিস্ফোরিত করা?
হ্যাঁ. >> [ছাত্রদের] ট্যাগ্স. >> ট্যাগ্স. ঠিক.
আমরা Milo, যিনি আমাদের যে CS50 পট্টি দিয়ে কুকুর মাসকট এখানে উপর আছে.
আপনি যে আমরা এই মধ্যম ট্যাগ বৈশিষ্ট্য আছে দেখতে পারেন.
এবং কি একটি ব্যবহারযোগ্যতা দৃষ্টিকোণ থেকে তৈরি ফেসবুক ফটো তাই আকর্ষণীয়
যে এটা আসলে এই মাধ্যমে লোকেদের তাদের ফটোতে তাদের বন্ধু জড়িত করা অনুমোদিত.
জন্য ফেসবুক, যেহেতু তাদের ওয়েবসাইট অত্যন্ত সামাজিক,
এটি সামাজিক বায়ুমন্ডলের সাজানোর এই বিল্ডিং এর সম্পর্কে.
যে ফটো অভিজ্ঞতা উন্নত অনেক আরো
কারণ তারা শুরু করতে পারে বলছে, "এই লোকদের মধ্যে সংযোগ,
এবং এইসব লোকেদের সাথে আপনি আসলে যত্ন সম্পর্কে ফটো. "
এর অনেক অংশ হয় সাজানোর আত্মরতি.
মানুষ তার পছন্দ মত যে ফটো এবং জিনিষ ট্যাগ করা হবে.
যদিও যে একটি ভালো মানুষের বৈশিষ্ট্য অগত্যা না,
একই সময়ে এটা ভালো নকশা সিদ্ধান্তের উপর ভিত্তি করে এর
কারণ মানুষ আসলে ভালো জিনিস যত্নশীল.
যাতে এর ফেসবুক ফটো.
>> কিন্তু যাক ফেসবুক এর আরো সাধারণভাবে কথা বলুন.
আমি নিশ্চিত এখানে অনেক লোক ফেসবুক সম্পর্কে মতামত আছে,
উভয় ভাল নকশা সিদ্ধান্ত এবং খারাপ নকশা সিদ্ধান্ত.
সুতরাং আসুন বা উচ্চারণ খুশি হবেন.
চলো. আমি জানি যে আপনি সব ফেসবুক ব্যবহার.
কেউ কিছু খারাপ বলতে বা কিছু ভাল এটা সম্পর্কে বলার আছে আছে. হ্যাঁ.
খবর ফিড ইন [ছাত্রদের] জিনিষ আমি সত্যিই কি যত্ন সম্পর্কে না অনেক আছে.
খবর ফিড জিনিষ আপনি যত্নশীল হতে পারে না অনেক প্রদর্শন আছে.
আপনার বন্ধুদের ফেসবুকে যারা আপনাকে 2 অথবা 3 বছর জন্য দেখা হয়নি আছে
এবং আপনি তাদের খবর ফলাফল আপনার খবর ফিডে পপিং দেখুন
এবং সত্যিই সে কি যত্ন না.
ফেসবুক আসলে করেনি এই সর্বোত্তম করে তুলতে একটি প্রচেষ্টা করেছেন,
এবং প্রকৃতপক্ষে তারা খবর ফিড শীর্ষে ইদানীং হিসাবে প্রাসঙ্গিক ফলাফল ধাক্কা চেষ্টা করেছি
তাই আসলে আপনি যা বন্ধুদের সাথে প্রাসঙ্গিক আপনি বা আপনার নিকট বন্ধুদের দ্বারা জিনিষ দেখতে.
আরও কিছু লাগবে? হ্যাঁ.
[শ্রবণাতীত ছাত্র প্রতিক্রিয়া] >> যে আবার আপনি কি বলতে পারেন?
[ছাত্রদের] বিজ্ঞাপনগুলি তুলনামূলকভাবে বিচক্ষণ. কি অর্থে >>?
[শ্রবণাতীত ছাত্র প্রতিক্রিয়া] তারা ব্যানার ভালো না পর্দায় আলো আছে,.
ঠিক আছে. এটা ভাল.
আপনি যদি ইন্টারনেট থেকে '90s মনে রাখবেন - >> [Malan] আমি সেখানে ছিল. >> তিনি সেখানে ছিল. [হাস্য]
আপনি ঝলকানি gifs ব্যাকগ্রাউন্ড sparkly, জিনিষ মনে রাখতে পারে,
জিওসিটিস জিনিস শৈলী সাজান.
এটা সত্যিই একটি ভাল নকশা একটি উদাহরণ না
কারণ এটি সত্যিই কন্টেন্ট থেকে এর বিক্ষেপী.
ইয়েল শিল্প ওয়েবসাইটে তাদের পটভূমি হিসাবে প্রাণবন্ত gifs আছে ব্যবহৃত
এবং আপনি পৃষ্ঠাতে কিছু না পড়তে পারেন,
কিন্তু আমি অনুমান তাদের আসলে কেউ কথা বলত এবং এখন এটা একটু ভিন্ন.
[Malan] এটি এখন অনেক ভালো. >> এটা এখন অনেক ভালো, হিসাবে আপনি দেখতে পারেন. >> [Malan] ওহ হ্যাঁ.
শুধু মহান, ঠিক - হ্যাঁ. ঠিক আছে.
>> এর অনেক অংশ এছাড়াও করছে আপনার পাতা খুব সম্ভবত খুব অল্পস্বল্প এবং বোধগম্য
তাই একটি উপায় যে খুব লজিক্যাল মধ্যে পাতা প্রবাহ উপর জিনিষ না অপরকে পথে আসে না.
অন্যান্য জিনিসপত্র কি প্রকারের ভাল ফেসবুক সম্পর্কে বা ফেসবুক সম্পর্কে খারাপ?
চলুন শুধু এখানে একটি নকশা কথোপকথন আছে.
ওহ. কোথায়? হাঁ.
[ছাত্রদের] নতুন সময়রেখা সিস্টেম আপনি তাদের অতীত সম্পর্কে ব্যক্তি এর প্রফাইল অনুসন্ধান করতে পারবেন.
সময়রেখা উত্তেজনা,.
সময়রেখা একটি দুর্দান্ত বিষয় কারণ এটি আপনি আপনার বন্ধু আপনাকে ডাঁটা
ফিরে যখন তারা উচ্চ বিদ্যালয় ছিল.
সময়রেখা ভাল কারণ এটি আপনাকে কন্টেন্ট অনেক দ্রুত মাধ্যমে ফিল্টার,
এটি আপনাকে যে অন্যথায় একজন সত্যিই দীর্ঘ সময় গৃহীত হত আপনি খুঁজে পেতে
শুধুমাত্র প্রদর্শনের আপ এবং নিচে আপ, আপ, আপ, আপ, সময় ফিরে যাওয়াকে ভালো আপ,.
তবে এছাড়াও আছে ব্যবহারকারীদের অভিজ্ঞতার নিরিখে যে একটি downside ধরণের.
হতে কি পারে যে?
বিগ শব্দ পি আর সঙ্গে আরম্ভ করা হয়. >> [ছাত্রদের] গোপনীয়. >> গোপনীয়, ডান?
গোপনীয় একটি বিশাল ব্যবহারকারীর অভিজ্ঞতা সমস্যা.
এই জিনিস আমি ফেসবুক সম্পর্কে অধিকাংশ এখন ঘৃণা এক. [হাস্য]
[Malan] যেহেতু এখন আমি কি.
ডেভিড আসলে এই গতকাল পর্যন্ত ঘটেছে কি না বুঝতে পারছি.
সুতরাং এখন তিনি জানেন যে প্রত্যেক সময় আমি তাকে চ্যাট আমি জানি সে সম্পর্কে উপেক্ষা করা হয়েছে.
[Malan] বিশ্রী অংশ ছিল আমি আসলে ছিল তাকে উপেক্ষা,
এবং আমি সে জানত আমি তাকে উপেক্ষা ছিল না জানেন. [হাস্য]
গোপনীয় একটি বিশাল সমস্যা.
সম্পর্কে যে কেউ এখানে কি ফেসবুক গোপনীয়তা সম্পর্কে খারাপ হতে পারে বলতে পারেন
অধিকন্তু যে তারা ভালো কিছু করার?
এটা কি ফেসবুক গোপনীয়তার সম্মান না বিশেষ করে কঠিন?
যে সাজানোর একটি উত্তরসূচক প্রশ্ন.
হ্যাঁ. >> [ছাত্রদের] নির্দিষ্ট ব্যক্তিদের কাছ থেকে আপনার ফটো লুকান.
রাইট. ঠিক, কিছু লোকের থেকে আপনার ফটো লুকান.
তারা উপরের ডান দিকের যে আপনাকে একটি ছবির গোপনীয়তা টগল এই ছোট, সামান্য বোতাম আছে.
তাদের গোপনীয়তা অপশন মেনু বিভিন্ন প্রকারের মধ্যে খুব হয় ভিন্নতা.
>> তারা এটি সম্পর্কে করেছি অর্জিত সম্প্রতি অনেক ভাল, কিন্তু এটি ক্ষেত্রে ব্যবহার করা হয়
যে যখনই আপনি দেখে ফটো থেকে আপনার বন্ধুদের প্রতিরোধ করতে চেয়েছিল,
আপনি একটি অত্যন্ত জটিল হচ্ছে ভালো 5 পদক্ষেপ প্রক্রিয়ার মধ্য দিয়ে যেতে হবে,
সম্পর্কে এই লিঙ্কটি ক্লিক করুন যাক এখন, আমার আবার ক্লিক করুন যাক, আমাকে আবার ক্লিক করুন,
আমাকে যা মানুষ না আমার ফটো দেখতে পারেন নির্দিষ্ট.
যে ফেসবুক এর অংশ বিশেষ ভাল হয় না
কারণ ব্যবহারকারীর অভিজ্ঞতা সম্পর্কে এত প্রদান করা হয় তাদের স্বাধীনতা
মানুষ কি দেখতে পারেন নিয়ন্ত্রণ.
আমরা এই ব্যবহারকারী নিয়ন্ত্রণ এবং স্বাধীনতা কল.
আপনি যদি লেট না করছি না যে আপনার ব্যবহারকারীদের মধ্যে একটি উপায় যে হল দক্ষ এবং স্বজ্ঞাত,
তারপর আপনার ব্যবহারকারীর অভিজ্ঞতা হয় এ সব সত্যিই যে মহান না.
আপনি চান না যাও ফেসবুক সম্পর্কে কিছু বলতে চান?
আমি কিভাবে এই সরা?
[Ong] আপনি এই বন্ধ, চালু না এবং যে একটি বিশাল ফেসবুক অংশ ব্যবহারযোগ্যতা ত্রুটি করতে পারেন.
এই বৈশিষ্ট্যটি - আমি আসলে তা গতকাল লাগছিল -
এটা হয় যে আপনি এটি ব্যবহার করতে পারবেন না বা এটা কোথাও কবর খুব খুব, গভীর এর
ফেসবুকের recesses কারণ আমি চিন্তা কিভাবে এই কার্যকারিতা এ সব নিষ্ক্রিয় করতে পারবেন না.
[Malan] কিন্তু কখনো কখনো এই সব সিদ্ধান্ত গ্রহণে সুস্পষ্ট নয়
কারণ আপনি না CS50 বিভিন্ন অ্যাপ্লিকেশনের উপর প্রদত্ত দরকারী প্রতিক্রিয়া অনেকটা আমাদের
ওয়েবসাইটগুলির অবশ্যই ব্যবহার করে.
আমরা এই অনুরোধগুলি এবং পরামর্শ সব বাস্তবায়িত হয়নি.
>> যে পার্ট অনেক অনুরোধ পাবার জন্য যে সময় একটি ফাংশন,
তবে কখনও কখনও আমরা ভালো একটি সচেতন সিদ্ধান্ত,
"পরামর্শের জন্য ধন্যবাদ, কিন্তু আমরা অসম্মতি."
সুতরাং কিভাবে আপনি আসলে কি কি করা উচিত তা স্থির যদি আপনার ব্যবহারকারী মনে করেন যে আপনার কিছু করতে হবে
এমনকি আপনি যদি না অগত্যা? না
এটা কি আপনার ব্যবহারকারীদের বলতে আসলে শোনার মধ্যে সূক্ষ্ম ভারসাম্য
আসলে লাইন এবং কিছু বাছাই করা হচ্ছে যেখানে আপনি বলতে,
"আমরা কি এই ব্যবহারকারীরা বলে না. করছি যাচ্ছে না"
এবং বিশেষ করে, আমি মনে করি হেনরি ফোর্ড দ্বারা উদ্ধৃতি যে এই পর্যন্ত অঙ্ক চমত্কার ছিল.
"যদি আমি জিজ্ঞেস করেছেন যে, তারা কী চান, তারা বলেন, তারা দ্রুত ঘোড়া চেয়েছিলেন হবে."
পৃথক্ জ্বালাতন করা কি সত্যিই যে উদ্ধৃতি এর অর্থ কেউ সাজাতে পারি?
এটা ঠিক যে ব্যবহারকারীরা কি তারা করতে চান না,
কিন্তু এটা আরো যে -
[ছাত্রদের] তারা কি করা সম্ভব জানি না.
অংশ তারা কি সম্ভব নয় জানি.
যে পৃথক্ একটি সামান্য বিট আরো আঁচড়ান. আপনি কি যে মানে?
[শ্রবণাতীত ছাত্র প্রতিক্রিয়া]
এটা ভাল. কি আমি মনে করি আমরা এখানে যা বলার চেষ্টা করছেন যে মানুষ এখন জানে কি করতে চান তারা.
তারা দ্রুত ঘোড়া চান.
তারা কি সত্যিই চান করার দক্ষতা দ্রুত সরানো,
কিন্তু তারা সত্যিই মাঝারি দ্বারা যা অর্জন জানি না.
আপনি যখন আপনার ব্যবহারকারীদের আসুন এবং আপনার ব্যবহারকারীদের কিছু বলুন আপনি
এবং তারা আপনাকে ", আমরা এই বৈশিষ্ট্য এবং এই বৈশিষ্ট্য এবং এই সমস্ত বৈশিষ্ট্য ব্যবহার করতে চান"
আপনি অগত্যা আমার মনে হয় না চান, "আমাকে এগিয়ে যান
"কি এবং স্পষ্টভাবে তারা বাস্তবায়ন"
কিন্তু আপনি কি চিন্তা করতে চান, "কি ধারণা আমি যে সাজানোর থেকে পেতে পারি?"
আসলে তারা কি করতে চান?
>> এবং কি কি করতে পারবেন যা তাদের অনুরোধ মাফিক ডিজাইন সেখানে থেকে
কিন্তু না অগত্যা কাজে ব্যবহারকারী প্রত্যাবর্তনের এটি সন্তুষ্ট করা.
তাই জন্য খুবই বাস্তব পদ কিছু চূড়ান্ত প্রকল্পের মত,,
একটি দরকারী অনুসন্ধানমূলক কি যখন এটি কিছু উন্নত করার জন্য আসে,
বিশেষত যদি ডিজাইনার তার সম্পর্কে এই দাম্ভিকতা আছে
যেখানে আপনি কি ধরণের সেরা এর জানি, আপনি আপনার ব্যবহারকারী থেকে ইনপুট নিতে পারে,
কিন্তু আপনি কিভাবে যে প্রতিক্রিয়া পেয়ে সম্পর্কে আসলে কি যান?
চূড়ান্ত প্রকল্পে, খুব concretely, কি অনুকূল ফলাফল এখানে উৎপন্ন?
উৎপন্ন ফলাফল অনুকূল কি - এবং আমি এই বিষয়ে একটি দ্বিতীয় মধ্যে যেতে হবে -
একটি উন্নয়নশীল এবং তারপর পরীক্ষা এবং তারপর iterating এই প্রক্রিয়া.
কি আমি পরীক্ষার দ্বারা অর্থ সাধারণতঃ যখন আপনি কিছু ডিজাইন
আপনি কি মনে করেন এটা মোটামুটি ভাল, যেমন, "আমি একটি মহান ডিজাইনার. প্রত্যেকেরই এই প্রেম করতে যাচ্ছে."
এবং তারপর আপনি এটি আউট করা আছে এবং মানুষের জন্য কিছু কারণ এটা সত্যিই না চাই.
আপনি কি আছে আপনি হয় যে সব জিনিষ জনের ভালো না অংশ নিতে
এবং যে মানুষ পছন্দ করেন না পুনর্গঠন করা.
এটি একটি খুব সুস্পষ্ট প্রক্রিয়া মত শোনাচ্ছে, কিন্তু এই প্রক্রিয়া ক্রমাগত iterating
আপনি কি ইতিমধ্যে তৈরি করেছি উপরে একটি প্রক্রিয়া যা আপনাকে
না কেবল আপনার নিজস্ব নকশা দক্ষতা কিন্তু পরিমার্জন এছাড়াও সাহায্য আপনি নকশা পরিশোধন
তাই যে কতজন মানুষ আপনার পণ্য প্রশংসা এমনকি অধিক পূর্বে তারা করেছেন.
>> আমি আসলে আরো কি কি হতে পারে কংক্রিট উদাহরণ উপর যাবেন.
একটি পণ্যের শেষ উদাহরণ হিসাবে সাজান, যাক কায়াক তাকান এর.
কায়াক যখন এসেছেন খুব খুব জনপ্রিয়.
যে কেউ অনুমান করতে পারে না কেন?
জিনিষ অসুস্থ আপনি এই সম্বন্ধে যদি আপনি এটি ব্যবহার করেছেন কি
বা কি জিনিষ আপনি পছন্দ করেন না অসুস্থ?
হ্যাঁ. >> [শ্রবণাতীত ছাত্র প্রতিক্রিয়া] >> ঠিক আছে.
যে কোন অংশ ব্যবহারকারী একটি নথি প্রশ্নের সাথে মিলেছে যা আরো বিস্তৃত আছে লেট হয়
একটি ভালো খুব নিয়ন্ত্রণমূলক একটির, "আপনি আপনার আরম্ভের তারিখ বাছাই আছে
"এবং আপনি আপনার শেষ তারিখ বাছাই আছে."
আসলে, এটি আপনাকে তা সম্পর্কে নমনীয় হতে হবে এবং এটি আপনাকে যে সীমার মধ্যে ফ্লাইট সব আপনি.
আরও কিছু লাগবে?
[ছাত্রদের] তারা মূল্য ফি অন্তর্ভুক্ত.
তারা মূল্য ফি অন্তর্ভুক্ত করবেন.
ট্যাক্স এবং জিনিস আসলে যে দাম মধ্যে উপরের বাম দিকের সোজা যান
যাতে আপনি চিন্তা করে যে আপনি আসলে একটি $ 240 ফ্লাইট জন্য করছি পরিশোধ করছেন না tricked
যখন এটি সত্যিই $ 330.
আরও কিছু লাগবে? হ্যাঁ.
[শ্রবণাতীত ছাত্র প্রতিক্রিয়া]
আমি যদি তারা আসলে আপনি যে কি ব্যাপারে নিশ্চিত হন না.
আমি ভুল হতে পারে.
যে একটি বিষয় যদি আপনি বিশেষ ফিল্টার আরও ওজন লাগাতে চান হতে পারে
যাতে তারা এর সাথে সম্পর্কিত উপরের যে ফিল্টার ফলাফল ধাক্কা.
কিন্তু এই সম্পর্কে কেউ কি এর বাম পাশে সম্পর্কে তাই বিশেষ বলতে পারেন?
কিভাবে আপনি ঐতিহ্যগতভাবে এই চেহারা আগে একটি ইন্টারনেট সেবা প্রদানকারী একটি ফ্লাইট আপ?
>> হ্যাঁ. >> [শ্রবণাতীত ছাত্র প্রতিক্রিয়া] >> আপনি বলতে পারেন যে -
[ছাত্রদের] প্রতিটি এয়ারলাইন. >> হ্যাঁ. প্রতিটি এয়ারলাইন নিজস্ব ওয়েবসাইট আছে.
এই জিনিস consolidates. এবং?
[ছাত্রদের] আপনি জানেন কি ঠিক সময় আপনি যাব করছি.
আপনি ঠিক কি সময় আপনি যাব করছি জানি,
বিশেষ ফিল্টার কিন্তু এর সাথে সম্পর্কিত.
আমাকে কায়াক মুঠি ধরে টেনে তুলবো.
ওহ ঈশ্বর, পপ আপ. খারাপ ব্যবহারকারীর অভিজ্ঞতা.
যখন আমি এই স্লাইডার চলে গেলে কি হবে?
[ছাত্রদের] অটোমেটিক আপডেট. >> [Ong] অটোমেটিক আপডেট.
যে যা খুবই গুরুত্বপূর্ণ.
আগে এই, যখনই আপনি একটি ফ্লাইট সন্ধান চেয়েছিলেন,
আপনি আপনার অবস্থান ইনপুট, আউটপুট আপনার অবস্থান, প্রেস খোঁজো রাখা ছিল,
এটি যে প্রক্রিয়া এবং আপনার ফলাফল দেখান.
আপনি যদি আপনার প্রশ্নের সাথে পরিবর্তন করতে চান, তাহলে আপনি ফিরে দুইবার প্রেস করতে হবে,
গোড়া থেকে নতুন একটি ক্যোয়ারী লিখুন, এবং তারপর এটি ফিরিয়া এবং আবার উপর.
ভালো কিছু সুন্দর জিনিষ এটা মধ্যম খুব [অপাচ্য] জিনিস ব্যবহার করে.
যখনই আপনি ভালো কিছু না, এটা খুন করে একটি অনুরোধ বন্ধ
এবং এটি সমস্ত উত্পন্ন ফলাফল অবিলম্বে আপনাকে.
তাৎক্ষণিক প্রতিক্রিয়া এই সাজানোর কিছু একটা যে তৈরি কায়াক অত্যন্ত জনপ্রিয়
কারণ এটা সত্যিই সহজ জন্য শুধু সম্পর্কে আমার প্রশ্নের পরিবর্তন
জিনিস এবং একটি নির্দিষ্ট পরিসীমা চারপাশে যা চিত্র আউট
ছাড়া যাও পিছনে যান, আগে পিছে, আগে পিছে না.
সুতরাং এই জিনিসগুলি সমস্ত প্রকারের আপনি যখন আপনি আপনার ওয়েবসাইট নকশা করছেন সম্পর্কে ভাবতে চাই.
আমি কিভাবে এটা করা খুব দক্ষ জন্য আমার ব্যবহারকারীদের মাধ্যমে যাই হোক না কেন তারা কাজ করছি যেতে পারেন
এবং তাদের চূড়ান্ত লক্ষ্য হচ্ছে যত তাড়াতাড়ি সম্ভব পেতে?
[Malan] এবং যাও জোসেফ এর আগে পয়েন্ট সম্পর্কে বুদ্ধিমান অগত্যা কি তারা করতে চান না, ব্যবহারকারীদের
ভিত্তি কি না এখন এইচটিএমএল সম্পর্কে জানা
এবং আপনি চেকবক্স, রেডিও বাটন নির্বাচন করুন মেনু, ইনপুট ক্ষেত্র এবং ভালো আছে,
কিভাবে একটি ফ্লাইট জন্য একটি শুরুর সময় অবচয় ধারণা আপনি বাস্তবায়ন করবে?
>> যারা বিভিন্ন UI 'তে প্রক্রিয়া যা আপনি ব্যবহার করেন?
যদি আপনি HTML এর পরিমাণ যে আগে শেখানো হয়েছে
এবং আপনি কি জানেন ইনপুট হল রেডিও বাটন, চেকবক্স, ড্রপ উন্মুক্ত বিস্তৃত উচ্চভূমি, এবং ইনপুট বক্স,
প্রাকৃতিক আপনার পছন্দ কি তারিখগুলি জন্য অবচয় হত?
[ছাত্রদের] ইনপুট. >> ইনপুট. অথবা এমনকি একটি ড্রপ ডাউন সঙ্গে তারিখগুলির সব, ডান?
তাই সঙ্গে আরো জটিল ভালো UI 'মেকানিজম বাম পাশে যে আপনি বাস্তবায়ন করতে পারেন,
আপনি একটি স্লাইডার সঙ্গে করা এই প্রক্রিয়া অনেক আরও বেশি ধারণাসম্পন্ন পারেন
কারণ সময় একটানা, এবং সাধারণত তা বিযুক্ত অংশ শর্তাবলী মনে করি না.
ঠিক আছে. সর্বশেষ জিনিস.
দশ ব্যবহারযোগ্যতা হিউরিস্টিক্স.
সমস্ত জিনিস আমরা স্বপ্ন সম্ভবত এই শ্রেণীর এক আওতায়.
যদি আপনি এই লিঙ্ক, কোন সাইট পোস্ট করা যেতে,
আপনি আসলে হতে পারবেন, হিসাবে আপনি আপনার সাইট ডিজাইন করব, মন এই হিউরিস্টিক রাখা
এবং থাম্ব এই নিয়ম.
আপনার প্রকল্পের জন্য কি, আমি আপনাকে পরামর্শ দিচ্ছি আপনি চেষ্টা করবেন যাতে আপনার অ্যাপ্লিকেশন ভাল ডিজাইন
প্রথমে কাগজ প্রোটোটাইপিং না হয়.
আপনি যখন আপনার আবেদন সম্পর্কে চিন্তা করছি, খুব তাড়াতাড়ি স্কেচ আপনি কি এটি করতে চান মত চেহারা
এবং নিশ্চিত করতে সব বাক্সে একটি পদ্ধতি যা ব্যবহারকারী ব্যবহার করার জন্য খুব স্বজ্ঞাত সাজানো হয়
এবং এমনকি আপনার বন্ধুদের এইসব কাগজ এবং এগুলির নমুনা দেখাতে ফোকাস গ্রুপ শুরু.
শুধু একসাথে 2 অথবা 3 জনের পেতে এবং তাদের শুধু এই কাগজ এগুলির নমুনা উপর টোকা জিজ্ঞাসা,
এবং তাদের নতুন পর্দা দেখানোর জন্য যদি তারা আসলে কি করছেন বুঝতে দেখুন.
>> আপনি কি করতে চান তাদের একটি টাস্ক দিতে, যে টাস্ক অনুপ্রাণিত করা হয়,
এবং শুধু তাদের অ্যাপ্লিকেশন দিতে এবং তাদের এটা ব্যবহার করতে দিতে.
কি যে নির্দেশাবলী তাদের অতিক্রম না.
আপনি আসলে আপনার অ্যাপ্লিকেশন সঙ্গে তাদের একটা উপায় যা আপনাকে দেখতে মধ্যে যোগাযোগব্যবস্থার বিভিন্ন জানাতে চাই
কিভাবে তারা এটি ব্যবহার করার জন্য যদি আপনি তাদের পাশে দাঁড়িয়ে ছিল না.
আর এটা খুব গুরুত্বপূর্ণ.
যে অর্ন্তদৃষ্টি প্রচুর হিসাবে দিতে হয় বিশেষ জিনিস কাছাকাছি পেয়ে মানুষের হবে
কখন যে আমি তাদের অভিপ্রায় করা না?
তারা কি পর্দায় বিশেষ UI 'তে প্রক্রিয়া ব্যবহার করে
যে একটি উপায় হল hacky ধরনের?
আমি তাদের জন্য যে উপায় না এটা চাননি.
এবং আপনি যে একবার শেষ হয়ে গেলে কি করছি, আপনি কি চান?
তোমার নকশা স্কচ, ডান?
আপনি কি চান আপনি দেখতে পারেন এবং তারপর বিকাশ উপর যে প্রক্রিয়া কাজ পুনরায় করতে চান.
তাই বন্ধুদের জন্য এটি একবার আপনি এটা উন্নত করেছি, এটি পরীক্ষা,
, বিকাশ পরীক্ষা, বিকাশ, পরীক্ষা, বারবার, এবং এবং ফরওয়ার্ড.
ডিজাইন খুবই এই অর্থে প্রক্রিয়া পুনরাবৃত্ত.
আপনাকে আসলে কিছু এবং তারপর এটি নির্মাণ সম্পর্কে জিনিষ বুঝতে আছে
আপনি আগে যে কি ফিরে যান এবং যে উন্নত থেকে বুঝতে পারছি না.
অংশ হিসাবে উন্নয়ন জন্য এখন,, যে কি টমি বিরতি পরে আপনাকে দেখাতে হবে
এবং আপনি কীভাবে স্বয়ংসম্পূর্ণ করার মত কিছু বাস্তবায়ন করতে সক্ষম হতে পারেন
একটি উপায় যে হল মোটামুটি সহজ.
[Malan] হিসেবে টমি এখানে সেট আপ, একটি প্রশ্ন তারপর.
নিকটতম ওয়েবসাইটে অনেক - এবং যখন জোসেফ 1990 শৈলী ওয়েবসাইট বলেন,
এটি ছিল বাস্তবায়নের যেখানে আপনি যদি একটি সূচনার সময় নির্বাচন চেয়েছিল এবং শেষ সময়,
অকপটে, পিঠ দিন এবং এমনকি কিছু ওয়েবসাইটের আজ,
আপনার এই কাজের জন্য আপনি একটি ড্রপ ডাউন থেকে একটি বাছাই ঘন্টা,
আপনি একটি ড্রপ ডাউন হয়ত, আপনি চয়ন না থেকে, PM তে পোস্ট করা মিনিট বাছাই,
এবং তারপরে আপনি যে আরো 3 বার না.
তাই সঙ্গে 6 ক্লিক হয়তো এবং কিছু স্ক্রলিং
আপনার ব্যবহারকারী আসলে তারিখ এবং / অথবা এই অর্থে সময় পরিসীমা কিছু প্রদান করতে পারেন.
>> তাই স্পষ্টভাবে suboptimal এবং এখনো পর্যন্ত আমরা কোন ভাবপূর্ণ ক্ষমতা দেখা করেছি
ভাষাগুলির মধ্যে আমরা কিছু sexier না দিকে তাকিয়ে করেছি
ভালো সময় শুরু এবং শেষ হওয়ার সময় এই স্লাইডার.
তবে আপনি যদি সপ্তাহে 0 ফিরে মনে যখন আমরা ভূত সম্পর্কে বললাম,
সেখানে খুব আছে উইজেট যে কিছু বিশেষ বিষয় কি ছিল না.
আপনি শুধুমাত্র সত্যিই loops এবং শর্ত এবং ভালো ভালো এইসব মৌলিক ছিল.
তাই শুধু চিন্তা এখন খুব abstractly, এইচটিএমএল বিবরণ স্বাধীন ধরনের,
সত্যি সত্যি কি এই সময় শুরু এবং শেষ হওয়ার সময় স্লাইডার ভালো কিছু যাওয়া?
যখন আমি আমার মাউস এবং সরানো যে সামান্য গাজর চিহ্ন আমি বাম ক্লিক করুন
এবং টেনে নিয়ে শুরু, programmatically, কি হয় এটা আপনার প্রয়োগ সক্ষম হতে চান
যে ঘটতে?
কি প্রশ্নের কি বুলিয়ান এক্সপ্রেশন, আপনি জিজ্ঞাসা করতে সক্ষম হতে চান না?
কি সত্যিই ঘটছে? স্যামি?
[ছাত্রদের] কোথায় কার্সর অবস্থান? >> গুড. কোথায় কার্সর অবস্থান?
এই ছিল যে আমরা ভূত ফিরে প্রকাশ প্রয়োজন,
তা অবস্থান এমনকি বা রং বা ভালো উপর ভিত্তি করে ছিল.
আপনি কি কখনও সোমবার প্রত্যাহার তাই সংক্ষিপ্তভাবে পারে এই সব জিনিস ছিল নামক ঘটনা
ওয়েব জগতে, তাই এবং onclick এবং onkeypress মত জিনিষ আছে
এবং onkeyup এবং onmouseover এবং onmouseout.
তাই বুঝতে পারি যে, এমনকি এই ব্যাপারে আমরা করেছি জন্য গ্রহণ করা হয়েছে ওয়েব মঞ্জুর
সঙ্গে সাইট ফেসবুক এবং Gmail-এর মত, এমনকি আপনি যদি কোন ধারণা আছে
কিভাবে আপনি সম্ভবত যে কারণ বক্তৃতা এমনকি এটি মত কিছুই নেই বাস্তবায়ন করবে
বা সমস্যা 7 সেট, এইসব মৌলিক সঠিক একই সঙ্গে যে বুঝতে পারছি,
HTTP-র সঙ্গে এবং পরামিতি এবং এবং GET পোস্ট,
সঙ্গে মৌলিক HTML রইলাম যা আমরা এ পর্যন্ত লাগছিল করেছি
এবং প্রোগ্রাম্যাটিক মেকানিজম সঙ্গে এক মুহূর্ত যে সম্পর্কে টমি এর সূচনা
আপনি নিজেকে আপনি যেমন সপ্তাহ 0 করেছিল প্রকাশ শুরু করতে পারেন
দ্বারা খুব intuitively টেনে এবং ড্রপ করা হচ্ছে.
>> সুতরাং যে বলেন টমি MacWilliam এবং কিছু আমাদের জন্য নতুন ওয়েব জন্য ধাঁধা টুকরা,.
ঠিক আছে. আমার নাম টমি এবং আমি জাভাস্ক্রিপ্ট সম্পর্কে কথা হবে না.
শুধু একটি দাবিত্যাগ: আমি মতামত নই যে জাভাস্ক্রিপ্ট ভাল প্রোগ্রামিং ভাষা
পুরো সমগ্র বিশ্বের.
মানুষ আমার সাথে যারা অসম্মতি অনেক আছে, কিন্তু এটি শুধু আশ্চর্যজনক.
আপনি একবার সি ফিরে যান, যদি আপনি অন্য কিছু বর্গ বা অন্যান্য ভাষার জন্য সি লিখুন আছে,
এটা তো শুধু সত্যিই সমস্ত নিম্নস্তরের বিস্তারিত আছে ইন নিচে bogged পেতে হতাশাজনক
তাই কখনও যদি আপনি বোধ করছি বিরক্তিকর সি কিভাবে লিখতে হয় আমার দু: খিত,
শুধু ফিরে যান, কিছু জাভাস্ক্রিপ্ট লিখুন. এটা নির্বাণ.
আপনি আপনার খারাপ দিন আমার অনেক ভাল বোধ করবেন.
জাভাস্ক্রিপ্ট এর যাদু অনেক ক্ষমতা জিনিষ নিপূণভাবে থেকে আসে
যে পাতা ইতিমধ্যেই আছে.
যখন আমরা আমাদের পিএইচপি স্ক্রিপ্ট লিখেছে, তারা সার্ভারে সঞ্চালিত হয়,
এবং অবশেষে যে সম্ভবত পিএইচপি স্ক্রিপ্ট কিছু এইচটিএমএল আউটপুট.
যে এইচটিএমএল ক্লায়েন্ট যাও, তারপর পাঠানো হয় এবং যে ছিল এটি.
উদাহরণস্বরূপ, যদি পিএইচপি একটি পৃষ্ঠায় একটি বাটন যুক্ত চেয়েছিলেন,, সত্যিই এটা যে না পারে.
এটি একটি সম্পূর্ণ নতুন HTML ফাইল এবং রেন্ডার ব্রাউজারে যে পাঠাতে হবে.
আমরা জাভাস্ক্রিপ্ট সঙ্গে জানতে পারি যে আমরা জিনিস আপডেট যখন তারা পৃষ্ঠায় ইতিমধ্যে করতে পারেন,
এবং এই কারণ আমরা আরো অনেক তাত্ক্ষণিক প্রতিক্রিয়া জানাতে পারেন,
যা সত্যিই আমাদের ওয়েবসাইটে ব্যবহারকারীর অভিজ্ঞতা উন্নত করতে হবে.
শুধু একটা জাভাস্ক্রিপ্ট নির্বাচক দ্রুত সংক্ষিপ্তবৃত্তি.
আমরা জানি যে, যখন আমরা একটি HTML পাতা ডাউনলোড,
যে DOM মধ্যে প্রতিনিধিত্ব করা হচ্ছে.
>> DOM মনে রাখবেন শুধু এই বড় বড় গাছ যেখানে উপাদান এই বৃহৎ অনুক্রমের সঙ্গে সম্পর্কিত হয়.
যখন উপাত্ত দিয়ে আমরা pset 7 কাজ,
প্রথম জিনিস আমরা কিভাবে কি জানা প্রয়োজন ছিল এক ডাটাবেস অনুসন্ধান করা.
আমরা এই বড় ব্যবহারকারীদের টেবিল খালি আছে, এবং কখনও কখনও আমরা শুধু বলতে চাই,
"শুধুমাত্র আমি এইসব ব্যবহারকারী যে কিছু শর্ত মেলে কিছু করতে চান."
একইভাবে, যখন আমরা DOM আছে আমরা তা অনুসন্ধান করার একটি উপায় সন্ধান করা আবশ্যক.
আমরা বলে কিছু উপায় প্রয়োজন, "আমি চাই বোতাম ভালো যে চেহারা সব
"বা সব পাতা চিত্র."
এবং এই নির্বাচক আমাদের যে কী না.
তাই শুধু একটি দ্রুত সংক্ষিপ্তবৃত্তি.
এই প্রথম এখানে এক, এই # জমা, কি যে নির্বাচন করতে যাচ্ছে? কারো কাছে কি মনে পড়ে?
[শ্রবণাতীত ছাত্র প্রতিক্রিয়া] >> হ্যাঁ, ঠিক.
এই পাতা যে জমা একটি আইডি আছে একটি উপাদান নির্বাচন করা হবে.
এবং যাতে হ্যাশ ট্যাগ বলছেন এই নির্বাচক ID-র সাথে কাজ করতে যাচ্ছে.
কিভাবে আমার দ্বিতীয় এক, এই. কেন্দ্রিক, কি যে নির্বাচন হবে?
হাঁ. >> [ছাত্রদের] ক্লাস. >> যথাযথভাবে. এই এখন হয় বর্গ দ্বারা নির্বাচন করতে যাচ্ছে.
আইডি এবং বর্গ এখানে মধ্যে পার্থক্য সাধারণত আইডি অনন্য হওয়া উচিত
যাই হোক না কেন স্থান থেকে আপনার খোঁজের করছি.
তাই আপনি যদি একটি সম্পূর্ণ ওয়েব পাতা অনুসন্ধান করা হয়েছে,
আপনি সত্যিই যে শুধুমাত্র নির্দিষ্ট আইডি সঙ্গে 1 উপাদান, আছে উচিত জমা দেওয়া তথ্য এই ক্ষেত্রে তাই.
অন্য দিকে ক্লাস সঙ্গে,, আমরা 1 এর অধিক উপাদান আছে একই পৃষ্ঠায় যাবে
একই সঙ্গে বর্গ.
এই বলে আমি সবকিছু যে পাতা কেন্দ্রেও এর নির্বাচন চান তাদের জন্য উপকারী হতে পারে
বরং মাত্র 1 জিনিস.
>> এবং পরিশেষে, এই শেষ এখানে এক একটি ছোট আরো জটিল,
কিন্তু কি এই DOM থেকে নির্বাচন হবে?
[শ্রবণাতীত ছাত্র প্রতিক্রিয়া] >> কি যে?
[ছাত্রদের] আর যে এর একটি ট্যাগ. >> আমরা 2 অংশ এখানে আছে.
দ্বিতীয় অংশে আমি ইনপুটের ট্যাগ সঙ্গে এই ট্যাগ নির্বাচন করতে চান তাহলে বলতে হবে,
তাই কোনো উপাদান এটা একটা ইনপুট ট্যাগ.
কিন্তু আমি শুধু ইনপুট সব নির্বাচন করতে না চান
কারণ একটি submit 'বোতাম মত একটি ইনপুট হতে পারে
এবং একটি টেক্সট বক্সের মত যে কোন একটি ইনপুট হতে পারে.
সুতরাং এই বর্গাকার বন্ধনী বলেই করছি সঙ্গে আমি শুধুমাত্র ঐ উপাদান নির্বাচন করতে চান
টাইপ লেখা যে.
কোথাও আমার HTML ট্যাগটি আমি একটি বৈশিষ্ট্য বলা হয় টাইপ আছে,
এবং যে বৈশিষ্ট্য মান পাঠ্য করা আছে.
সুতরাং কিভাবে সম্পর্কে এই প্রথম অংশ এখানে?
এই নির্বাচক প্রথম শব্দটি হল ফর্ম তারপর আমি একটি স্থান এবং তারপর এই ইনপুট অংশ আছে.
কি, এটা সামনে ফর্ম নির্বাণ?
এটি মূলত আমাদের প্রশ্নের সাথে সীমাবদ্ধ রাখা যাচ্ছে না.
এই ক্ষেত্রে আমরা যে পৃষ্ঠাতে কিছু ইনপুট আছে হতে পারে
যে একটি ফর্ম উত্তরপুরুষ হয় না.
কি করবেন এই হল এই বলবে আমি শুধু চাই ইনপুট ট্যাগ কোথাও তাদের উপরে যে আছে
কিছু একটি ফর্ম অভিভাবক উপাদান.
এই পদ্ধতিতে যাতে এবং আমরা এইসব আরো হায়ারারকিকাল কোয়েরি করতে পারেন
তাই আমরা সবকিছু একটি প্রদত্ত নির্বাচক মেলা নির্বাচন আছে ঠিক না.
আমরা যে প্রশ্নের সাথে সুযোগ অন্য কিছু সীমা ধরনের পারেন.
তাই এখন আমরা জানি কিভাবে পাতা উপাদান নির্বাচন,
যাক AJAX এর সম্পর্কে একটু বলুন.
AJAX একটি এখনও খুব প্রচলিতো আদ্যক্ষরা অ্যাসিঙ্ক্রোনাস জাভাস্ক্রিপ্ট এবং XML জন্য যে দাঁড়িয়েছে.
এটা ঠিক যে এক্সএমএল শুধুমাত্র কিছু তথ্য উপস্থাপন করে.
>> হারিয়ে জনপ্রিয়তার যে সম্প্রতি ধরনের, তাই AJAX মধ্যে এক্স সব সময় ব্যবহার করা হয় না.
মূলত, কি AJAX আমাদের করার অনুমতি দেয় HTTP অনুরোধ করা হয়
থেকে জাভাস্ক্রিপ্ট প্রসঙ্গে.
যখন আমরা আমাদের ওয়েব ব্রাউজারের করছি এবং আমরা পৃষ্ঠাগুলি কাছাকাছি নেভিগেট করছি এবং আমরা একটি লিঙ্ক ক্লিক করুন,
কি ব্রাউজার আমাদের করতে হবে একটি লিঙ্ক যাই হোক না কেন আমরা ক্লিক HTTP-র অনুরোধ করা হয়.
কিন্তু যে আদর্শ কারণ যদি সবসময় যে ক্ষেত্রে, তাহলে হিসাবে ডেভিড বলছে ছিল না,
আমরা সবসময় ব্যবহারকারীদের একটি submit বাটন ক্লিক করুন অথবা একটি লিঙ্কটি ক্লিক করতে হবে
যাতে কিছু যে একটি HTTP অনুরোধ জড়িত করা হচ্ছে এরকম না.
সুতরাং AJAX সঙ্গে আমরা জাভাস্ক্রিপ্ট পক্ষে এই অনুরোধ করতে পারেন.
তার মানে যখনই ব্যবহারকারীর পাতা বা কিছু ঘটলে সাথে মিথস্ক্রিয়া,
আমরা আসলে কিছু অন্যান্য পিএইচপি ফাইলে প্রোগ্রাম অনুরোধ আমাদের ওয়েবসাইটে করতে পারেন
অথবা অন্য কিছু তথ্য এবং যে যে ফাইল spits আউট উদ্ধার করে.
যাক AJAX এর একটি উদাহরণ কটাক্ষপাত করা.
এটি আমাদের CS50 ফাইন্যান্স পাতা আশা আমাদের সঙ্গে যা কিছু পরিচিত.
যদি আমরা এই পৃষ্ঠার HTML তাকান, আমরা এখানে দেখতে যে আমি কিছু বিষয় যোগ করেছেন,
এক যা আমি একটি আইডি দেওয়া এই ফর্ম করেছি.
আমি আইডি = "ফর্ম-উদ্ধৃতি" বলেছেন করেছি.
আমি এই করেছেন মাত্র কারণ এটি একটি সামান্য বিট DOM থেকে সহজে নির্বাচন করতে যাচ্ছে
যেহেতু আমি একটি খুব সহজ প্রশ্ন করতে পারেন.
আমি এখানে কি করতে হয় আমি CS50 ফাইন্যান্স সঙ্গে কিছু সমস্যাটি সমাধান করতে চান.
তাই আপনি যদি আমরা finance.cs50.net যান,
প্রত্যেক সময় আমি একটা পেতে চান, আমি এই পান উক্তি আছে বাটন ক্লিক করুন,
এবং যে পান উক্তি বাটন তারপর অন্য পুরো পাতা যাও সম্পর্কে লাগে.
এবং আমি যদি অন্য মূল্যউদ্ধৃতি চান, আমি ব্যাক বোতাম আঘাত আছে এবং তারপর আমি এটা টাইপ,
আমি একটা পেতে, এবং আমি ব্যাক বোতাম আঘাত.
এটি সত্যিই ভাল ব্যবহারকারীর অভিজ্ঞতা হয় না.
সত্যিই কে সাইট যদি এটা যে মন্থর যাও স্টকের মূল্য পেতে ব্যবহার করেন?
তাই আমরা যা AJAX সঙ্গে কাজ করতে চান যাচ্ছে একটি পৃথক পৃষ্ঠাতে যে পদক্ষেপ সরিয়ে
যাতে ফলাফল দেখতে.
>> আমরা কি সত্যিই কেবলমাত্র তাহলেই জানতে এটি কি সত্যিই ছোট মূল্য,
এবং যে একটি মাত্র তথ্য সত্যিই খুব অল্প পরিমাণ.
তাই আমার জন্য কোন প্রয়োজন অন্য পুরো HTML পাতায় যান সেখানে,
পুরো HTML-এর নতুন ব্যাচ ডাউনলোড হয়ত আরো কিছু ইমেজ ডাউনলোড করুন,
কিছু অন্যান্য সিএসএস ফাইল শুধু জন্য সম্পর্কে যে খুব সহজ প্রশ্ন উত্তর
এর কত স্টক আছে এই খরচ.
AJAX সঙ্গে আমরা এই অনেক সহজতর করে তুলতে পারে.
আমরা দেখতে এখানে নিচে যে আমি একটা জাভাস্ক্রিপ্ট ফাইল নামক quote.js মধ্যে লিঙ্ক চাই.
চলুন আসলে যে ফাইলটি খুলুন. . সেখানে নেই
আমার জাভাস্ক্রিপ্ট ফাইল সব HTML এ অবস্থিত করা যাচ্ছে
যাতে ওয়েব ব্রাউজার এটি অ্যাক্সেস করতে পারেন.
তারপর আমরা একটি পৃথক জাভাস্ক্রিপ্ট জন্য এখানে ডিরেক্টরি আছে,
এবং এখানে এখন quote.js হয়.
এই ফাইল সম্পর্কে শীর্ষে এখানে বলছেন যে আমি সম্পূর্ণ পৃষ্ঠা জন্য লোড করা পর্যন্ত অপেক্ষা করতে চান
আগে আমি কিছু করতে চেষ্টা করুন. কেন যে প্রয়োজনীয়?
এটা পরিনত হয় যে পরের জিনিস আমি এখানে করতে যাচ্ছি শুরু হয় একটি উপাদান খুঁজছেন
যে কিছু নির্বাচক সাথে মেলে.
যদি কখনও এই জাভাস্ক্রিপ্ট মৃত্যুদন্ড কার্যকর হওয়ার আগে এই উপাদান পাতা লোড হয়,
তারপর সবকিছু আমি কি চেষ্টা কাজ হবে না
কারণ আমি এখনো যে কিছু হয় না নির্বাচন করার চেষ্টা করতে যাচ্ছি.
তাই উপরে এই লাইন বলছেন আমি আপনি সবকিছু লোড হওয়া পর্যন্ত অপেক্ষা করতে চান না
তাই আমরা যে কোনো উপাদান আমি খুঁজছি পৃষ্ঠায় আসলে নিশ্চিত করছেন.
এই ডলার এখানে সাইন মানে আমি লাইব্রেরি বলা হয় jQuery ব্যবহার করছি.
গ্রন্থাগারের এই jQuery আমাদের এই নির্বাচক যে আমরা শুধু দিকে তাকিয়ে ব্যবহার করতে পারবেন.
দ্বারা $ তারপর বলছে একটি আর্গুমেন্ট হিসাবে এই ক্ষণস্থায়ী # ফর্ম-মূল্যউদ্ধৃতি মধ্যে,
আমি এখন করছি যে ফর্ম নির্বাচন যে আমরা একটি চেহারা নিয়েছে.
এখন আমি যা মেমরির মধ্যে যে একরকম ফর্ম একটি উপস্থাপনা আছে.
>> অন ​​এই বস্তু এখন, ফর্ম এই উপস্থাপনা,
আমি এখন করছি একটি ফাংশন বলা নেভিগেশন ব্যবহার করে.
কি এই ফাংশন আছে এটা একটি ইভেন্ট হ্যান্ডলার জোড়া যাচ্ছে.
ঘটনাটি যে জন্য আমরা শুনতে যাচ্ছে সেটি submit 'ঘটনা.
সুতরাং যখন ব্যবহারকারীর ক্লিকের যে বোতাম বা presses জমা লিখুন,
এই ইভেন্টটি ফায়ার হবে.
এই মধ্যে hooking দ্বারা, আমি এখন ফর্ম ডিফল্ট আচরণ মান অগ্রাহ্য করা যাবে.
এই জাভাস্ক্রিপ্ট ছাড়া, ফর্ম জমা দিন যাই হোক না কেন পিএইচপি ফাইল
আমরা যে কর্মের বৈশিষ্ট্য ব্যবহৃত.
কিন্তু পরিবর্তে, এখন আমি বলছে করছি, অপেক্ষা করুন, অপেক্ষা, অপেক্ষা করুন, আমি আপনাকে আসলে কি সেটা চাই না.
আমি এই আগে আপনি যান এবং কিছু পিএইচপি ফাইলে জমা দেবার চেষ্টা করতে চায়.
এখন আমি কি করতে চান?
আমি একরকম AJAX কি স্টক মূল্য মধ্যে লোড করার জন্য ব্যবহার এই মুহুর্তে চান.
প্রথম জিনিস জানতে হবে আমি কি স্টক ব্যবহারকারী আপ খুঁজছেন হয়.
না যে আমি অন্য একটি নির্বাচক ব্যবহার করতে যাচ্ছি.
এটি তৃতীয় নির্বাচক আমরা আগে দিকে তাকিয়ে.
এই বলে যে আমি উদ্ধৃতি ফর্ম-এর একটি আইডি দিয়ে শুরু এই ফর্ম উপাদান বন্ধ করতে চান.
তদাকার ভিতরে কোথাও তারপর রয়েছে একটি ইনপুট উপাদান আছে
যে প্রতীক একটি নাম আছে.
যদি আমরা আমাদের HTML-এ ফিরে তাকান, আমরা দেখেছি যে আমরা একটি ইনপুট ছিল [নামের = চিহ্ন].
তার মানে এই যে টেক্সট বক্সের মধ্যে যে ব্যবহারকারী টাইপ করছে নির্বাচন হবে.
এটা চমৎকার. আমরা টেক্সট বক্স আছে.
এখন আমরা তা ভিতর কি জানি শুধু প্রয়োজন.
যে আমরা এই পদ্ধতি এখানে কল করতে পারেন এটা. Val,,
এবং এই বলে আমি জানি আপনি কি টেক্সট বক্স আছে.
আমি আপনার সম্পর্কে কি এটা ব্যবহারকারী যে টেক্সট বক্সে টাইপ জানাতে চান.
এখন আমরা একটি স্ট্রিং নামক চিহ্ন যা সমান যাই হোক না কেন ব্যবহারকারী টাইপ করে রেখেছেন আছে
এটা চমৎকার. আমরা স্ট্রিং এখন ব্যবহার করার জন্য আমাদের অনুরোধ করতে পারেন.
এটি এখানে একটি নতুন ফাংশন, এই $,
আমরা ছাড়া আর চলুন যাও উপাদান নির্বাচন করা হবে,
আমরা একটি ভিন্ন ফাংশন যে আমাদের jQuery এর দ্বারা উপলব্ধ করা হবে কলিং চলুন.
এই AJAX ফাংশন কি আসলে এর এই HTTP-র অনুরোধ করা যাচ্ছে.
তাই আমরা কয়েকটি বিষয় জানাতে হবে.
প্রথম জিনিস আমরা এই ফাংশন বলা আছে যেখানে আমি অনুরোধ যেতে চান.
কোথাও আমার প্রকল্পের আমি HTML-নির্দেশিকা নামক quote.php ভিতর এই ফাইল আছে.
আমি এই ফাইলটি ব্যবহার করতে পারেন, আমরা শুধু ভালো দেখেছি,, আমি যদি localhost / quote.php যান.
>> আমি যে পাতা থেকে একটি অনুরোধ করা আমার জাভাস্ক্রিপ্ট চান.
কি ধরনের অনুরোধ এখন?
আমরা দেখেছি আগে যে ফর্ম যে পদ্ধতি = "পোস্ট" অ্যাট্রিবিউট আছে,
এবং তার মানে এটি একটি পোষ্ট করতে অনুরোধ করবে,
তাই এটি URL 'র মধ্যে বরং একটি অনুরোধ পেতে বেশী কিছু করা, যাচ্ছে না,
যা শুধু মাত্র যদি আমরা ওয়েব ব্রাউজার দিয়ে ব্যবহার পাতা উদাহরণস্বরূপ, বহিস্কার করা হবে.
এখন আমরা আমি একটি HTTP POST অনুরোধ করতে চাই বলেন করেছি
একটি পাতা quote.php এ অবস্থিত.
আমরা যখন ফর্ম জমা দেবেন, মনে রাখবেন আমরা যে ফর্ম ভিতর ইনপুট উপাদানের অ্যাক্সেস করতে পারে
যে $ _POST পরিবর্তনশীল.
এ পর্যন্ত বিবরণ প্রকৃতপক্ষে আমরা পাঠিয়েছে কোনো তথ্য বরাবর না এখনো.
আমরা ঠিক করেছি বলেন, আমরা একটি AJAX অনুরোধ করছেন
এবং এখানে অনুরোধের টাইপ আমরা তৈরি করছি.
এখন আমরা আসলে পৃষ্ঠাতে কিছু তথ্য পাঠাতে হবে.
না যে আমরা এই সম্পত্তি নামক তথ্য ব্যবহার করতে পারেন.
এই সম্পত্তির মূল্য আসলে একটি এসসিয়েতিভ আরে.
এই জন্য কারণ এটা আমাদের শুধু তথ্য 1 টুকরা বেশী পাঠাতে পারবেন.
এটা কেন আমরা এই তরঙ্গায়িত ধনুর্বন্ধনী এখানে এই অন্যান্য কোঁকড়া ধনুর্বন্ধনী ভিতরে নেস্টেড.
এই মিশুক অ্যারে মধ্যে কি একই জিনিস হতে যাচ্ছে
হিসাবে যাদের নাম আমাদের ফর্ম উপাদানের মধ্যে বৈশিষ্ট্যাবলী.
এটার মানে হল যে যদি আমি চিহ্ন কী বরাবর পাঠাতে,
মানে আমার পিএইচপি পাতা $ _POST [চিহ্ন] সঙ্গে এই তথ্য অ্যাক্সেস করতে পারেন
যেমন আমরা যখন আমরা একটি ফর্ম জমা দেওয়ার আগে ছিল না.
এবং এখন আমরা প্রকৃত তথ্য পাঠাতে চান
এই মিশুক অ্যারের মান ভিতর হতে যাচ্ছে.
>> আমরা একটি পরিবর্তনশীল নামক চিহ্ন এই পাঠ সঞ্চিত,
এবং তাই আমরা বরাবর প্রেরণ চিহ্ন এখন কী করছেন
এবং যাই হোক না কেন ব্যবহারকারী টাইপ ইন একটি মান
এখন আমরা এই HTTP-র অনুরোধ করেছি, আমাদের পিএইচপি ফাইল মৃত্যুদন্ড কার্যকর করেনি,
এবং এটি যাও ক্লায়েন্ট কিছু তথ্য যে ঠিক এই অনুরোধটি করেছেন ফেরত পাঠাতে এখন যাচ্ছে.
এখন আমরা আমাদের সার্ভার যাই হোক না কেন তাতে সাড়া প্রয়োজন.
না যে আমরা এই শেষ এখানে সম্পত্তি নামক সাফল্য আছে.
এই সাফল্য কি 'র মান প্রকৃতপক্ষে একটি ফাংশন হবে,
এবং এটি সত্যিই দুর্দান্ত জিনিস আপনাকে জাভাস্ক্রিপ্ট দিয়ে করতে পারি এক.
নেই শুধু একটি মিশুক অ্যারের মান ভিতরে হিসাবে আপনি ints অ্যারে বা থাকতে পারে,
আমরা একটি কার্যকারিতা থাকতে পারে.
সুতরাং দ্বারা সাফল্য বলছে, এই হল আমার কী.
একটি কোলন এখানে বলছেন মান আসে,
এবং এখন এই মান আসলে একটি ফাংশন.
তাই আমরা কোনটাই একটি নাম দিন এই ফাংশন করার প্রয়োজন হবে না.
আমরা কেবল বলতে পারেন এই কিছু ফাংশন হবে. এটি 1 যুক্তি নিতে যাচ্ছে.
এই ফাংশন আর্গুমেন্ট হতে যাচ্ছে
যাই হোক না কেন সার্ভারের প্রেরিত অনুরোধ আমাদের থেকে ফিরে.
শুধু যখন আমাদের ব্রাউজারে একটি অনুরোধ তোলে চান, সার্ভার কিছু ফেরত পাঠায়
এবং ব্রাউজার এটি প্রদর্শন করা,
AJAX পরিপ্রেক্ষিতে আমরা শুধু একটি অনুরোধ করেন যে, সার্ভার কিছু ফেরত পাঠানো হয়,
এবং এখন আমরা যে একটি পংক্তি হিসাবে প্রতিনিধিত্ব করেছেন.
স্ট্রিং সঙ্গে আমি যে পাতা প্রদর্শন করতে চান.
না যে আমি এক নির্বাচক শেষ আছে যাচ্ছি.
আমি আইডি মূল্য সহ উপাদান নির্বাচন করতে চান.
এটি একটি খালি পাতা তৈরি div যে আমি করেছি,
এবং আমি যে div যাও যাহা সার্ভার আমাদের ফেরত পাঠানো হতে বিষয়বস্তু সেট করতে চান.
আমি আসলে একটু পরিবর্তন করেছি quote.php.
>> বরং রেন্ডার কলিং এবং কিছু পাতা তরজমা,
quote.php সহজভাবে এখন স্টক একটি পংক্তি হিসাবে মান প্রিন্ট আউট হবে.
সুতরাং যদি আপনি আসলে পাতা পরিদর্শন ছিল, আপনি শুধু যে ছোট পংক্তিটি হবে
এর স্টক মূল্য যাই হোক না কেন.
গত এক জিনিস আমরা এখানে যা করতে হবে ঠিক নিশ্চিত না এই ফাংশন ফেরৎ মিথ্যা না.
কি এই বলে যে যদি আমি একটি হ্যান্ডলার এর ভিতর আছি
এবং যে হ্যান্ডলার এর পরিবর্তে ফিরে সত্য মধ্যে ফেরৎ মিথ্যা,
তার মানে আমি ফায়ার আসল ইভেন্ট করতে না চান.
এই ক্ষেত্রে, যদি আমরা আছে এবং কোন জাভাস্ক্রিপ্ট না আমরা একটি ফর্ম জমা দেওয়া,
আমাদের ওয়েব ব্রাউজারকে বলে, "আমি বরাবর যে তথ্য পাঠাতে যাচ্ছে না" হবে
এবং তারা অন্য পাতা পাঠাতে চলুন.
কারণ আমরা AJAX ব্যবহার করে এখন করছি, কোন প্রয়োজন বা অন্য পৃষ্ঠাতে ব্যবহারকারী পাঠাতে আছে.
আমরা ঠিক করছি ফলাফল প্রদর্শন পরিবর্তনশীল এই একই পৃষ্ঠায় যাচ্ছে.
আমরা সত্যিই তাদের কোথাও যেতে, না এবং আমি একই পৃষ্ঠায় থাকতে চান.
তাই ফিরে মিথ্যা, আমরা নিশ্চিত যে ফর্ম যা আমাদের জন্য না.
চলুন কি আসলে এই মনে কটাক্ষপাত করা.
আমাদের মূল্যউদ্ধৃতি পাতা একই দেখায়.
আমাকে পরিদর্শক বৈঠাচালনা আপ ডাউন এখানে যাতে আমরা কি ঘটছে তা দেখতে পারেন.
এটি একটি সামান্য কম বিশাল না.
যদি আমরা নেটওয়ার্ক ট্যাব খুলুন স্মরণ রাখবেন, এই যেখানে আমরা HTTP অনুরোধের সব দেখতে পারেন
যে পৃষ্ঠায় ঘটছে.
>> একটি সিম্বলের জন্য দেওয়া AAPL এ সম্পর্কে এবং টাইপ উক্তি পান ক্লিক করুন.
এখন আমরা দেখেছি যে আপেল ভাগ ডলার খরচ কিছু সংখ্যা
শুধু পাতা তে হাজির হয়, কিন্তু URL-এ সমস্ত পরিবর্তন হয়নি.
আসলে এখানে, এটা HTTP অনুরোধের যে আমরা তৈরি.
আমরা quote.php একটি পোষ্ট অনুরোধটি করেছেন. যে অর্থে তোলে.
এটা কি সার্ভার আমাদের ফেরত পাঠানো হয়.
তাই এটা এখন আর এই সুবিপুল এবং ইমেজ যে মত বিষয়গুলিতে HTML নথি,
এটি শুধু লেখার একটা লাইন, এবং তারপর আমরা লেখার লাইন প্রদর্শিত.
আমরা যদি হেডার ফিরে যান এবং কি আমরা আসলে এই HTTP অনুরোধের ভিতরে পাঠানো দেখুন,
আমরা এখানে নিচে দেখতে পারেন যে আমরা চিহ্ন এবং AAPL একটি মান কী বরাবর পাঠানো,
যা কি ব্যবহারকারী টাইপ ইন
এটি চমৎকার, কিন্তু এটি এখনও একটু বিরক্তিকর.
আমি এখনও এই বোতাম যাও স্টকের মূল্য পেতে ক্লিক করুন আছে.
আমরা ব্যস্ত মানুষ এবং আমরা বাটন ক্লিক সময় নেই.
Google এই সামান্য উপলব্ধি করার আগে যখন তারা Google তাত্ক্ষনিক বাস্তবায়িত হয়নি.
কি Google ঝটপট আছে হয় হিসাবে আপনি টাইপ করছেন এটা শুরু হয় আপনি এর ফলাফল প্রদর্শন করা
যাতে আপনি এমন কি খোঁজো ক্লিক করে চিন্তা করতে হবে না.
বাস্তবিক, একটি মজার গল্প যে সংক্রান্ত.
একবার Google ঝটপট বেরিয়ে আসেন, মানুষ, ভালো ছিল "আরে, এই হল সুপার আশ্চর্যজনক."
"এটি যাতে শান্ত."
এবং স্ট্যানফোর্ড সময়ে ছাত্র নিচে যিনি এই সময়ে ছিল 19
এই সাইট YouTube-তাত্ক্ষনিক বলা হয়েছে.
YouTube-এ সমস্ত তাত্ক্ষনিক কার্যকরভাবে জন্য অবিলম্বে YouTube-এ অনুসন্ধান করা হয়.
তাই বদলে যাও যাও এবং YouTube.com খোঁজো আঘাত যেতে হচ্ছে,
যখন আমি CS50 মত শুরু YouTube-তাত্ক্ষনিক কিছু ভাগ টাইপ,
আমরা এখানে যে এটি একটি ধীর গতির ইন্টারনেট সংযোগ প্রয়াস দেখতে পারে
পূরণ এই ফলাফল বাস.
না যে আমরা আসলে আমাদের quote.js ফাইল খুব সহজ পরিমার্জন করতে পারেন.
রাইট এখন আমরা এই ইভেন্ট সংযুক্ত করছি যখন ফর্ম জমা দেওয়া হয়.
আমরা ব্যবহারকারী আর যে ফর্ম জমা করতে চাই সত্যিই না,
তাই দিন এর পরিবর্তে প্রতি সময় ব্যবহারকারী একটি কী presses করো এই ইভেন্ট.
কি যে let এর প্রথম keyup জমা থেকে ইভেন্ট পরিবর্তন.
যে বরং অপেক্ষা জন্য ফর্ম জমা দিতে চেয়ে মানে,
প্রত্যেক সময় কি টেপা না হলে, কিছু একটা ঘটতে যাচ্ছে.
এটা কোনো ইন্দ্রিয় পুরো ফর্ম এই keyup ইভেন্ট জোড়া তোলে.
আমরা সত্যিই শুধুমাত্র যে সার্চ বক্স যত্নশীল.
>> যাও এখন যে, আমরা এই করা বরং ফর্ম-মূল্যউদ্ধৃতি তুলনায় পরিবর্তন, নির্বাচন করতে পারেন,
ফর্ম-মূল্যউদ্ধৃতি এবং আমরা একটি ইনপুট আছে (= টেক্সট টাইপ) বা আমরা (= চিহ্ন নাম) বলতে পারে করব -
যাই হোক না কেন আমরা চাই.
এখন এক শেষ জিনিস আমরা কি আছে.
নিচে এখানে মনে রাখবেন যখন আমরা ফেরত মিথ্যা
আমরা বলেন, আমরা যে ডিফল্ট ইভেন্ট করো না চান.
কিন্তু এটা যাতে ঘটবে যদি আমরা এখন অক্ষম যে,
যাই হোক না কেন আমরা টাইপ ব্রাউজারে দেখা আর হবে না
কারণ যে কোনো টেক্সট বক্সে টাইপ ডিফল্ট আচরণ নির্ধারণ করা হবে.
আমরা যে তাই, এর এই রিটার্ন মিথ্যা ধ্বংস যাক আর ওভাররাইড করতে চান.
যদি আমরা যে এবং সংরক্ষণ পাতা, এখন পুনরায় লোড যখন আমি AAPL টাইপ করা শুরু
আপনি যে স্বয়ংক্রিয়ভাবে এখানে নীচে স্টক মূল্য পরিপূরক হয় দেখতে পাবেন.
সুতরাং এখানে CS50 ফাইন্যান্স তাত্ক্ষনিক.
বাস্তবিক একটি YouTube তাত্ক্ষনিক সম্বন্ধে মজার গল্প
ঠিক হয় যে ছাত্র ধরনের একটি 1 রাত্রিকালীন প্রকল্প হিসাবে এটি লিখেছেন,
এবং পরের দিন তিনি ইউটিউব সিইও দ্বারা একটি পেশা ছিল দেওয়া.
সুতরাং হিসাবে যে সহজ হিসাবে, আপনি CS50 ছাত্র, আপনার চূড়ান্ত প্রকল্প YouTube-এ আপনি একটা কাজ করতে পারেন.
যে মত একটি প্রকল্প চূড়ান্ত জন্য সত্যিই শীতল ধারণা, ডান?
আমরা কিছু বিদ্যমান কার্যকারিতা যে আমরা সাথে সংহত করতে চেয়েছিলেন ছিল.
আমরা অল্প উন্নত ব্যবহারকারীর অভিজ্ঞতা,
এবং হঠাৎ YouTube-এ অবিলম্বে কিছু অনুসন্ধান অনেক সহজ হতে পারে
এটি জন্য তুলনায় নিয়মিত YouTube-এ অনুসন্ধান করা.
সুতরাং যে কথায় আছে AJAX.
>> উদাহরণ যে জোসেফ দেখাচ্ছে ছিল, আমরা autocompletes অনেক দেখেছি,
এবং যারা autocompletes সত্যিই, সত্যিই সুবিধাজনক কারণ আমরা মনে রাখতে হবে না -
উদাহরণস্বরূপ, যদি আপনি আপেল জন্য স্টক দাম মনে রাখতে হবে না
এবং আমরা জানি এটা বরং আমার ঠিক বলছে তুলনায় aa কিছু,,
"এই জিনিস এক ভাগ এই টাকা খরচ,"
আমি কি স্টক aa সঙ্গে শুরু জানা ধরনের চাই.
আমরা যে লাইব্রেরি বুটস্ট্র্যাপ ইতোমধ্যেই অন্তর্ভুক্ত সঙ্গে যে কি সত্যিই চমত্কার করতে পারেন
ভিতর CS50 ফাইন্যান্স.
আপনি যদি জাভাস্ক্রিপ্ট আসা ট্যাগ এখানে আপ এবং Typeahead যাও নিচে স্ক্রল,
এটা একটা চমৎকার প্লাগইন যা আমাদের জন্য ইতিমধ্যে কারো লিখেছেন,
এবং আমরা সহজে ভালো তার বৈশিষ্ট্য ব্যবহার করতে পারেন.
আমি একটি একটি টাইপ করা এবং এখানে কয়েকটি রাজ্যে এ যে শুরু তালিকা
চলুন শুরু করা যাক যে আমি মনে হয় যে এটা সত্যিই শান্ত এবং সময় এর জন্য আমার এই পৃষ্ঠায় অন্তর্ভুক্ত.
এটা পরিনত হয় যে এটি সত্যিই সত্যিই, সহজ.
চলুন quote3.js ঝাঁপ এখানে বেশী.
আমার ফাইল দেখায় সামান্য কিছুটা আলাদা.
এখানে নিচে আমার AJAX তরিতরকারি সব একই.
আমি বা অন্য পৃষ্ঠাতে যান ছাড়াই স্টক তথ্য লোড করতে চান.
কিন্তু এখন আমি এই প্লাগইন ব্যবহার করতে চান.
বুটস্ট্র্যাপ ডকুমেন্টেশন ঠিক কিভাবে আমি তা করতে পারে মহান উদাহরণ আছে.
আমি বলতে চাই, "এখানে আমি যে ইনপুট স্বয়ংসম্পূর্ণ করতে চান,"
এবং আমি এই ফাংশন বলা typeahead কল চলেছি,
এবং যে আমাদের জন্য Typeahead তরিতরকারি সব হ্যান্ডেল করে যাচ্ছে.
এটা তালিকা আরম্ভ করা হবে, এটা আমাদের ফিল্টারিং সব করবেন.
শুধু এটা জানা প্রয়োজন হয় যে তথ্য আমরা autocompleting করছি.
তাই আমি শুধু ডকুমেন্টেশন পাওয়া পড়া এবং উদাহরণ এ খুঁজছেন দ্বারা এই কি আউট.
যদি আমি এটা উৎস কী, এই কি 'র মান দিতে
একটা জিনিস কিছু অ্যারে আমি স্বয়ংসম্পূর্ণ করতে চান.
এই পরিবর্তনশীল এই অন্যান্য ফাইল থেকে এসেছিলেন.
আমি খুলুন symbols.js আপ.
>> এই symbols.js শুধুমাত্র এই সত্যিই সত্যিই, বড় অ্যারে পংক্তি ধারণকারী
এই NASDAQ থেকে স্টক প্রতীকে সব.
যদি আমি ফিরে এইচটিএমএল, যাতে jharvard, vhosts, globalhost, এইচটিএমএল, টেমপ্লেট ঝাঁপ চান,
quote_form.
যেহেতু এখন যে quote3.js এর নামে, আমাকে জাভাস্ক্রিপ্ট ফাইল এখানে আমি অন্তর্গত করছি পরিবর্তন.
এখন আমি quote3.js আছে, তাই আমি যে পৃথক জাভাস্ক্রিপ্ট ফাইলের মধ্যে লোড করা যাচ্ছে না,
এক যে বুটস্ট্র্যাপ স্বয়ংসম্পূর্ণ হয়েছে.
এখন যখন আমি ব্রাউজারের ঝাঁপ ফিরে, পাতা, পুনরায় লোড করুন এবং আমি শুরু aa টাইপ,
আমার স্বয়ংসম্পূর্ণ করার আছে. এবং এটি সত্যিই ছিল যে হিসাবে হিসাবে সহজ.
আমি কোড 1 লাইন যে শুধু বলেন, ছিল "এখানে জিনিষ আমি স্বয়ংসম্পূর্ণ করতে চান,"
এবং আমি হঠাৎ প্রচেষ্টার একটি সম্পূর্ণ না অনেক সময়ে এই সব সঙ্গে সত্যিই সত্যিই, সুন্দর কার্যকারিতা আছে.
হিসাবে আপনি ওয়েবসাইটের এবং বিশেষত সামনে জিনিস শেষ প্রান্তের উন্নয়নশীল করছি,
আপনি এই ক্ষেত্রে অনেক খুঁজে পেতে যাচ্ছেন.
অনেক, সত্যিই শীতল বিনামূল্যে লাইব্রেরি অনেক, আছে অনেক আছে
যে না এটা ভালো জিনিস সুসাধ্য সুপার.
এই চিহ্ন বৃহৎ তালিকায় সহজভাবে autocompleting কোন অপূর্ণতা মধ্যে যে কেউ মনে করতে পারেন?
কি যে ভাল কিছু এই পদ্ধতির সঙ্গে পারা গেল না?
হাঁ. >> [ছাত্রদের] সময়, যদি আপনি [শ্রবণাতীত] অনেক আছে
হাঁ. রাইট এখন আমরা এই বিশাল জাভাস্ক্রিপ্ট ফাইল ডাউনলোড করছেন এবং চিহ্ন অনেক আছে.
এবং তাই যদি আমরা পণ্যদ্রব্য একটি টন আছে, এই ধরনের পারা অনুসন্ধান শুধু না লেটেন্সি বৃদ্ধি
কিন্তু প্রকৃত ফাইল ডাউনলোড করা.
গ্রেট. আরও কিছু লাগবে?
রাইট এখন কোন প্রাসঙ্গিকতা বাস্তব অর্থে আছে.
যদি আমি একটি একটি, কোম্পানি প্রদর্শন করুন এখানে টাইপ
সবচেয়ে জনপ্রিয় এ কোম্পানীর সঙ্গে যে শুরু নাও হতে পারে
>> আগে আমি আপেল পেতে, এটা থেকে কি আমি চাই আরো কিছু অক্ষর খুঁজে নিতে পারে.
এই স্বয়ংসম্পূর্ণ প্রাসঙ্গিকতা এই অর্থে নেই.
এটি শুধু, বলে যাচ্ছে "আর যে মেলে আমি প্রদর্শন যাচ্ছি."
পরিবর্তে যে, আমি একরকম অনুসন্ধান আমার মধ্যে কিছু প্রাসঙ্গিকতা সংহত করতে চাই.
যদি আমি কি ইয়াহু ফিনান্স এখানে বেশী, finance.yahoo.com,
যদি আমি ইয়াহু ফিনান্স এর পাতায় একটি প্রতীক লিখুন চেষ্টা
এবং আমি শুরু GOOG টাইপ, আমি এই জিনিষ চমৎকার তালিকা আছে.
স্পষ্টত:, এটা দেখে মনে হচ্ছে ইয়াহু ফিনান্স কিছু করছে আরো চালাক এখানে.
তারা কিছু প্রাসঙ্গিকতা আছে এবং তারা অতিরিক্ত কিছু তথ্য আছে
ভালো স্টক নাম.
এটা কিছু যে আমি সত্যিই শুধু আমার চিহ্ন স্টক তালিকা সঙ্গে পাবেন না.
আমি এই করতে চান এবং আমি এটা নিতে যাচ্ছি.
কি যে let এর কয়েকটি বিষয় না.
চলুন শুরু করা যাক এই প্রথম পাতা খোলা পরিদর্শক আপ
কারণ আমরা দেখেছি যে এই পৃষ্ঠায় সমস্ত পুনরায় লোড করা হয় না,
তাই সম্ভবত এটি AJAX এর ব্যবহার একরকম তাদের তথ্য লোড করা হবে.
আমরা কি তা লোড এর তথ্য খুঁজে পেতে পারেন.
যদি আমি এই নেটওয়ার্ক ট্যাবে ক্লিক করুন, এই অনুরোধ শুরু করা হবে যে বহিস্কার যাও সব হতে যাচ্ছে.
এখন যদি আমি সস্তা ভাবালুতা টাইপ, আমরা যে আমি একটি নতুন HTTP অনুরোধ পেয়েছেন দেখতে পারেন.
এটা সম্ভবত যেখানে যে তথ্য থেকে আসছে.
নিশ্চিত যথেষ্ট, যদি আমি এই URL টি, যা একটু অদ্ভুত নামে তাকান,
আমরা যে এই ঠিক হল যেখানে ইয়াহু থেকে পাঠানো তার তথ্য বন্ধ আপনি তা দেখতে পারেন.
>> আমি একটি পৃথক ফাইল নামক suggest.php যে এর মধ্যে আত্মা লুকআপ ফাংশন অনুরূপ তৈরি করে.
এটি মূলত এর যাও ইয়াহু এর URL-এ একটি প্রশ্ন তৈরী করুন ঃ যাচ্ছে, কিছু কিছু তথ্য পেতে ফিরে,
এবং এটি প্রেরণ সম্পর্কে ফিরে.
এখন, বরং এই বড়, চিহ্ন বিপুল তালিকা ব্যবহার করে,
আমি ইয়াহু এর প্রাসঙ্গিকতা চমৎকার জিনিস ব্যবহার করতে পারেন,
এবং আমি যে বৃহদায়তন জাভাস্ক্রিপ্ট ফাইল ডাউনলোড করতে হবে না.
আমি শুধু করছি আসলে প্রাসঙ্গিক স্টক প্রতীকে টেনে নামিয়ে আনবো যাচ্ছে.
এর মধ্যে যে তিড়িং লাফ দিন.
সুতরাং html, js. আমরা quote4 মধ্যে এখন করছি.
এখন আমরা আর সেই জাভাস্ক্রিপ্ট ফাইল বড় তালিকা ব্যবহার করছেন.
কিন্তু এখানে আছে একটি নকশা সমস্যার ছোট ধরনের.
আমরা যে AJAX মধ্যে একটি হল অ্যাসিঙ্ক্রোনাস বলেন করেছি.
কি যে মানে হল এই যে যখন আমি একটি AJAX অনুরোধ না,
লাইন 8 তাই ঠিক, এই হল যেখানে আসলে আমার AJAX অনুরোধ বহিস্কার করা হয়.
চলুন শুরু করা যাক বলতে এখন আমি কিছু কোড নিচে আছে এখানে যা কিছু উপাদান কাজ করে যাচ্ছে
ব্যবহারকারী পাতা অথবা পরিবর্তনের কিছু সতর্কতা চাই.
কি ঘটতে যাচ্ছে না হয় এর ব্রাউজার এই অনুরোধ জন্য অবিরত অপেক্ষা করতে হবে না
আগে ত্তলন এবং এই লাইন আঘাত.
এটা অ্যাসিঙ্ক্রোনাস অংশ.
এই অনুরোধ করতে বলবে "যখনই আপনি শেষ করবে,
"ফিরে আসা এবং যে ফাংশন যে আমি সাফল্য ভিতরে কল কল আপনাকে বলেছে."
তার মানে আমরা শুধুমাত্র ডাউনলোড করতে পারেন না আগেভাগে সব স্টক.
আমরা অনুরোধ করা এবং কিছু ফিরে আসা জন্য অপেক্ষা করার প্রয়োজন.
যে যে আগে মানে, আমরা শুধু বুটস্ট্র্যাপ বলতে পারে,
"এখানে জিনিসের তালিকা আমি স্বয়ংসম্পূর্ণ করার আপনি করতে চান."
আমরা যে আর নেই কারণ আমরা জানি না পারেন
আমরা আসলে স্বয়ংসম্পূর্ণ করতে চান.
সৌভাগ্য যে, এই বুটস্ট্র্যাপ কারণ হল যারা আছে ওভার স্মার্ট বলছি,
এবং প্রকৃতপক্ষে তারা এনে দেয় এই Typeahead প্লাগইন লোড করার আরেকটি উপায় আমাদের.
পূর্বে, এই উৎস সম্পত্তির মূল্য ছিল ঠিক এই জিনিস বড় স্বয়ংসম্পূর্ণ করার শৃঙ্খলার.
>> এখন উৎস সম্পত্তি আসলে একটি ফাংশন,
এবং এই ফাংশন উদ্দেশ্য জিনিসটা কি স্বয়ংসম্পূর্ণ করার জিনিষ হয় তাদের.
উপায় যে জিনিসটা হচ্ছে এটা যাও ইয়াহু ফিনান্স জিজ্ঞাসা যাচ্ছে
কি স্বয়ংসম্পূর্ণ করার সবচেয়ে ভাল জিনিস.
না যে আমি খুব অনুরূপ AJAX অনুরোধ করা যাচ্ছে না.
আমি suggest.php এই পৃষ্ঠা অনুরোধ যাচ্ছি.
আমি এখনও চিহ্ন বরাবর পাঠাতে চান.
এবং এখন আমার সাফল্য, বুটস্ট্র্যাপ ডকুমেন্টেশন সম্পর্কে জানান
যে অনুক্রমে জিনিস যে তালিকা পূরণ যাও,
সব আমি যা করতে হবে এখন এই অ্যারের মধ্যে পাস হয় কলব্যাক ফাংশন.
কিন্তু একটি মিনিট অপেক্ষা করুন.
যদি এই একটি অ্যারে হতে অনুমিত এবং AJAX সম্পর্কে পাঠাচ্ছে ফিরে টেক্সট হয়,
কিভাবে সম্ভব হল?
এই একটি নামক JSON তথ্য বিনিময় নতুন পথ চলা.
এই ক্ষেত্রে আমরা একটি সহজ টেক্সট পংক্তি প্রেরণ ঠিক করছি না ফিরে.
এখন আমরা এই স্টক প্রতীকে আরও জটিল তালিকা সঙ্গে লেনদেন করছেন.
এই স্টক প্রতীকে এছাড়াও কোম্পানির নাম অথবা বর্তমান মূল্য মত কাজ করা যাবে.
শুধু একটি বড় দীর্ঘ স্ট্রিং যে কোনো আন্দাজের ভাবে ফরম্যাট না ব্যবহার করে
হয় সবচেয়ে ভালো উপায় হলো ইয়াহু এর সার্ভার থেকে এই তথ্য সম্পর্কে পেতে হবে না
কখন যে আমি সহজে বুঝতে পারেন.
JSON একটি প্রযুক্তি যে কিভাবে আমরা জাভাস্ক্রিপ্ট মধ্যে মিশুক অ্যারে নির্মাণ সুবিধা নেয়.
এই একটি জাভাস্ক্রিপ্ট এসসিয়েতিভ আরে মত অনেক দেখায়,
এবং আসলে, এটি এর কারণ এটি.
JSON জাভাস্ক্রিপ্ট অবজেক্ট স্বরলিপি ঘোরা.
মূলত এই বিন্যাসে উপর একটি তথ্য বিনিময়ের পিছনে জন্য একমত.
এখানে এই JSON সামগ্রী বা JSON মিশুক এই অ্যারে
সম্পর্কে একটি কোর্স সম্পর্কে কিছু তথ্য প্রেরণ করা হয়.
>> এই অ্যারের নির্দেশক জিনিসগুলি অবশ্যই ভালো যে cs50 একটি মান আছে,
এবং এখানে আমরা নিচে যে আমি একটি মান যে একটি অ্যারে আছে দেখতে পারেন.
আমি স্ট্রিং আউট পার্স মত কাজ করবেন এবং না কমা জন্য চেহারা
এবং যে ছবি ভালো কিছু করার.
কারণ এই এই JSON বিন্যাসে ঘোষিত হয়,
জাভাস্ক্রিপ্ট এবং jQuery ইতিমধ্যেই একটি স্ট্রিং রূপান্তর ফাংশন আছে
এই JSON মত একটি প্রকৃত জাভাস্ক্রিপ্ট মিশুক অ্যারের মধ্যে দেখায়
আমরা যে কাজ করতে পারেন.
যে এরকম হয় বলে যে নেই এই ফাইলটি, suggest.php হিসাবে হিসাবে সহজ,
সম্পর্কে পাঠানোর ফিরে সহজভাবে লেখা একটি পংক্তি,
কিন্তু আমি জানি এটা আমার ফিরে JSON প্রেরণ করা যাচ্ছে.
তার মানে যে JSON একটি জাভাস্ক্রিপ্ট মিশুক অ্যারের মধ্যে রূপান্তরিত করা সম্ভব.
এবং তাই jQuery, আমি কি আমার জন্য যে করতে চান.
এটার মানে হল যে এই প্রতিক্রিয়া এখানে পরামিতি,
এই আর মাত্র একটি পংক্তি.
কারণ আমরা jQuery বলেছেন এখানে যে কিছু JSON আসে,
jQuery যাও স্মার্ট যথেষ্ট বলতে হবে, "আপনি JSON চান?"
"আমি একটা আপনার জন্য মিশুক অ্যারের মধ্যে যে রূপান্তর যাচ্ছে. করছি"
চলুন আসলে নেটওয়ার্ক ট্যাব কটাক্ষপাত একবার আমরা quote4.js আছে নিতে.
আমরা এই পরিবর্তন এবং পৃষ্ঠাটি পুনরায় লোড করব.
এখন আমি একটি একটি করে আবার টাইপ করুন যাচ্ছি.
আমি একটি suggest.php যাও দম্পতি অনুরোধ করেছি, কিন্তু এখন এই প্রতিক্রিয়া,
বরং শুধুমাত্র স্ট্রিং, এটা JSON.
তাই আমি একটি খোলা কোঁকড়া বক্রবন্ধনী বলছে, আছে "এখানে আসে একটি মিশুক অ্যারে."
>> এই মিশুক অ্যারের প্রথম এবং একমাত্র চাবি চিহ্ন বলা হয়,
এবং তারপর এখানে প্রাসঙ্গিক হয় চিহ্ন সকল একটি অ্যারে
ইয়াহু ফিনান্স থেকে এখন আসছে যে রাক্ষুসে তালিকা থেকে, না.
এটা কিভাবে আমি কেবল এই স্বয়ংসম্পূর্ণ প্লাগইন পূরণ করতে পারেন
সাথে কিছু তথ্য যে একটি স্থানীয় ফাইলটি যে ইতোমধ্যেই পূর্বাহ্নে নির্ধারিত থেকে আসছে না
কিন্তু থেকে অন্য কিছু.
এটা পরিনত হয় যে আমরা আসলে একটি প্রযুক্তি বলা JSONP সুবিধা গ্রহণ করতে পারেন,
বা প্যাডিং সহ JSON, যে এই suggest.php ফড়িয়া নিষ্কাশন করা হবে.
কিন্তু এর পরিবর্তে যে করছেন, এর পরিবর্তে যাক কিভাবে আমি এই এমনকি আরো উন্নত করতে পারেন কটাক্ষপাত করা.
আমি সত্যিই Bootstrap-এর Typeahead চান. এটা সত্যিই চমৎকার.
কিন্তু আমরা জাভাস্ক্রিপ্ট ভাল এবং আমরা পেতে চান, তাদের নিজেদেরকে এই ধরনের কাজ করছি,
হয়তো কি এই প্লাগইন কাজ করা যায়নি কটাক্ষপাত করা.
এর আর যে Typeahead জিনিস ব্যবহার করা যাক,
এবং আসুন যাও প্রস্তাবিত স্টক এই তালিকা নিজেদেরকে করতে চেষ্টা করুন.
এখানে quote6.php মধ্যে আমরা একই ভাবে শুরু বন্ধ চলুন.
প্রতিটি সময় কাউকে কিছু ধরনের, আমরা একটি AJAX অনুরোধ করতে চাই.
এটি অনুরূপ আমাদের মূল CS50 ফাইন্যান্স তাত্ক্ষনিক যাও.
বরং quote.php একটি অনুরোধ করে,
আমরা এখন করছি যে একই ফাইলে আগে হিসাবে একটি অনুরোধের ফলে, এই suggest.php,
যা শুধু হয় ইয়াহু ফিনান্স থেকে তথ্য উন্মুলিত করা যাচ্ছে.
>> আবার, আমরা এখনও আশা করছি JSON, কিন্তু এখন থেকে এই Typeahead করছে আমাদের জন্য না,
আমরা মান যে বর্তমান টেক্সট বক্সের ভিতরে হয় বরাবর পাঠাতে প্রয়োজন.
এখন আমরা জানি কি ইয়াহু ফিন্যান্সের জন্য অনুরোধ,
এবং এখন তাই এখানে ফাংশন যে আমরা একবার অনুরোধ সঞ্চালনের সমাপ্ত করতে চান.
আমরা আমাদের জন্য তালিকা করার জন্য আপনার কাছে প্লাগইন না,
তাই এখানে যেখানে আসলে আমরা পরামর্শ তালিকা নির্মাণ করছেন যাচ্ছে.
যে কি, পিএইচপি অনেক পছন্দ আমরা এইসব HTML-এর বড় স্ট্রিং ঘনিভূত
তারপর আমরা তাদের মুদ্রিত, আমরা জাভাস্ক্রিপ্ট একই সঠিক জিনিস করতে পারেন.
প্রথম আমরা এই স্ট্রিং নামক পরামর্শ শুরু বন্ধ চলুন,
এবং শুধুমাত্র এই পংক্তিটি কিছু এইচটিএমএল থাকতে হবে.
আমরা এটা একটা তালিকা হতে চান, যাতে আমরা এই তালিকা ট্যাগ সঙ্গে চলতে শুরু চলুন,
এবং এখন আমরা চিহ্ন যা আমাদের মধ্যে ফিরে ফিরে সব পুনরুক্তি উপর চলুন.
মনে রাখবেন, কারণ আমরা ডাটাটাইপ বলেন করেছি: 'json', এই একটি স্ট্রিং নয়.
এই ইতিমধ্যে আমাদের জন্য একটি অ্যারে. এটা সত্যিই শীতল.
আমরা সহজভাবে বলে, "আমি আপনাকে একটি তালিকা উপাদান যোগ করতে চান." করতে পারেন
আমরা একটি একটি উপাদান ভিতরে এটা পাশ রেখে দেব,
আমরা পরামর্শ একটি বর্গ এটি দিন যাতে আমরা জানতে পারি কি করব,
এবং এখানে এখন একটি প্রতীক যে আমরা ইয়াহু ফিনান্স থেকে ফিরে পেয়েছেন.
>> একবার আমরা চিহ্ন আমরা ফিরে অর্জিত করেছি প্রতিটি জন্য একটি উপাদান তৈরি করে,
আমরা শুধু তালিকা বন্ধ করা বন্ধ করতে চান.
তাই এখন প্রস্তাবনা উপস্থাপন করে এই সামান্য এইচটিএমএল টুকরা
যে একটি পাতায় যখন বসাবেন সে ব্যাপারে আমরা খুঁজছেন সেটি তালিকা করা হচ্ছে.
এখন আমি কি আসলে পৃষ্ঠায় যে করান.
না যে আমি আসলে অন্য খালি div তৈরি করে এবং আমি এটি প্রস্তাবনার একটি আইডি দিয়েছি.
অনেক ভালো আমরা div বিষয়বস্তু যে স্টক তথ্য মূল্য প্রদর্শন করবে সেট,
আমরা শুধু এখন যাও যাই হোক না কেন এই স্ট্রিংটি এই div বিষয়বস্তু সেট করতে চান
যা এই চিহ্ন রয়েছে.
এই পদ্ধতি ব্যবহার করে HTML এর দ্বারা, এই পরামর্শ পরিবর্তনশীল, এই স্ট্রিং হয় HTML-এর একটি পংক্তি.
আমি আপনি যে HTML এ নিয়ে এর div নামক পরামর্শ ভিতরে লাগাতে চান.
আমরা ঠিক করেছি DOM কিছু এখন যোগ করা.
আমরা কিছু DOM যাও নতুন উপাদান যোগ করেছেন যে আমরা এখন পৃষ্ঠায় প্রদর্শন করতে পারেন.
এর কি ভালো দেখায় দেখতে দিন.
যদি quote6 আমরা লোড এবং এখন আমরা ফিরে আসা,
এখন যখন আমি শুরু AAPL টাইপ, আমরা নেই যে বুটস্ট্র্যাপ স্বয়ংসম্পূর্ণ করার আছে,
কিন্তু এখন আমরা এই তালিকা যে আমরা নিজেদের তৈরি করা আছে.
এটি যেমন একটি সামান্য বুটস্ট্র্যাপ Typeahead চেয়ে বিট uglier,,
কিন্তু এটা আমাদের এক অন্য জিনিস করতে অনুমতি দেয়.
যখন আমরা যে বুটস্ট্র্যাপ প্লাগইন দিকে তাকিয়ে ছিল,
আমরা দেখেছি যে, যখন আমরা autocompleted, স্বয়ংসম্পূর্ণ মান ছিল AAPL.
যাতে সহায়ক হতে পারে না.
একটি ব্যবহারকারী হিসাবে, অবিলম্বে আমি স্টক প্রতীকে সব চিনতে পারে.
কি আমি সম্ভবত না আরো চিনতে সম্ভাবনা কম কোম্পানী এর প্রকৃত নাম.
সুতরাং এটি সত্যিই সহায়ক হবে না যদি বদলে AAPL বলছে চাই
এই অ্যাপেল Inc মত কিছু বলেন
কারণ আমরা নিজেদেরকে ঘূর্ণিত এই করেছি, আমরা সত্যিই কি যে সহজেই করতে পারেন.
এর শেষ উদ্ধৃতি আমাদের এখানে ফাইল খুলুন যাক, তাই quote7.
>> একই জিনিস. আমি ঠিক করেছি পিএইচপি ফাইল অন্য যে আমাদের আরো ঠিক চিহ্ন তুলনায় ফিরে তৈরি হবে.
এটা আমাদের কোম্পানী এর নাম দিতে হবে ফিরে.
এবং তাই আমরা একই জিনিস করছেন. আমরা একটি AJAX অনুরোধ করছেন.
একবার অনুরোধ সম্পন্ন করেনি, আমরা এখানে এই ফাংশন চালানো চলুন,
এবং এই ফাংশনটি একটি উপাদানের বড় স্ট্রিং বিল্ড আপ হবে.
কিন্তু এখানে পার্থক্য হল, এই তালিকার মধ্যে মান আর মাত্র চিহ্ন,
এটি এখন এর নাম.
সুতরাং আমরা একটি ছোট সমস্যা আছে.
যখন আমরা আমাদের লুকআপ ব্যবহার, আমরা এটা একরকম প্রতীক পাস প্রয়োজন.
আমরা মাইক্রোসফট কর্পোরেশন লুকআপ মত কিছু হইনি পাস করতে পারেন.
আমরা এটা MSFT পাস প্রয়োজন.
যখন আমরা আপনাকে HTML লেখা করছি, আমরা চমৎকার অন্তর্নির্মিত গুণাবলী প্রচুর আছে.
একটি একটি এটি একটি href অথবা একটি বর্গ সঙ্গে যুক্ত থাকতে পারে.
কিন্তু এই লিঙ্কগুলির মধ্যে প্রতিটি জন্য কি আমরা এখন সত্যিই প্রয়োজন হয়
একটি স্টক চিহ্নের এর সাথে জড়িত আছে.
কোন বিল্ট ইন এইচটিএমএল অ্যাট্রিবিউট জন্য স্টক চিহ্নের, আছে
কিন্তু সৌভাগ্যক্রমে, HTML5 আমাদের নিজস্ব বৈশিষ্ট যাও যাই হোক না কেন আমরা চাই হতে তৈরি করা যাবে.
তথ্য-চিহ্ন দ্বারা বলছে, আমি একটি নতুন বৈশিষ্ট্য চালু করেছি
যার নাম শুধু আমি গঠিত, এবং এই ঠিক আছে কারণ আমি এই তথ্য দিয়ে এটা prefaced.
আমরা আছে প্রতীক ভিতরে স্টক থেকে যাও এখন সঞ্চয় চলুন.
কি যে এর মানে হল যে যদিও আমরা নামটি মান প্রদর্শন করছেন
আমাদের স্বয়ংসম্পূর্ণ ভিতর, আমরা এখনও মনে করছি প্রতীক
প্রতিটি সংস্থার সাথে যুক্ত হয়.
উপায় যে আমরা করছি এই উপাদান নিজে এর ভিতরে হয়.
সুতরাং তার মানে আমরা এক আরো পরিবর্তন করা প্রয়োজন.
যখন আমরা এখন এটি ক্লিক করুন, আমরা আসলে প্রতীক অ্যাট্রিবিউট সদ্ব্যবহার করা প্রয়োজন
বরং ঠিক তার মান.
যদি আমরা ফিরে আপ, আমরা পরামর্শ একটি ইভেন্ট হ্যান্ডলার জোড়া.
যখনই এখন এই প্রস্তাবগুলি ক্লিক না, আমি কোনো কিছু করতে চান.
আমি কি করে যেতে চাই, যে ইনপুট বক্স মান পরিবর্তন.
এখন আমি এই একই Val ফাংশন সেট করতে চান.
>> সুতরাং কোনো আর্গুমেন্ট ছাড়া এই Val ফাংশন আপনি ফিরে কি টেক্সট বক্সের মধ্যে ইতিমধ্যেই,
কিন্তু যদি আপনি এটি একটি স্ট্রিং দেবে, তা যে স্ট্রিং নিয়ে কোনো টেক্সটবক্সের মধ্যে এটা করা যাচ্ছে.
আমি একই ভাবে করছি তার টেক্সট বক্স নির্বাচন করুন.
এটা এর নাম হয় ফর্ম-উদ্ধৃতি চিহ্ন ভিতরে.
এখন আমি এটি বৈশিষ্ট্য তথ্য-প্রতীক মূল্য প্রেরণ করছি.
এখানে একটি বিষয় নতুন, এই $ (এই).
কি এই চিহ্নিত হয় যে ক্লিক উপাদান ছিল.
আমরা এখানে যে আমরা একটি ক্লিক ইভেন্ট যুক্ত না তা দেখতে পারেন
যাও প্রস্তাব একটি বর্গ সঙ্গে পৃথকভাবে প্রতিটি উপাদান.
বরং, এই আমরা একটু ভিন্নভাবে সমীপবর্তী করছি.
এর পরিবর্তে আমরা বলছে যখনই এই পরামর্শ div কিছু ভিতর,
যা মনে রাখবেন শুধু যে তালিকা জন্য আধার,
যদি এই div ভিতরে কিছু ক্লিক এবং এটি প্রস্তাব একটি শ্রেণী রয়েছে,
আমি এই ঘটনা ফায়ার করতে চান.
মূলত এর মানে কি আমরা করতে পারি মনে হয় আমরা এই একই হ্যান্ডলার পুনরায় ব্যবহার করতে পারেন
জন্য তালিকার যে জিনিস সব.
তাই আমরা এক প্রথম উপাদান জন্য হ্যান্ডলার আছে না আছে
এবং একটি ভিন্ন দ্বিতীয় উপাদান জন্য হ্যান্ডলার.
আমরা বদলে বলে, "আমি একই হ্যান্ডলার আমার তালিকা সবকিছুই প্রয়োগ করতে চান." করতে পারেন
কিন্তু আমরা একরকম যা উপাদান ছিল ক্লিক জানা প্রয়োজন.
এই "এই" কীওয়ার্ড উপস্থাপন ঠিক.
এই বস্তুর যে ব্যবহারকারী দ্বারা ঠিক ছিল ক্লিক.
যদি আমি 3rd লিঙ্কে ক্লিক করেন, এই যে 3 য় লিঙ্কের উপাদান প্রতিনিধিত্ব করে,
যার অর্থ হল যে আমি তার বৈশিষ্ট্য, তথ্য-প্রতীক পেতে পারেন,
যা আমরা জানি যাও চিহ্ন যে কোম্পানী আমি ক্লিক এর সাথে যুক্ত আছে.
যদি আমরা আমাদের অর্থ পাতা ঝাঁপ ফিরে,
আমরা এখন যে একবার আমি শুরু msft ভালো কিছু টাইপ করে দেখতে পারেন,
আর আমরা করছি ঠিক স্টক প্রতীকে পেয়ে,
আমরা এখন করছি প্রকৃত কোম্পানীগুলো দেখা পেয়ে.
কিন্তু যখন আমি এই কোম্পানীর এক ক্লিক করুন,
আমরা কোম্পানীর নাম দিয়ে দেখতে পারেন যে আসলে আমরা টেক্সট বক্সে পূর্ণ করছেন না
কিন্তু যাই হোক না কেন সেই তথ্য গুণাবলী ভিতরে সঞ্চিত ছিল.
এবং তাই যদি এটি আসলে আমি ডান ক্লিক করে এই উপাদান এক পরিদর্শন করা
এবং এলিমেন্ট পরিদর্শন ক্লিক করে, আসলে আমরা দেখতে পারেন কি ভালো দেখায়.
>> মনে রাখবেন, এই যে আমরা কিছু একটা যে তৈরি ভিতরে লুপ জন্য
যখন আমরা HTML-এর স্ট্রিং নির্মাণের আপ হয়েছিল.
আমরা এখানে যে এই তথ্য-চিহ্ন MSFT, যা মহান মূল্য আছে দেখতে পারেন.
আমরা আশা ছিল.
এটা চিহ্ন এবং যে কিভাবে আমরা মান ব্যবহার করা প্রয়োজন যে আমরা পেয়েছিলাম
ভিতর এই টেক্সট বক্সে.
এটা উদ্ধৃতি ফর্ম জন্য যথেষ্ট কারণ যে ধরনের বিরক্তিকর.
চলুন আমাদের পোর্টফোলিও পাতা যাও কিছু দ্রুত বৃদ্ধি করতে.
আপনি যদি একটি যখন জন্য CS50 অর্থ ব্যবহার করেছি এবং আপনি শুরু ক্রয় এবং স্টক অনেক বিক্রয়,
ঘটনাক্রমে এই টেবিলের প্রশংসনীয় বড় পাওয়া যাচ্ছে,
এবং আপনাকে একটি স্টক টিকার, অবশ্যই চাই চলুন.
একবার টেবিল সত্যিই সত্যিই, বড়, এটি ব্যবহারকারীর জন্য সহায়ক এটা উপর অনুসন্ধানের চেষ্টা করে দেখতে পারেন.
ভিতর সন্ধান বক্সে যদি আমি শুরু ডিজনি ভালো কিছু টাইপ
এবং আমার Mickey মাউস স্টক খুঁজছেন, আমরা যে এখন টেবিল ফিল্টার তা দেখতে পারেন
ভিত্তি কি আমি ঠিক ইন টাইপ
এই কার্যকারিতা দেখায় সুপার জটিল, কিন্তু এটা আসলে সত্যিই, সহজ
সঙ্গে jQuery এবং জাভাস্ক্রিপ্ট.
এই ফাইলটি একটি portfolio.php জাভাস্ক্রিপ্ট ফাইল নামক portfolio.js অন্তর্ভুক্ত.
চলুন যে কটাক্ষপাত করা.
সুতরাং html, js, পোর্টফোলিও.
এখানে যেখানে আমরা টেবিলের উপর যে অনুসন্ধান করছেন.
প্রথম জিনিস আমি যা করতে হবে যে টেক্সট বক্সে একটি ইভেন্ট হ্যান্ডলার জোড়া হয়
কারণ আমরা জানি যে আমরা আমাদের ফিল্টারিং ফাংশন ফায়ার করতে চান
প্রতি ব্যবহারকারীর কিছু সময় presses কারণ আমরা খোঁজো বোতাম জন্য সময় না থাকে.
প্রথম জিনিস আমরা করতে প্রয়োজন হয় জিনিসটা কি ব্যবহারকারীর জন্য অনুসন্ধান করা হয়,
যেমন আমরা আগে কি.
এই অভিব্যক্তি বর্তমান উপাদান ব্যবহারকারীর সাথে আলাপচারিতার হয় বোঝায়.
>> কারণ ব্যবহারকারী অনুসন্ধান বক্স সাথে আলাপচারিতার হয়,
$ এই সার্চ বক্স প্রতিনিধিত্ব করে,
তাই this.val দেয় আমাদের অনুসন্ধান বাক্স ব্যবহারকারী বর্তমানে টাইপ ভিতর কি.
সুতরাং, এখন কি আমরা যেতে চাই আমরা সারি সব পুনরুক্তি ওভার করতে চান না
ভিতর আমাদের টেবিল.
আমাদের টেবিলের সারির সব নির্বাচন করুন, আমি দিয়েছি টেবিল রেখচিত্রের একটি আইডি টেবিল,
এবং প্রতিটি সারির একটি TR-উপাদান দ্বারা প্রতিনিধিত্ব করা হয়,
তাই এই নির্বাচক সম্পর্কে একটি বড় অ্যারে ফিরে যাচ্ছে
সব আমার টেবিলের সারি.
এখন আমি যে অ্যারের উপর পুনরুক্তি করতে চান.
আমি লুপ জন্য, কিন্তু আপনি একটি পারা jQuery আসলে উপলব্ধ চমৎকার ফাংশন বলা হয় আমাদের "প্রতিটি."
প্রতিটি কি আছে, প্রতিটি এক যুক্তি লাগে,
এবং যে যুক্তি হল একটি ফাংশন.
কি এটি করতে যাচ্ছে এটা প্রতিটি উপাদান এই তালিকার ভিতরে যাও যে ফাংশন প্রয়োগ করে যাচ্ছে.
এই ফাংশন এক যুক্তি যা ই লাগে,
এবং যখন এই ফাংশন মৃত্যুদন্ড কার্যকর করা হয়, এই ই প্রথম সারি দিয়ে প্রতিস্থাপন করা হবে,
তারপর দ্বিতীয় সারি, এবং তারপর তৃতীয় সারির.
এই পদ্ধতি দ্বারা, এই লুপ জন্য একটি চলমান হিসাবে একই জিনিস
এবং তারপর বর্তমান উপাদান আপনার লুপ জন্য সূচক ভিতরে উপর ভিত্তি করে figuring.
এ প্রতিটি পুনরাবৃত্তির, টেবিলের জন্য এই উপাদানের প্রতি,
সারির ভিতরে কক্ষের পাঠ্য - আমি উপাদান লেখা যদি চেক করতে চান -
সাথে মেলে কি আমি জন্য অনুসন্ধান করছি.
এই বড় কমান্ড দীর্ঘ স্ট্রিংটি কিভাবে আমি তা করতে পারে.
প্রথম আবার,, যাও এখন এই প্রসঙ্গে - কারণ এটা একটা নতুন ফাংশন ভিতরে -
এই এখন টেবিলের বর্তমান সারি.
আমি টেবিলের বর্তমান সারি নিতে চান,
এবং আমি তার বাচ্চাদের সব পেতে চাই.
মনে রাখবেন, DOM একটি হায়ারারকিকাল গাছ,
যার মানে উপাদান শিশুদের একটি নম্বর আছে.
>> এই. শিশুদের ফাংশন সম্পর্কে যাও সব উপাদানের একটি শ্রেণীবিন্যাস ফিরে ফিরে যাচ্ছে
যে এই ক্ষেত্রে, টেবিলের একটি সারিতে শিশুদের,.
এটি সহজভাবে সারি ভেতরের ঘর.
আমি শুধু প্রথম কোষ ও অনুসন্ধান করতে চান.
এই. প্রথম ফাংশন সম্পর্কে বলেছেন যে অ্যারের মধ্যে প্রথম উপাদান দিতে.
তারপর টেক্সট ফাংশন সম্পর্কে বলছেন ঠিক কি যে ঘরের ভিতর এর পেতে
যেহেতু আমি যে টেক্সট ও অনুসন্ধান করতে চান.
অবশেষে, আমি কি এটা ছোট হাতের অক্ষর রূপান্তর,
তাই আমরা পাঠ্য ক্ষেত্রে অসংবেদী কোয়েরি করতে পারেন.
পরিশেষে, আমরা যদি একটি টেবিল ভিতরে যে পংক্তি স্ট্রিং আমরা অনুসন্ধান করছেন উপস্থিত দেখতে চাই.
জাভাস্ক্রিপ্ট indexOf মধ্যে ফাংশন আছে শুধু যে.
এটা আমাদের বলে কিনা বা না এই পংক্তি স্ট্রিং অন্য রয়েছে.
যদি এটি সত্য যে কোষ রয়েছে কি আমি জন্য অনুসন্ধান করছি,
তারপর আমি নিশ্চিত যে এটা দেখানো এর করতে চাই.
শো পদ্ধতি, বলে "উপাদান দেখান." হবে
যদি এই ঘটনা না, তাহলে তার মানে যাই হোক না কেন আমি অন্তর্গত নয় জন্য অনুসন্ধান করছি
মধ্যে যে সারি, এবং আমি লুকাতে চান ব্যবহারকারী থেকে হয়.
যে যে চমৎকার ফিল্টারিং প্রভাব অর্জন যেখানে আর আমরা সম্পূর্ণ তালিকা দেখুন.
যদি আপনি কিভাবে এই টিকার যাও হিসাবে ভাল করতে আগ্রহী হন,
আমরা উৎস অনলাইন পোস্ট করব. কিন্তু এটা আসলে খুব সহজ.
JQuery এইসব অ্যানিমেশন সাধিত এবং CSS এর জন্য বৈশিষ্ট্যাবলী সন্ত্রস্ত পদ্ধতি আছে.
অতএব, যে আমার জন্য এটি.
>> মিথ্যা তাহলে কি এগিয়ে? হিসাবে আপনি কয়েক দিনের মধ্যে দেখতে পাবেন যে, চূড়ান্ত প্রকল্প প্রস্তাব কারণে.
চূড়ান্ত প্রকল্প প্রস্তাব কয়েক প্রশ্ন জিজ্ঞাসা করবে,
কিন্তু তাদের মধ্যে তিন মাইলস্টোন হবে -
এক একটি "ভালো" মাইলফলক, এক একটি মাইলফলক ভালো, এবং এক একটি শ্রেষ্ঠ.
ধারণা করা হচ্ছে সত্যিই আপনাকে বলছি আপনার সাহায্য প্রত্যাশা সেট
তাই ন্যূনতমরূপে যে আপনি আপনার চূড়ান্ত প্রকল্পের আউটপুট খুশি হবে
এবং এটি "ভাল" যতক্ষণ পর্যন্ত আপনি উদ্বিগ্ন হতে হবে.
কিন্তু তারপর আপনাকে কিছু যাও যাও অল্পমাত্র বিট পৌঁছানোর পাবার আগ্রহ ভাল
অথবা কিছু ভাল, আমরা যে দিকে হিসাবে আপনি ভাল ধাক্কা মধ্যে বাছাই করব.
CS50 হ্যাক একটি thon এদিকে, কয়েক সপ্তাহের মধ্যে হয়.
সাধারণত, আমরা একটি সুরতি ভিত্তিতে ভিত্তিতে আগ্রহের কারণ এই না,
কিন্তু মতভেদ আমরা শাটল বাস মধ্যে আমাদের কয়েক শত হার্ভার্ড স্কয়ার থেকে নেব
নিচে Kendall স্কয়ার যেখানে মাইক্রোসফট হয়েছে একটি সুন্দর সুবিধা যথাযোগ্যভাবে নামক "Nerd" -
নিউ ইংল্যান্ড এবং ডেভেলপমেন্ট রিসার্চ সেন্টার.
আমরা সেখানে 8 অপরাহ্ন কাছাকাছি আমরা কিছু খাবার আছে করব পাবেন.
1 সকাল প্রায় আমরা আরো কিছু খাবার আছে করব.
প্রায় 5 am যদি আপনি এখনও জাগ্রত আমরা বা IHOP নেন, তাহলে আপনি ক্যাম্পাসে ফিরে উপর আগাইয়া করব.
উদ্দেশ্য সেখানে চূড়ান্ত প্রকল্পের মধ্যে আকর্ষণীয় হয়
পাশাপাশি এর সহপাঠীদের এবং কর্মীরা.
তারপর কয়েক দিন পরে হয় CS50 পরিষ্কার,
যা সত্যিই একটি সুযোগ হতে বোঝানো জন্য আপনাকে বলছি আপনার কাজ তুলে যাও
সেমিস্টারে জন্য এবং শিক্ষাদীক্ষা
যখন একে অপরের সাথে কাঁধ মার্জন এবং কি সবাই কি একটা ধারনা পেয়ে.
সঙ্গে বলেন যে, টমি এবং জোসেফ অনেক ধন্যবাদ,
এবং আমরা সোমবার আপনি দেখতে পাবেন.
[সাধুবাদ]