როგორი გრძნობაა JavaScript-ის სწავლა 2016 წელს

ამ სტატიის დაწერის დროს JavaScript ჩარჩოები არ შექმნილა.

შემდეგი არის შთაგონებული სტატიით „ეს მომავალია“ Circle CI-დან. ორიგინალის წაკითხვა შეგიძლიათ აქ . ეს ნაწილი მხოლოდ მოსაზრებაა და ისევე როგორც ნებისმიერი JavaScript ჩარჩო, ის არ უნდა იქნას მიღებული ძალიან სერიოზულად.

ჰეი, მე მივიღე ეს ახალი ვებ პროექტი, მაგრამ მართალი გითხრათ, რამდენიმე წელია არ დამიწერია ბევრი ვებ და გავიგე, რომ პეიზაჟი ცოტა შეიცვალა. თქვენ ხართ ყველაზე განახლებული ვებ დეველოპერი აქ?

-ფაქტობრივი ტერმინი არის Front End-ის ინჟინერი, მაგრამ დიახ, მე ვარ სწორი ბიჭი. მე ვაკეთებ ინტერნეტს 2016 წელს. ვიზუალიზაციები, მუსიკალური პლეერები, მფრინავი დრონები, რომლებიც თამაშობენ ფეხბურთს. მე ახლახან დავბრუნდი JsConf-დან და ReactConf-დან, ამიტომ ვიცი უახლესი ტექნოლოგიები ვებ აპების შესაქმნელად.

მაგარია. მე უნდა შევქმნა გვერდი, რომელიც აჩვენებს მომხმარებლების უახლეს აქტივობას, ასე რომ, მე უბრალოდ მჭირდება მონაცემების მიღება REST ბოლო წერტილიდან და გამოვაჩინო იგი რაიმე სახის გაფილტვრად ცხრილში და განაახლო თუ რამე შეიცვლება სერვერზე. ვფიქრობდი, იქნებ ვიყენებ jQuery-ს მონაცემების მოსატანად და საჩვენებლად?

-ღმერთო არა, jQuery-ს აღარავინ იყენებს. თქვენ უნდა სცადოთ React-ის სწავლა, 2016 წელია.

ოჰ, კარგი. რა არის რეაქცია?

-ეს არის სუპერ მაგარი ბიბლიოთეკა, რომელიც შექმნილია ფეისბუქის რამდენიმე ბიჭის მიერ, ის ნამდვილად მოაქვს კონტროლს და შესრულებას თქვენს აპლიკაციაში, რაც საშუალებას გაძლევთ მარტივად გაუმკლავდეთ ხედვის ნებისმიერ ცვლილებას.

რომ ჟღერს სისუფთავე. შემიძლია გამოვიყენო React სერვერიდან მონაცემების საჩვენებლად?

-კი, მაგრამ ჯერ თქვენ უნდა დაამატოთ React და React DOM, როგორც ბიბლიოთეკა თქვენს ვებ გვერდზე.

მოიცადე, რატომ ორი ბიბლიოთეკა?

-ასე რომ, ერთი არის ფაქტობრივი ბიბლიოთეკა და მეორე არის DOM-ის მანიპულირებისთვის, რომელიც ახლა შეგიძლიათ აღწეროთ JSX-ში.

JSX? რა არის JSX?

-JSX უბრალოდ JavaScript სინტაქსის გაფართოებაა, რომელიც საკმაოდ ჰგავს XML-ს. ეს არის DOM-ის აღწერის სხვა გზა, იფიქრეთ, როგორც უკეთესი HTML.

რა ჭირს HTML-ს?

-2016 წელია. HTML-ს პირდაპირ აღარავინ დაკოდირებს.

უფლება. მაინც, თუ დავამატებ ამ ორ ბიბლიოთეკას, შემიძლია გამოვიყენო React?

-არა მთლად. თქვენ უნდა დაამატოთ Babel და შემდეგ შეგიძლიათ გამოიყენოთ React.

სხვა ბიბლიოთეკა? რა არის ბაბელი?

