[இசை] 

டேவிட் ஜே MALAN: வணக்கம். மூலம் ஒரு நடைக்கு எடுத்து விடுங்கள் பிரச்சனை அமை 8 மேஷ, இது நீங்கள் சவால் போகிறது Google Maps ஐ உறுப்புகள் மீது வரைய Google செய்திகள் மற்றும் மேஷ் கூறுகளை ஒன்றாக ஒரு வலை ஆப்லெட் அவற்றை என்று ஒரு பயனர் தேட உள்ளூர் செய்தி ஒரு வரைபடத்தை குறிப்பிட்ட நகரங்களுக்கு இடம், நகரங்களில், மற்றும் அஞ்சல் குறியீடு. இதை செய்ய, நாம் என்ன செய்ய போகிறோம் சில HTML ஒருங்கிணைக்க, CSS, PHP, SQL, ஜாவா, மற்றும் ஒரு நுட்பம் பொதுவாக பொருட்டு அஜாக்ஸ் என அழைக்கப்படும் இந்த அதிவேக உருவாக்க பயனர் அனுபவம். 

முதல் கூகுள் மேப்ஸ் தன்னை பார்ப்போம். இந்த, நிச்சயமாக, ஒருவேளை ஆகிறது ஒரு பழக்கமான முகப்பை. ஆனால் அது மாறிவிடும் கூகுள் மேப்ஸ் ஒரு API-- பயன்பாடு வழங்குகிறது வழங்குவதன் முகப்பு நிரலாக்க வழியாக நீங்கள் Google Maps கூறுகளை எடுக்க முடியும் மற்றும் அவற்றை ஒருங்கிணைக்கும் உங்கள் சொந்த பயன்பாடுகளை. உண்மையில், முழுவதும் இந்த செயல்பாடு, நீங்கள் போகிறோம் URL கள் ஒரு ஜோடி கண்டுபிடிக்க என்று குறிப்பாக பயனுள்ளதாக குறிப்பிடப்பட்டுள்ளன சிக்கல் அமை 8 விவரக்குறிப்பு, குறிப்பாக இந்த தொடங்குதல் வழிகாட்டி அல்லது டெவலப்பர் கையேடு Google Maps API பதிப்பு 3 அதே கூகுள் மேப்ஸ் ஜாவாஸ்கிரிப்ட் API போன்ற ஒரு இது 3 குறிப்பு, வாசிக்க பிட் இன்னும் விளங்காத ஆனால் உண்மையில் குறைந்த அளவில் அனைத்து உள்ளது என்ன செயல்பாடுகளை அல்லது முறைகள், பற்றி விவரங்கள் மற்றும் பொருட்களை மற்றும் பண்புகள் மற்றும் நிகழ்வுகள் உண்மையில் ஏபிஐ வர, ஆவி மிகவும் ஒத்த [செவிக்கு புலப்படாமல்] பக்கங்களுக்கு. 

இப்போது நாம் பாருங்கள் என்றால் Google செய்திகள் மணிக்கு, உங்களுக்கு ஒருவேளை இங்கே ஒரு பழக்கமான இடைமுகம் பார்க்க. ஆனால் அதை நீங்கள் தேட முடியும் மாறிவிடும் குறிப்பிட்ட ஒரு உதாரணமே க்கான Google செய்திகள் பூகோள என்று ஒரு HTTP அளவுரு வழியாக. உண்மையில், நான் பெரிதாக்க என்றால் இங்கே, நீங்கள் பார்க்க வேண்டும் என்று நான் இருக்கிறேன் news.google.com/news/section?geo=02138. மேலும், உண்மையில், நான் பெரிதாக்க என்றால் அவுட், நான் இருக்கிறேன் என்று பார்க்க வேண்டும் ஒரு மொத்தமாக ஒரு பக்கம் பார்த்து கேம்பிரிஜ், மாசசூசெட்ஸ் பற்றி காட்சிகள். 

இதற்கிடையில், நான் உண்மையில் மாற்ற என்றால் URL ஐ, இந்த மாதிரி ஒரு ZIP குறியீடு இருக்க முடியாது ஆனால் ஒரு சிறிய மெஸ்ஸியர் ஏதாவது கேம்பிரிட்ஜ் + மாசசூசெட்ஸ் போல், பிளஸ் வழி எங்கே நீங்கள் ஒரு உருமாற்றுகிற்கிறீர்கள் ஒரு URL ஐ வெளி தன்மை மற்றும் வெற்றி உள்ளிடவும், நீங்கள் உண்மையில், நான் பார்க்க வேண்டும் கிட்டத்தட்ட அதே செய்தி மட்டும் பார்க்க. ஒருவேளை அது கொஞ்சம் வித்தியாசமாக இருக்கிறது கேம்பிரிட்ஜ் உண்மையில் ஏனெனில் பல குறியீடு உள்ளது. இப்போது நான் எப்படி என்று எனக்கு தெரியும், உண்மையில், எப்படி எப்படியோ நான் முடிந்த பெரிய மற்றும் சிறிய நகரங்கள் கட்டி வழக்கு நான் குறியீடு வேண்டும் பயனர் அனுமதிக்க வேண்டும் அல்லது வரை எப்படி? சரி, அது அந்த மாறிவிடும் ஒரு வலைத்தளம் அங்கு என்று geonames.org இது ஒரு முயற்சி வேண்டும் அனைத்து இலவசமாகக் கிடைக்கும் தகவல் புவியியல் தகவல் வகையான, அமெரிக்காவில் மட்டும், ஆனால் மேலும் மற்ற நாடுகளில் அதே. உண்மையில், நான், இங்கே இந்த URL க்கு சென்றால், இது அமைக்க பிரச்சனை குறிப்பிடப்பட்டுள்ளது விவரக்குறிப்பு, நீங்கள் மூன்று பார்க்க வேண்டும் கோப்புகளை ஒரு மொத்தமாக பட்டியல் இது எந்த நீங்கள் பதிவிறக்கம். உண்மையில், இந்த பிரச்சனை அமைக்க நீங்கள் us.zip பதிவிறக்க போகிறோம். இப்போது இந்த கோப்பு உள்ள, ஒரு முழு ஆகிறது உரை வடிவம் தரவு மொத்தமாக. கோப்புகளை ஒரு மிகவும் ஒத்த CSV-- கமா, மதிப்புகள் பிரிக்கப்பட்ட கோப்பு ஆனால் அது உண்மையில் பயன்படுத்துகிறது தாவல்கள் துறைகளில் விளங்கப்படுத்த. இப்போது, இதற்கிடையில், நீங்கள் பார்க்கிறீர்கள் என்றால் இங்கே நான் உயர்த்தி என்ன, இந்த கோப்பு துறைகளில் போகிறோம் நாட்டின் குறியீடுகள் போன்ற விஷயங்கள் இருக்க வேண்டும் என்று, அஞ்சல் குறியீடு, இடங்களின் பெயர்கள் பின்னர், சில வடிவத்தில் அல்லது மற்ற, மாகாணங்கள் மற்றும் நாடுகள், சமூகங்கள், மற்றும் மேலும். உண்மையில், நான் ஏற்கனவே நான் முன்கூட்டியே இந்த கோப்பு பதிவிறக்கம். எனக்கு முன்னால் சென்று இங்கே அதை திறக்க உண்மையில், நீங்கள், us.text-- மற்றும் நான் 16.792 வரிசையாக கீழே இருந்தால் பார்க்க நீங்கள், கேம்பிரிட்ஜ் ஒரு சில பதிவுகளை பார்க்க வேண்டும் மசாசூசெட்ஸ் மற்றும் அதன் பல்வேறு குறியீடு. என்ன நீங்கள் அங்கு பார்க்க, மாவட்ட உள்ளது நான் உண்மையில் இல்லை என்று சில எண்கள் மேலும் அனைத்து புரிந்து, ஆனால் வலது வழி, சில ஜி.பி.எஸ் ஆய அட்சரேகை மற்றும் தீர்க்கரேகை. இந்த பெரிய ஒன்று, ஏனெனில் Google Maps API அம்சங்கள் கண்டறியும் திறன் ஆகும் நீங்கள் புவியியல் எங்கே ஜி.பி.எஸ் அடிப்படையில். 

