跳至主要內容
前端八股合集

前端八股合集

[TOC]

计算机网络

GraphQL

设计准则

  • 查询为分层结构:查询与响应数据一对一匹配的分层和嵌套字段格式,查询和相应的形状类似于树。
  • 以产品为中心,更关心前端希望如何接收数据,并构建交付所需的运行时:前端就可以通过一次请求来获取需要的所有数据,服务器会按照 GraphQL 规范来从不同的端点获取数据
  • 使用特定于应用程序的类型系统:开发人员能在执行前确保查询使用了有效类型并且语法正确,否则查询前就会抛出错误
  • 客户端确切知道会以何种格式接收数据
  • 使用 GraphQL 的服务器结构是内省的

Chilfish大约 53 分钟
2023 末

1

// TODO

一些记录

动漫们

整理了下,今年看得不是很多,但基本都是要看一辈子的了😎

这个列表还是从 bgm.tv 上手动 F12 筛出来的,补番的话就是搜索出来,复制卡片的 HTML 再 append 回去😹忘了好像有个很方便地筛年度动漫的工具,也就凑合着看吧hhh


Chilfish大约 2 分钟blog
TypeScript 代码片段们

Image ArrayBuffer to URL

export function toURL(arrayBuffer: ArrayBuffer) {
  if (!(arrayBuffer instanceof ArrayBuffer)) {
    throw new TypeError(
      'Invalid parameter: arrayBuffer must be an instance of ArrayBuffer',
    )
  }

  let type = 'image/png'
  const buffer = new Uint8Array(arrayBuffer)

  if (buffer.byteLength > 0 && buffer[0] === 60)
    type = 'image/svg+xml'

  else if (
    buffer.byteLength > 3
    && buffer[0] === 71
    && buffer[1] === 73
    && buffer[2] === 70
  )
    type = 'image/gif'

  else if (buffer.byteLength > 2 && buffer[0] === 255 && buffer[1] === 216)
    type = 'image/jpeg'

  const url = URL.createObjectURL(new Blob([buffer], { type }))

  // 在适当的时机手动释放URL对象
  const cleanup = () => {
    URL.revokeObjectURL(url)
  }

  // 返回URL,并在外部调用cleanup函数来释放资源
  return { url, cleanup }
}

Chilfish大约 1 分钟
Docker 化你的项目

为什么要 Docker 化

Docker是一种开源的容器化平台,它可以将应用程序及其依赖项打包到一个独立的、可移植的容器中。这个容器可以在不同的环境中运行,无论是开发环境、测试环境还是生产环境,都能保持一致的运行结果。Docker的核心概念是容器,它是一个轻量级的、独立的运行环境,包含了应用程序及其所需的操作系统、库和依赖项

Docker 化你的项目,可以让你的项目更加轻量化,更加便携化,更加易于维护,更加易于部署

by Copilot & GPT

Docker 化你的项目


Chilfish大约 8 分钟
应该使用 GET/POST 获取返回 200 的状态码的 API

似乎所有人都这么做

经常做爬虫的时候总会观察到这么一个现象,很多网站的API都会返回 200 的状态码,即使是请求失败了,也会返回 200 的状态码,然后在返回的数据中会有一个 code 字段,用来表示请求是否成功,比如:

{
  "code": "not_found_user",
  "data": null,
  "message": "用户不存在",
  "success": false,
  "statusCode": 404
}

Chilfish大约 4 分钟
Chilpost Spring Boot Kotlin 后端实现

咱还是因为 Web 的大作业要求 Spring Boot,有些看不起 Node 后端,那还是写一份 SB 的实现吧😹当然,得是 Kotlin 的😇

咱放在了 chilpost-sb 这个 repo 里

咱写着写着 Kotlin 版本的后端成了主线,Nuxt 得拖拖了,找个较好的 Node 后端技术栈 实在是因为 Kotlin 太甜了,让人很难推掉它hhh


Chilfish大约 3 分钟blog
锈化你的命令行工具

