Differences
This shows you the differences between two versions of the page.
|
se:labs:08 [2025/11/24 21:37] ilie_cristian.sandu |
se:labs:08 [2025/11/24 22:23] (current) ilie_cristian.sandu [Introduction] |
||
|---|---|---|---|
| Line 352: | Line 352: | ||
| * **ChatGPT API**: A conversational AI API for natural language processing. | * **ChatGPT API**: A conversational AI API for natural language processing. | ||
| * **GitHub Copilot**: An AI coding assistant for accelerating development. | * **GitHub Copilot**: An AI coding assistant for accelerating development. | ||
| - | * **Additional AI and no-/low-code tools**: Services that help you quickly validate and implement startup ideas (e.g., idea validators, research assistants, landing page builders, and prototyping tools). | ||
| By the end of this lab, you will build a simple Next.js chat application, with UI components created using V0/Lovable and all of this logic implemented using Cursor (or other AI powered IDE). | By the end of this lab, you will build a simple Next.js chat application, with UI components created using V0/Lovable and all of this logic implemented using Cursor (or other AI powered IDE). | ||
| Line 577: | Line 576: | ||
| [[https://v0.dev/chat|V0]] is a visual development platform that enables rapid prototyping and development of user interfaces. It allows developers and designers to create UI components visually, reducing the need for manual coding of UI elements. | [[https://v0.dev/chat|V0]] is a visual development platform that enables rapid prototyping and development of user interfaces. It allows developers and designers to create UI components visually, reducing the need for manual coding of UI elements. | ||
| + | (similar tools: [[https://lovable.dev/|lovable]], [[https://bolt.new/|bolt.new]], [[https://replit.com/|Replit AI]]) | ||
| {{:se:labs:v0-1.png?700|V0}} | {{:se:labs:v0-1.png?700|V0}} | ||
| Line 625: | Line 625: | ||
| ====Overview==== | ====Overview==== | ||
| - | [[https://github.com/features/copilot|GitHub Copilot]] is an AI-powered code completion tool developed by GitHub in collaboration with OpenAI. It uses OpenAI's Codex model, which is trained on a vast dataset of public code repositories, to provide code suggestions and generate code snippets based on comments and existing code. | + | [[https://github.com/features/copilot|GitHub Copilot]] is an AI-powered code completion tool developed by GitHub in collaboration with OpenAI. It uses OpenAI's Codex model, which is trained on a vast dataset of public code repositories, to provide code suggestions and generate code snippets based on comments and existing code. Now copilot support multiple LLM's from OpenAI, Antropic or Google |
| {{:se:labs:ghcopilot-1.png?700|GitHub copilot}} | {{:se:labs:ghcopilot-1.png?700|GitHub copilot}} | ||
| Line 664: | Line 664: | ||
| =====Tasks===== | =====Tasks===== | ||
| - | - Download the generated project {{:se:labs:se-lab8-tasks.zip|se-lab8-tasks.zip}} (and run **//npm install//** and **//npm run dev//**) | + | - Download the generated project **se-lab8-tasks.zip** (run `npm install` and then `npm run dev`). |
| - | - Use **V0** to design the frontend of your chat application. | + | - Read the section **“Using Generative AI Effectively: How to Ask Good Questions”** from this lab. Then, interact with at least one generative AI tool (ChatGPT, Gemini, Claude, etc.) and: |
| - | - Implement the chat logic with help from **Cursor** / **V0** / **Chat GPT** or other tools. | + | * use it to refine the requirements and UX for your chat application, and |
| - | - Integrate the [[https://platform.openai.com/docs/api-reference/introduction|ChatGPT API]] to generate responses. | + | * use it to generate or improve a part of your work (e.g., code snippet, test, error message copy, or help text) |
| - | - Add a privacy policy/terms of service to your application using a **generative AI tool**. | + | - Use **V0** to design the frontend of your chat application: |
| - | - **Bonus**: Use AI generated images for your chatbot avatar. | + | * chat window |
| - | + | * message list | |
| - | <note tip> | + | * input field |
| - | Hint: | + | * send button |
| - | [[https://leonardo.ai/|Leonardo.AI]], [[https://openai.com/dall-e-2/|DALL-E]], [[https://stability.ai/stable-diffusion|Stable Diffusion]] | + | - Implement the chat logic of your application using **Cursor / V0 / ChatGPT / other tools**: |
| - | </note> | + | * you may use a simple local/mock backend or hardcoded responses, |
| + | * you are encouraged to use AI tools while coding, | ||
| + | * **you do NOT have to integrate any external API (e.g., ChatGPT API) in your project.** | ||
| + | - Add a **Privacy Policy / Terms of Service** section to your application using a generative AI tool. | ||
| + | * Clearly prompt the AI with the context of your app (what it does, what data it handles). | ||
| + | * Adapt the generated text to your project if needed. | ||
| + | - **Bonus (optional):** Use AI-generated images (Leonardo.AI, DALL·E, Stable Diffusion, etc.) for your chatbot avatar or UI elements. | ||