இப்போது எப்படி கண்டுபிடிக்க தொடங்க அனுமதிக்க ஒன்றாக இந்த விஷயங்களை சம்மந்தப்படுத்துவதற்கு தொடங்கும். நாம் ஒரு முழு கொடுக்கப்பட்ட விநியோக குறியீடு கொத்து, அதே MySQL தரவுத்தள என. நான் இழுக்க என்றால் உண்மையில், ஒரு கால் தேக்கரண்டி உப்பு கொண்ட ஏற்கனவே இறக்குமதி, நீங்கள் விரைவில் சாப்பிடுவேன், pset8.SQL, நீங்கள் ஒரு MySQL அட்டவணை பார்க்க வேண்டும் என்று இந்த மாதிரி, ஒரு ஐடி துறையில், நாட்டின் குறியீடு, அஞ்சல் குறியீடு, இடத்தின் பெயர் மற்றும் மேலும். அந்த எல்லா வகையான பத்திகள் நான் வெறுமனே பெறப்பட்ட readme.text படித்து குறிப்பிட்ட என்று இங்கே தாக்கல் ஒரு துறையில் ஒரு முழு என்பதை, அல்லது Varchar அல்லது போன்ற. 

எனவே நாம் அந்த அட்டவணை உருவாக்கப்பட்ட நீங்கள் நீங்கள் SQL கட்டளைகளை கொடுக்கப்பட்ட என்று உருவாக்க இயக்க உங்கள் சொந்த தகவல் அட்டவணை, ஆனால் இன்னும் உண்மையில் அது எந்த தரவு இல்லை. மாறாக, நீங்கள் செய்ய வேண்டும் போகிறேன் us.zip பதிவிறக்க அல்லது எந்த நாட்டின் ZIP அங்கு URL இருந்து ஒரு கோப்பு. பின்னர் நீங்கள் எழுத வேண்டும் போகிறோம் என்று PHP ஒரு கட்டளை வரி ஸ்கிரிப்ட் அந்த உரை திறந்து போகிறது , தாக்கல் அதன் கோடுகள் மீது மீண்டும் கூறு, பின்னர் ஒவ்வொரு அந்த வரிகளை ஒரு நுழைவு செய்கின்றன அந்த அட்டவணையில் இடங்களில் உங்கள் MySQL தரவுத்தள. இந்த செயல்முறை இறுதியில், நீங்கள் எனவே இறுதியில் அந்த ஸ்கிரிப்டை இயக்க ஒரே ஒருமுறை மட்டும் கோட்பாடு. உண்மையில் நீங்கள் ஒருவேளை தருகிறேன் அதை முறை ஒரு கொத்து இயக்க போது பல்வேறு பிழைகள் சரி செய்ய முயற்சி. 

இறுதியில், நீங்கள் ஒரு வேண்டும் போகிறோம் ஆயிரக்கணக்கான உண்மையில் பெரிய தகவல் புவியியல் வரிசைகள் மற்றும் ஆயிரக்கணக்கான. பின்னர் நீங்கள் அந்த இறக்குமதி செய்ய போகிறோம் ஸ்கிரிப்ட் அதை ஒதுக்கி வேலை முறை உங்கள் தரவுத்தள நன்றாக இருக்கிறது சரியான, பின்னர் நீங்கள் உண்மையில் செல்ல போகிறோம் மேஷ தன்னை செயல்படுத்தி. மேஷ பார்க்க போகிறது இது போன்ற ஒரு சிறிய ஒன்று. Mashup.cs50.net, நாம் ஒரு ஊழியர்கள் தீர்வு வேண்டும் இந்த மாதிரி ஒரு சிறிய ஒன்று தெரிகிறது. உண்மையில், இந்த செய்தி மீது கிளிக் செய்தால், கேம்பிரிஜ், மாசசூசெட்ஸ் படவுரு, நீங்கள் ஒரு நூற்பு பார்க்க வேண்டும் சுருக்கமாக பின்னர் ஐகான் ஒரு கட்டளையிட்டார் பட்டியல், ஒரு கட்டுரைகள் பகிர்வுக் கேம்பிரிஜ், மாசசூசெட்ஸ் தொடர்பான. நான் சார்லஸ்டவுன் மீது கிளிக் செய்தால், மாசசூசெட்ஸ், நான் அந்த நகரம் அதே பார்க்க வேண்டும். நான் கிளிக் செய்தால் வாட்டர்டவுன், மாசசூசெட்ஸ், அங்கு ஏதாவது இருக்க வேண்டும் வட்டெற்தோவின் ல் இருந்து செய்தி எனவே நீங்கள் ஏதாவது பார்க்க வேண்டும் மெதுவாக செய்தி நாள் போன்ற. 