Rust 作为一门系统级语言,在命令行工具的开发上有着天然的优势。于是就在 Github 的 Rust topic 下找到了一些有意思的项目,并通过 scoop 安装到了 Windows 上

这些工具通常都是系统自带软件的替代品,它们都使用 Rust 来重写,更现代、更快、更好用 😍,特别是 git 等的支持

bat

sharkdp/bat 是一个 cat 的替代品,它的特点是语法高亮和 Git 集成


Chilfish大约 3 分钟
Linux

Linux 的目录结构

  • /bin:存放二进制可执行文件(ls,cat,mkdir 等),常用命令一般都在这里
  • /etc:存放系统管理和配置文件
  • /home:存放所有用户文件的根目录,是用户主目录的基点,比如用户 user 的主目录就是/home/user,可以用 ~user 表示
  • /usr:用于存放系统应用程序,比较重要的目录
    • /usr/local:本地系统管理员软件安装目录(安装系统级的应用)。这是最庞大的目录,要用到的应用程序和文件几乎都在这个目录
    • /usr/x11r6:存放 x window 的目录
    • /usr/bin:众多的应用程序
    • /usr/sbin:超级用户的一些管理程序
    • /usr/doc linux:文档
    • /usr/include linux:下开发和编译应用程序所需要的头文件
    • /usr/lib:常用的动态链接库和软件包的配置文件
    • /usr/man:帮助文档
    • /usr/src:源代码,linux 内核的源代码就放在 /usr/src/linux
    • /usr/local/bin:本地增加的命令
    • /usr/local/lib:本地增加的库
  • /opt:额外安装的可选应用程序包所放置的位置。一般情况下,我们可以把 tomcat 等都安装到这里
  • /proc:虚拟文件系统目录,是系统内存的映射。可直接访问这个目录来获取系统信息
  • /root:超级用户(系统管理员)的主目录
  • /sbin:存放二进制可执行文件,只有 root 才能访问。这里存放的是系统管理员使用的系统级别的管理命令和程序。如 ifconfig 等
  • /dev:用于存放设备文件
  • /mnt:系统管理员安装临时文件系统的安装点,系统提供这个目录是让用户临时挂载其他的文件系统
  • /boot:存放用于系统引导时使用的各种文件
  • /lib:存放跟文件系统中的程序运行所需要的共享库及内核模块。共享库又叫动态链接共享库,作用类似 windows 里的 .dll 文件,存放了根文件系统程序运行所需的共享文件
  • /tmp:用于存放各种临时文件,是公用的临时文件存储点
  • /var:用于存放运行时需要改变数据的文件,也是某些大文件的溢出区,比方说各种服务的日志文件(系统启动日志等。)等
  • /lost+found:这个目录平时是空的,系统非正常关机而留下“无家可归”的文件(windows 下叫什么.chk)就在这里

Chilfish大约 2 分钟Linux
2023 Logs 下半年

07-25 环境变量

关于环境变量 .envdotenv 的问题,纯浏览器客户端的 JavaScript 没有 Node.js 的process概念,因此无法使用process.meta.env等变量

Vite 提供了一个解决方案,它内置了 dotenv,可以将 .env 文件的内容以明文形式复制到引用中(import.meta.env.VITE_xxx),这样在 vite build 后生成的 JavaScript 代码中可以访问这些变量。然而,不推荐将敏感信息放在客户端代码中,因为在浏览器端无法保密。(Vue 本身还是运行在客户端的,所以打包后同理)


Chilfish大约 16 分钟blog
Weibo-archiver 存档你的微博 | 开发记录

项目地址:archiver

还得自己写一份

之前微博号莫名被夹过一次(事件)后,才意识到是不是该先手备份一份才对,还好只是禁言禁动作,那三千多条微博还是能看。那时翻遍了都没找到几个用得舒服的,特别是我想将它存为 HTML 之类的,图片存到本地,还能做全文搜索、OCR 搜索等等


Chilfish大约 11 分钟bloglogsvue