-ოჰ, ბაბელი არის ტრანსპლერი, რომელიც საშუალებას გაძლევთ მიზანმიმართოთ JavaScript-ის კონკრეტული ვერსიები, ხოლო თქვენ კოდირება JavaScript-ის ნებისმიერ ვერსიაში. თქვენ არ გჭირდებათ Babel-ის ჩართვა ReactJS-ის გამოსაყენებლად, მაგრამ თუ ამას არ გააკეთებთ, ES5-ის გამოყენებას შეგაწუხებთ და მოდით ვიყოთ რეალური, ეს 2016 წელია, თქვენ უნდა დაწეროთ ES2016+-ში, როგორც ამას სხვა მაგარი ბავშვები აკეთებენ.

ES5? ES2016+? აქ ვიკარგები. რა არის ES5 და ES2016+?

-ES5 ნიშნავს ECMAScript 5-ს. ეს არის გამოცემა, რომელიც მიზნად ისახავს ადამიანების უმეტესობას, რადგან ის დანერგილია დღესდღეობით ბრაუზერების უმეტესობის მიერ.

ECMAScript?

-დიახ, იცით, JavaScript სკრიპტირების სტანდარტზე დაფუძნებული იყო 1999 წელს, 1995 წელს მისი თავდაპირველი გამოშვების შემდეგ, მაშინ, როცა JavaScript-ს ეწოდა Livescript და მხოლოდ Netscape Navigator-ში მუშაობდა. მაშინ ეს ძალიან ბინძური იყო, მაგრამ საბედნიეროდ ახლა ყველაფერი ძალიან ნათელია და ჩვენ გვაქვს, მაგალითად, ამ განხორციელების 7 გამოცემა.

7 გამოცემა. რეალურად. და ES5 და ES2016+ არიან?

-მეხუთე და მეშვიდე გამოცემა შესაბამისად.

მოიცადე, რა მოხდა მეექვსეზე?

-ეს 6-ს გულისხმობ? დიახ, ვგულისხმობ, რომ თითოეული გამოცემა არის წინა ვერსიის სუპერკომპლექტი, ასე რომ, თუ იყენებთ ES2016+-ს, იყენებთ წინა ვერსიების ყველა მახასიათებელს.

უფლება. და რატომ გამოვიყენოთ ES2016+ ES6-ზე?

-კარგი, თქვენ შეგიძლიათ გამოიყენოთ ES6, მაგრამ იმისთვის, რომ გამოიყენოთ მაგარი ფუნქციები, როგორიცაა ასინქრონიზაცია და ლოდინი, უნდა გამოიყენოთ ES2016+. წინააღმდეგ შემთხვევაში, თქვენ ჩარჩენილი ხართ ES6 გენერატორებთან კორუტინებით, რათა დაბლოკოთ ასინქრონული ზარები სათანადო კონტროლის ნაკადისთვის.

წარმოდგენა არ მაქვს, რა თქვი, და ყველა ეს სახელი დამაბნეველია. შეხედე, მე უბრალოდ ვტვირთავ მონაცემთა კრებულს სერვერიდან, მე შემეძლო უბრალოდ ჩამერთო jQuery CDN-დან და უბრალოდ ვიღებ მონაცემებს AJAX ზარებით, რატომ არ შემიძლია ამის გაკეთება?

-2016 წელია კაცო, jQuery-ს აღარავინ იყენებს, სპაგეტის კოდში მთავრდება. ეს ყველამ იცის.

უფლება. ასე რომ, ჩემი ალტერნატივა არის სამი ბიბლიოთეკის ჩატვირთვა მონაცემების მისაღებად და HTML ცხრილის ჩვენების მიზნით.

-კარგი, თქვენ ჩართეთ ეს სამი ბიბლიოთეკა, მაგრამ შეფუთეთ ისინი მოდულის მენეჯერთან, რომ ჩატვირთოთ მხოლოდ ერთი ფაილი.

მე ვხედავ. და რა არის მოდულის მენეჯერი?

-განმარტება დამოკიდებულია გარემოზე, მაგრამ ვებში ჩვეულებრივ ვგულისხმობთ ყველაფერს, რაც მხარს უჭერს AMD ან CommonJS მოდულებს.

Riiight. და AMD და CommonJS არიან…?