இப்போது இதற்கிடையில், மேல் இடது உள்ளன சில பழக்கமான கூகுள் மேப்ஸ் கட்டுப்பாடுகள் பான் நீங்கள் அவுட் பெரிதாக்கவும் அனுமதிக்க மேலே, கீழே, இடது மற்றும் வலது, ஆனால் நாம் அங்கு வைத்து ஒரு தேடல் பெட்டி. அதனால் நான் வெளிப்படையாக, தேட இருந்தால், எனக்கு மட்டுமே தெரியும் மற்ற ZIP குறியீடு, 90210, நாம் உண்மையில் பார்க்க வேண்டும் பெவர்லி ஹில்ஸ், கலிபோர்னியா. சொடுக்கும் போது, அது என்னை செல்கிறது கலிபோர்னியா மற்றும் ஒரு மொத்தமாக பெவர்லி ஹில்ஸ் பற்றி news. இப்போது அங்கே என்ன நடந்தது என்று கூட, கவனிக்க. கூட 02138 அல்லது நான் இந்த முறையும் தேடல் கேம்பிரிட்ஜ் கமா மாசசூசெட்ஸ் அல்லது சில மாறுபாடு, அதின் நீங்கள் ஒரு கிடைக்கும் சிறிய தானாக நிரப்புதல் கீழிறங்கும். இப்போது இந்த ஒரு நீட்சி jQuery என்று ஒரு நூலகம், மற்றும் அந்த நீட்சி typeahead என்று. நாம் வெறுமனே மூலம் வாசிக்க ஆவணங்கள், .js ஒருங்கிணைந்த தாக்கல் விநியோக குறியீடு அதனால் நீங்கள் இறுதியில் குறியீடு எழுத முடியும் என்று ஆட்டோ மெனு நிரப்பகிறது தேர்வுகளை அல்லது கார் பரிந்துரைகள். 

இப்போது விநியோகம் குறியீடு என்று, எனினும், நீங்கள் சபையோர்களகிய இல்லை பெற்றார். நீங்கள் கூகிள் மேப் பதிக்கப்பட்ட கிடைக்கும், மற்றும் நீங்கள் மேல், கட்டுப்பாடுகள் கிடைக்கும் நீங்கள் தேடல் பெட்டியில் கிடைக்கும். ஆனால் நான் போன்ற ஏதாவது தட்டச்சு என்றால் 02138, எந்த இடங்களில் இன்னும் காணப்படுகின்றன. அதனால் இருக்க போகிறது இங்கே எங்கள் இலக்குகளில் ஒன்றாக. மேலும், நீங்கள் ஒரு அடி எடுத்து வைத்தால் மீண்டும், மற்றும் வரைபடம் தன்னை பார்க்க, அவற்றுக்கு எந்த செய்தியும் இல்லையே. நான் கிளிக் கூட மற்றும் இழுவை, உண்மையில் எந்த குறிப்பான்கள் அந்த காரணம் என்று செய்தி தோன்றும் சவாலை அத்துடன் நீங்கள் தான் இருக்கிறது. 

பின்னர் ஒரு பார்க்கலாம் விநியோகம் குறியீடு. நீங்கள் பதிவிறக்கம் முறை pset8.zip அது அன்சிப் உங்கள் vhost அடைவு ஒரு CS50 அப்ளையன்ஸ், நீங்கள் இந்த பார்க்க வேண்டும் இங்கு உள்ளே அடைவுகள். பொதுவாக குறிக்கும் Bin-- இயங்கக்கூடிய நிரல்களை பைனரி pset7 உள்ள உள்ளடக்கியுள்ளது, சில PHP மற்ற கோப்புகளை அடங்கும் என்று கோப்புகளை, இது பின்னர் பொது, வேண்டும் என்று கோப்புகளை பொதுவில் அணுக இருக்க வேண்டும் ஒரு உலாவி ஒரு பயனர். உள்ள ஒரு பார்க்கலாம் பின் அடைவு, மற்றும் நாம் தருகிறேன் ஒரு கோப்பு உள்ளது என்று பார்க்க ஏற்கனவே இறக்குமதி இருக்கிறது என்று அழைக்கப்படும். நாம் gedit இந்த திறக்கும் போது, நாம் பார்க்க வேண்டும் துரதிருஷ்டவசமாக, அங்கு இல்லை அங்கு. என்றாலும், இல்லை என்று அனைத்து, மேலே ஒரு வாகனம் ஆகும் இது குறிப்பிடுகிறது இந்த வழக்கில் மொழிபெயர்ப்பாளரை PHP-- உண்மையில் பயன்படுத்த வேண்டும் இந்த கோப்பு இயக்க. ஆனால் பின்னர் அதை சொல்வது அங்கு நீங்கள் இருக்கும் இடத்தில் வேண்டியவை ஆகிறது சில குறியீடு எழுத வேண்டும் போகிறது என்று ஒருவேளை கட்டமைப்பு தேவைப்படுகிறது அடைவு அடங்கும் என்று கோப்பு நாம் PHP கோப்புகளை முன் செய்தது போல. பின்னர் நீங்கள் போகிறோம் எப்படியோ வரை திறக்க வேண்டும் us.text இது நீங்கள் மறைமுகமாக ஏற்கனவே அன்சிப். பிறகு நீ செய்ய போகிறோம் என்று கோப்பு கோடுகள் மீது மீண்டும் கூறு, ஒருவேளை செயல்பாடுகளில் சில பயன்படுத்தி விவரக்குறிப்பு தெரிவித்தனர். பின்னர் அந்த ஒவ்வொரு நுழைக்க MySQL தரவுத்தள ஒரு கோடுகள் கேள்வி செயல்பாடு பயன்படுத்தி இது நாம் மீண்டும் with-- உங்களுக்கு வழங்கப்படும் அல்லது குறைந்த பட்சம் ஒரு மாறுபாடு அதின் functions.php உள்ள, இது நாம் ஒரு கணம் பார்க்க வேண்டும். 

