Newbie, can't code, how to make aMini ProgramsWoolen cloth?
Don't be afraid, today, I'll use cursor and coze, complete hands-on, complete a simple praise division applet, the effect is as follows.
Register for the applet and download the development tools
WeChat public platform URL: https://mp.weixin.qq.com/, point immediately register.
Select the applet.
Go to Registration.
The remaining steps are, well, typical registration steps, just fill them out truthfully.
After registration, log in to the small program, find the development and services - development management, we need to save the AppID first. It will be needed when you associate it later.
Then, again, in this menu, going down, there's a server domain.
Put https://api.coze.cn填入request合法域名里 and put wss://api.coze.co.uk in the socket legal domain.
Next, we also need to install the applet development tools for easy development, preview, and debugging.
Installation, cursor registration and unlimited use
Open the official website, https://www.cursor.com.
Click on download either in the center or in the upper right corner.
Once downloaded, just install it.
Then, it's time to register.
Tap sign in in the upper right corner.
If you have a gmail account or a github account, you can log in directly, if you don't, just register and log in.
Generating API access tokens
coze URL, https://www.coze.cn/, register if you haven't.
Generating tokens is the key to accessing the API interface.
What is a token? It's the equivalent of a key, just like a key that opens a specific door lock, in this case, it means that the API token allows the applet to access specific API functions or data without the need for a username and password, which is equivalent to authorization to use it within the applet I'm developing.
Once you're on the homepage, select this Sugarloaf icon on the left, find Authorization, and click Add New Token.
Check the box, Messages, Knowledge Base Management, select Personal Space, and tap OK.
Next! Note that you need to take this token, click on the right side, copy it, and save it for later use in development.
Developing Intelligent Bodies
Tap the + sign on the left to create a smartbody.
Then, fill in the name and description.
Then, it goes to this page, which is the window for developing intelligences.
In the section on persona and reply logic, I'll enter the content of the instructions.
This cue word is as follows.
When the workplace worker in the writing society is facing the double pressure of work and life, he/she/they need others' praise and encouragement very urgently, and you have to write complimentary statements according to what he/she/they input to make the person being complimented happy.
##Constrains.
-Prohibit the use of all negative words
-Prohibit the use of hyperbole
-Prohibit compliments from being taken out of context of user inputs
##Skills.
1. Observational: Exercise your powers of observation by noticing behaviors, strengths, efforts, or accomplishments of others, which will provide you with specifics for compliments.
2. Empathy: Developing empathy allows you to better understand the emotions and experiences of others, thus making your compliments more relevant and deeper.
3. Sincerity: Make sure your compliments come from the heart, sincere compliments are more likely to be accepted and produce positive results.
4. Moderation: learn to master the proportion of praise, avoid excessive or insufficient, so that your praise is both appropriate and touching.
5. Expression ability: Improve your language expression ability, choose the right words and expressions to make your praise more vivid and touching.
6. Listening skills: Listening to better understand the other person's needs and emotions will help you provide more personalized and appropriate compliments.
7. Cultural sensitivity: Understanding the communication habits and sensitivities of different cultures will help your compliments to be properly understood and accepted in different cultural environments.
##Workflows.
1. Guide users to enter content
2. Generate compliments based on user inputs
##Initialization: As a [Role], always remember to complete [Goals], strictly follow [Constraints], and talk to the user in the order of [Workflows].
On the right side, you can directly enter information for debugging. For example, I said I woke up overtime today, haha, and it started to quack~
Once the test is OK, click Publish in the upper right corner.
Then, check the following boxes, making sure to check API.
After posting, take this string of numbers behind bot in the address bar and save it, you will need to fill it in later.
Development of small programs
It's time for a critical step. See how to develop without knocking a single line of code.
Big Step 1: Start with applet initialization
Open the WeChat small program development tool, WeChat swipe to log in a little.
Tap this + sign.
Follow, as shown in the configuration, AppID write the one we just recorded when we registered the applet, and then, do not apply the cloud service, do not use the template.
Wait for a while, the following interface appears, which means it is successful.
The 2nd major step in assisting development with cursor Open cursor and open the praetorian catalog you just had.
In the directory, create a new fileinstruction.mdThis is mostly an introduction to the project, telling the cursor what we want it to do. Write the following in the file.
1. This is a small program development system
2. your role is a ui designer, it must be aesthetically pleasing, I prefer the style and style of element-ui
3. The applet has been initialized using the official script, you just need to implement the next function. This is done in the page directory
4. The function is as follows: There are three pieces of content on the home page: a text input box, a submit button, and a display area. Among them, the input box and the button are together, and the display area is below. The layout should be reasonable and in line with the user experience. There should be a certain distance from the top.
5. When the button is clicked, the content of the text input box is displayed in the display area.
Then, ctrl+i, open the composer panel and type the following:Please generate specific code based on the contents of the instrction.md document, and then, it will start brushing up the code.
Next, let's go back to the WeChat developer tools to preview the results.
It was found to be so.
I think the style is a bit ugly for a mobile experience, so I'll tweak it a bit more.
I think this input box and button, to be exclusive to one line and they should be aligned, the button color becomes #f49898.
Then it started to modify.
After another round of questions, into the following satisfactory results, click submit, the following area is temporarily the content of the input box inside ~
Yes, for now.
Related coze APIs
Now the static page is good, but how to call the smart body application we made in coze.
We tell cursor what we think and what the interface looks like.
Now click on the button to call the coze api, the documentation for the coze api instructions is: '''curl -location -request POST 'https://api.coze.cn/open_api/v2/chat' \
-header 'Authorization: Bearer {{Personal_Access_Token}}' \
-header 'Content-Type: application/json' \
-header 'Accept: */*' \
-header 'Host: api.coze.cn' \
-header 'Connection: keep-alive' \
-data-raw '{
"conversation_id": "123",
"bot_id": "{{Bot_Id}}",
"user": "29032201862555",
"query": "hello",
"stream":false
}'
'''
Then the modifications will begin.
Next, it will ask for the botId and token token, which we saved above.
If the interface reports an error and doesn't display properly, send it the returned information and the data structure you want.
Then, this is how the final applet will look like!
Isn't that pretty good? Then it's time to publish, get on the version, and wait for review.
OK, this is the whole cursor and coze with one line of code did not write, do out of the small program. Of course, this is just a simple example, the specific development, according to the demand to ~
Above. That's it for today's post, thanks for dropping by and I hope it's inspired you~