- განმარტებები. არსებობს გზები იმის აღსაწერად, თუ როგორ უნდა ურთიერთობდეს მრავალი JavaScript ბიბლიოთეკა და კლასი. იცით, ექსპორტი და მოითხოვს? თქვენ შეგიძლიათ დაწეროთ მრავალი JavaScript ფაილი, რომელიც განსაზღვრავს AMD ან CommonJS API-ს და შეგიძლიათ გამოიყენოთ ისეთი რაღაც, როგორიცაა Browserify მათ დასაკავშირებლად.

კარგი, ეს აზრი... ვფიქრობ. რა არის Browserify?

-ეს არის ინსტრუმენტი, რომელიც საშუალებას გაძლევთ დააკავშიროთ CommonJS აღწერილი დამოკიდებულებები ფაილებთან, რომლებიც შეიძლება გაშვებული იყოს ბრაუზერში. ის შეიქმნა იმიტომ, რომ ადამიანების უმეტესობა აქვეყნებს ამ დამოკიდებულებებს npm რეესტრში.

npm რეესტრი?

-ეს არის ძალიან დიდი საჯარო საცავი, სადაც ჭკვიანი ხალხი ათავსებს კოდს და დამოკიდებულებებს მოდულებად.

მოსწონს CDN?

-არა მართლა. ეს უფრო ცენტრალიზებულ მონაცემთა ბაზას ჰგავს, სადაც ყველას შეუძლია გამოაქვეყნოს და ჩამოტვირთოთ ბიბლიოთეკები, ასე რომ თქვენ შეგიძლიათ გამოიყენოთ ისინი ადგილობრივად განვითარებისთვის და შემდეგ ატვირთოთ ისინი CDN-ში, თუ გსურთ.

ოჰ, როგორც ბაუერი!

-კი მაგრამ ახლა 2016 წელია, ბოუერს აღარავინ ხმარობს.

ოჰ, მე ვხედავ… ასე რომ, მე უნდა გადმოვწერო ბიბლიოთეკები npm-დან?

-კი. მაგალითად, თუ გსურთ გამოიყენოთ React, გადმოწერეთ React მოდული და შემოიტანეთ იგი თქვენს კოდში. ამის გაკეთება შეგიძლიათ თითქმის ყველა პოპულარული JavaScript ბიბლიოთეკისთვის.

ოჰ, როგორც Angular!

-ანგულარი ასე 2015. მაგრამ კი. Angular იქნება იქ, VueJS ან RxJS და სხვა მაგარი 2016 ბიბლიოთეკების გვერდით. გსურთ გაიგოთ მათ შესახებ?

მოდით დავრჩეთ React-ს, ახლა უკვე ძალიან ბევრ რამეს ვსწავლობ. მაშ, თუ მჭირდება React-ის გამოყენება, ვიღებ მას ამ npm-დან და შემდეგ გამოვიყენებ ამ Browserify ნივთს?

-კი.

როგორც ჩანს, ზედმეტად რთულია დამოკიდებულების თაიგულის დაჭერა და მათი ერთმანეთთან დაკავშირება.

- სწორედ ამიტომ იყენებთ ამოცანების მენეჯერს, როგორიცაა Grunt, Gulp ან Broccoli, Browserify-ის გაშვების ავტომატიზაციისთვის. ჰეკ, თქვენ შეგიძლიათ გამოიყენოთ მიმოზაც კი.

გრუნტი? გულპი? ბროკოლი? მიმოზა? ჯანდაბაზე ვსაუბრობთ ახლა?

- დავალებების მენეჯერები. მაგრამ მაგრები აღარ არიან. ჩვენ გამოვიყენეთ ისინი 2015 წელს, შემდეგ გამოვიყენეთ Makefiles, მაგრამ ახლა ყველაფერს ვახვევთ Webpack-ით.

მაკეფაილები? მე მეგონა, რომ ძირითადად გამოიყენებოდა C ან C++ პროექტებზე.

-კი, მაგრამ, როგორც ჩანს, ინტერნეტში გვიყვარს რამის გართულება და შემდეგ საფუძვლებზე დაბრუნება. ჩვენ ამას ვაკეთებთ ყოველწლიურად ან ასე, უბრალოდ დაელოდეთ ამას, ჩვენ ვაპირებთ ასამბლეის გაკეთებას ქსელში ერთ ან ორ წელიწადში.