இப்போது இறக்குமதி மூடிவிட்டு மீண்டும் செல்லலாம் எங்கள் விதிமுறைகள் மற்றும் இந்த நேரத்தில் செல்ல அடங்கும். நான் அங்கு கள் செய்தால், நீங்கள் காண்பீர்கள் மிகவும் சிக்கல் அமை 7 போன்ற மூன்று கோப்புகளை. மற்றும் விரைவான பாருங்கள் நாம், உதாரணமாக, config.php உள்ள. அங்கு, குறைந்த கோடுகள் முன் விட, அது இந்த கோப்பு அடங்கும் தெரிகிறது constants.php மற்றும் functions.php. நாம் சற்று மாறுபட்ட பயன்படுத்தி தொழில் நுட்பம், உண்மையில், இந்த முறை இந்த கோப்புகளை தொடர்புடைய என்று குறிப்பிட தற்போதைய அடைவு, __ DIR__ பிரதிபலிக்கிறது என்ன அடைவு இந்த கோப்பு, config.php, தன்னை உள்ளது. எனவே, இந்த ஒரு மேலும் ஆகிறது குறிப்பிடாமல் வெளிப்படையான வழி நீங்கள் தேவைப்படும் வேண்டும் என்ன மற்ற கோப்புகளை. 

இப்போது நான் இந்த கோப்பு மூட என்றால் அதற்கு பதிலாக constants.php திறந்து, நீங்கள் மிகவும் நினைவூட்டுவதாக ஒரு கோப்பு பார்க்க வேண்டும் செய்ய பிரச்சனை தொகுப்பு 7 இன் அத்துடன், என்றாலும் pset8 என்று வேறு தரவுத்தள. இறுதியாக, functions.php உள்ள, நாம் ஒரு செயல்பாடு பார்க்கலாம் கேள்வி என்று இந்த நேரத்தில். இந்த நாம் கையாள தவிர, கிட்டத்தட்ட அதே ஆகிறது சற்று சுற்றி பிழைகள் இந்த நேரத்தில் வித்தியாசமாக, ஆனால் அது பயன்பாடு உள்ளது பிரச்சனை அதே ஏழு அமைந்தது. 

இப்போது எங்கள் pset8 மீண்டும் செல்லலாம் அடைவு, பொது செல்ல, மற்றும் அங்கு நான் ls செய்தால், நீங்கள் இதை பார்க்க வேண்டும் articles.php index.html,, search.php, அனைத்து கோப்புகளை update.php--. பின்னர் CSS எழுத்துருக்கள், நன்றி, மற்றும் மிகவும் pset7 போன்ற JS அடைவு. 

தான் ஒரு பார்க்கலாம் இது இன்டெக்ஸ்.ஹெச்டிஎம்எல், உண்மையில் இருக்க போகிறது smashup நுழைவு புள்ளி. இப்போது இன்டெக்ஸ்.ஹெச்டிஎம்எல், நீங்கள் ஒரு முழு பார்க்க வேண்டும் தலையில் இணைப்பு கூறுகள் கொத்து, குறிப்பாக, எங்கள் சொந்த பூட்ஸ்டார்ப் ஸ்கிரிப்ட் ஒரு மொத்தமாக தொடர்ந்து CSS வரைபடங்கள், ஏபிஐ போன்ற விஷயங்களை குறிச்சொற்களை தன்னை, லேபிள் ஒரு சிறப்பு மார்க்கர் நாம் குறிப்பிட்ட அந்த பயன்பாடு விவரக்குறிப்பு, உங்களுக்கு கிடைக்கும் jQuery தன்னை, பூட்ஸ்ட்ராப் தன்னை, மற்றும் மற்றொரு நூலகம் என்று கோடிட்டு இது நாம் ஸ்பெக் பற்றி பேச. Jquery.js போன்ற Underscore.js ஜாவாஸ்கிரிப்ட் நூலகம் அந்த செயல்பாடு ஒரு மொத்தமாக உள்ளது என்று உலக ஆசை மக்கள் நிறைய ஜாவா தன்னை இருந்தது. எனவே இந்த அனைத்து இருக்கின்றன உண்மையில் மிகவும் பிரபலமான. நாங்கள், typeahead குறிப்பிட்டுள்ளார் நூலகம் இது என்று என்று தானாக நிரப்புதல் கீழிறங்கும் மற்றும் இறுதியாக எங்கள் சொந்த ஜாவா ஒரு இணைப்பு. 

இதற்கிடையில், ஒருவேளை அதிர்ஷ்டவசமாக, இந்த மேஷ ஒப்பீட்டளவில் சிறிய இயக்கப்படுகிறது கீழே இங்கே கீழே உள்ள HTML. நாம் ஒரு DIV குறிப்பிடப்படவில்லை நான் என்று அறிவிப்பு வர்க்க கொள்கலன் திரவம் நம் உடல். இந்த, ஒன்றுக்கு பூட்ஸ்டார்ப் ஆவணங்கள், தான் இந்த கிராம நிரப்ப போகிறது என்று அர்த்தம் காட்சியும் அல்லது முழுமையாக உலாவி சாளரத்தில். 

இதற்கிடையில், என்று கீழே நாம் ஒரு DIV வேண்டும் என்று திறந்து உடனடியாக மூடப்படும் வரைபடம் கேன்வாஸ் தனிப்பட்ட அடையாள கொண்டு. இது இப்போது கூகிள் இருந்து ஆகிறது வரைபடங்கள் ஆவணங்கள் அதன் API, ஐந்து அதன்படி நான் வெறுமனே வேண்டும் , புகுத்த இது ஒரு வெற்று div வேண்டும் இறுதியில், ஒரு உண்மையான, Google Maps. ஆனால் ஒரு பிட் என்று ஆனால் மேலும். 

இறுதியாக, ஒரு வடிவம் இல்லை உள்ளே இங்கே இது உரை பெட்டியில், மேல் இடது தேடி எங்கள் இடைமுகம். நாம் பயன்படுத்தப்படும் என்று அறிவிப்பு பூட்ஸ்ட்ராப் ஒரு பிட் இங்கே போன்ற விஷயங்களை too-- வடிவம் இன்லைன் மற்றும் வடிவம்-குழு. நாம் முன்னாள் கொடுக்கப்பட்ட படிவத்தை தனிப்பட்ட அடையாள. பின்னர், இறுதியில், நான் உண்மையில் அழகான நன்கு இது ஒரு உள்ளீடு வகை, கே யாருடைய அடையாள உள்ளது. ஒரு மரபு. கேள்வி வேண்டும் என்று கே எதையும் என்று. பின்னர் ஒதுக்கிட, இதற்கிடையில், நகரம், மாநில உள்ளது, மற்றும் அஞ்சல் குறியீடு நீங்கள் நினைவு இது டெமோ முந்தைய நம் மேஷ பார்த்து. இந்த கோப்பு மூடலாம். 

