Tag Archives: git

Εγκατάσταση Ionic Framework για ανάπτυξη υβριδικών mobile εφαρμογών σε Windows και Ubuntu GNU/Linux.

To ionic framework είναι ένα framework (σώπα σας είπα κάτι νέο) που συνδιάζει Angular.js και Apache cordova  προκειμένου μέσω javascript να μπορείς να δημιουργείς mobile εφαρμογές για IOS και Android.

Για να παίξει το εν λόγο framework θέλουμε την node.js, για windows την κατεβάζουμε από το https://nodejs.org/en/ και απλά πατάμε next next next ενώ σε Ubuntu linux δίνουμε:

sudo apt-get install nodejs npm

Μετά θα χρειαστούμε το git σε windows το κατεβάζουμε από την σελίδα http://www.git-scm.com/download/win ενώ σε linux δίνουμε στο τερματικό (Σε windows είναι σημαντικό να επιλέξετε να σας εγκαταστήσει και το bash κέλυφος (απλά πατήστε next next next) next next next):

sudo apt-get install git

Μετά σε windows ανοίγουμε το git-bash ενώ σε gnu/linux έχουμε ανοικτό το τερματικό μας.

Σημείωσεις:

  1. Σε Windows από εδώ και στο εξής οι εντολές θα τρέχουν από το git-bash.
  2. Σε Windows στις εντολές που αρχίζουν με sudo ΔΕΝ το βάζουμε.
    πχ. Η εντολή:

    sudo npm install -g ionic cordova

    Στο git-bash σε Windows θα την τρέξετε έτσι:

    npm install -g ionic cordova

Τώρα είτε στο terminal είτε στο git-bash δίνουμε τις εξής εντολή :

sudo npm install -g ionic cordova

Τώρα έχουμε 2 επιλογές:

  1. Να δημιουργήσουμε την δικιά μας εφαρμογή.
  2. Να συνεισφέρουμε στην ανάπτυξη ήδη υπάρχουσας εφαρμογής από το github.

Επιλογή 1:

Δίνουμε:

ionic start ^όνομα app^ tabs

Για το στυλ tabs του ionic:
Application with tabs generated by Ionic
ή

ionic start ^όνομα app^ sidemenu

Για να δημιουργία του στυλ με πλαινό μενού του ionic:
Application with sidebar generated by Ionic
(Δεν σας δείχνω την επιλογή bare διότι δεν βολεύει αν θέλετε να αρχίσετε μια νέα εφαρμογή η αν μαθένετε το framework)

Όπου ^ονομα app^ είναι πως θέλετε να ονομάσετε μια την εφαρμογή σας. Σας επισημαίνω ότι θα δημιουργηθεί ένας φάκελος στον τρέχων φάκελο που είστε στο τερματικό η στο git bash (που ουσιαστικά είναι το bash κέλυφος που χρησιμοποιεί το gnu/linux σε windows περιβάλλον)

Όταν μας ρωτήσει «Create an ionic.io account to send Push Notifications and use the Ionix View app» πορς το παρόν δίνουμε n. (Ειδάλλως y αν το χρειάζεστε για κάτι άλλο προσωπικά ΔΕΝ το έχω χρησιμοποιήσει.)

πχ. Αν δώσω την εντολή:

ionic start sample tabs

Θα δημιουργήσει τον φάκελο sample και θα βάλει μέσα σε αυτό τα κατάλληλα αρχεία για να δημιουργήσει ένα βασικό σκελετό εφαρμογής με tabs.

Θα το δούμε ότι δημιουργήθηκε ο φάκελος δίνοντας:

ls

Και εντοπίζοντας με το μάτι τον φάκελο που δημιουργήθηκε.

Μετά δίνουμε:

cd ^όνομα app^

Και μετά:

ionic serve

Για να το δοκιμάσετε στον browser σας. Αν πάτε πίσω στην κονσόλα (η στο git bash) και πατήσετε q και μετά enter θα κλείσει η «υποτυπώδης» web server που σας δείχνει την εφαρμογή.

Σημείωση: Η παραπάνω εντολή ενδεχομένως να σας βγάλει επιλογή δικτύου επιλέγουμε το 2 (localhost). Ακόμη
Τα windows θα σας βγάλει ένα μήνυμα για το εάν επιτρέπετε αυτήν την εφαρμογή να τρέχει στο δίκτυο όπου σαφώς λέμε ότι το επιτρέπουμε.

Για την Επιλογή 2:

Για την επιλογή αυτή θα υποθέσουμε ότι έχουμε ένα αποθετήριο στο github και θέλουμε να το κάνουμε clone.

Δημιουργούμε έναν φάκελο με την εντολή:

mkdir ^όνομα φακέλου^

Και μετά δίνουμε:

cd ^όνομα φακέλου^

Και μετά κάνουμε clone το github αποθετήριo:

git clone ^repo_name^ .

Σημείωση: μην ξέχάσετε την . στο τέλος.

Όπου ^όνομα φακέλου^ ένα χαρακτηριστικό όνομα για τον φάκελο που θα φιλοξενήσει το project.
Όπου ^repo_name^ copy paste από το github ή bitbucket. (Για github βλ. τα βελάκια στην παρακάτω εικόνα)
Field fto copy the repo

Πχ. Πως να κατεβάσετε τον κώδικα του faster (μιας εφαρμογής που δημιουργήθηκε από στο #crownpolicy #transport hackathon):

Έστω τον φάκελο που θέλουμε να αποθηκεύσουμε την εφαρμογή ονομάζεται faster έτσι θα δώσουμε (είτε στο τερματικό του gnu/linux είτε στο git bash):

mkdir faster
cd faster
git clone git@github.com:kawai-developers/faster.git .

Και για να δούμε πως παίζει δίνουμε:

ionic serve
Advertisements