Penulisan perintah yang efektif
Tetap teratur dengan koleksi
Simpan dan kategorikan konten berdasarkan preferensi Anda.
Efektivitas blueprint aplikasi dan kualitas kode yang dihasilkan bergantung pada kejelasan dan detail dari perintah Anda. Saat menggunakan App Prototyping agent, pertimbangkan panduan berikut untuk perintah yang efektif saat membuat dan men-debug aplikasi:
- Berikan informasi yang spesifik: Tentukan dengan jelas fitur, interaksi pengguna, dan persyaratan data aplikasi Anda. Minta teknologi tertentu, jika memungkinkan. Misalnya, jika mencoba membuat aplikasi web dengan elemen 3D, Anda dapat meminta Gemini untuk menggunakan
three.js.
- Tanyakan tentang tugas tambahan untuk menyiapkan layanan: Gemini dapat menulis kode untuk aplikasi Anda, tetapi tidak dapat menyiapkan layanan, mengaktifkan API, atau menyediakan resource (seperti bucket Cloud Storage atau akun Stripe).
Jika meminta Gemini menulis kode untuk layanan tertentu, pastikan
juga Anda memintanya menyertakan cara menyiapkan layanan tersebut.
- Meminta project Firebase: Jika Anda meminta App Prototyping agent untuk
membantu Anda menyiapkan layanan Firebase, agen ini akan menyediakan project Firebase
atas nama Anda. Misalnya, Anda dapat meminta "Membantu saya menambahkan Firestore,", atau "Menghubungkan
aplikasi saya ke Firebase".
- Gunakan Gemini untuk meningkatkan kualitas perintah Anda: Gunakan Gemini untuk Google, chat dengan Gemini di Firebase dalam tampilan Code, atau platform Gemini lainnya untuk meningkatkan kualitas dan mengoptimalkan perintah Anda.
- Berikan konteks: Sertakan informasi latar belakang tentang tujuan aplikasi, target audiens, dan pengalaman pengguna yang Anda inginkan.
- Gunakan contoh: Jika memungkinkan, berikan contoh cara pengguna harus berinteraksi dengan aplikasi atau data yang harus ditampilkan.
- Lakukan iterasi dan tingkatkan kualitas: Jalankan pengembangan Anda secara iteratif. Pertimbangkan untuk memulai dengan permintaan dasar, lalu tambahkan fitur, uji, tingkatkan kualitasnya, kemudian tambahkan fitur yang lain.
Dengan mengikuti panduan ini, Anda dapat meningkatkan secara signifikan kualitas dan relevansi blueprint aplikasi yang dihasilkan oleh Firebase Studio dan keberhasilannya saat men-debug aplikasi Anda.
Menggunakan perintah tambahan untuk meningkatkan kualitas respons
Jika hasil awal tidak sesuai dengan yang diharapkan, Anda dapat meningkatkan kualitas perintah dengan menambahkan detail selengkapnya atau memberikan petunjuk spesifik:
- Tambahkan batasan: Tentukan batasan pada UI, model data, atau fitur.
- Berikan contoh: Berikan contoh cara pengguna harus berinteraksi dengan aplikasi dan data apa yang harus muncul.
- Gunakan kata kunci: Gunakan kata kunci untuk mendeskripsikan fitur atau kemampuan yang Anda inginkan agar LLM dapat mengaitkannya dengan class output yang Anda inginkan. Misalnya, Anda dapat menggunakan Desain Material dalam perintah yang menunjukkan bahwa Anda ingin aplikasi mematuhi standar desain Google.
- Minta perubahan yang spesifik: Minta perubahan yang spesifik pada kode atau blueprint yang dihasilkan. Tambahkan setiap permintaan fitur dalam permintaan terpisah.
- Minta model untuk bernalar: Jika Anda mengalami masalah saat mendapatkan hasil yang diinginkan, coba minta model untuk bernalar melalui perintah. Misalnya, Anda dapat mengucapkan "Berpikirlah secara berurutan. Saya ingin membuat kotak input untuk aplikasi tugas saya. Kotak input tersebut harus berisi tombol 'Tambahkan tugas' dan tombol 'Batal'".
Dengan teknik ini, Anda dapat secara iteratif meningkatkan kualitas perintah untuk mendapatkan hasil yang diinginkan.
Contoh perintah yang efektif untuk blueprint aplikasi
Berikut adalah beberapa contoh perintah yang efektif untuk berbagai jenis aplikasi:
Pelacak tugas sederhana:
Create a simple web app that displays a list of to-do items.
Users should be able to add new items to the list and mark items as complete.
Provide a way to delete items and export the list as a text file.
Use a clean and modern UI using Google Material Design principles.
Aplikasi pengelolaan anggaran:
A budgeting and expense tracking app with spending categories, charts, and
budget goals. Include a clean dashboard with key insights. It should include
spending categories, charts, and budget goals. The app should allow users to
manually add expenses or upload csv files. The app should also allow users to
upload receipts, then use AI to convert the receipt into an expense entry that
users can edit. Data should be stored in browser cache, with download and
delete options.
Perintah aplikasi game dengan bantuan dari Gemini (Markdown):
Generate a delightful sliding number puzzle game (15-puzzle) with Javascript,
HTML, and CSS.
- **Setup:** Create a 4x4 grid with numbers 1-15 and one empty space. Use a
**solvable shuffling algorithm** to randomize the start.
- **Gameplay:** Allow clicking tiles **adjacent to the empty space** to slide
them. Count and display the number of moves.
- **Timer:** Include a **countdown timer** starting at **120 seconds**
(2 minutes).
- **End Conditions:**
- If solved (numbers 1-15 in order): Alert with an encouraging winning
statement generated by AI.
- If timer reaches 0: Alert with a funny retort generated by AI.
Tips untuk proses debug
Anda dapat menggunakan Gemini di Firebase untuk membantu men-debug kode dengan chat di ruang kerja Code atau App Prototyping agent.
Meskipun Gemini dapat menulis kode untuk Anda, terkadang kode tersebut juga akan menghasilkan error. Setiap error yang terdeteksi akan melalui proses perbaikan. Jika menemui masalah dengan pesan error yang tidak dapat diselesaikan, Anda dapat mencoba beberapa teknik berikut:
Jelaskan masalah tersebut: Di antarmuka chat, jelaskan masalah yang Anda alami sejelas dan sesingkat mungkin.
Meskipun memiliki akses ke konteks seperti pesan error dan log, Gemini mungkin tidak memahami konteks lengkapnya. Menjelaskan perilaku beserta pesan error dapat membantu Gemini memperbaiki error lebih cepat.
Ajukan pertanyaan spesifik: Jangan ragu untuk mengajukan pertanyaan langsung ke Gemini tentang kode Anda. Misalnya, "Apa yang dapat menyebabkan pengecualian pointer null dalam fungsi ini?" atau "Bagaimana cara mencegah kondisi race ini?"
Uraikan masalah kompleks: Jika Anda menangani masalah yang kompleks, uraikan menjadi bagian-bagian yang lebih kecil dan lebih mudah dikelola. Minta Gemini untuk membantu Anda men-debug setiap bagian secara terpisah dan memikirkan masalah secara bertahap.
Gunakan pembatas kode: Saat membagikan cuplikan kode, gunakan pembatas kode untuk memastikan kode diformat dengan benar. Hal ini memudahkan Gemini untuk membaca dan memahami kode Anda.
Lakukan iterasi dan tingkatkan kualitas: Gemini mungkin tidak selalu memberikan solusi sempurna pada percobaan pertama. Tinjau respons, ajukan pertanyaan klarifikasi, dan berikan informasi tambahan sesuai kebutuhan.
Hindari loop perintah: Jika Gemini terjebak dalam loop atau tidak dapat menjawab pertanyaan Anda, coba susun ulang perintah atau berikan konteks tambahan. Terkadang, hanya dengan mengubah kata-kata pertanyaan, Gemini dapat memahami apa yang Anda tanyakan.
Jika menyusun ulang perintah tidak menyelesaikan loop, coba teknik berikut:
Mulai percakapan baru: Jika Anda menggunakan Gemini di chat Firebase di ruang kerja Code, mulai sesi percakapan baru untuk mereset konteks Gemini. Hal ini dapat membantu menghilangkan miskonsepsi atau asumsi yang mungkin dibuat oleh Gemini dalam percakapan sebelumnya.
Berikan contoh kontra: Jika Gemini membuat asumsi yang salah, berikan contoh kontra untuk membantunya memahami perilaku yang benar.
Langkah berikutnya
Kecuali dinyatakan lain, konten di halaman ini dilisensikan berdasarkan Lisensi Creative Commons Attribution 4.0, sedangkan contoh kode dilisensikan berdasarkan Lisensi Apache 2.0. Untuk mengetahui informasi selengkapnya, lihat Kebijakan Situs Google Developers. Java adalah merek dagang terdaftar dari Oracle dan/atau afiliasinya.
Terakhir diperbarui pada 2025-08-26 UTC.
[null,null,["Terakhir diperbarui pada 2025-08-26 UTC."],[],[],null,["The effectiveness of your app blueprint and the quality of the generated code\ndepend on the clarity and detail of your prompts. When using\nthe App Prototyping agent, consider the following guidelines for effective\nprompting when generating and debugging apps:\n\n- **Be specific:** Clearly define the features, user interactions, and data requirements of your app. Ask for specific technologies, where possible. For example, if trying to create a web app with 3D elements, you may want to ask Gemini to use `three.js`.\n- **Ask about additional tasks to set up services:** Gemini can write code for your app, but it cannot actually set up services, enable APIs, or provision resources (like a Cloud Storage bucket or a Stripe account). Make sure to tell Gemini that if it writes code for specific services that it should also tell you how to set up those services.\n- **Request a Firebase project:** If you ask the App Prototyping agent to help you set up Firebase services, it will provision a Firebase project on your behalf. For example, you can ask \"Help me add Firestore,\" or \"Connect my app to Firebase.\"\n- **Use Gemini to refine your prompt:** Use [Gemini for\n Google](https://gemini.google.com), [chat with\n Gemini in Firebase](/docs/studio/try-gemini) in Code view, or other Gemini surfaces to refine and optimize your prompt.\n- **Provide context:** Include background information about your app's purpose, target audience, and the user experience you want.\n- **Use examples:** If possible, provide examples of how users should interact with the app or what data should be displayed.\n- **Iterate and refine:** Approach your development *iteratively*. Consider starting with a basic request, then add a feature, test it, refine it, then add another feature.\n\nBy following these guidelines, you can significantly improve the quality and\nrelevance of the app blueprints generated by Firebase Studio and its\nsuccess when debugging your app.\n\nUse additional prompts to refine responses\n\nIf the initial results aren't what you expect, you can refine your prompts by\nadding more detail or providing specific instructions:\n\n- **Add constraints:** Specify constraints on the UI, data model, or features.\n- **Provide examples:** Provide examples of how users should interact with the app and what data should appear.\n- **Use keywords:** Use keywords to describe the features or capabilities you want that the LLM might associate with the class of output you want. For example, you might use *Material Design* in a prompt where you indicate that you want your app to adhere to Google design standards.\n- **Ask for specific changes:** Ask for specific changes to the generated code or blueprint. Add each feature request in a separate request.\n- **Ask the model to reason:** If you're having trouble getting the results you want, try asking the model to reason through the prompt. For example, you could say \"Think step by step. I want to create an input box for my task app. It should contain an 'Add task' button and a 'Cancel' button.\"\n\nBy using these techniques, you can iteratively refine your prompts to get the\nresults you want.\n\nExamples of effective prompts for app blueprints\n\nHere are some examples of effective prompts for different types of apps:\n\n**Simple task tracker:** \n\n Create a simple web app that displays a list of to-do items.\n Users should be able to add new items to the list and mark items as complete.\n Provide a way to delete items and export the list as a text file.\n Use a clean and modern UI using Google Material Design principles.\n\n**Budgeting app:** \n\n A budgeting and expense tracking app with spending categories, charts, and\n budget goals. Include a clean dashboard with key insights. It should include\n spending categories, charts, and budget goals. The app should allow users to\n manually add expenses or upload csv files. The app should also allow users to\n upload receipts, then use AI to convert the receipt into an expense entry that\n users can edit. Data should be stored in browser cache, with download and\n delete options.\n\n**Game app prompt with assistance from Gemini (Markdown):** \n\n Generate a delightful sliding number puzzle game (15-puzzle) with Javascript,\n HTML, and CSS.\n\n - **Setup:** Create a 4x4 grid with numbers 1-15 and one empty space. Use a\n **solvable shuffling algorithm** to randomize the start.\n - **Gameplay:** Allow clicking tiles **adjacent to the empty space** to slide\n them. Count and display the number of moves.\n - **Timer:** Include a **countdown timer** starting at **120 seconds**\n (2 minutes).\n - **End Conditions:**\n - If solved (numbers 1-15 in order): Alert with an encouraging winning\n statement generated by AI.\n - If timer reaches 0: Alert with a funny retort generated by AI.\n\nTips for debugging\n\nYou can use Gemini in Firebase to help you debug your code with\nchat in your **Code** workspace\nor the App Prototyping agent.\n\nWhile Gemini can write code for you, it might sometimes also\nproduce errors. When it detects an error, it will attempt\nto fix it. If you find that it isn't able to resolve the issue given\nthe error message, you can try some of the following techniques:\n\n- **Describe the issue:** In the chat interface, describe the\n problem you're encountering as clearly and concisely as possible.\n While Gemini might have access to context like error messages\n and logs, it might not understand the full context. Describing the behavior\n along with the error message can help Gemini fix errors\n faster.\n\n- **Ask specific questions:** Don't be afraid to ask Gemini\n direct questions about your code. For example, \"What could be causing a\n null pointer exception in this function?\" or \"How can I prevent\n this race condition?\"\n\n- **Break down complex problems:** If you're dealing with a complex\n issue, break it down into smaller, more manageable parts. Ask\n Gemini to help you debug each part separately and think\n through problems step-by-step.\n\n- **Use code fences:** When sharing code snippets, use code fences\n to ensure that the code is properly formatted. This makes it easier\n for Gemini to read and understand your code.\n\n- **Iterate and refine:** Gemini may not always provide the perfect\n solution on the first try. Review the responses, ask clarifying\n questions, and provide additional information as needed.\n\n- **Avoid prompting loops:** If Gemini gets stuck in a loop or is\n unable to answer your question, try rephrasing your prompt or\n providing additional context. Sometimes, just rewording your\n question can help Gemini understand what you're asking.\n\n If rephrasing your prompt doesn't resolve the loop, try\n the following techniques:\n - **Start a new chat:** If you're using Gemini in Firebase\n chat in your Code\n workspace, start a new chat session to reset\n Gemini's context. This can help break free from any\n misconceptions or assumptions that Gemini may have made\n in the previous conversation.\n\n - **Provide counter-examples:** If Gemini is making incorrect\n assumptions, provide counter-examples to help it understand\n the correct behavior.\n\nNext steps\n\n- [Get started with the App Prototyping agent](/docs/studio/get-started-ai).\n- [Develop, publish, and monitor an app following a guided tour of the App Prototyping agent](/docs/studio/solution-build-with-ai).\n- [Develop applications in a\n Firebase Studio workspace](/docs/studio/get-started-workspace)."]]
