EmberJS гэж юу вэ? суулгах нь

Zorig
Zori’s ember.js тэмдэглэл
3 min readAug 16, 2017

Ember гэж юу вэ?

Ихэвчлэн олон тоон(embers) дээр хэлэгддэг. Унтарч буй галанд шатаж буй жижиг мод эсвэл нүүрсний хэсгийг ember гэж нэрлэдэг байна. Уг гарал нь эртний германик англи хэлний “eimuria” бөгөөд орчин цагийн англи хэлэнд дуудахад амар болгох гэж “b” оруулж өгсөн байна.

Emberjs гэж юу вэ?

A framework for creating ambitious web applications гэх мото-той энэ фрэймворк нь нээлттэй эхийн, урт хугацаанд хөгжүүлэгдэх ажилд зориулагдсан front end буюу хэрэглэгч талын фрэймворк юм. EmberJS нь бусад дээд түвшиний фрэймворкуудын адил Single Page Application(SPA) хийхэд нэн тохиромжтой. Энэ нь юу гэсэн үг вэ гэхээр энгийн вэб шиг хуудас шилжилт бүрт бүх контентоо дуудаж хүлээх хоорондоо цагаан хуудас харахаас ялгаатай нь нэг удаа дуудаад цаашаа бүх юм ид шидийн мэт ажиллах болно.

Single Page Application нь энгийнээр вэб аппликешныг browser дотор ашиглах явцад хуудас дахин дууддагүй аппликешн юм. Таны өдөр бүр л хэрэглэдэг Gmail, Google Maps, Facebook г.м вэб аппликешнууд. SPA нь маш сайн UX -тэй ашиглахад таатай experience үзүүлэх, хуудас дахин дуудахгүй, контент хүлээх шаардлагагүй, доторх контентоо дээд түвшиний javascript фрэймворкууд(Angular, Ember, React)-ын тусламжтай дуудаж харуулдаг.

source: pexels.com pexels-photo-266751.jpeg

Ember фрэймворкийн анхны 2 коммитын нэг нь өөр фрэймворкийн код буюу SproutCore 2 байсан. SproutCore нь apple -д анх үүссэн ч дараа нь тусдаа гарч өөр компани болсон байна. SproutCore нь icloud -д зориулан бүтээгдэж байсан ба одоо ч эх код нь хэвээрээ гэлцдэг. EmberJS нь “convention over configuration” -ыг гол үзэл болгон баримталдаг. Аливаа юмыг хийхэд олон амархан арга байгаа ч яг зөв аргаар хийх гэдэг нь арай өөр зүйл юм. Тэгэхээр ямар нэг аргаар ember-ын код бичээд ажиллуулж болох ч яг зөв аргаар нь хийхгүй л бол дараа нь өөрөө л хохирох нь.

Харин ember -т үүнийг ингэж хийх ёстой, түүнийг заавал ингэж хийх ёстой гэх зэрэг маш сайн зөвлөмжүүд мөн таньд туслах ember -ын коммьюнити бий.

Аугаа Jquery түүний баялаг сангууд болон event listener зэргийг ашиглаад HTML -ыг DOM руу хийхэд багагүй хүндрэлтэй л байх болов уу.

Хэрхэн суулгах вэ?

Ember-cli бол тушаалын мөрний хэрэгсэл(command line tool) бөгөөд терминал/command prompt -аас аппликешний файлуудыг үүсгэх, локал дээр ажиллуулах, серверт тавихад бэлэн болгох, нэмэлтүүд суулгах зэрэгт туслах багаж юм. Шинээр ember сурч байгаа бол шинэ файл үүсгэхдээ өөр файлыг хуулах, файлаас хуулах, шинээр нэрлэх зэргээс аль болох зайлс хийсэн дээр. Учир нь дээрх үйлдлүүдийг хийхэд алдаж болзошгүй учраас үргэлж ember-cli ашиглаж занших хэрэгтэй.

Ember-cli суулгахын тулд бидэнд nodejs мөн yarn суусан байх шаардлагатай. /Хэрхэн суулгахыг энд бичээд хэрэггүй болов уу./

  1. Ember-cli суулгахдаа терминал/CMD нээгээд npm ээр эсвэл yarn ашиглан суулгана.
yarn global add ember-cli
npm install -g ember-cli

Төсөл үүсгэх

Суулгасан ember-cli tool -ын new команд ашиглан шинэ төсөл үүсгэнэ. Доор myproject нэртэй төсөл үүсгэе

ember new myproject

ингэснээр myproject нэртэй хавтас үүсэх ба дотор нь ember application-ыг үүсгэж ажиллахад бэлэн болгосон байгаа. Үүссэн аппликешн маань:

  1. Хөгжүүлэлт хийхэд зориулсан сервер
  2. Темплэйт хувиргалт
  3. Javascript, CSS minify буюу багасгалт
  4. Babel ашиглан es2015 -ын нэмэлт боломжууд зэргийг агуулсан байдаг.

Бүх юм ном журмын дагуу суусан эсэхийг шалгая. Үүний тулд терминал дээр:

cd myproject
ember server

ингээд хэдэн секундын дараа доорх гаралт гарах ба өөрийн хэрэглэдэг

Livereload server on http://localhost:49152
Serving on http://localhost:4200/

интернет browser-г нээж localhost:4200хандахад ember -ын welcome хуудас гарч ирнэ. Баяр хүргэе! анхны ember апп үүсгээд, ажилуулж чадлаа.

--

--

Zorig
Zori’s ember.js тэмдэглэл

Lover(Programming, Anime, Manga, Music, Movie, FilmPhotography, Aikido, Travel, Internet, Open Source..) Tinker, Reader, Parkour, Web Developer, host of devnote