კვნესა. თქვენ ახსენეთ რამე, სახელად Webpack?

-ეს არის კიდევ ერთი მოდულის მენეჯერი ბრაუზერისთვის, რომელიც ასევე ერთგვარი ამოცანების შემსრულებელია. ეს არის Browserify-ის უკეთესი ვერსია.

ოკ, კარგი. რატომ ჯობია?

-კარგი, შეიძლება არ ჯობდეს, უბრალოდ, უფრო მეტი აზრი აქვს იმაზე, თუ როგორ უნდა იყოს დაკავშირებული შენი დამოკიდებულებები. Webpack გაძლევთ საშუალებას გამოიყენოთ სხვადასხვა მოდულის მენეჯერები და არა მხოლოდ CommonJS, მაგალითად, მშობლიური ES6 მხარდაჭერილი მოდულები.

მე უკიდურესად დაბნეული ვარ მთელი ამ CommonJS/ES6-ით.

-ყველა არის, მაგრამ SystemJS-ს აღარ უნდა აინტერესებდე.

იესო ქრისტე, სხვა არსებითი სახელი-js. კარგი, და რა არის ეს SystemJS?

-ისე, Browserify-ისა და Webpack 1.x-ისგან განსხვავებით, SystemJS არის დინამიური მოდულის ჩამტვირთავი, რომელიც საშუალებას გაძლევთ დააკავშიროთ მრავალი მოდული მრავალ ფაილში, ნაცვლად მათი ერთ დიდ ფაილში შეფუთვაში.

დაელოდე, მაგრამ მე მეგონა, რომ გვინდოდა ჩვენი ბიბლიოთეკების აგება ერთ დიდ ფაილში და ჩატვირთვა!

-დიახ, მაგრამ იმის გამო, რომ HTTP/2 მოდის ახლა მრავალი HTTP მოთხოვნა რეალურად უკეთესია.

მოიცადეთ, ასე რომ, არ შეგვიძლია უბრალოდ დავამატოთ სამი ორიგინალური ბიბლიოთეკა React-ისთვის??

-არა მართლა. მე ვგულისხმობ, რომ თქვენ შეგიძლიათ დაამატოთ ისინი, როგორც გარე სკრიპტები CDN-დან, მაგრამ მაინც დაგჭირდებათ Babel-ის ჩართვა.

კვნესა. და ეს ცუდია არა?

-დიახ, თქვენ ჩავრთავთ მთელ ბაბილონის ბირთვს და ეს არ იქნება ეფექტური წარმოებისთვის. წარმოებისას თქვენ უნდა შეასრულოთ რამდენიმე წინასწარი დავალება თქვენი პროექტის მოსამზადებლად, რაც სატანის გამოძახების რიტუალს მოხარშული კვერცხის რეცეპტს ჰგავს. თქვენ გჭირდებათ აქტივების მინიმიზაცია, მათი გაფუჭება, ჩასმული css-ს ზემოთ, სკრიპტების გადადება, ასევე-

მივიღე, მივიღე. ასე რომ, თუ ბიბლიოთეკებს პირდაპირ CDN-ში არ ჩავრთავთ, როგორ გააკეთებ ამას?

-მე მას Typescript-დან გადავიტანდი Webpack + SystemJS + Babel კომბინაციის გამოყენებით.

საბეჭდი დამწერლობა? მე მეგონა JavaScript-ში ვაკოდებდით!

-Typescript არის JavaScript, ან უკეთ რომ ვთქვათ, JavaScript-ის სუპერკომპლექტი, უფრო კონკრეტულად JavaScript ES6 ვერსიაზე. იცით, მეექვსე ვერსიაზე ადრე ვისაუბრეთ?

მე მეგონა ES2016+ უკვე ES6-ის სუპერსეტი იყო! რატომ გვჭირდება ახლა ეს ნივთი სახელად Typescript?

