一.邂逅软件开发
1.1 对于软件的认识
- 软件是什么?
- 软件就是application,我们日常手机上安装的qq,微信都是软件
- 一个完整的软件体系应该是什么样的?
- 服务器 (用后端语言,诸如java/node/python/php开发的能为各种客户端提供服务的电脑)
- 客户端:用户访问数据的各种终端,如,安卓端,iPhone端,ipad端,pc网页端,windows,mac上的客户端等等
- 一个完整的软件体系应该具备以上所说的所有
1.2 对于前端开发的认识
- 处于什么样的行业?
- who are you ?
- 前端开发工程师,软件 开发工程师
- 开发者,程序员,码农等
- developer,coder,programmer
- 前端开发的主要内容是什么?
1.3 疑惑解答:是否适合学习前端?
- 英文水平的要求?
- 学习前期,只要求会一些基本的词汇就可以,遇到不会的单词多用翻译软件翻译,学习,平时没事时多背单词,英语对于编程还是很重要的
- 是否要求是计算机专业?
- 并不要求,只要是会使用计算机就可以,当然是计算机专业就更好了
- 学习难度?
- 在软件开发的领域中算是简单的了,但是东西很多,很杂,技术更新速度也快,需要不断地学习
- 智商要求?
- 不管学习什么,智商都不是决定性因素,认真努力才是王道
- 行业发展前景?
二.对网页的认识
2.1 网页和网站的关系?
2.2 什么是网页?
- 上网浏览的页面
- 用户从网页上可以获取信息(类似新闻,报纸等)
2.3 怎样浏览网页?
2.4 前端工程师要做的工作?
- 在自己的电脑上进行网站的开发
- 将开发的出来的内容进行打包(webpack/gulp)
- 上传和部署 -> 服务器
- 用户通过浏览器 -> URL -> 下载资源 -> 浏览器解析
2.5 网页的组成?
- HTML:超文本标记语言,用来描述网页的基本结构和骨架
- CSS:层叠样式表,用于对网页样式的美化
- JavaScript:网页的交互处理
2.6 浏览器的内核?
- 浏览器最核心的部分就是渲染引擎,也就是浏览器的内核
- 负责解析网页语法,渲染显示网页
- 不同浏览器渲染规则不同,所以同一个网页在不同浏览器也会有不同的展现形式
2.7 常见的浏览器内核?
- trident: IE
- gecko: Firefox
- presto ->blink: Opera
- webkit -> Safari/Android/iOS(webview)
- blink -> Chrome
建议使用chrome浏览器
三.开发第一个网页
3.1 使用记事本开发第一个网页
<!doctype html>
<head>
<title>使用记事本开发第一个网页</title>
</head>
<body>
<h1>开始学习前端的内容</h1>
</body>
</html>
- 保存文件,更改后缀名为.html,在浏览器中预览效果
3.2 开发工具的选择 vscode
- 插件安装
- Chinese
- open in browser
- atom
- vscode-icons
- 设置
- 自动保存(延迟时间)
- 字体大小
- wrap 换行
- 空格渲染 -> 点
- tab -> 4/2
3.3 元素的使用
3.4 注释的使用
- 注释的定义
- 简单来说,注释就是一段代码说明,程序执行时会跳过,是给开发者阅读的
- html中注释是这样的:
<!--
注释内容
-->
- 注释的重要性
- 帮助我们理解代码的思路,方便以后查阅
- 与他人合作开发时,添加适当的注释可以节省沟通成本
- 开发自己的框架时,添加适当的注释,有利于别人的使用和学习(开源精神)
- 适当的注释有利于代码的调试
- 注意: