Δημιουργήστε την πρώτη σας εφαρμογή!

Γνωρίστε το Nette Framework δημιουργώντας ένα απλό ιστολόγιο με σχόλια. Ας ξεκινήσουμε!

Μετά τα δύο πρώτα κεφάλαια, θα έχετε το δικό σας λειτουργικό ιστολόγιο και θα είστε έτοιμοι να δημοσιεύσετε τις φοβερές αναρτήσεις σας, αν και οι δυνατότητες θα είναι αρκετά περιορισμένες μετά την ολοκλήρωση αυτών των δύο κεφαλαίων. Για να κάνετε τα πράγματα πιο ευχάριστα για τους χρήστες σας, θα πρέπει επίσης να διαβάσετε τα επόμενα κεφάλαια και να συνεχίσετε να βελτιώνετε την εφαρμογή σας.

Αυτό το σεμινάριο προϋποθέτει ότι έχετε ολοκληρώσει το έγγραφο Εγκατάσταση και έχετε ρυθμίσει με επιτυχία τα εργαλεία σας. Προϋποθέτει επίσης ότι κατανοείτε τον αντικειμενοστραφή προγραμματισμό στην PHP.

Παρακαλούμε χρησιμοποιήστε PHP 8.1 ή νεότερη έκδοση. Μπορείτε να βρείτε την πλήρη εφαρμογή στο GitHub.

Η σελίδα καλωσορίσματος

Ας ξεκινήσουμε δημιουργώντας ένα νέο έργο στον κατάλογο nette-blog:

composer create-project nette/web-project nette-blog

Αυτή τη στιγμή θα πρέπει να εκτελείται η σελίδα καλωσορίσματος του Web Project. Δοκιμάστε την ανοίγοντας το πρόγραμμα περιήγησής σας και πηγαίνοντας στην ακόλουθη διεύθυνση URL:

http://localhost/nette-blog/www/

και θα πρέπει να δείτε τη σελίδα καλωσορίσματος του Nette Framework:

Η εφαρμογή λειτουργεί και μπορείτε τώρα να αρχίσετε να κάνετε αλλαγές σε αυτήν.

Αν έχετε κάποιο πρόβλημα, δοκιμάστε αυτές τις συμβουλές.

Περιεχόμενο του Web Project

Το Web Project έχει την ακόλουθη δομή:

nette-blog/
├── app/              ← application directory
│   ├── Core/         ← βασικές αναγκαίες τάξεις
│   ├── UI/           ← παρουσιαστές, πρότυπα και λοιπά.
│   │   └── Home/     ← Αρχικός κατάλογος παρουσιαστών
│   └── Bootstrap.php ← booting class Bootstrap
├── bin/              ← scripts for the command line
├── config/           ← configuration files
├── log/              ← error logs
├── temp/             ← temporary files, cache, …
├── vendor/           ← libraries installed by Composer
│   └── autoload.php  ← autoloading of libraries installed by Composer
└── www/              ← public folder - the only place accessible from browser
    └── index.php     ← initial file that launches the application

Υποτίθεται ότι ο κατάλογος www αποθηκεύει εικόνες, JavaScript, CSS και άλλα δημόσια διαθέσιμα αρχεία. Αυτός είναι ο μόνος κατάλογος που είναι άμεσα προσβάσιμος από το πρόγραμμα περιήγησης, οπότε μπορείτε να στρέψετε εδώ τον ριζικό κατάλογο του διακομιστή ιστού σας (μπορείτε να το ρυθμίσετε στον Apache, αλλά ας το κάνουμε αργότερα, καθώς δεν είναι σημαντικό αυτή τη στιγμή).

Ο πιο σημαντικός κατάλογος για εσάς είναι ο app/. Εκεί θα βρείτε το αρχείο Bootstrap.php, μέσα στο οποίο υπάρχει μια κλάση που φορτώνει το πλαίσιο και ρυθμίζει την εφαρμογή. Ενεργοποιεί το autoloading και ρυθμίζει τον αποσφαλματωτή και τις διαδρομές.

Καθαρισμός

Το Web Project περιέχει μια σελίδα καλωσορίσματος, την οποία μπορούμε να αφαιρέσουμε – μπορείτε να διαγράψετε το αρχείο app/UI/Home/default.latte και να το αντικαταστήσετε με το κείμενο “Hello world!”.

Tracy (αποσφαλματωτής)

Ένα εξαιρετικά σημαντικό εργαλείο για την ανάπτυξη είναι ένας αποσφαλματωτής που ονομάζεται Tracy. Δοκιμάστε να κάνετε κάποια λάθη στο αρχείο σας app/UI/Home/HomePresenter.php (π.χ. αφαιρέστε μια καμπύλη αγκύλη από τον ορισμό της κλάσης HomePresenter) και δείτε τι θα συμβεί. Θα εμφανιστεί μια σελίδα με κόκκινη οθόνη και μια κατανοητή περιγραφή του σφάλματος.

Το Tracy θα σας βοηθήσει σημαντικά κατά το κυνήγι των σφαλμάτων. Σημειώστε επίσης την αιωρούμενη μπάρα Tracy Bar στην κάτω δεξιά γωνία, η οποία σας ενημερώνει για σημαντικά δεδομένα εκτέλεσης.

Στη λειτουργία παραγωγής, το Tracy είναι, φυσικά, απενεργοποιημένο και δεν αποκαλύπτει καμία ευαίσθητη πληροφορία. Αντ' αυτού, όλα τα σφάλματα αποθηκεύονται στον κατάλογο log/. Απλά δοκιμάστε το. Στον κατάλογο app/Bootstrap.php, βρείτε το ακόλουθο κομμάτι κώδικα, ξεσχολιάστε τη γραμμή και αλλάξτε την παράμετρο κλήσης της μεθόδου σε false, έτσι ώστε να μοιάζει ως εξής:

...
$this->configurator->setDebugMode(false);
...

Μετά την ανανέωση της ιστοσελίδας, η σελίδα με την κόκκινη οθόνη θα αντικατασταθεί με το φιλικό προς τον χρήστη μήνυμα:

Τώρα, κοιτάξτε στον κατάλογο log/. Εκεί θα βρείτε το αρχείο καταγραφής σφαλμάτων (στο αρχείο exception.log), καθώς και τη σελίδα με το μήνυμα σφάλματος (αποθηκευμένη σε ένα αρχείο HTML με όνομα που αρχίζει με exception).

Σχολιάστε ξανά τη γραμμή // $configurator->setDebugMode(false);. Το Tracy ενεργοποιεί αυτόματα τη λειτουργία ανάπτυξης στο περιβάλλον localhost και την απενεργοποιεί αλλού.

Τώρα, μπορούμε να διορθώσουμε το σφάλμα και να συνεχίσουμε να σχεδιάζουμε την εφαρμογή μας.

Στείλτε ευχαριστίες

Θα σας δείξουμε ένα κόλπο που θα κάνει τους συγγραφείς ανοιχτού κώδικα ευτυχισμένους. Μπορείτε εύκολα να δώσετε ένα αστέρι στο GitHub στις βιβλιοθήκες που χρησιμοποιεί το έργο σας. Απλά εκτελέστε:

composer thanks

Δοκιμάστε το!