இப்போது PHP கோப்புகளை பாருங்கள் என்று காத்திருங்கள் பின்னர் பார்ப்பதற்கு JavaScript கோப்புகளை. நம் PHP கோப்புகளை, நாம் நான் ஏற்கனவே நீங்கள் செயல்படுத்தப்படும், உதாரணமாக, மேம்படுத்தல்கள். நாங்கள் ஒரு பெரிய செலவு சுருக்கமாக இங்கே நேரம் அளவு கோப்பு என்று எங்கள் ஜாவாஸ்கிரிப்ட் குறியீடு போகிறது அஜாக்ஸ் வழியாக தொடர்பு என்று தான் ஒத்திசைவற்ற நுட்பம் என்று இந்த நாட்களில் ஜாவா அமையப்பெற்றுள்ள அமெரிக்க update.php கேட்க அனுமதிக்க வேண்டும் மேலும் தகவலுக்கு,. 

குறிப்பாக, எப்போது பயனர் வரைபடம் பரப்பியிருக்கிறது அல்லது தாண்டுகிறது என்று ஒரு தேடல் செயல்படுகிறது இன்னொரு இடம் பயனர், எங்கள் ஜாவா குறியீடு, நாங்கள் விரைவில் காண்பீர்கள் என்று, ஆகிறது update.php அழைக்க போகிறேன் மற்றும் 10 அல்லது குறிப்பான்கள் கேட்க காட்சியும் அமைந்துள்ள ஜிபிஎஸ் ஆய மேல் மற்றும் கீழே என்று வரைபடத்தை மூலைகளிலும். பின்னர் நாம் இப்போது அந்த வரைபடத்தில் இயலாமல் முடியும் பயனர் பொருட்டு திரைக்கு சென்றார் 10 அநேகமாக புதிய பார்க்க வெவ்வேறு நகரங்களில் இந்த குறிப்பான்கள். இதற்கிடையில், இந்த கோப்பு இறுதியில் ஆகிறது ஒரு SQL கேள்வி இயக்க போவதில்லை எமது தகவல் எதிரான அட்டவணை என்று இடங்களில் இது அந்த திரும்ப போகிறது 10 அல்லது குறைவான இடங்களில். 

இதற்கிடையில், articles.php, மற்றொரு ஆகிறது நாங்கள் அதன் முழுமையாக எழுதி விட்டேன் தாக்கல். இது செய்ய ஆவி மிகவும் ஒத்த பிரச்சனை அமை 7, தேடல் செயல்பாடு அவர்கள், நீங்கள் யாகூ நிதி தொடர்பு. இந்த கோப்பு தொடர்புகள், Google செய்திகள் நீங்கள், இறுதியில் வாட்டி ஒரு இயந்திரம் படிக்க version-- ஏதாவது செய்தி ஆர்எஸ்எஸ் வடிவம் என்று கேம்ப்ரிட்ஜ் அல்லது பெவர்லி ஹில்ஸ் அல்லது என்ன நகரம் நீங்கள் தேடியது அந்த geoparameter அடிப்படையில். நாம் ஒரு இது ஆர்எஸ்எஸ், இட பிற அழைக்க மார்க் மொழி வகை, மற்றும் நாம் உண்மையில் உங்கள் உலாவியில் அதை திரும்ப உங்கள் ஜாவா குறியீடு, குறிப்பாக, ஒரு வடிவத்தில் என்று JSON, ஜாவாஸ்க்ரிப்ட் ஆப்ஜெக்ட். இப்போது நீங்கள் பார்க்க வேண்டும் specification-- நாங்கள் உங்களுக்கு சுட்டிக்காட்ட நீங்கள் உண்மையில் பார்க்க முடியும் எப்படி எஞ்சினியரிங், வரவிருக்கும் திரும்பி சில இந்த செயல்பாடு இறுதியில் நீங்கள் அதனால் அந்த பாப் மெனுக்களை விரிவுப்படுத்த நீங்கள் கிளிக் செய்யும் போது அந்த வரைபடத்தில் உள்ள ஒரு மார்க்கர் நீங்கள் உண்மையில் ஒரு மொத்தமாக பார்க்க தோட்டாக்கள் ஒவ்வொன்றும் ஒரு கட்டுரையில் இணைப்புகள். 

இப்போது கடைசி ஒரு பாருங்கள் நாம் அதிர்ஷ்டவசமாக, இல்லை இது PHP கோப்பு எவ்வளவு வேண்டும் on-- போகிறது ஒரு அழகான பெரிய வேண்டியவை. இப்போது இந்த கோப்பு அறிவிக்கிறது ஒரு வரிசை இடங்களில் அழைக்கப்படும். பின்னர் இறுதியில் அச்சிட்டு JSON வடிவம் என்று வரிசை என்று தான் அதை அழகாக பிரிண்டிங் விஷயங்களை debug எளிதாக இருக்கும். துரதிருஷ்டவசமாக, உள்ள நடுத்தர இந்த TODO உள்ளது, நீங்கள் தேட இது அழைக்கிறது பொருத்தமான இடங்களில் தகவல் ஒரு பூகோள HTTP அளவுரு. 

மேலும், உண்மையில், இந்த போகிறது உங்கள் challenges-- ஒன்றாக இருக்க இங்கே இந்த செயல்பாடுகளை நடைமுறைப்படுத்த அதனால் இந்த கோப்பை தொடர்பு போது தேடல் ஒரு URL ஐ. PHP? பூகோள = ஒன்று, உங்கள் குறியீடு இறுதியில் ஒரு JSON திரும்ப உள்ள இடங்களில் எல்லாம் வரிசை உங்கள் அந்த உள்ளீடு பொருந்தும் என்று தரவுத்தள அட்டவணை. கேம்பிரிட்ஜ் பயனர் வகையான என்றால் இங்கே உங்கள் கோப்பில் search.php இறுதியில், ஒரு JSON வரிசை திரும்ப வேண்டும் கேம்பிரிட்ஜ் போட்டிகளில் அனைவரும், மாசசூசெட்ஸ் இருக்கும் இது ஆனால் கூட வேறு எங்கும் இருக்க முடியும். 

