Prompt. Build. Ship.:: AI for Web Devs Build x3 Times Faster - страница 8

Шрифт
Интервал


That could be anything – short, long, simple, fancy, with different colors or fonts.

Context: Use Tailwind CSS, colors should pop like the Google logo, and include fields like name, email, and phone.

That gives the prompt more direction.

Exemplar: You might even upload an image of a form you like – so the AI knows what kind of style you’re going for.

So that’s how prompt architecture works – task, context, and exemplar.

Once you understand this structure, you can use it not only in coding but in many areas of your life where AI can help.





Exercise.

Prompting practice

This is a practice-style task.

For this module, you’ll have a small assignment: create a simple prompt using proper prompt architecture, and then test it in the four different generative AIs we've discussed.




The goal of this task is to help you understand how prompting works.

To make it easier, here’s a breakdown of the steps:

Create a simple prompt. It doesn’t have to be about coding, although coding-related prompts are preferred since this is a coding course.


Apply the 50-40-10 rule we covered earlier – that’s task, context, and exemplar.


Use this prompt in four different AIs: ChatGPT, Claude, DeepSeek, and Gemini. Try it out and compare the results.





The main goal here is to get comfortable with using AI.

Good luck!

Module 2.

Summary

Congratulations on completing Module Two!

In this lesson, you’ve learned some very important foundations, including how Generative AI works.





How to use popular general-purpose AIs like Claude, ChatGPT, and others.

You also discovered the four main ways to interact with AI: through text, audio, image, and video.




And last but not least, you learned about prompt architecture – how to structure prompts properly to get the best results for your project.




Once again, congratulations – and see you in the next module!


Module 3.

Gen AI in Coding Process

Hello and welcome to Module 3: Generative AI in the Coding Process.

Now the fun part begins because we’re diving into the coding zone! In Module 2, you covered the essential basics of using generative AI. But now, we’re going to get into the meat of it. In this module, we’ll start by discussing the role of generative AI in the web development process.




Then, we’ll take a look at the best aspects of AI and some of its limitations. Finally, a large portion of the module will be dedicated to an overview of the tools.