-ოჰ, იმიტომ, რომ ის გვაძლევს საშუალებას გამოვიყენოთ JavaScript, როგორც აკრეფილი ენა და შევამციროთ გაშვების დროის შეცდომები. 2016 წელია, თქვენ უნდა დაამატოთ რამდენიმე ტიპი თქვენს JavaScript კოდს.

და Typescript აშკარად აკეთებს ამას.

-Flow ასევე, თუმცა ის ამოწმებს მხოლოდ აკრეფას, ხოლო Typescript არის JavaScript-ის სუპერკომპლექტი, რომელიც საჭიროებს კომპილაციას.

კვნესა... და ფლოუ არის?

-ეს არის სტატიკური ტიპის შემოწმება, რომელიც ფეისბუქზე რამდენიმე ბიჭის მიერ არის შექმნილი. მათ დაშიფრეს იგი OCaml-ში, რადგან ფუნქციონალური პროგრამირება გასაოცარია.

OCaml? ფუნქციონალური პროგრამირება?

-აი რას იყენებენ დღეს მაგარი ბავშვები კაცო, იცი 2016? ფუნქციონალური პროგრამირება? მაღალი შეკვეთის ფუნქციები? კურირება? სუფთა ფუნქციები?

წარმოდგენა არ მაქვს ახლა რა გითხარი.

- თავიდან არავინ აკეთებს. შეხედეთ, თქვენ უბრალოდ უნდა იცოდეთ, რომ ფუნქციური პროგრამირება უკეთესია ვიდრე OOP და ეს არის ის, რაც ჩვენ უნდა გამოვიყენოთ 2016 წელს.

მოიცადე, მე ვისწავლე OOP კოლეჯში, მეგონა კარგი იყო?

-ასე იყო ჯავა სანამ Oracle-მა იყიდა. ვგულისხმობ, რომ OOP კარგი იყო იმ დღეებში და მას დღესაც აქვს თავისი გამოყენება, მაგრამ ახლა ყველა ხვდება, რომ მდგომარეობის შეცვლა ჩვილების დარტყმის ტოლფასია, ამიტომ ახლა ყველა გადადის უცვლელ ობიექტებზე და ფუნქციურ პროგრამირებაზე. ჰასკელის ბიჭები მას წლების განმავლობაში ეძახდნენ, - და ნუ გამიგებთ Elm-ის ბიჭებთან - მაგრამ საბედნიეროდ ინტერნეტში ახლა გვაქვს Ramda-ს მსგავსი ბიბლიოთეკები, რომლებიც გვაძლევს საშუალებას გამოვიყენოთ ფუნქციური პროგრამირება უბრალო JavaScript-ში.

უბრალოდ სახელებს ამისთვის ხსნი? რა ჯანდაბაა რამდა?

-არა. რამდა. ლამბდას მსგავსად. იცით, დევიდ ჩემბერსის ბიბლიოთეკა?

დავით ვინ?

-დევიდ ჩემბერსი. მაგარი ბიჭი. თამაშობს გადატრიალების თამაშს. რამდას ერთ-ერთი მონაწილე. თქვენ ასევე უნდა შეამოწმოთ ერიკ მეიჯერი, თუ სერიოზულად აპირებთ ფუნქციონალური პროგრამირების სწავლას.

და ერიკ მაიჯერი არის...?

-ფუნქციონალური პროგრამირების ბიჭიც. გასაოცარი ბიჭი. მას აქვს უამრავი პრეზენტაცია, სადაც ამ უცნაური ფერის პერანგის გამოყენებისას Agile-ს აფუჭებს. თქვენ ასევე უნდა შეამოწმოთ ზოგიერთი პერსონალი Tj, Jash Kenas, Sindre Sorhus, Paul Irish, Addy Osmani-დან.

კარგი. იქ ვაპირებ გაგაჩერო. ეს ყველაფერი კარგი და კარგია, მაგრამ მე ვფიქრობ, რომ ეს ყველაფერი ძალიან რთული და არასაჭიროა მხოლოდ მონაცემების მისაღებად და ჩვენებისთვის. დარწმუნებული ვარ, რომ არ მჭირდება ამ ადამიანების გაცნობა ან ყველაფრის სწავლა დინამიური მონაცემებით ცხრილის შესაქმნელად. დავუბრუნდეთ React-ს. როგორ მივიღო მონაცემები სერვერიდან React-ით?

