Πρόγραμμα επεξεργασίας HTML

Γράψτε τον κώδικά σας στις καρτέλες HTML, CSS και JavaScript, και η προεπισκόπηση δίπλα τους δείχνει τη σελίδα καθώς πληκτρολογείτε. Βγάλτε το τικ από την «Ενημέρωση κατά την πληκτρολόγηση» για να εκτελείται ο κώδικας μόνο όταν πατάτε «Εκτέλεση» ή Ctrl+Enter. Ο επεξεργαστής επισημαίνει τον κώδικα, κάνει εσοχή στις νέες γραμμές, κλείνει αγκύλες και ετικέτες και σημειώνει τα σφάλματα στο περιθώριο, ενώ η κονσόλα κάτω από την προεπισκόπηση δείχνει τι γράφει το σενάριό σας με console.log() και τα σφάλματα που προκαλεί, με τους αριθμούς γραμμής τους. Τα κουμπιά πάνω από την προεπισκόπηση δείχνουν τη σελίδα στο πλάτος ενός φορητού υπολογιστή, μιας ταμπλέτας ή ενός τηλεφώνου, και το κουμπί πλήρους οθόνης δίνει στον επεξεργαστή όλο το παράθυρο.

Η σελίδα σας εκτελείται σε ξεχωριστό, απομονωμένο πλαίσιο, έτσι τα στυλ και τα σενάριά της δεν μπορούν να αλλάξουν αυτόν τον ιστότοπο, και ο ιστότοπος δεν διαβάζει τον κώδικά σας. Ο κώδικας αποθηκεύεται στο πρόγραμμα περιήγησής σας καθώς πληκτρολογείτε και είναι ακόμη εκεί όταν ανοίξετε ξανά τον επεξεργαστή. Η «Αντιγραφή HTML» και η «Λήψη HTML» σας δίνουν όλη τη σελίδα ως ένα αρχείο HTML με τον κώδικα CSS και JavaScript μέσα, έτοιμο να ανοίξει σε πρόγραμμα περιήγησης ή να ανέβει στο διαδίκτυο, και το «Άνοιγμα αρχείου» φορτώνει ένα αρχείο HTML, CSS ή JavaScript στην καρτέλα του. Η «Φόρτωση του παραδείγματος» επαναφέρει τη σελίδα-δείγμα. Ο επεξεργαστής βασίζεται στο Ace, έναν επεξεργαστή κώδικα ανοιχτού κώδικα.