零基础也能轻松搞定!5分钟打造你的支付页面,Cursor助你一臂之力

零基础也能轻松搞定!5分钟打造你的支付页面,Cursor助你一臂之力

最近大家都在聊Cursor,我起初也只是把它当成一个简单的代码编辑器,觉得没什么特别的。结果我亲自试了一下,没想到不到五分钟就用自然语言搞出了一个支付页面(后面会详细分享制作过程)。这让我想起李彦宏提到的“人人都是开发者”的未来,真有可能实现吗?

01 Cursor是什么?

Cursor是一个集成了多个模型,如claude-3.5-sonnet和GPT-4的编辑器,国内用户可以直接使用。它支持多种编程语言,包括Python、Java、C#等,而且可以在多个平台上安装。它的功能非常多样,可以用来聊天、辅助编程和写作等,旨在更好地服务开发者。

零基础也能轻松搞定!5分钟打造你的支付页面,Cursor助你一臂之力

在LLM的支持下,Cursor有点像GitHub的Copilot或者百度的文心快码。它目前的主要特点包括:

1. 界面和功能都与vscode非常相似,深度集成了GPT等大模型,还能无缝融入IntelliJ IDEA、Visual Studio Code和GitHub等主流开发环境。

2. 体积小巧,启动迅速,提升编程效率。

现在,Cursor的母公司Anysphere的客户已经扩展到OpenAI、Midjourney、Perplexity等大牌公司,进一步证明了Cursor的价值和实用性。

零基础也能轻松搞定!5分钟打造你的支付页面,Cursor助你一臂之力

Cursor:全球开发者的宠儿,轻松创建支付页面

说到Cursor,它真是受到了全球开发者的热爱,评价也是一片好评。

Cursor

那么,关于价格呢?Cursor现在推出了三种订阅选择:

首先是免费模式(Hobby 计划):用户可以在前两周内免费体验,每月还能享有2000次代码补全、50个优先的高级请求,以及200次使用cursor-small模型的机会。

接下来是付费模式(Pro 计划):每月只需20美元,就能享受更多的GPT-4使用次数和无限的代码补全服务。

最后是企业专业模式(Business 计划):每月40美元,除了常规服务外,还有额外的数据保留等功能。

支付页面

02 用Cursor简单创建一个支付页面

想要创建支付页面?只需要按下快捷键`Ctrl + K`,唤醒Edit功能,然后输入:

# 创建一个简单的支付页面,内容包括姓名、手机号、支付方式以及支付金额,支付方式支持微信支付和支付宝支付,设计风格简洁而高级,参考乔布斯的风格。

轻松创建你的支付页面!

零基础也能轻松搞定!5分钟打造你的支付页面,Cursor助你一臂之力

只需简单几步,就能生成支付页面的代码哦:





    
    
    支付页面
    
        body {
            font-family: -apple-system, BlinkMacSystemFont, 'Helvetica Neue', Arial, sans-serif;
            display: flex;
            justify-content: center;
            align-items: center;
            height: 100vh;
            margin: 0;
            background-color: #f5f5f7;
            color: #1d1d1f;
        }

        .payment-form {
            background-color: white;
            padding: 40px;
            border-radius: 18px;
            box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
            width: 320px;
            display: flex;
            flex-direction: column;
            align-items: center;
        }

        h2 {
            font-size: 28px;
            font-weight: 600;
            margin-bottom: 30px;
            text-align: center;
        }

        form {
            width: 100%;
            display: flex;
            flex-direction: column;
            align-items: center;
        }

        input,
        select,
        button {
            display: block;
            width: 100%;
            margin-bottom: 20px;
            padding: 12px;
            border: none;
            border-radius: 8px;
            font-size: 16px;
            box-sizing: border-box;
        }

        input,
        select {
            background-color: #f5f5f7;
            -webkit-appearance: none;
            -moz-appearance: none;
            appearance: none;
        }

        select {
            background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23333' d='M10.293 3.293L6 7.586 1.707 3.293A1 1 0 00.293 4.707l5 5a1 1 0 001.414 0l5-5a1 1 0 10-1.414-1.414z'/%3E%3C/svg%3E");
            background-repeat: no-repeat;
            background-position: right 12px center;
            padding-right: 30px; 
        }

        button {
            background-color: #0071e3;
            color: white;
            cursor: pointer;
            font-weight: 600;
            transition: background-color 0.3s ease;
        }

        button:hover {
            background-color: #0077ed;
        }




    

支付

选择支付方式 微信支付 支付宝支付

效果真心不错,感觉比想象中要强,设计风格也很有品位,视觉效果很棒!

打造炫酷支付页面,简单又高效!

零基础也能轻松搞定!5分钟打造你的支付页面,Cursor助你一臂之力

零基础也能轻松搞定!5分钟打造你的支付页面,Cursor助你一臂之力

如果你觉得生成的效果还不错,那就可以在这个基础上进行一些调整和改进,甚至加点新功能哦!要是遇到不明白的代码,直接在聊天框里问就行。

零基础也能轻松搞定!5分钟打造你的支付页面,Cursor助你一臂之力

经过一番体验,发现这款工具的多种适应性真的很不错!它在自动补全代码、预测光标位置以及多行编辑等功能上都表现得相当出色,尤其是前端的能力,设计风格也挺有感觉。这里面整合了目前最强大的claude-3.5-sonnet,能免费试用Claude的体验真是太好了。还有更多强大的功能等着你去发掘!

Cursor 快捷键:

零基础也能轻松搞定!5分钟打造你的支付页面,Cursor助你一臂之力

温馨提示:在 Windows/Linux 系统上,请用 Ctrl 键来替代 ⌘ (Command) 键。

03 一家改变世界的公司

零基础也能轻松搞定!5分钟打造你的支付页面,Cursor助你一臂之力

在他们的博客中,透露了他们的雄心壮志:

未来几年,我们想要打造一款前所未有的 IDE。希望 Cursor 能成为让编程变得简单、愉快且有趣的工具。虽然路途漫长,但我们相信能实现这个目标。面临的挑战有很多,包括复杂的工程问题、技术难点以及聪明的产品思维。但是,成功是可能的,这在历史上还是第一次。如果我们做到了,将会重新定义编程的意义,帮助全世界的开发者关注更重要的事情。

为了实现这个愿景,我们正在组建一支由顶尖技术专家、研究人员和工程师组成的小团队。你将加入一个从中学时代就对编程充满热情的团队,大家都对工程和人工智能充满热忱。在这里,你会解决复杂的问题,享受一个充满活力的环境,拥有自主权去做你一生中最棒的工作。

这份创业精神将会在这里燃起,这正是创业公司的意义所在:怀揣着高远的梦想,脚踏实地地去实现。

最后,我想用乔布斯的话来致敬他们,以及向我们在创业路上的努力者们致敬:“他们用不同的视角看待世界,不拘泥于常规,不甘于现状。你可以赞扬或质疑他们,但永远无法忽视他们。”

最后但同样重要

Cursor 已经得到了全球众多开发者的认可,毫无疑问其能力出色,特别是对于刚入门的初学者来说非常友好。你可以通过自然语言来创建和优化代码。这其实在提醒我们,未来并不是说我们不再需要编写代码,也不是大家所担心的程序员会被 AI 替代,而是更需要加强我们的编程思维和基础知识,而不是单纯与代码较劲。

来源:今日头条
原文标题:不懂代码的人也可以用Cursor,5分钟快速完成一个简单的支付页面 – 今日头条
声明:
文章来自网络收集后经过ai改写发布,如不小心侵犯了您的权益,请联系本站删除,给您带来困扰,深表歉意!

发表评论