-კარგი, თქვენ რეალურად არ იღებთ მონაცემებს React-ით, თქვენ უბრალოდ აჩვენებთ მონაცემებს React-ით.

ოჰ, ჯანდაბა მე. მაშ, რას იყენებთ მონაცემების მისაღებად?

-თქვენ იყენებთ Fetch-ს სერვერიდან მონაცემების მისაღებად.

ვწუხვარ? იყენებთ Fetch-ს მონაცემების მისაღებად? ვინც ამ ნივთებს ასახელებს, სჭირდება თეზაურუსი.

-ხო ვიცი? მიიღეთ ეს იმპლემენტაციის სახელი, რომელიც გამოიყენება სერვერის წინააღმდეგ XMLHttpRequests-ის შესასრულებლად.

ოჰ, ასე რომ AJAX.

-AJAX არის მხოლოდ XMLHttpRequests-ის გამოყენება. მაგრამ რა თქმა უნდა. Fetch საშუალებას გაძლევთ გააკეთოთ AJAX დაპირებების საფუძველზე, რაც შემდეგ შეგიძლიათ გადაჭრათ, რათა თავიდან აიცილოთ უკუგამოძახების ჯოჯოხეთი.

გამოძახების ჯოჯოხეთი?

-კი. ყოველ ჯერზე, როდესაც თქვენ ასრულებთ ასინქრონულ მოთხოვნას სერვერის მიმართ, თქვენ უნდა დაელოდოთ მის პასუხს, რომელიც შემდეგ გაიძულებთ დაამატოთ ფუნქცია ფუნქციის ფარგლებში, რომელსაც ეწოდება ჯოჯოხეთიდან გამოძახების პირამიდა.

ოკ, კარგი. და ეს დაპირება წყვეტს ამას?

-მართლა. თქვენი ზარების დაპირებების საშუალებით მანიპულირებით, შეგიძლიათ დაწეროთ უფრო გასაგები კოდი, დაცინოთ და შეამოწმოთ ისინი, ასევე შეასრულოთ ერთდროული მოთხოვნები და დაელოდოთ ყველა მათგანის ჩატვირთვას.

და ეს შეიძლება გაკეთდეს Fetch-ით?

-დიახ, მაგრამ მხოლოდ იმ შემთხვევაში, თუ თქვენი მომხმარებელი იყენებს მარადმწვანე ბრაუზერს, წინააღმდეგ შემთხვევაში თქვენ უნდა ჩართოთ Fetch polyfill ან გამოიყენოთ Request, Bluebird ან Axios.

რამდენი ბიბლიოთეკა უნდა ვიცოდე ღვთის გულისთვის? რამდენი მათგანია?

-ეს არის JavaScript. ათასობით ბიბლიოთეკა უნდა იყოს, რომელიც ყველა ერთსა და იმავეს აკეთებს. ჩვენ ვიცით ბიბლიოთეკები, ფაქტობრივად, ჩვენ გვაქვს საუკეთესო ბიბლიოთეკები. ჩვენი ბიბლიოთეკები უზარმაზარია და ზოგჯერ მათში გი ფიერის სურათებსაც ვამატებთ.

ახლა თქვი გაი ფიერი? მოდით, ეს დავამთავროთ. რას აკეთებენ ეს Bluebird, Request, Axios ბიბლიოთეკები?

-ეს არის ბიბლიოთეკები XMLHttpRequest-ების შესასრულებლად, რომლებიც აბრუნებენ დაპირებებს.

jQuery-ის AJAX მეთოდმაც არ დაიწყო დაპირებების დაბრუნება?

- 2016 წელს "ჯ" სიტყვას აღარ ვიყენებთ. უბრალოდ გამოიყენეთ Fetch და პოლიშეავსეთ, როდესაც ის ბრაუზერში არ არის, ან გამოიყენეთ Bluebird, Request ან Axios. შემდეგ მართეთ დაპირება ასინქრონული ფუნქციისა და ბუმის ფარგლებში მოლოდინით, თქვენ გაქვთ სათანადო კონტროლის ნაკადი.

