Бүх сургалт ХУГАЦААГҮЙ буюу НАСАН ТУРШИЙН!
Зөвлөмж: Энэ сургалтыг үзэхийн
өмнө "VueJs орчин үеийн Javascript фрэймворк мастерын сэлэм - 1" сургалтыг
үзэхийг зөвлөж байна.
Ямар ч хүчирхэг зүйлийн гол танигдах шинж чанар нь түүний хялбар байдал билээ.
Тун залуухан боловч хамгийн хүчирхэг Javascript фрэймворкуудын нэг болж чадсан
VUEJS-ийг ашиглан та ойлгомжтой хялбар кодоор, найдвартай, хурдтай бас хүчирхэг
хамгаалалттай вэб сайтыг хурдан хугацаанд бүтээж чадна.Мэдээж та манай Javascript хэлийг эхнээс нь дуустал! сургалтын танилцуулга дээр байгаа дараах хэсгийг уншсан байх:
Яг одоо дэлхийн #1 эрэлттэй, өргөн ашиглагддаг програмчлалын хэлээр Javascript тодроод байна. Хэрэв та Javascript мэддэг бол АНУ-д танд сарын $9121 буюу ойролцоогоор сарын 24.4 сая төгрөгийн цалин өгөх ажээ. 2019 оны судалгаагаар Javascript нь Stackoverflow болон Github дээрх хамгийн их яригдаж буй сэдвээр тодорсонд гайхах зүйл үгүй.
Тэгвэл энэхүү хүчирхэг хэлний бүхийл гайхамшгийг өөртөө агуулсан, нэмж өргөтгөсөн 2019 оны шилдэг Javascript Фрэймворкоор тодорсон VUEJS-ийг ашиглан та маш богино хугацаанд, монгол хэл дээр видео бичлэг үзэн сурахыг хүсч байна уу?
Энэ сургалтыг үзсэнээр та дээрх аргуудад суралцахаас гадна Vuejs-ийг бие даан ашиглан мэргэжлийн вэб сайтыг хурдан хугацаанд хийх чадварыг эзэмшинэ. Та Javascript дээр эхлэн суралцагч байсан ч энэ сургалтыг бүрэн ойлгож суралцах боломжтой. Хамгийн гол нь сургалтын туршид бид хамтдаа Vuejs фрэймворкийн суурь ойлголтуудыг эхнээс нь дуустал нь демо прожектууд дээр туршиж, ажиллуулж үзэх болно.
Сургалтын явцад эзэмшсэн ур чадвараа ашиглан маш богино хугацаанд өндөр хамгаалалттай, хүчирхэг, уян хатан интерактив вэб программыг та бүтээж сурна.
Эцэст нь нэг асуулт асууя. VueJS гэж яг юу вэ?
Энэхүү гайхалтай фрэймворкийг фэйсбүүкийн ReactJS, гүүглийн Angular фрэймворкуудтай өрсөлдүүлэн ердөө ганц залуу бүтээсэн гэвэл та итгэх үү? Энэ залуу өөрөө Гүүглд ажиллаж байсан ба өөрийн хоббигоор бүтээсэн энэхүү фрэймворк нь гарсан даруйдаа дэлхий нийтийн хөгжүүлэгчдийг шууруулж чадсан билээ. Дэлхий нийт ердөө ганц хүн хөгжүүлж байгаа гэдгийг нь ч тоосонгүй, шууд л талархан хүлээн авчээ.
Яагаад ийм их амжилттай байсан юм бол? Юуны өмнө Ларавел фрэймворкийн бүтээгч Тейлор Отвел хэлэхдээ VueJS бол React сурахаас хамаагүй амар бас супер эд байна гэж анх твиттерээр зарлажээ. Өөрөөр хэлбэл дэлхийн шилдэг вэб фрэймворкийг бүтээсэн хүний амнаас ийм үг сонсоход хүн бүрийн анхааралд оролгүй яахав.
Өөр гоё юм юу байна вэ? Яагаад та энэ сургалтыг судлаад олж мэдэж болохгүй гэж?
Хичээлүүд :
-
02:00Танилцуулга
-
06:01Формтой ажиллах: Input form binding
-
02:48Формтой ажиллах: Input form binding үргэлжлэл
-
09:01Формтой ажиллах: Vue instance object-ийн өгөгдлийг груплэх ба формын инпутэд зарим тохиргоо хийх.
-
04:17Формтой ажиллах: Textarea-тай ажиллах
-
05:19Формтой ажиллах: Чекбокс ашиглах ба өгөгдлийг массивт хадгалах
-
03:12Формтой ажиллах: Радио товч ашиглах
-
10:35Формтой ажиллах: Сонголт хийх доош унадаг цэстэй ажиллах
-
03:28Формтой ажиллах: V-model bind дээрх нэмэлтийн тухай
-
11:46Формтой ажиллах: Формыг дээрх нэмэлтүүдийг ба тэдгээрийн тохиргоо
-
06:46Формтой ажиллах: Илгээх товчтой ажиллах
-
14:22Directive - ыг ойлгох нь
-
03:19Directive - рүү утга дамжуулах нь
-
05:23Directive - рүү аргумент дамжуулах нь
-
05:45Directive - рүү modifier дамжуулах нь
-
03:59Local Directive бүртгэх нь
-
07:55Multiple modifiers ашиглах нь
-
09:55Directive - рүү олон утга дамжуулах нь
-
06:21Локал шүүлтүүр(Local filter)- үүсгэх нь
-
05:37Глобал шүүлтүүр(Global filter) ба олон шүүлтүүрийг хэрхэн холбох вэ?
-
11:30Computed hook ашиглан Filter-ийг илүү динамик болгох
-
14:33Mixin-ийг ойлгох нь. Mixin үүсгэх.
-
11:18Mixin хэрхэн ажиллаж байгааг тестлэх. Глобалаар mixin ашиглах
-
20:44Хөдөлгөөнт анимацын тухай (Transitions)
-
09:48Урсдаг трансишн үүсгэх
-
13:41Трансишн ба Анимаци шинж чанаруудыг холих
-
05:15Динамик нэрүүд ба аттрибут ашиглах
-
06:09Олон элементийн хооронд транисишн тохируулах(Transitioning between multiple elements)
-
14:07Жаваскрифт дэгээнүүд ба Жаваскрифт анимешнүүдийг ойлгох нь
-
12:20Жаваскрифт дэгээнүүд ба Жаваскрифт анимешн хийх
-
13:08Динамик компонент хооронд шилжихдээ анимешн ашиглах
-
20:48Груп трансишн ашиглан анимаци хийх (Using transition-group to animate a list)
-
11:23Супер асуулт, хариултын жижиг веб программыг өмнөх мэдлэгээ ашиглан хийж үзэх. Танилцуулга хичээл.
-
33:13Супер асуулт, хариултын жижиг веб программын гол кодчилол болон трансишныг хийх.
-
31:10Vuejs Router (vue-router) суулгах, Router-ын тохиргоо хийж, ачааллах
-
14:00Router-ын горимыг ойлгох(Hash vs History) ба Router линкүүдээр header цэс хийх
-
09:56Би хаана байна. Идэвхитэй линкүүдийг хэлбэржүүлэх ба Кодоос url-ийг өөрчлөх
-
13:55Route-д параметр тохируулах, Route-ээс параметр авах, Route-ийн параметрийг өөрчлөх
-
08:55Эцэг Route-д хүү Route тодорхойлох
-
06:56UserStart component(Эцэг route)-оос Хүү component(Хүү route)-руу чиглүүлэх
-
15:51Route link-ийг илүү динамик болгох, Route-ийг нэрлэх. Route рүү хандах хандалтыг илүү халбар болгох
-
05:46Route дээр query ашиглан параметр дамжуулах
-
14:48Олон router-view ашиглах, router-view нэрлэх, Redirect method ашиглах
-
13:58Router-view дээр transition ашиглах, Animation хийх, Route дээр # - ашиглан html DOM-рүү хандах
-
26:02Scroll төлөвийг удирдах, Route-д хамгаалалт хийх, Хамгаалалт хийхийн өмнө beforeEnter method ашиглах
-
18:44Хамгаалалтанд beforeLeave method ашиглах, Route-ыг хялбараар ачаалах, browser-ын хурд нэмэгдүүлэх
-
14:59HTTP request – Vue-resource суулгах, тохиргоо
-
13:40Firebase(backend) server тохируулах. Өгөгдөл илгээх формыг бэлтгэх, шалгах
-
28:21Серверлүү пост(post) хүсэлт илгээх, Серверлүү гет(get) хүсэлт илгээх
-
11:08Vue-Resource-ыг глобаллаар тохируулах, Пост хүсэлт илгээхийн өмнөх боловсруулалт
-
04:53Пост хүсэлтийн хариунд боловсруулалт
-
07:15Vue-Resource хаанаас ирдэг вэ?
-
14:56Vue-Resource санг өргөтгөх(custom acitons) ба URL үүсгэх загварыг ойлгох
-
15:41Vuex: State Management Pattern + Library танилцуулга
-
33:43Vuex: Parent and Child component үүсгэх, VUEX суулгах, Centralized State үүсгэх, түүнийг ашиглах
-
18:55Vuex: getters ашиглах, mapGetters helper function ашиглан getters-ыг хаялбаршуулах
-
12:50Vuex: mutations ашиглах, mapMutations helper function ашиглан mutations-ыг хаялбаршуулах
-
20:05Vuex: actions ашиглах
-
25:56Vuex: Module
-
16:01Axios: Танилцуулга, axios суулгах, backend(firebase) тохиргоо хийх
-
25:12Axios: POST ба GET хүсэлт серверлүү илгээх
-
15:44Axios: Хүсэлт илгээхэд зарим тохиргоог нэмэлтээр хийж өгөх(global configuration)
-
11:43Axios: Interceptors ашиглах
-
09:54Axios: Custom instances default үүсгэж component-д ашиглах
-
04:35Authentication in Vue Apps. SPA-ны ажиллах зарчим.
-
11:07Firebase сервисийн тохиргоог хийх, Хэрэглэгч бүртгэх тохиргоог хийх(Firebase REST API)
-
07:37Хэрэглэгч нэвтрэх тохиргоог хийх(Firebase REST API)
-
24:57Хэрэглэгчийн нэвтрэх хүсэлтийг VUEX ашиглан илгээх, өгөгдлийг VUEX-д хадгалах
-
25:02Бусад component-оос VUEX-рүү хандах, Backend талд token дамжуулах
-
06:2569-р хичээлийн үргэлжлэл
-
14:59Route-д хамгаалалт тавих, VUEX State-д тулгуурлан нэвтрэлт хийдэг болгох
-
12:02Logout
-
11:04Автоматаар системээс Logout хийх
-
26:11Автоматаар Login хийх(Нэвтрэх)
-
05:03Vue CLI 3 Танилцуулга
-
06:54Шинэ Vue CLI-г ашиглан прожект үүсгэх
-
10:02Шинэ Vue CLI-г ашиглан прожект үүсгэх хичээлийн үргэлжлэл
-
08:32Шинэ Vue CLI-г ашиглан ninja-custom прожект үүсгэх
-
09:12Шинэ Plugin суулгах
-
12:00Using the GUI
-
15:25Нинжагийн хортой SMOOTHIE. Аппын танилцуулга, компонентын бүтэц.
-
09:51Прожектод Material Design framework суулгах(Google), Navbar component угсрах
-
22:17Index.vue component угсрах
-
08:57Устгах товч нэмэх
-
16:11Firestore тохиргоо хийх, Smootie app-даа Firebase сервис суулгах
-
22:16Firestore-оос өгөгдөл авах, түүнийг дэлгэцэнд харуулах
-
04:09Firestore-оос өгөгдөл утсгах
-
30:13Smoothie нэмэх component-ыг угсрах, орц нэмэх input-ыг тохируулах
-
17:44Ingredients-ын утгуудыг дэлгэцэнд харуулах, Smoothie өгөгдлийг Firestore-д хадгалах
-
09:38Ingredients-ын утгыг дэлгэцэн дээрээс устгах
-
20:07Smoothie засах component үүсгэх, slug ашиглан firestore-оос өгөгдөл шүүж авах
-
20:49Smoothie засах Формоо засаж дуусгах, Firestore-т байгаа өгөгдлийг шинэчлэх
-
16:45Бэлэн болсон прожектыг серверт байршуулах /Build & Deploy to Firebase/
VueJs орчин үеийн Javascript фрэймворк мастерын
сэлэм - 1
Хугацаа: 8 цаг 8 мин | Сурагчид: 216 | Үнэ:
29,900₮
|
|
HTML5, CSS3 эхнээс нь дуустал! (Sass-ын
хамт)
Хугацаа: 29 цаг 40 мин | Сурагчид: 2824 | Үнэ:
29,900₮
|
|
Javascript хэлийг эхнээс нь дуустал!
Хугацаа: 52 цаг 21 мин | Сурагчид: 3094 | Үнэ:
29,900₮
|
|
Онлайн форумын бүрэн вэб сайтыг эхнээс нь
(Laravel, VueJS, Pusher, JWT)
Хугацаа: 15 цаг 28 мин | Сурагчид: 296 | Үнэ:
29,900₮
|
|
React эхнээс нь дуустал!
Хугацаа: 42 цаг 2 мин | Сурагчид: 1796 | Үнэ:
29,900₮
|
|
== Сурагчдын сэтгэгдлүүд ==
Золбоо багшд тусгайлан талархаж баяр хүргэмээр байна. Ийм сайхан сургалтыг цаг зав гарган оюутнууд бидэнд улам ойлгомжтой сайхан зааж буйд баярлалаа. Нэг зүйлийг ойлгуулахын тулд дахин дахин жишээ авч тайлбарлаад байгаа нь үнэхээр их таалагдлаа. Компонентуудыг сайн ойлгохгүй байсан ч гэсэн багшийн уйгагүй зүтгэлийн үр дүнд маш сайн ойлгож эхэлж байна.
Axios сургалт дээр хянах самбар эхнээсээ гарахгүй байсан. Одоо ч гэсэн гараагүй л байна. Хойшид гарах байх гэж найдаж байна. Ер нь цаашид шинэ сэдэв эхлэхдээ github дээр тавихаас гадна бүх компонентуудыг дэлгэц дээрээ нэг халь гүйлгэж харуулаад эхлэмээр байна. Тэгэхгүй бол зарим нэг сэдвүүдийн доторх код өөрчлөгдсөнөөс болоод нэлээд хожуу алдаа нь илэрч гарч ирээд байна.
Баярлалаа