思米米(SIMIMI)

欢迎访问「思米米」

2022-06-04

作为程序员，编写代码也需要大量的写作技巧。好的代码可以让人耳目一新、通俗易懂、舒适自然，同时又充满成就感。因此，整理了一些近三年使用过的JS开发技巧，希望能让大家写出耳目一新、通俗易懂、舒适自然的代码。

字符串技巧

1: Compare time

const time1 = "2022-03-02 09:00:00";
const time2 = "2022-03-02 09:00:01";
const overtime = time1 < time2;
// overtime => true

2: Format money

const ThousandNum = num => num.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
const money = ThousandNum(1000000);
// money => '1,000,000'

3: Generate random ID

const RandomId = len => Math.random().toString(36).substr(3, len);
const id = RandomId(10);
// id => "xdeguewg1f"

思米米的小笔记

JavaScript

前端开发规范：命名规范、html规范、css规范、js规范

2022-06-01

前端开发规范：命名规范、html规范、css规范、js规范

一个好的程序员肯定是要能书写可维护的代码，而不是一次性的代码，怎么能让团队当中其他人甚至一段时间时候你再看你某个时候写的代码也能看懂呢，这就需要规范你的代码了。

命名

驼峰式命名法介绍

Pascal Case 大驼峰式命名法：首字母大写。eg：StudentInfo、UserInfo、ProductInfo
Camel Case 小驼峰式命名法：首字母小写。eg：studentInfo、userInfo、productInfo

思米米的小笔记

前端

CSS命名参考

2022-06-01

CSS命名参考

页面结构命名

page  // 代表整个页面，用于最外层。
wrap  // 外套，将所有元素包在一起的一个外围包，用于最外层
wrapper  // 页面外围控制整体布局宽度，用于最外层
container  // 一个整体容器，用于最外层
head|header  // 页头区域，用于头部
nav  // 导航条
content  // 内容，网站中最重要的内容区域，用于网页中部主体
main  // 网站中的主要区域（表示最重要的一块位置），用于中部主体内容
column  // 栏目
sidebar  // 侧栏
foot|footer  // 页尾、页脚。网站一些附加信息放置区域，（或命名为 copyright）用于底部

思米米的小笔记

CSS

CSS规范

2022-06-01

CSS规范

CSS书写顺序

位置属性(position, top, right, z-index, display, float等)
大小(width, height, padding, margin)
文字系列(font, line-height, letter-spacing, color- text-align等)
背景(background, border等)
其他(animation, transition等)

*** Bad ***
.example {
    color: red;
    z-index: -1;
    background-color: #9e0;
    display: inline-block;
    font-size: 1.5em;
}

*** Good ***
.example {
    z-index: -1;
    display: inline-block;
    font-size: 1.5em;
    background-color: #9e0;
}

思米米的小笔记

CSS

CSS设置字体

2022-05-20

CSS初始化字体

@font-face {
  font-family: Emoji;
  src: local("Apple Color Emojiji"), local("Segoe UI Emoji"), local("Segoe UI Symbol"), local("Noto Color Emoji");
  unicode-range: U+1F000-1F644, U+203C-3299;
}
body {
  font-family: system-ui, —apple-system, Segoe UI, Rototo, Emoji, Helvetica, Arial, sans-serif;
}

思米米的小笔记

CSS

使用v2rayN代理Git、PowerShell、CMD的设置

2022-05-17

git 命令设置代理

设置永久有效

git config --global https.proxy http://127.0.0.1:10809
git config --global https.proxy https://127.0.0.1:10809
git config --global http.proxy 'socks5://127.0.0.1:10808'
git config --global https.proxy 'socks5://127.0.0.1:10808'
git config --global --list	#查询代理设置

思米米的小笔记

Proxy

【分享】可视化图表库echarts

2022-04-23

ECharts，一个使用 JavaScript 实现的开源可视化库，可以流畅的运行在 PC 和移动设备上，兼容当前绝大部分浏览器（IE9/10/11，Chrome，Firefox，Safari 等），底层依赖矢量图形库 ZRender，提供直观，交互丰富，可高度个性化定制的数据可视化图表。