Apa alur kerja yang disarankan untuk belajar HTML5? Alat apa yang harus saya instal? SDK apa? Mulai dari mana? Bagaimana cara menguji? Bagaimana cara debug? Apa yang saya baca?
Saya mengerti bahwa apa yang sering disebut sebagai "pengembangan HTML5" sebenarnya merupakan campuran dari HTML, CSS, JS dan banyak lagi, namun saya tidak percaya bahwa proyek yang lebih besar dikembangkan di Notepad. Itulah mengapa saya meminta Anda untuk mengungkapkan tips dan trik tentang alur kerja Anda.
<html>Hi</html>membantu Anda memulai karena Anda tidak memerlukan DOCTYPE. Ulangi.Jawaban:
Jika saya memulai proyek HTML5 baru dari awal sekarang saya mungkin akan melakukan sesuatu seperti ini:
Unduh dan gunakan HTML5 Boilerplate . Ini akan memberi Anda halaman baru dengan sebagian besar hal-hal penting diinisialisasi dan siap untuk diuji. Juga termasuk beberapa fitur debug bagus yang harus Anda gunakan bersama dengan pembakar
Lihat di Menyelam ke HTML5 untuk melihat riwayat dan penggunaan kode.
Di mac saya, saya menggunakan Coda, dan di tempat kerja saya menggunakan Dreamweaver dalam tampilan kode. Mereka tidak akan membangun halaman untuk Anda, tetapi penyelesaian kode, petunjuk dan kode warna berfungsi dengan baik. Saya yakin Aptana dan sejenisnya menawarkan fitur-fitur hebat, tetapi saya selalu menemukan lebih sederhana untuk menjadi lebih baik ketika datang ke html.
Defintiely mengambil buku HTML5 dan CSS3 dari "A Book Apart" (CSS3 keluar akhir bulan ini)
Dan akhirnya - untuk mencoba dan mencari tahu semuanya ini:
Jaringan Pengembang Opera - http://dev.opera.com/articles/view/html-5-canvas-the-basics/
Canvas Cheat Sheet - http://blog.nihilogic.dk/2009/02/html5-canvas-cheat-sheet.html
Cara menggambar dengan HTML5 Canvas http://thinkvitamin.com/code/how-to-draw-with-html-5-canvas/
sumber
HTML5 bukan satu hal yang terintegrasi. Ini adalah kumpulan ekstensi ke HTML, beberapa di antaranya diimplementasikan secara luas dan dapat digunakan dengan aman, beberapa di antaranya belum ada yang mengimplementasikan, dan banyak di antaranya. Jika Anda mencoba memperlakukan HTML5 sebagai platform pengembangan tunggal yang koheren dan 'pelajari semuanya', Anda akan mengalami kesulitan.
Sebaliknya yang perlu Anda pelajari adalah web secara keseluruhan: HTML dasar, CSS, JavaScript, Core DOM, HTML DOM, Model Objek Browser dasar. Kemudian Anda dapat menambahkan fitur-fitur dari Web Baru sebagai dan di mana Anda membutuhkannya, dan dukungan browser memungkinkan: ekstensi HTML5, properti CSS3, gambar kanvas, soket web, ekstensi DOM dan BOM lainnya yang dipisahkan dari pekerjaan HTML5 ...
Rangkaian fitur web terus berkembang dan tidak ada satu titik referensi pun. W3Schools (yang tidak ada hubungannya dengan W3C secara tidak sengaja) mencoba, tetapi penuh dengan kesalahan. Jangan percaya apa yang dikatakannya sebagai Injil.
Anda mungkin perlu merujuk ke HTML4 definitif , CSS2 . DOM Core dan DOM HTML untuk memastikan. Anda mungkin juga ingin melihat referensi DOM MDC dan referensi DOM MSDN untuk apa yang didukung oleh Firefox dan IE. Spesifikasi HTML5 mengandung lebih banyak hal-hal DOM juga, serta ekstensi HTML baru, tetapi itu adalah dokumen yang panjang dan berat, cukup sulit untuk digunakan bahkan oleh standar dokumen standar. Meskipun tidak seburuk spesifikasi ECMAScript yang tidak bisa ditembus . (Untungnya Anda mungkin sudah terbiasa dengan banyak hal itu jika Anda sudah terbiasa bekerja dengan ActionScript.)
Anda tidak memerlukan SDK atau IDE untuk mengembangkan HTML / CSS / JS. Anda dapat menggunakan IDE jika mau, tetapi saya cukup senang melakukan semuanya di editor teks favorit saya. Tidak ada langkah-langkah membangun / kompilasi yang perlu dikhawatirkan, Anda cukup menyimpan file dan menekan reload, pekerjaan selesai. Sebagian besar browser web modern memiliki debugger dan alat pengembangan lainnya baik yang ada di dalamnya (misalnya IE8) atau tersedia sebagai ekstensi (misalnya Firebug ).
sumber
Saya sangat merekomendasikan WebStorm , dari JetBrains (atau produk berbasis IntelliJ mereka , seperti PHPStorm, RubyMine, PyCharm karena semuanya mendukung HTML). Anda mendapatkan CSS, pelengkapan otomatis HTML, dan langsung (saat Anda mengetik) memeriksa kebenarannya. Dukungan refactoring untuk Javascript (sesuatu yang belum pernah saya lihat di tempat lain), dan bahkan kemampuan untuk men-debug Javascript di IDE (jika Firebug atau alat Pengembang Chrome kurang untuk Anda). Ini memiliki dukungan proyek serta dukungan SVN, Git, Perforce dan CVS. Dan banyak fitur lainnya, sangat dianjurkan ...
sumber
Beberapa alat yang tak ternilai
Alat-alat itu sebagian besar untuk debugging Javascript dan untuk mencari tahu tentang penentuan posisi elemen dan gaya CSS yang diterapkan.
sumber
Jika Anda mencari rekomendasi IDE, Eclipse cukup bagus. Jika Anda mencari alat Javascript, Firebug sangat bagus untuk debugging.
Namun, Anda benar-benar tidak memerlukan "alat". Saya pikir gagasan bahwa "proyek yang lebih besar tidak dapat / tidak dikembangkan di Notepad", cukup sederhana, salah. Saya menggunakan Notepad ++ untuk menulis semua HTML / CSS / Javascript saya dan saya pikir ini adalah pendekatan yang sangat umum - bahkan untuk desainer web profesional. Notepad ++ memiliki penyorotan sintaks untuk HTML, CSS, dan Javascript, serta penyelesaian otomatis. Jika Anda menginginkan perangkat lunak yang menawarkan lebih dari itu, harap spesifik di mana fitur penting bagi Anda. (BTW, jika Anda pengguna mac, coba BBEdit).
Situs yang lebih besar sering ditulis dengan kerangka kerja seperti Django atau Ruby on Rails, tetapi itu benar-benar tidak ada hubungannya dengan menggunakan atau mempelajari HTML5.
sumber
Saya percaya Adobe (pembuat Flash) sebenarnya sedang dalam proses merilis alat konversi Flash ke HTML5, yang mungkin bernilai saat Anda melihat ke dalam.
http://news.softpedia.com/news/Adobe-Showcases-Flash-to-HTML5-Converter-163709.shtml
Secara efektif, Flash menjadi alat untuk mengembangkan HTML5.
Dan pada minggu ini, Microsoft telah mengumumkan bahwa mereka akan menuju arah yang sama dengan Silverlight, jadi sepertinya semuanya berjalan HTML5 sekarang.
Satu pertanyaan yang saya miliki adalah seberapa bagus kode HTML5 yang dihasilkan oleh dua alat ini? Kami tidak akan tahu jawabannya sampai mereka benar-benar dirilis, tetapi saya tidak pernah menemukan kode yang dihasilkan sangat berkualitas. Semoga kita tidak berakhir dengan MS Front Page yang modern.
sumber
Saya sangat merekomendasikan pengaturan sistem build untuk kode Javascript Anda, dan memeriksanya terhadap JSLint setiap build. Saya telah menemukan ini mengambil banyak kesalahan sejak awal dan mempromosikan pengkodean yang baik (bermain dengan opsi jika terlalu ketat). Lihatlah sistem build jQuery di GitHub untuk contoh yang baik.
Selain itu untuk mengedit saya penggemar berat Notepad ++ karena saya belum menemukan IDE yang menyediakan fitur berguna tanpa seluruh beban mengasapi dan tipu daya GUI.
Anda bisa melihat Dreamweaver terbaru, editor kode tidak buruk dan mereka memiliki galeri widget dengan sejumlah widget HTML5 yang bisa Anda singgahi.
sumber
Anda salah di sana. Saya adalah pengguna Notepad lama, dan saya pikir itu cara terbaik untuk pergi. Untuk debugging, saya menggunakan Alat Pengembang IE, FireBug Firefox, dan Inspektur Chrome.
Sejauh HTML5 berjalan, itu pada dasarnya hanya HTML biasa dengan beberapa mainan tambahan. Selain itu, tidak ada yang menghentikan Anda dari mendeklarasikan dokumen HTML5, maka hanya menggunakan hal-hal yang ada dalam versi HTML yang lebih lama.
Satu hal yang saya sarankan untuk dihindari adalah program seperti Dreamweaver. Mereka membuat segalanya terlihat mudah dengan alat desain grafis, tetapi ketika Anda ingin melakukan hal-hal Anda sendiri itu menjadi sangat sulit. (Saya melihat siswa lain di kursus yang saya lakukan ketika saya mengatakan ini)
sumber