1. Terangkan perbezaan antara HTML, CSS dan JavaScript dalam pembangunan web
Jawapan: HTML ialah bahasa penanda yang digunakan untuk mencipta struktur dan pemformatan kandungan pada halaman web.
- CSS ialah bahasa penggayaan yang digunakan untuk menentukan rupa dan reka letak halaman web.
- JavaScript ialah bahasa pengaturcaraan yang digunakan untuk menambah interaktiviti dan memproses logik pada halaman web.
2. Bagaimanakah anda membuat tapak web responsif?
Jawapan: Untuk membuat tapak web responsif, kami menggunakan pertanyaan media dan teknik CSS seperti unit ukuran bendalir, sistem grid dan kotak fleksibel untuk menyesuaikan diri dengan saiz skrin yang berbeza. Kami juga menggunakan corak reka bentuk yang fleksibel, peleraian imej yang pelbagai dan tunjukkan/sembunyikan elemen berdasarkan saiz skrin.
3. Terangkan konsep box model dalam CSS.
Jawapan: Model kotak dalam CSS ialah model yang merangkumi komponen asas elemen: sempadan, jidar, padding dan kandungan. Setiap komponen membentuk "kotak" di sekeliling kandungan elemen dan mentakrifkan ruang dan kedudukan elemen pada halaman web.
4. Bagaimanakah anda bekerja dengan rangka kerja CSS seperti Bootstrap?
Jawapan: Untuk bekerja dengan rangka kerja CSS seperti Bootstrap, kami menyertakan fail CSS dan JavaScript rangka kerja dalam halaman web kami. Kami kemudiannya boleh menggunakan kelas dan elemen pratakrif yang disediakan oleh rangka kerja untuk mencipta antara muka dan mempercepatkan proses pembangunan.
5. Terangkan bagaimana AJAX berfungsi dalam menghantar dan menerima data daripada pelayan
Jawapan: AJAX(Asynchronous JavaScript and XML) membolehkan kami menghantar permintaan HTTP tak segerak dari halaman web dan menerima respons daripada pelayan tanpa memuatkan semula keseluruhan halaman. Kami menggunakan objek XMLHttpRequest JavaScript atau API pengambilan untuk membuat permintaan dan mengendalikan hasil yang diterima melalui kaedah seperti GET atau POST.
6. Terangkan penggunaan pertanyaan media dalam CSS untuk mencipta laman web responsif
Jawapan: Pertanyaan media dalam CSS membolehkan kami menggunakan peraturan CSS yang berbeza berdasarkan syarat seperti saiz skrin, peleraian dan orientasi peranti. Kami menggunakan pertanyaan media untuk menentukan syarat dan peraturan CSS yang sepadan yang akan digunakan apabila syarat tersebut dipenuhi.
7. Bagaimanakah anda mengoptimumkan masa muat halaman dan prestasi tapak web?
Jawapan: Untuk mengoptimumkan masa muat halaman dan prestasi tapak web, kami boleh mengambil beberapa langkah seperti:
- Optimumkan dan mampatkan fail CSS, JavaScript dan imej.
- Gunakan teknik caching untuk menyimpan sementara sumber dalam penyemak imbas.
- Kurangkan bilangan permintaan HTTP dengan menggabungkan fail dan menggunakan sprite imej
- Gunakan Rangkaian Penghantaran Kandungan(CDN) untuk mengagihkan beban tapak web.
- Optimumkan struktur HTML dan CSS untuk memastikan kod sumber yang cekap dan pengoptimuman untuk SEO.
8. Bagaimanakah anda mengendalikan acara dalam JavaScript? Terangkan penggunaan addEventListener
Jawapan: Untuk mengendalikan acara dalam JavaScript, kami menggunakan kaedah addEventListener() untuk melampirkan fungsi pengendali acara pada elemen HTML. Sebagai contoh:
const button = document.querySelector('#myButton');
button.addEventListener('click', function() {
// Event handling when the button is clicked
});
Kaedah addEventListener() membolehkan kami menentukan nama acara(cth, 'klik', 'mouseover') dan fungsi pengendali acara yang akan dilaksanakan apabila peristiwa itu berlaku.
9. Bagaimanakah anda mencipta kesan gerakan dan animasi menggunakan CSS dan JavaScript?
Jawapan: Untuk mencipta kesan gerakan dan animasi menggunakan CSS dan JavaScript, kita boleh menggunakan sifat CSS seperti peralihan, animasi dan transformasi untuk mengubah suai sifat visual sesuatu elemen. Kami juga boleh menggunakan JavaScript untuk mengawal sifat CSS dan mencetuskan kesan animasi berdasarkan peristiwa.
10. Terangkan konsep keserasian silang pelayar dan cara menangani isu ini dalam pembangunan web
Jawapan: Keserasian merentas pelayar ialah keupayaan tapak web untuk berfungsi secara konsisten dan boleh dipercayai merentas pelayar web yang berbeza. Untuk menangani isu ini, kami perlu menguji dan memastikan tapak web berfungsi dengan betul pada berbilang penyemak imbas. Kami juga perlu menggunakan teknik pembangunan web lanjutan, mematuhi piawaian web dan mengehadkan penggunaan ciri yang tidak disokong secara meluas oleh pelayar lama.
11. Bagaimanakah anda mencipta dan menggunakan komponen boleh guna semula dalam pembangunan Frontend?
Jawapan: Untuk mencipta dan menggunakan komponen boleh guna semula dalam pembangunan Frontend, kami sering menggunakan perpustakaan UI seperti React, Vue atau Angular. Kami membina komponen bebas dan kemudian menggunakannya dalam pelbagai bahagian antara muka pengguna. Ini meningkatkan modulariti dan kebolehgunaan semula kod, memudahkan pengurusan UI yang cekap.
12. Terangkan penggunaan tag semantik dalam HTML dan mengapa ia penting untuk SEO
Jawapan: Teg semantik dalam HTML, seperti <header>, <nav>, <section>, <article>, dan <footer>, digunakan untuk menentukan makna dan struktur elemen dalam halaman web. Mereka menjadikan kod sumber lebih mudah dibaca dan difahami serta memberikan maklumat penting kepada enjin carian. Teg semantik yang dilaksanakan dengan baik boleh meningkatkan kebolehcarian dan kedudukan tapak web dalam hasil carian.
13. Bagaimanakah anda mengoptimumkan SEO di laman web?
Jawapan: Untuk mengoptimumkan SEO di laman web, kami boleh mengambil beberapa langkah, termasuk:
- Mencipta tajuk meta yang menarik dan tepat yang merangkumi kata kunci yang berkaitan.
- Membuat huraian meta menarik yang menyediakan ringkasan kandungan halaman yang baik.
- Menggunakan tag tajuk yang sesuai(h1, h2, h3) untuk menyediakan struktur kandungan yang jelas.
- Mengoptimumkan imej dengan menggunakan atribut alt dan saiz yang sesuai.
- Mencipta pautan dalaman untuk meningkatkan kebolehtemuan dan kebolehrangkak.
- Mereka bentuk URL mesra pengguna dan kaya kata kunci.
- Menjana kandungan yang berkualiti dan relevan yang menyasarkan kata kunci yang dikehendaki.
14. Bagaimanakah anda mengendalikan dan mengesahkan data input pengguna dalam borang web?
Jawapan: Untuk mengendalikan dan mengesahkan data input pengguna dalam borang web, kami menggunakan teknik seperti JavaScript dan PHP. Di sisi pelanggan, kami menggunakan JavaScript untuk melaksanakan pengesahan data masa nyata secara langsung dalam penyemak imbas. Di bahagian pelayan, kami menggunakan PHP untuk memproses dan mengesahkan data sekali lagi untuk memastikan keselamatan dan kebolehpercayaan.
15. Terangkan penggunaan prapemproses CSS seperti SASS atau LESS dan faedahnya dalam pembangunan Frontend
Jawapan: Prapemproses CSS seperti SASS(Syntactically Awesome Stylesheets) atau LESS(Leaner CSS) ialah bahasa sambungan CSS yang menyediakan ciri dan utiliti berkuasa untuk menulis CSS. Mereka membenarkan kami menggunakan ungkapan, pembolehubah, sarang dan campuran untuk mencipta CSS yang lebih mudah dibaca, boleh diselenggara dan boleh digunakan semula. Menggunakan prapemproses CSS membantu mempercepatkan pembangunan dan mengurus CSS dengan berkesan dalam projek Frontend yang besar.