இறுதியாக, இரண்டு மணிக்கு ஒரு முறை பார்ப்போம் நிலையான ultimately-- அந்த கோப்புகளை உங்கள் CSS கோப்பு மற்றும் உங்கள் ஜாவா கோப்பு. நான் எங்கள் CSS அடைவில் சென்று என்றால், கோப்புகளை ஒரு மொத்தமாக, அங்கு தான் ஆனால் அவர்கள் மிகவும் நூலகங்கள் உள்ளன. நான் பார்க்கலாமா போகிறேன், குறிப்பாக, styles.css மணிக்கு, இது தான் நமது சொந்த உலக CSS உள்ளது இந்த முழு மேஷ stylize போகிறது. நீங்கள் மூலம் படிக்க வேண்டும் நான் அதை விட்டு விடுகிறேன் கருத்துகள் இங்கு, ஆனால், ஒரு இடத்தில் உள்ள, இந்த உறுதி என்று CSS உள்ளது எங்கள் மேஷ, பெட்டியின் வெளியே இயல்பாக, நாம் அதை விரும்பவில்லை சரியாக வழி தெரிகிறது காட்சி பூர்த்தி போர்ட் வரைபடத்தை மற்றும் தேடல் மேல் இடது பெட்டியை. நாங்கள் உரிமை பெற்றுவிட்டேன் என்று, typeahead கீழிறங்கும் stylizing மெனு சிறிது அதே. 

மிக முக்கியமான கோப்பு ஒருவேளை அமைக்க இந்த பிரச்சனை இந்த கடைசி ஒரு, scripts.js ஆகிறது. உங்கள் JS அடைவு உள்ளே இன்னும் கோப்புகளை ஆகிறது. அவர்கள் அனைவரும் நூலகம் கோப்புகள் உள்ளன இந்த ஒரு தவிர, scripts.js. நாங்கள் இந்த திறந்து என்றால், தான் எடுத்து விடுங்கள் எங்கள் செயல்பாடுகளை மூலம் இறுதி சுற்றுலா என்று இந்த கோப்பு அமையப்பெற்றுள்ள நீங்கள் அழைப்பு கவனத்திற்கு வரவிருக்கும் பொய் என்று TODOs வேண்டும். 

இந்த கோப்பு மேலே, மூன்று உலக மாறிகள் உள்ளன. போகிறது இது ஒரு வரைபடத்தை, ஒரு எங்கள் கூகிள் மேப் குறிப்புக்களில். நீங்கள் அதை பற்றி யோசிக்க முடியும் வகையான ஒரு சுட்டிக்காட்டி. இதற்கிடையில், நாம் வேண்டும் மற்றொரு உலக மாறி தோன்றுகிறது என்று அழைக்கப்படுகிறது தகவல், ஒரு அழைப்பு திரும்ப மதிப்பு சேமித்து புதிய google.maps.InfoWindow வேண்டும். இங்கு பொருட்களை ஆதரிக்கிறது ஸ்ட்ரட்ஸின் செய்ய ஆவி மிகவும் ஒத்த. என்ன இந்த வரி நமது தேவைகளுக்காக செய்து ஒரு புதிய தகவல் உருவாக்கி உள்ளது பின்னர் நினைவகம் மற்றும் சாளர ஒரு குறிப்பு சுற்றி வைத்து தகவல், ஒரு மாறி என்று வணங்குகிறான். அந்த இடையே, இதற்கிடையில், தோன்றுகிறது என்ன ஆகிறது ஒரு வெற்று ஜாவா இருக்க வரிசை குறிப்பான்கள் என்று. அந்த பத்திரிகை சின்னங்கள் அனைத்து, அல்லது நீங்கள் முற்றிலும் மற்றொரு ஐகான் தேர்வு செய்யலாம், சேமித்து வைக்க போகிறது இறுதியில் இந்த வரிசையில் நாம் மிகவும் எளிதாக சேர்க்க முடியும் என்று வரைபடம் மற்றும் வரைபடம் அவற்றை நீக்க. 

இப்போது கீழே பார்ப்போம் ஒரு சிறிய பிட் மற்றும் விஸ் இருக்க போகிறது என்று குறியீடு மூலம் டிஓம் அல்லது ஆவணம் விரைவில் மரண தண்டனை பொருள் மாதிரி அல்லது பக்கம் தன்னை தயாராக உள்ளது. இந்த இலக்கணத்தை என்று நினைவு இங்கே வெறுமனே குறிப்பிடுகிறது பின்வரும் குறியீடு என்று மட்டுமே மரண தண்டனை உலாவி முடிந்ததும் எல்லாவற்றையும் ஏற்றும். 

முதலில் ஒரு அறிவிக்க பாணிகள் மொத்தமாக, stylizing முடிவடையும் இது குறிப்பிட்ட படி வரைபடம். நாம் ஒரு அறிவிக்க விருப்பங்களை மொத்தமாக, மேலும் கூகிள் தனிப்பயனாக்க இது நாங்கள் உட்பொதிக்க போகிறீர்கள் என்று வரைபடம். நிச்சயமாக, நாம் jQuery குறியீடு ஒரு பிட் பயன்படுத்த இது ஒரு பிட் மேலும் விரிவாக விளக்கினார் ஸ்பெக், அடைய அந்த உறுப்பு, வரைபடம் கேன்வாஸ் நாம் அவ்வாறு தனித்துவமாக அடையாளம் காணப்படும் என்று. பின்னர் இந்த வரி இங்கே இருக்கிறது என்ன தெரிகிறது மாயமாக எங்களுக்கு கொடுக்க உள்ளே ஒரு கூகிள் மேப் எங்கள் சொந்த பயன்பாடு, ஒரு குறிப்பு, அதற்கு உறுதுணையாக சேமித்து என்று மாறி என்று வரைபடத்தில் உள்ள. 

இறுதியாக, கீழே இங்கே நாம் பதிவு என்ன ஒரு கேட்பவரின் என்று. திரும்பி வழி, வழி என்று CS50 உள்ள வாரம் பூஜ்யம் திரும்பி நாம் கீறல் பார்த்து போது ஒரு நடைக்கு மூலம் அதன் ஆதரவு என்று விஷயங்கள் மூலம் நிகழ்வுகள் மற்றும் ஒளிபரப்பு. நீங்கள் பயன்படுத்த வேண்டும் அது உங்களை, ஆனால் அது தான் ஒரு பொறிமுறையை அதன்படி ஒரு இந்த வழக்கில் உலாவி அது தான் நம் கவனத்தை பெற முடியும் உண்மையில் சில குறியீடு இயக்க தயாராக. இந்த வழக்கில், அதை கேட்க நடக்கிறது சும்மா என்று ஒரு நிகழ்வை வரைபடத்தை. இந்த உலாவி உள்ளது என்று அர்த்தம் கூகிள் மேப் ஏற்றும் முடிந்ததும். இந்த கட்டத்தில் ஒரு செயல்பாடு என்று கட்டமைக்க வேண்டும் இறுதியில் மரண தண்டனை வேண்டும். அந்த செயல்பாடு, கட்டமைக்க, நாங்கள் எங்களுக்கு எழுதிய, பார்க்க வேண்டும். 

கீழே இங்கே இப்போது ஒரு செயல்பாடு ஆகிறது துரதிருஷ்டவசமாக ஒரு TODO சேர்க்க குறியீடாகும். குறிப்பிட்ட படி. நீங்கள் வேண்டும் போகிறேன் உண்மையில் குறியீடு எழுத அது தெரிகிறது என்பதை ஒரு marker-- சேர்க்கிறது ஒரு பத்திரிகை, அல்லது ஒரு கட்டைவிரல் பிசுப்பு போன்ற, அல்லது ஏதாவது Google வரைபடத்தில் else--. இங்கே இப்போது அந்த செயல்பாடு ஆகிறது கட்டமைக்க என்று. நீங்கள் படிக்க வேண்டும் நான் அதை விட்டு விடுகிறேன் மேலும் விரிவாக, ஆனால் நாம் சேர்க்க என்று உணர ஒரு கொத்து மேலும் அப்படின்னா போது நாம் குறியீடு இயக்க முடியும் என்று பயனர் கிளிக் வரைபடம் நீடிக்கிறது. நாங்கள் இங்கே அந்த குறியீடு வேண்டும் என்று, typeahead சொருகி துவக்கும் என்று கீழிறங்கும் பட்டி உண்மையில் வேலை. 

ஆனால் ஒரு கவனம் செலுத்த அனுமதிக்க இங்கு இடங்களில் ஜோடி. குறிப்பாக, இந்த செய்ய இங்கே. நான் ஆன்லைன் ஒத்திவைக்க வேண்டும் ஆவணங்கள் மற்றும் விவரக்குறிப்பு எப்படி இந்த TODO நிரப்ப. ஆனால் சுருக்கமாக, இந்த நூலகம் typeahead நீங்கள் அனுப்ப அனுமதிக்கிறது பொதுவாக ஒரு டெம்ப்ளேட் அறியப்படுகிறது என்ன, சில மாறி பெட்டிகள் கொண்ட வைட்டமின் இன்% செய்ய ஆவி மிகவும் ஒத்த. * கள். ஆனால், இந்த விஷயத்தில், குறிப்பிட்ட படி டெம்ப்ளேட் நீங்கள் குறிப்பிடும் என்ன மாறிகள் நீங்கள் விரும்பினால் வா என்று தரவு இருந்து புகுத்த மீண்டும் PHP போன்ற ஏதாவது இருந்து நீ எழுதப்பட்ட என்று கோப்புகளை அந்த JSON வெளியீடு உமிழும். 

இப்போது கீழே இங்கே நாம் என்று உணர typeahead தேர்வுகளை கேட்டு போது பயனர் உண்மையில் நடத்துகிறது ஒரு தேடல் மற்றும் ஒரு மதிப்பு சேர்த்து. இந்த நாம் உண்மையில் நீங்கள் எப்படி உள்ளது என்று கேட்க போவதில்லை மற்றும் விளைவாக சில குறியீடு இயக்க. பின்னர் நாம் கட்டமைக்க தொடரலாம் மேஷ தான் கொஞ்சம். மேலும், இறுதியில், நாம் அழைக்கின்றோம் இந்த செயல்பாடு மேம்படுத்தல். அதை திரையில் குறிப்பான்கள் மேம்படுத்துகிறது. ஒரு நொடியில் என்று மேலும். இதற்கிடையில், சில அங்கு, இங்கே சிறிய செயல்பாடுகள். இது ஒரு hideInfo இது வெறுமனே InfoWindow நிறைவடைகிறது. இங்கே இன்னொரு செயல்பாடு, அது இறுதியில் மிக நீண்ட முடியாது, குறிப்பான்கள் நீக்க. அந்த மீளமை நடக்கிறது என்ன சேர்ப்பு மார்க்கர் செயல்பாடு இல்லை. பின்னர் கீழே இங்கே தேடல் இருக்கிறது. இந்த ஒரு சுவாரஸ்யமான ஆகிறது நாம் ஏனெனில் என்று இங்கு குறியீடு எழுதியுள்ளனர் அன்று search.php பேசப்போகிறேன் சர்வர் மற்றும் சில பதிலைத் திரும்ப கிடைக்கும். 

நீங்கள், நிச்சயமாக, இன்னும் சாப்பிடுவேன் search.php செயல்படுத்த வேண்டும், ஆனால் நாம் செயல்படுத்தப்பட்டது என்று இங்கு குறியீடு நிகழ்ச்சி உண்மையில் கையாள போகிறோம் அந்த உரை பெட்டியில் இருந்து தேடுகிறது. குறிப்பாக, அறிவிப்பு என்று இங்கே இந்த விழா தேடல், search.php அழைக்கிறது என்று ஒரு முறை மூலம் நாம் விரிவுரையில் பார்த்தேன், இது எஞ்சினியரிங், கிடைக்கும். மேலும் இங்கே தொடரியல் ஒரு சிறிய மாறுபட்ட என்று விரிவுரை இருந்து நாம் பயன்படுத்தி jQuery வாக்குறுதியை முகப்பை என்று அழைக்கப்படும். ஸ்பெக் என்று மேலும். இது வெறுமனே எங்கள் அர்த்தம் இப்பொழுது இதை நோக்கங்களுக்காக இரண்டு சிறப்பு செயல்பாடுகளை நாம் டாட் கொண்டு அழைக்க வேண்டும் இங்கே உடனடியாக JSON பெற அழைப்பு பிறகு. ஒரு செய்து அழைக்கப்படுகிறது. என்று அழைக்கப்படும் ஒரு தோல்வியடைகிறது. நீங்கள் இந்த யோசிக்க முடியும் வெற்றி கையாளுதல் போன்ற மற்றும் தோல்வி கையாளுதல் தான் வழக்கில் ஏதாவது தவறு நடந்தால். 

இப்போது கடந்த பார்போம் இந்த கோப்பு செயல்பாடுகளை ஜோடி. கீழே இங்கே ஒரு செயல்பாடு ஆகிறது என்று ShowInfo, இது அந்த ஒரு தகவல் காட்டுகிறது சிறிய தகவல் ஜன்னல்கள் என்று பயனர் ஒரு மார்க்கர் கிளிக் போது மேல்தோன்றும். கீழே இங்கே இன்னும் இருக்கிறது என்று மேம்படுத்தல் செயல்பாடு என்று நாம் நீ செயல்படுத்தப்பட்டது. வரைபடத்தில் எல்லைக்கு தீர்மானிக்கிறது. ஜி.பி.எஸ் என்ன அதன் வடகிழக்கு மற்றும் இங்கே தென்மேற்கு மூலைகளிலும். நாம் சில அடர்நடவின் அளவுருக்கள் தயார் இங்கே பின்னர் இறுதியில் அவர்களை கடந்து நமக்கு இது, update.php செய்ய மேலும், நீ செயல்படுத்தப்பட்டது. என்று இறுதியில், சில JSON திரும்ப பெறுகிறது கோப்பு update.php என்று இருந்து பின்னர் எந்த நீக்குகிறது திரையில் குறிப்பான்கள் பின்னர் மீது செயல்களை திரும்பி வந்து என்று தரவு update.php, இருந்து, இது மீண்டும், ஒரு JSON வரிசை ஆகும். பின்னர் அது இறுதியில் ஒரு மார்க்கர் சேர்க்கிறது அந்த இடங்களில் ஒவ்வொரு கையாளும் தோல்வி அல்லது எந்த வலிமை பிழைகள் நன்றாக நடக்கும். 

இப்போது தான் நீங்கள் எப்படி ஒரு சுவை கொடுக்க இந்த திட்டம், பிழைத்திருத்தம் போகலாம், நான் திறந்து விட்டேன் என்று உணர இந்த URL இங்கே இந்த தாவல் முன்னெடுக்க, pset8 / articles.php? பூகோள = 02138. பற்றி இப்போது, மீண்டும், கட்டுரைகள் PHP நாங்கள் உங்களுக்கு நடைமுறைப்படுத்தப்படுகின்றன எனவே இந்த மிகவும் அல்ல நீங்கள் பயன்படுத்தி கொள்ள வேண்டும் என்ன பிழைத்திருத்தம், மாறாக நுட்பத்தை. நான் தேடியது என்று அறிவிப்பு இங்கே கேம்பிரிட்ஜ் ZIP குறியீடு, நான் ஒரு JSON, உண்மையில், திரும்பி வந்திருக்கிறேன் JSON வரிசை இது உள்ளே எதிர்த்திருகிறது இரண்டு keys-- இணைப்பு மற்றும் தலைப்பு உள்ளன. 

எனவே இந்த செயல்பாடு நீங்கள் ஏற்கனவே வேலை. ஆனால் கைமுறையாக இந்த உத்தி போகிறது ஏதாவது இந்த மாதிரி ஒரு URL போன்ற search.php? பூகோள = கேம்ப்ரிட்ஜ் அல்லது 02138 அல்லது பயனர் தட்டச்சு என்ன நீங்கள், உங்களை, முயற்சி என விலைமதிப்பற்ற நிரூபிக்க கண்டுபிடிக்க சரியாக அல்லது ஏன் search.php வேலை அல்லது இல்லை. 

இறுதியில், பின்னர், நீங்கள் வேண்டும் மேலே நீங்கள் ஒரு சில TODOs. நீங்கள் முதலில் செயற்படுத்துபவையாவன போகிறோம் அந்த இறக்குமதி ஸ்கிரிப்ட் உங்கள் தரவுத்தளத்தில் us.text உள்ள படிக்கிறார். அதன் பிறகு நீங்கள் வேண்டும் போகிறோம் search.php செயல்படுத்த குறிப்பிட்ட சரியாக செயல்படும் என்று. அதன் பிறகு நீங்கள் வேண்டும் போகிறோம் scripts.js கவனம் செலுத்த மற்றும் இறுதியில் செயல்படுத்துகிறது TODOs அந்த ஜோடி, கட்டமைக்க உட்பட மற்றும் டெம்ப்ளேட், , குறிப்பான்கள் சேர்க்க குறிப்பான்கள் நீக்க, மற்றும் பின்னர் கடந்த, ஆனால் குறைந்தது, ஒரு தனிப்பட்ட தொடர்பு. 

நீங்கள் உங்கள் மேஷ வேலை செய்து முடித்ததும் கையில் மிகவும் நமது, கோல் நீங்கள் ஒரு தனிப்பட்ட சேர்க்க ஆகிறது உங்கள் மேஷ தொடவும் அது அழகியல் அல்லது செயல்பாட்டு என்பதை. எப்போதும் மிகவும் மேஷ எடுத்து சற்று அடுத்த நிலை. மிக நீண்ட காலமாக நீங்கள் தாண்டி உங்களை தள்ளும் என ஸ்பெக் தன்னை உங்கள் பரிச்சயம் மற்றும் ஒரு நுட்பம் அழைத்து புதிய, இது எல்லாம் கூட வெறும் ஏதாவது மாற்றம் போன்ற அழகியல் நீங்கள் பயன்படுத்தும் அந்த வரைபடத்தை அமைப்பு, நாம் எதிர்பார்க்க என்று நோக்கம் திருப்தி. அப்போது, அந்த சிக்கல் அமை 8 மேஷ உள்ளது. மேலும் இணைந்திருங்கள் விவரக்குறிப்பு மற்றும் அதிர்ஷ்டம் இந்த கைப்பற்றுதல், உங்கள் கடந்த CS50 பிரச்சினை எப்போதாவது அமைக்க. 

[இசை]