大白话前端基础--反正很浓缩的新手网站

#仅此纪念自己的爬坑之路,有任何的不足之主,我也没办法.大佬的指南引发的一场学习,然后通过指南找到了mozilla的相关文档,一下内容,是自己对文档的概括和自己补漏.

热身运动

作为一位崭新出厂的小白,肯定是需要新手装备

• 计算机:Windows啊 Linux啊 MAC啊 台式机啊 笔记本啊 都行,现在前端都选MAC,吧,所以,我选择在我的windows上装了MAC系统,emmm.
• 文本编辑器:用来写代码也是相当的多了,大佬直接用Notepad++写的你敢信,所以我选择 Visual Studio Code,默默的当一个新人.
• Web浏览器:测试代码.理论上你应该把主流的都装上,但是还是Chrome和Firefox.
• 图像编辑器:用来编辑网页中的图形图像.像 GIMP、Paint.NET、Photoshop 或者 XD.
• 版本控制系统: Git，同时 GitHub 以及 GitLab,也可以是Gitee.
• FTP工具:老式 Web 托管账户用来管理服务器上文件Cyberduck、Fetch 和 FileZilla.
• 自动化构建工具:用来自动完成压缩代码和运行测试等重复性任务，比如 Grunt 或 Gulp。
• 模板\库\框架等等等等,当然都是高阶时候用.

新手主要先弄个文本编辑器,Web浏览器.

网站

一个网站由哪些组成呢?
HTML,额外附加CSS,JavaScript等等等等等

tip:构建站点时要确保文件夹结构组织合理,文件之间交互畅通,没有明显的错误.

网站的蕴藏方式:应将所有相关文件放在一个单独的文件夹中,映射出站点文件结构.
1.创建一个web-projects文件夹,所有网站项目都存放一处.
2.再在web-projects里创建一个文件夹test-site,存放第一个网站.

tip:Web服务器对于大小写极为敏感,说一就是一,不一样就是不一样.浏览器\Web服务器和编程语言处理空格的方式是不一样的,数据在运行中,结果会变成不同.总结下来,一开始就养成习惯,文件夹和文件名使用小写,用短横线而不是空格来分隔,可以避免很多让你头疼的情况.

网站的构造

最基本\最常见的结构是:一个主页,一个图片文件夹,一个样式表文件夹和一个脚本文件夹.
index.html: 一般就是专业内容文件,即用户第一次访问站点时看到的页面.
images文件夹:包含站点中所有图像.
styles文件夹:包含站点中所有样式表.
scripts文件夹:包含提供站点交互功能的JavaScript代码.

tip:其实代表了三大科目 HTML ,CSS,JavaScript,每个坑先挖一点,然后再挖宽,再挖深,再挖出花样,然后就补完了.

文件路径

• 若引用目标文件与index.html同级,只需直接使用文件名
• 若引用子文件夹中的文件,要在路径前写下子文件名并加一个斜杠
• 若引用目标文件位于index.html上级,需要加上两个点.
• 以上三点可以混用.

网站基础版大概就时这样.