借助ChatGPT,从0开始学一点前端
心血来潮,我打算从0开始,花几天时间,学一点前端知识。 所谓从0开始,其实也有些夸张。我对于前端有一点点了解(否则也不会突然想学这么一个玩意),包括: 前端是用来设计网站的。 前端由HTML,CSS,Javascript组成,其中Javascript是一种编程语言。 HTML大约长这样:<p class="paragraph">一段话</p> 打开chrome浏览器,右键点击网页,选择“检查”,能看到一些前端代码。 懂一些编程思路。 仅此而已。 我会通过向ChatGPT(gpt-4)提问的方式学习,我会把每一次与ChatGPT的对话都记录在blog上。 此外,我给本次学习增加一个限制:即,所有知识来源均仅从ChatGPT处获得,我将只点击ChatGPT给出的连接。 看看我们能走到哪一步吧 --- day1:基础知识 https://chat.openai.com/share/5d19094c-4527-41ef-8866-212e22eb2a0b 我询问的问题有: 什么是前端,什么是html。 html,css,javascript的格式是什么。 怎么在html中用css,怎么在html中用javascript。 day2:做一个计算器 https://chat.openai.com/share/89f34b72-0322-4f38-a67e-6499d868a4c5 我想要一个练手的项目,ChatGPT推荐我做一个网页版计算器。 我询问的问题有:合适的编码平台,如何添加按钮,如何添加按钮功能,如何批量定义按钮,如何计算一个字符串的结果,如何创建一个显示结果的窗口,如何使用css选择器,如何设置按钮样式(包括大小,边框,字符加粗,颜色),如何使用grid排列按钮,如何设置列宽比例,如何用css覆盖之前的样式,如何对结果四舍五入。 在ChatGPT的帮助下,我写出了一个可以正常使用的计算器所需的html,css和js文档。 这是我最终的结果: demo: https://blog.tennisatw.com/p/calculator.html ChatGPT在解决简单的问题上完全OK,虽然有...