Πώς να δημιουργήσετε φοβερές προτροπές ChatGPT;
Πριν ξεκινήσετε να χρησιμοποιείτε το εργαλείο AI, υπάρχουν μερικές βέλτιστες πρακτικές που ισχύουν όταν κάνετε ερωτήσεις στο ChatGPT:
- Να είστε συγκεκριμένοι,
- Παροχή πλαισίου,
- Χρησιμοποιήστε παιχνίδι ρόλων,
- Χρησιμοποιήστε διπλά εισαγωγικά,
- Δώστε παραδείγματα,
Ακολουθώντας αυτές τις συμβουλές, μπορείτε να διασφαλίσετε ότι χρησιμοποιείτε το bot όσο το δυνατόν πιο αποτελεσματικά.
Τι υπάρχει μέσα:
- Προτροπές αρχιτεκτονικής ανάπτυξης ιστού
- Προτροπές HTML και Markdown
- Προτροπές CSS
- Προτροπές JavaScript
- Προτροπές ασφαλείας
- Ενδείξεις εντοπισμού σφαλμάτων κώδικα & βελτιστοποίησης
Ας εξερευνήσουμε τη μεταμορφωτική δύναμη των προτροπών ChatGPT στην ανάπτυξη ιστοσελίδων και όχι μόνο!
Προτροπές αρχιτεκτονικής ανάπτυξης ιστού
Χρησιμοποιώντας το ChatGPT μπορείτε να δημιουργήσετε μια ισχυρή δομή για το έργο σας στο διαδίκτυο. Χρησιμοποιήστε τις παρακάτω προτροπές και τροποποιήστε τις με τις προδιαγραφές του έργου σας.
- Ανάπτυξη αρχιτεκτονικής και κώδικα για έναν ιστότοπο για Javascript
- Ενεργεί ως προγραμματιστής λογισμικού. Δημιουργήστε μια αρχιτεκτονική και έναν κώδικα για την ανάπτυξη ενός δικτυακού τόπου [δικηγόρου] με δυνατότητες προγραμματισμού χρησιμοποιώντας HTML.
- Φτιάχνω έναν ιστότοπο για μια μικρή επιχείρηση που πουλάει χειροποίητα σαπούνια. Δώστε ιδέες σχετικά με τον τρόπο δόμησης της ιστοσελίδας με τη χρήση του WordPress.
- Ανάπτυξη αρχιτεκτονικής και κώδικα για ένα διαδικτυακό εργαλείο διαχείρισης έργων που επιτρέπει στους χρήστες να συνεργάζονται σε εργασίες και έργα.
- Μπορείτε να προτείνετε κάποιες βιβλιοθήκες ή πλαίσια για την ανάπτυξη [συγκεκριμένος τύπος εφαρμογής];
Προτροπές HTML και Markdown
Η HTML είναι το πρώτο βήμα για να μάθετε να γίνεστε προγραμματιστής. Με το ChatGPT, αυτό το βήμα μπορεί να γίνει ακόμα πιο εύκολο. Ελέγξτε τις παρακάτω οδηγίες.
- Σε έναν πίνακα, απαριθμήστε τις συντομεύσεις για [HTML/ VS Code/React/Python] χρησιμοποιώντας μια συσκευή Apple ή Windows.
- Γράψτε ένα cheat sheet για τη μορφοποίηση markdown
- Γράψτε έναν κώδικα HTML για μια φόρμα που συλλέγει το όνομα, το email και τον αριθμό τηλεφώνου ενός χρήστη.
- Γράψτε ένα έγγραφο Markdown που περιλαμβάνει επικεφαλίδες, παραγράφους, σημεία με κουκκίδες και έναν υπερσύνδεσμο.
- Κάντε τον ακόλουθο κώδικα γκαλερί εικόνων ευέλικτο σε HTML
- Μπορείτε να παρέχετε ένα απόσπασμα κώδικα HTML που δημιουργεί ένα κουμπί με εφέ αιώρησης και έναν σύνδεσμο προς την ακόλουθη σελίδα [insert URL]
- Ενεργήστε ως προγραμματιστής ιστοσελίδων. Δημιουργήστε ένα πλέγμα [αριθμός] επί [αριθμός] από divs HTML με φόντο [χρώμα].
Προτροπές CSS
Όπως και με την HTML, αξιοποιώντας τις δυνατότητες επεξεργασίας φυσικής γλώσσας της πλατφόρμας, μπορείτε να εργάζεστε με CSS πιο γρήγορα από ποτέ. Μπορείτε να βρείτε παραδείγματα κώδικα CSS, να τα αναλύσετε και να βελτιώσετε τις δεξιότητές σας.
- Θέλω να εφαρμόσω μια γραμμή πλοήγησης στον ιστότοπό μου. Μπορείτε να δώσετε ένα παράδειγμα χρησιμοποιώντας CSS και Javascript;
- Λίστα συμβατότητας προγράμματος περιήγησης ιστού για CSS Grid.
- Δώστε ένα demo κώδικα χρησιμοποιώντας το Flexbox.
- Δείξτε μου πώς μπορώ να δημιουργήσω ένα responsive μενού χρησιμοποιώντας μόνο CSS;
- Δείξτε μου πώς μπορώ να δημιουργήσω ένα διαβαθμισμένο φόντο χρησιμοποιώντας CSS;
- Δείξτε μου πώς να δημιουργήσω ένα animation CSS για ένα κουμπί όταν περνάει από πάνω του.
- Ενεργήστε ως προγραμματιστής ιστοσελίδων. Γράψτε κώδικα HTML και CSS για [συγκεκριμένο τύπο ιστοσελίδας], με [συγκεκριμένα χαρακτηριστικά].
- Προτείνετε ένα πλαίσιο CSS για [συγκεκριμένο έργο].
Προτροπές JavaScript
Αν χρησιμοποιείτε Javascript, μπορείτε να ζητήσετε από το ChatGPT να δημιουργήσει κώδικα για μια συγκεκριμένη λειτουργία ή να λύσει ένα συγκεκριμένο σφάλμα στον κώδικά σας. Ελέγξτε τις παρακάτω προτροπές και προσαρμόστε τις στις ανάγκες σας.
- Παρακαλώ συνεχίστε να γράφετε αυτόν τον κώδικα για Javascript
- Ενεργήστε ως προγραμματιστής JavaScript, γράψτε ένα πρόγραμμα που ελέγχει τις πληροφορίες σε μια φόρμα. Το όνομα και ο αριθμός τηλεφώνου απαιτούνται, αλλά η διεύθυνση ηλεκτρονικού ταχυδρομείου και η ηλικία όχι.
- Εντοπίστε διαρροές μνήμης στον ακόλουθο κώδικα JavaScript
- Αλλάξτε από [React] σε [Vuejs] τον ακόλουθο κώδικα:
- Αναπτύξτε μια εφαρμογή JavaScript που ανακτά δεδομένα από ένα δημόσιο API και τα εμφανίζει σε μια ιστοσελίδα.
Προτροπές ασφαλείας
Η διασφάλιση της ασφάλειας της εφαρμογής σας είναι ένα εξαιρετικά σημαντικό βήμα στην ανάπτυξή σας. Δείτε πώς μπορεί να σας βοηθήσει η ChatGPT.
- Ανακαλύψτε το ελάττωμα ασφαλείας σε αυτό το απόσπασμα κώδικα από ένα πακέτο ανοικτού κώδικα npm
- Δείξτε μου βήμα προς βήμα πώς μπορώ να εφαρμόσω το HTTPS στον ιστότοπό μου
- Δείξτε μου πώς μπορώ να εφαρμόσω το 2FA στον ιστότοπό μου
- Ως ειδικός σε θέματα ασφάλειας στον κυβερνοχώρο. Θα σας δοθούν συγκεκριμένες λεπτομέρειες σχετικά με τον τρόπο αποθήκευσης και διαμοιρασμού των δεδομένων και το καθήκον σας θα είναι να προτείνετε κατάλληλα μέτρα για την ασφάλεια των δεδομένων αυτών από κακόβουλους παράγοντες. Αυτό μπορεί να περιλαμβάνει τη σύσταση [insert].
- Γράψτε μια ασφαλή [γλωσσική] συνάρτηση ή ενότητα που εκτελεί [συγκεκριμένη εργασία ή λειτουργία], αποτρέποντας παράλληλα [απειλή ή ευπάθεια ασφαλείας].
Ενδείξεις εντοπισμού σφαλμάτων κώδικα & βελτιστοποίησης
Η διασφάλιση της ασφάλειας της εφαρμογής σας είναι ένα εξαιρετικά σημαντικό βήμα στην ανάπτυξή σας. Δείτε πώς μπορεί να σας βοηθήσει η ChatGPT.
- Προτείνετε τρόπους βελτιστοποίησης της ακόλουθης συνάρτησης
- Ο παραπάνω κώδικας δεν εκτελείται. Μπορείτε να μου πείτε ποιο μπορεί να είναι το πρόβλημα;
- Λειτουργήστε ως ανώτερος προγραμματιστής ιστοσελίδων. Θα μπορούσατε να αναδιαμορφώσετε τον ακόλουθο κώδικα
- Θα μπορούσατε να μου πείτε κάποιες περιπτώσεις δοκιμών για να ελέγξω τον παραπάνω κώδικα;
- Γράψτε μια ασφαλή [γλωσσική] συνάρτηση ή ενότητα που εκτελεί [συγκεκριμένη εργασία ή λειτουργία], αποτρέποντας παράλληλα [απειλή ή ευπάθεια ασφαλείας].
GR 
EN