Instalacja ember-cli i środowiska deweloperskiego dla embera 2.X

Tworzymy frontendową aplikację z emberem na frontendzie i Pythonem, Django w backendzie.

Najnowsze wersje JavaScriptowych frameworków mocno bazują na JavaScriptowych narzędziach. Minęły już czasy, gdy wszystko wrzucało się do katalogu na statykę.

W serii artykułów postaram się przedstawić najnowszą wersję ember.js wraz z JavaScriptowym środowiskiem w połączeniu z RESTowym API wystawianym przez Django, czy inne backendowe API.

Zacznijmy od przygotowania środowiska dla ember-cli.

Instalacja ember-cli

ember-cli to narzędziówka dla embera, pozwala generować szkielet nowych aplikacji, ich części, czy odpalać deweloperski serwer albo testy. Jak każdy inny pakiet zainstalować można go poprzez npm - menedżer pakietów node.js.

Instalacja pod Linuksem

Zaczynamy od pobrania nvm - menedżera wersji node.js ułatwiającego zainstalowanie pożądanej wersji node. Wystarczy wykonać polecenie:

wget -qO- https://raw.githubusercontent.com/creationix/nvm/v0.29.0/install.sh | bash

Następnie możemy zainstalować wybraną wersję node:

nvm install 0.12

W dowolnym momencie możemy włączyć daną wersję node, w podobny sposób jak virtualenvy w Pythonie:

nvm use 0.12

Teraz możemy globalnie zainstalować ember-cli oraz bowera (menedżer zależności w projekcie):

npm install -g ember-cli
npm install -g bower

Następnie możemy zainstalować także watchmana, który będzie obserwował nasz kod i przeładowywał otwartą w przeglądarce aplikację gdy zajdą jakieś zmiany. Pod OS X do jego instalacji możemy użyć homebrew, a pod Linuksem linuxbrew:

ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/linuxbrew/go/install)"


==> Next steps
Install the Linuxbrew dependencies:

Debian, Ubuntu, etc.:
  `sudo apt-get install build-essential`

Fedora, Red Hat, CentOS, etc.:
  `sudo yum groupinstall 'Development Tools'`

See http://brew.sh/linuxbrew/#dependencies for more information.

Run `brew doctor` before you install anything
Run `brew help` to get started

Brewmaster będzie dostępny jako .linuxbrew/bin/brew i żeby był dostępny globalnie możemy dodać do .bashrc:

export PATH="/home/USERNAME/.linuxbrew/bin:$PATH"

Po czym możemy zainstalować watchmana:

brew install watchman

Gdy instalacja się zakończy zostaniemy poinformowani o dodatkowych krokach do wykonania:

Python modules have been installed and Homebrew's site-packages is not
in your Python sys.path, so you will not be able to import the modules
this formula installed. If you plan to develop with these modules,
please run:
  mkdir -p /home/USERNAME/.local/lib/python2.7/site-packages
  echo 'import site; site.addsitedir("/home/USERNAME/.linuxbrew/lib/python2.7/site-packages")' >> /home/USERNAME/.local/lib/python2.7/site-packages/homebrew.pth

I gotowe, mamy wszystkie zależności i możemy zacząć przygodę z emberem:

ember new NAZWA_APLIKACJI
cd NAZWA_APLIKACJI
ember server

Serwer deweloperski uruchomi się pod adresem http://localhost:4200/

ember-cli w dockerze

Alternatywny sposób instalacji całej tej narzędziówki bez zaśmiecania sobie systemu jest wykorzystanie obrazu dockera. Samego dockera można zainstalować z repozytorium, choć jeżeli wersja jest stara to lepiej pobrać instalator (plik sh) ze strony get.docker.com i zainstalować najnowszą wersję. Po instalacji warto dodać się też do grupy docker żeby móc używać go bez sudo.

Cała narzędziówka embera dostępna jest w obrazie danlynn/ember-cli. Do obsługi obrazu przyda się docker-compose, którego możemy zainstalować PIPem.

Tworzymy katalog na naszą aplikację, a w nim plik docker-compose.yml:

ember: &defaults
  image: danlynn/ember-cli:latest
  volumes:
    - .:/myapp

npm:
  <<: *defaults
  entrypoint: ['/usr/local/bin/npm']

bower:
  <<: *defaults
  entrypoint: ['/usr/local/bin/bower', '--allow-root']

server:
  <<: *defaults
  command: server --watcher polling
  ports:
    - "4200:4200"
    - "35729:35729"

Możemy już stworzyć szkielet aplikacji, czy odpalić serwer deweloperski:

docker-compose run --rm ember init
docker-compose run --rm ember server

Serwer zostanie uruchomiony na porcie 4200 działającego obrazu dockera. Żeby sprawdzić jakie IP ma obraz - wylistuj go za pomocą docker ps a następnie skopiuj jego ID do polecenia docker inspect TUTAJ_ID. Pod kluczem IPAddress będzie podany adres IP obrazu.

Aktualizacja embera

W chwili pisania artykułu ember-cli domyślnie instalował embera 1.3, gdzie najnowsza wersja to 2.1. Aktualizacja jest prosta. Edytujemy bower.json i podbijamy wersje zależności po czym wykonujemy bower install:

"ember": "^2.1.0",
"ember-data": "^2.1.0",
"ember-cli-shims": "ember-cli/ember-cli-shims#0.0.4",
"ember-load-initializers": "ember-cli/ember-load-initializers#0.1.7",

Następnie edytujemy package.json i podbijamy wersje:

"ember-cli-app-version": "1.0.0",
"ember-cli-htmlbars": "1.0.1",
"ember-cli-htmlbars-inline-precompile": "^0.3.1",
"ember-data": "2.1.0",

I wykonujemy polecenie npm install

blog comments powered by Disqus

Kategorie

Strony