From 2ea057d9a110fd0b5dae21d2b627cadc63d7e999 Mon Sep 17 00:00:00 2001 From: imdatouk Date: Fri, 20 Sep 2024 16:20:04 +0800 Subject: [PATCH] =?UTF-8?q?=E6=9B=B4=E6=96=B0=E5=86=85=E5=AE=B9=EF=BC=8C?= =?UTF-8?q?=E8=B0=83=E6=95=B4=E6=A0=BC=E5=BC=8F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- Frontend_notes.md | 99 +++++++++++++++++++++++++---------------------- JavaScript.md | 2 +- Linux_notes.md | 4 +- MongoDB_notes.md | 18 ++++----- README.md | 2 +- React_notes.md | 31 ++++++++++++++- 6 files changed, 95 insertions(+), 61 deletions(-) diff --git a/Frontend_notes.md b/Frontend_notes.md index 9acdb71..a282fec 100644 --- a/Frontend_notes.md +++ b/Frontend_notes.md @@ -903,56 +903,61 @@ Canvas教程:[https://developer.mozilla.org/zh-CN/docs/Web/API/Canvas_API/Tuto -### CSS一些写法: - -width:100px !important; //不使用引入的样式 - -**CSS函数 参考手册:** - -| 函数 | 描述 | CSS 版本 | -| ------------------------------------------------------------ | ------------------------------------------------------------ | -------- | -| [attr()](https://www.runoob.com/cssref/func-attr.html) | 返回选择元素的属性值。 | 2 | -| [calc()](https://www.runoob.com/cssref/func-calc.html) | 允许计算 CSS 的属性值,比如动态计算长度值。 | 3 | -| [cubic-bezier()](https://www.runoob.com/cssref/func-cubic-bezier.html) | 定义了一个贝塞尔曲线(Cubic Bezier)。 | 3 | -| [hsl()](https://www.runoob.com/cssref/func-hsl.html) | 使用色相、饱和度、亮度来定义颜色。 | 3 | -| [hsla()](https://www.runoob.com/cssref/func-hsla.html) | 使用色相、饱和度、亮度、透明度来定义颜色。 | 3 | -| [linear-gradient()](https://www.runoob.com/cssref/func-linear-gradient.html) | 创建一个线性渐变的图像 | 3 | -| [radial-gradient()](https://www.runoob.com/cssref/func-radial-gradient.html) | 用径向渐变创建图像。 | 3 | -| [repeating-linear-gradient()](https://www.runoob.com/cssref/func-repeating-linear-gradient.html) | 用重复的线性渐变创建图像。 | 3 | -| [repeating-radial-gradient()](https://www.runoob.com/cssref/func-repeating-radial-gradient.html) | 类似 radial-gradient(),用重复的径向渐变创建图像。 | 3 | -| [rgb()](https://www.runoob.com/cssref/func-rgb-css.html) | 使用红(R)、绿(G)、蓝(B)三个颜色的叠加来生成各式各样的颜色。 | 2 | -| [rgba()](https://www.runoob.com/cssref/func-rgba.html) | 使用红(R)、绿(G)、蓝(B)、透明度(A)的叠加来生成各式各样的颜色。 | 3 | -| [var()](https://www.runoob.com/cssref/func-var.html) | 用于插入自定义的属性值。 | 3 | + +#### CSS函数 参考手册: + +| 函数 | 描述 | +| ------------------------------------------------------------ | ------------------------------------------------------------ | +| [attr()](https://www.runoob.com/cssref/func-attr.html) | 返回选择元素的属性值。 | +| [calc()](https://www.runoob.com/cssref/func-calc.html) | 允许计算 CSS 的属性值,比如动态计算长度值。 | +| [cubic-bezier()](https://www.runoob.com/cssref/func-cubic-bezier.html) | 定义了一个贝塞尔曲线(Cubic Bezier)。 | +| [hsl()](https://www.runoob.com/cssref/func-hsl.html) | 使用色相、饱和度、亮度来定义颜色。 | +| [hsla()](https://www.runoob.com/cssref/func-hsla.html) | 使用色相、饱和度、亮度、透明度来定义颜色。 | +| [linear-gradient()](https://www.runoob.com/cssref/func-linear-gradient.html) | 创建一个线性渐变的图像 | +| [radial-gradient()](https://www.runoob.com/cssref/func-radial-gradient.html) | 用径向渐变创建图像。 | +| [repeating-linear-gradient()](https://www.runoob.com/cssref/func-repeating-linear-gradient.html) | 用重复的线性渐变创建图像。 | +| [repeating-radial-gradient()](https://www.runoob.com/cssref/func-repeating-radial-gradient.html) | 类似 radial-gradient(),用重复的径向渐变创建图像。 | +| [rgb()](https://www.runoob.com/cssref/func-rgb-css.html) | 使用红(R)、绿(G)、蓝(B)三个颜色的叠加来生成各式各样的颜色。 | +| [rgba()](https://www.runoob.com/cssref/func-rgba.html) | 使用红(R)、绿(G)、蓝(B)、透明度(A)的叠加来生成各式各样的颜色。 | +| [var()](https://www.runoob.com/cssref/func-var.html) | 用于插入自定义的属性值。 | +| hsl() | 使用色相、饱和度、亮度来定义颜色。 | +| | | + + ## HTML转义字符: -| 特殊字符 | 描述 | 实体名称 | -| :-------: | :-------: | :------: | -| 【空格】 | 空格 |   | -| 【Tab键】 | Tab键 |   | -| > | 大于号 | > | -| < | 小于号 | < | -| 《 | 书名号-前 | « | -| 》 | 书名号-后 | » | -| & | 和号 | & | -| " | 引号 | " | -| ' | 单引号 | ' | -| ¥ | 人民币 | ¥ | -| $ | 美元符号 | $ | -| % | 百分号 | % | -| © | 版权 | © | -| ® | 注册商标 | ® | -| ™ | 商标 | ™ | -| x | 乘号 | × | -| ÷ | 除号 | ÷ | -| ± | 正负号 | ± | -| ° | 摄氏度 | ° | -| ² | 平方 | ² | -| ³ | 立方 | ³ | - - - -**鱼皮整理的 前端学习路线:** +| 特殊字符 | 描述 | 实体名称 | +| :-------: | :-------: | :-------: | +| 【空格】 | 空格 |   ; | +| 【Tab键】 | Tab键 | &emsp ; | +| > | 大于号 | > ; | +| < | 小于号 | < ; | +| 《 | 书名号-前 | « ; | +| 》 | 书名号-后 | » ; | +| & | 和号 | & ; | +| " | 引号 | " ; | +| ' | 单引号 | &apos ; | +| ¥ | 人民币 | ¥ ; | +| $ | 美元符号 | $ ; | +| % | 百分号 | % ; | +| © | 版权 | © ; | +| ® | 注册商标 | ® ; | +| ™ | 商标 | &trade ; | +| x | 乘号 | × ; | +| ÷ | 除号 | ÷ ; | +| ± | 正负号 | ± ; | +| ° | 摄氏度 | ° ; | +| ² | 平方 | ² ; | +| ³ | 立方 | ³ ; | + +注:实体名称后面我又加了一个空格,防止解析成特殊字符。 + + + + + +### 鱼皮的前端学习路线: diff --git a/JavaScript.md b/JavaScript.md index da1ddbd..e302699 100644 --- a/JavaScript.md +++ b/JavaScript.md @@ -864,7 +864,7 @@ Node.js 是一个基于Chrome JavaScript 运行时建立的一个平台。 Node.js是一个事件驱动I/O服务端JavaScript环境,基于Google的V8引擎,V8引擎执行Javascript的速度非常快,性能非常好。 -### Node.js 安装包及源码下载地址为:https://nodejs.org/en/download/。 +#### Node.js 安装包及源码下载地址为:https://nodejs.org/en/download/。 简单示例: diff --git a/Linux_notes.md b/Linux_notes.md index 785a83b..fa23642 100644 --- a/Linux_notes.md +++ b/Linux_notes.md @@ -66,9 +66,9 @@ sudo ss -tuln | grep [端口号] 5. mv:移动文件 如: mv index.html test 就会把index.html移动到test文件夹里 6. reset:初始化终端 跟clear效果差不多 -***`rm -rf /`* 格式化根目录 此命令不可乱用** +**`rm -rf /*` 格式化根目录 此命令不可乱用** -#### Linux 命令大全 +#### Linux 命令,转自菜鸟教程 | Linux 命令大全 | | | | | :----------------------------------------------------------- | ------------------------------------------------------------ | ------------------------------------------------------------ | ------------------------------------------------------------ | diff --git a/MongoDB_notes.md b/MongoDB_notes.md index b92c721..9917106 100644 --- a/MongoDB_notes.md +++ b/MongoDB_notes.md @@ -36,15 +36,15 @@ NoSQL 是一项全新的数据库革命性运动,早期就有人提出,发 ### MongoDB 概念解析 -| SQL术语/概念 | MongoDB术语/概念 | 解释/说明 | -| :----------- | :--------------- | :---------------------------------- | -| database | database | 数据库 | -| table | collection | 数据库表/集合 | -| row | document | 数据记录行/文档 | -| column | field | 数据字段/域 | -| index | index | 索引 | -| table joins | | 表连接,MongoDB不支持 | -| primary key | primary key | 主键,MongoDB自动将_id字段设置为主键 | +| SQL 术语/概念 | MongoDB 术语/概念 | 说明 | +| :------------ | :---------------- | :---------------------------------- | +| database | database | 数据库 | +| table | collection | 数据库表/集合 | +| row | document | 数据记录行/文档 | +| column | field | 数据字段/域 | +| index | index | 索引 | +| table joins | | 表连接,MongoDB不支持 | +| primary key | primary key | 主键,MongoDB自动将_id字段设置为主键 | diff --git a/README.md b/README.md index 53175f2..37913d7 100644 --- a/README.md +++ b/README.md @@ -16,7 +16,7 @@ | JavaScript | Js学习笔记包括NodeJS | | jQuery_notes | jQuery学习笔记 | | Linux_notes | Linux学习笔记,记录一些Linux的命令以及一些使用技巧 | -| MongoDB_notes | MongoDB笔记,记录MongoDB的一些概念以及用法 | +| MongoDB_notes | MongoDB笔记,记录MongoDB的一些概念以及用法 | | Photoshop_notes | 记录PS和LR的使用快捷键和一些方法技巧 | | PHP_notes | PHP学习笔记 | | Python_notes | Python学习笔记 | diff --git a/React_notes.md b/React_notes.md index c6f0ebb..9284629 100644 --- a/React_notes.md +++ b/React_notes.md @@ -1,2 +1,31 @@ -## React笔记 +# React笔记 + +### 简介 + +React 是一个用于构建用户界面的 JavaScript 库。 + +React 主要用于构建UI,很多人认为 React 就是 MVC 中的 V(视图view)。 + +React 起源于 FaceBook 的一个内部项目,用来架设 Instagram 的网站,并于 2013 年 5 月开源。 + +### React 特点 + +1. **声明式设计:** React 采用声明范式,可以轻松描述应用。 +2. **高效:** React 通过对 DOM 模拟,最大限度的减少与 DOM 的交互。 +3. **灵活:** React 可以与已知的库或框架更好的配合。 +4. **JSX:** JSX 是 JavaScript 的语法拓展,React 开发并不一定使用 JSX,但一般都推荐使用 JSX。 +5. **组件:** 通过 React 构建组件,使得代码更加容易得到复用,能够良好的应用在大项目的开发中。 +6. **单向响应的数据流:** React 实现了单向响应的数据流,从而减少了重复代码,这也是它为什么比传统的数据绑定更简单。 + +### React 安装使用 + +#### 使用 npm 安装 + +```sh + +npm install -g create-react-app + +create-react-app <项目名称> + +```