ეს უკვე მესამედ ახსენეთ მოლოდინში მაგრამ წარმოდგენა არ მაქვს რა არის.

-Await გაძლევთ საშუალებას დაბლოკოთ ასინქრონული ზარი, რაც საშუალებას მოგცემთ უკეთ აკონტროლოთ მონაცემების მოპოვება და მთლიანობაში გაზარდოთ კოდის წაკითხვა. ეს გასაოცარია, თქვენ უბრალოდ უნდა დარწმუნდეთ, რომ დაამატეთ ეტაპი-3 წინასწარ დაყენებული ბაბელში, ან გამოიყენეთ სინტაქსური ასინქციური ფუნქციები და გარდაქმნის ასინქრონიზაცია გენერატორში.

ეს სიგიჟეა.

-არა, სიგიჟეა ის ფაქტი, რომ თქვენ გჭირდებათ წინასწარ შეადგინოთ Typescript კოდი და შემდეგ გადაიტანოთ ის Babel-თან, რათა გამოიყენოთ ლოდინი.

რა? ეს არ შედის Typescript-ში?

-ეს ასეა შემდეგ ვერსიაში, მაგრამ 1.7 ვერსიიდან ის მხოლოდ ES6-ს მიზნად ისახავს, ასე რომ, თუ გსურთ გამოიყენოთ await ბრაუზერში, ჯერ უნდა შეადგინოთ თქვენი Typescript კოდი, რომელიც მიზნად ისახავს ES6-ს და შემდეგ Babel-ს, რომელიც მიზნად ისახავს ES5-ს.

ამ ეტაპზე არ ვიცი რა ვთქვა.

-აჰა, ადვილია. დააკოდირე ყველაფერი Typescript-ში. ყველა მოდული, რომელიც იყენებს Fetch-ს, აკომპლექტებს მათ ES6-ის სამიზნეზე, გადააქვს მათ Babel-ით ეტაპი-3 წინასწარ დაყენებულზე და იტვირთება SystemJS-ით. თუ Fetch არ გაქვთ, შეავსეთ ის, ან გამოიყენეთ Bluebird, Request ან Axios და შეასრულეთ ყველა თქვენი დაპირება მოლოდინში.

ჩვენ გვაქვს მარტივის ძალიან განსხვავებული განმარტებები. მაშ, ამ რიტუალით საბოლოოდ მოვიყვანე მონაცემები და ახლა შემიძლია React-ის ჩვენება, არა?

- აპირებს თუ არა თქვენი განაცხადი რაიმე სახელმწიფოებრივ ცვლილებას?

არა, მე ასე არ ვფიქრობ. უბრალოდ მონაცემების ჩვენება მჭირდება.

-ოჰ მადლობა ღმერთს. წინააღმდეგ შემთხვევაში, მომიწევდა აგიხსნათ Flux, და ისეთი განხორციელებები, როგორიცაა Flummox, Alt, Fluxible. მართალია, გულწრფელად რომ ვთქვათ, თქვენ უნდა გამოიყენოთ Redux.

მე ვაპირებ ამ სახელების თავზე ფრენას. ისევ, მე უბრალოდ მჭირდება მონაცემების ჩვენება.

-ოჰ, თუ უბრალოდ აჩვენებთ მონაცემებს, თავიდან React არ სჭირდებოდათ. შაბლონური ძრავით კარგი იქნებოდა.

მეხუმრები? როგორ ფიქრობთ, ეს სასაცილოა? ასე ექცევი შენს საყვარელ ადამიანებს?

-უბრალოდ ავუხსენი რისი გამოყენება შეიძლებოდა.

გაჩერდი. უბრალოდ გაჩერდი.

-ვგულისხმობ, მაშინაც კი, თუ ეს მხოლოდ შაბლონის ძრავის გამოყენებას გულისხმობს, მე მაინც გამოვიყენებდი Typescript + SystemJS + Babel კომბოს, შენ რომ ვიყო.

მე მჭირდება მონაცემების ჩვენება გვერდზე და არა Sub Zero-ს ორიგინალური MK fatality. უბრალოდ მითხარი რა შაბლონის ძრავი გამოვიყენო და იქიდან ავიღებ.

-ბევრია, რომელს იცნობ?

უჰ, სახელი არ მახსოვს. დიდი ხნის წინ იყო.

- j თარგები? jQote? სუფთა?

არა, ზარს არ რეკავს. კიდევ ერთი?

-გამჭვირვალობა? JSRender? MarkupJS? KnockoutJS? იმ ერთს ორმხრივი შეკვრა ჰქონდა.

კიდევ ერთი?

-PlatesJS? jQuery-tmpl? სახელურები? ზოგი მაინც იყენებს მას.

შესაძლოა. არის ამ უკანასკნელის მსგავსი?

-ულვაშები, ხაზგასმა? მე ვფიქრობ, რომ ახლა ლოდაშსაც აქვს ერთი, მართალი გითხრათ, მაგრამ ეს არის 2014 წელი.

არა.. იქნებ უფრო ახალი იყო.

-ჯეიდი? DustJS?

არა.

-DotJS? EJS?

არა.

-ნუჯუკები? ECT?

არა.

-მაჰ, Coffeescript სინტაქსი მაინც არავის მოსწონს. ჯედი?

არა, შენ უკვე თქვი ჯეიდი.

-პუგს ვგულისხმობდი. ჯეიდს ვგულისხმობდი. ვგულისხმობ, ჯეიდი ახლა პუგია.

კვნესა. არა, არ მახსოვს. რომელს გამოიყენებდით?

-ალბათ მხოლოდ ES6-ის მშობლიური შაბლონის სტრიქონები.

ნება მომეცით გამოვიცნო. და ამას სჭირდება ES6.

-სწორია.

რასაც, იმის მიხედვით, თუ რომელ ბრაუზერს ვიყენებ, სჭირდება Babel.

-სწორია.

რომელიც, თუ მსურს ჩართვა მთელი ძირითადი ბიბლიოთეკის დამატების გარეშე, უნდა ჩავტვირთო მოდულის სახით npm-დან.

-სწორია.

რაც მოითხოვს Browserify-ს, ან Wepback-ს, ან, სავარაუდოდ, სხვა ნივთს, სახელწოდებით SystemJS.

-სწორია.

რომელიც, თუ ეს არ არის Webpack, იდეალურად უნდა მართოს ამოცანების შემსრულებელმა.

-სწორია.

მაგრამ, რადგან მე უნდა გამოვიყენო ფუნქციონალური პროგრამირება და აკრეფილი ენები, ჯერ უნდა შევადგინო Typescript წინასწარ ან დავამატო ეს Flow რამ.

-სწორია.

და შემდეგ გაუგზავნე ბაბელს, თუ მსურს გამოიყენო ლოდინი.

-სწორია.

ასე რომ, მე შემიძლია გამოვიყენო Fetch, დაპირებები და დინების კონტროლი და მთელი ეს მაგია.

-უბრალოდ არ დაგავიწყდეთ Fetch-ის პოლიფილის შევსება, თუ ის არ არის მხარდაჭერილი, Safari მაინც ვერ უმკლავდება მას.

იცი რა. მგონი აქ დავასრულეთ. სინამდვილეში, ვფიქრობ, რომ დავასრულე. მე დავასრულე ვებ, მე დავასრულე JavaScript-ით.

-კარგია, რამდენიმე წელიწადში ჩვენ ყველა ვაპირებთ კოდირებას Elm-ში ან WebAssembly-ში.

მე უბრალოდ ვაპირებ უკან დაბრუნებას. მე უბრალოდ ვერ ვიტან ამ ბევრ ცვლილებას და ვერსიას, გამოცემებს, შემდგენელებსა და ტრანსპილერებს. JavaScript საზოგადოება გიჟურია, თუ ფიქრობს, რომ ვინმეს შეუძლია ამის გათვალისწინება.

-გისმენ. მაშინ უნდა სცადოთ პითონის საზოგადოება.

რატომ?

- ოდესმე გსმენიათ Python 3-ის შესახებ?

განახლება: გმადლობთ ბეჭდვითი შეცდომებისა და შეცდომების მითითებისთვის, მე განვაახლებ სტატიას, როგორც აღვნიშნეთ. დისკუსია HackerNews-სა და Reddit- ში .