Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.
Awesome Lists | Featured Topics | Projects
https://github.com/muyunyun/blog

Life is a moment :notebook_with_decorative_cover:
https://github.com/muyunyun/blog
algorithm css data-structure design-pattern front-end javascript modern-testing raspberrypi react typescript
Last synced: about 5 hours ago
JSON representation
Life is a moment :notebook_with_decorative_cover:
Host: GitHub
URL: https://github.com/muyunyun/blog
Owner: MuYunyun
Created: 2017-11-14T15:40:02.000Z (almost 7 years ago)
Default Branch: main
Last Pushed: 2024-04-14T01:48:14.000Z (5 months ago)
Last Synced: 2024-04-15T01:18:19.296Z (5 months ago)
Topics: algorithm, css, data-structure, design-pattern, front-end, javascript, modern-testing, raspberrypi, react, typescript
Language: JavaScript
Homepage: http://muyunyun.cn/blog
Size: 252 MB
Stars: 1,588
Watchers: 73
Forks: 232
Open Issues: 12
Metadata Files:
- Readme: README.md
- Funding: .github/FUNDING.yml
- Roadmap: roadmap.png
Awesome Lists containing this project

README

        

![views](https://raw.githubusercontent.com/MuYunyun/blog/traffic/traffic-blog/views.svg)

![views](https://raw.githubusercontent.com/MuYunyun/blog/traffic/traffic-blog/views_per_week.svg)

![clones](https://raw.githubusercontent.com/MuYunyun/blog/traffic/traffic-blog/clones.svg)

![clones](https://raw.githubusercontent.com/MuYunyun/blog/traffic/traffic-blog/clones_per_week.svg)

This is my personal blog created using create-react-doc to write and record my daily thoughts. I would be grateful if you could point out any mistakes by clicking on the link [there](https://github.com/MuYunyun/blog/issues/new).

Outline


- [Data Structure](#data-structure)

- [Design Pattern](#design-pattern)

- [React Series](#react-series)

  - [Deep Into React](#deep-into-react)

  - [Component Design](#component-design)

  - [React Stack](#react-stack)

  - [Build React from scratch](#build-react-from-scratch)

  - [Modern Testing](#modern-testing)

- [TypeScript](#typescript)

- [FE Cloud](#fe-cloud)

  - [JavaScript](#javascript)

  - [CSS](#css)

  - [Node.js](#nodejs)

  - [FE CLOUD](#fe-cloud-1)

  - [Project Framework](#project-framework)

- [RaspberryPi](#raspberrypi)

- [Sponsor](#sponsor)

- [Thanks](#thanks)

### Data Structure

Let's embark on a journey through the world of data structures together! There's no doubt that this adventure will be incredibly interesting and enjoyable. Before we begin, I want to emphasize two valuable points:

1. Keep your interest and persistence in learning.

2. Remember that thoughtful understanding is more important than simply taking action.

> [Travel Of LeetCode](https://github.com/MuYunyun/blog/blob/main/LeetCode/README.md)

* [Stack](https://muyunyun.cn/blog/c9b1b7wg)

* [Queue](https://muyunyun.cn/blog/87unmb8q)

* [List](https://muyunyun.cn/blog/z4nj8u3b)

* [Set](https://muyunyun.cn/blog/yqpmr5zs)

* [Dictionary](https://muyunyun.cn/blog/c1nhctpd)

* [Hash Table](https://muyunyun.cn/blog/nzpqsh6o)

* [Binary Tree](https://muyunyun.cn/blog/qykpal2y)

* [Graph](https://muyunyun.cn/blog/c3ns7c83)

  algorithm

* [Algorithm And Complexy](https://muyunyun.cn/blog/cbrpc1ne)

* [Recursive](https://muyunyun.cn/blog/4id99bn9)

* [Binary Search](https://muyunyun.cn/blog/ps27a5tp)

* [Greedy Algorithm](https://muyunyun.cn/blog/pkr9cdeo)

* [Dynamic Programming](https://muyunyun.cn/blog/wjncoyei)

### Design Pattern

* [Singleton Pattern](https://muyunyun.cn/blog/rizxul9p)

* [Stralegy Pattern](https://muyunyun.cn/blog/d8asfapg)

* [Proxy Pattern](https://muyunyun.cn/blog/euxm3din)

* [Iterator Pattern](https://muyunyun.cn/blog/2qm4d8um)

* [Publish/Subscribe Pattern](https://muyunyun.cn/blog/3cmugmwo)

* [Command Pattern](https://muyunyun.cn/blog/77vv1d3r)

* [Composite Pattern](https://muyunyun.cn/blog/1byioyjm)

* [Template Method Pattern](https://muyunyun.cn/blog/631wdfgg)

* [Flyweight Pattern](https://muyunyun.cn/blog/m92cq52g)

* [Chain of Responsibility Pattern](https://muyunyun.cn/blog/k27cb3ml)

* [Mediator Pattern](https://muyunyun.cn/blog/p9mgwwap)

* [Decorator Pattern](https://muyunyun.cn/blog/mzqguwi3)

* [State Pattern](https://muyunyun.cn/blog/s9x6auju)

* [Adapter Pattern](https://muyunyun.cn/blog/n9yua87r)

* [Observer Pattern](https://muyunyun.cn/blog/zyhpx5ad)

### React Series

This section will progressively introduce the world of React. It will cover the principles of React, how to gracefully design React components, and how to build a simple React application from scratch.

#### Deep Into React

* [React16.x 特性剪辑](https://muyunyun.cn/blog/v5nv35eg)

* [Fiber 数据结构](https://muyunyun.cn/blog/f3uuo1ij)

* [深入 Fiber 架构](https://muyunyun.cn/blog/bqtcq53y)

* [流畅性](https://muyunyun.cn/blog/13ymm2xq)

* [Schedule](https://muyunyun.cn/blog/v6uidkki)

* [你不知道的 requestIdleCallback](https://muyunyun.cn/blog/lmjv3sgz)

* [React Suspense 解决了什么](https://muyunyun.cn/blog/9ajh17y7)

* [React Hooks 深入系列](https://muyunyun.cn/blog/t3in9kmo)

* [React Hooks 设计模式](https://muyunyun.cn/blog/96j58x88)

* [React 暗器百解](https://muyunyun.cn/blog/v11si119)

#### Component Design

* [重新认识受控与非受控组件](https://muyunyun.cn/blog/56hn38ez)

- [ ] [Build Mobile First Animation In React](https://muyunyun.cn/blog/n6mg8zen)

  More

* [Button](https://muyunyun.cn/blog/1g88yeca)

* [Icon](https://muyunyun.cn/blog/jv1qrbmc)

* [Menu](https://muyunyun.cn/blog/5kj24dd3)

* [Keyboard](https://muyunyun.cn/blog/6ibj18mp)

* [Carousel](https://muyunyun.cn/blog/n2xngha2)

* [Tabs](https://muyunyun.cn/blog/sic5ph49)

* [Affix](https://muyunyun.cn/blog/fd4ap89c)

* [AddressPicker](https://muyunyun.cn/blog/oe699e2p)

* [CheckBox](https://muyunyun.cn/blog/91evrivd)

* [Form](https://muyunyun.cn/blog/yjp6glo1), [oneForm](https://github.com/MuYunyun/oneForm/issues/1)

* [SearchBar](https://muyunyun.cn/blog/zennyqde)

* [Modal](https://muyunyun.cn/blog/r5u2z2vr)

* [Textarea](https://muyunyun.cn/blog/51ezcvd1)

* [主题色替换方案](https://muyunyun.cn/blog/kvqod8vz)

* [移动端测试指北](https://muyunyun.cn/blog/x2orssyg)

- [ ] [组件设计实践](https://muyunyun.cn/blog/l25patvw)

#### React Stack

* [Redux 与 Mobx 适用场景](https://muyunyun.cn/blog/idu7szrn)

* [MVVM 框架解析之双向绑定](https://github.com/MuYunyun/FeCloud/issues/11) _{(相关项目)}

* [探索从 MVC 到 MVVM + Flux 架构模式的转变](https://github.com/MuYunyun/blog/issues/14) _{(相关项目)}

* [redux middleware 源码分析](https://github.com/MuYunyun/blog/issues/15)

* [在 React 使用 immutable 数据的优势](https://muyunyun.cn/blog/4sdxeudx)

* [路由的简易实现](https://muyunyun.cn/blog/163w51fk)

* [React 在服务端渲染的实现](https://github.com/MuYunyun/blog/issues/4)

* [定制自己的 react-script](https://muyunyun.cn/blog/ymisqdg2)

* [使用 React 全家桶搭建一个后台管理系统](https://github.com/MuYunyun/blog/issues/3)

_{(相关项目)}

#### Build React from scratch

* [前置准备](https://muyunyun.cn/blog/xn5bap3c)

* [JSX 和 Virtual DOM](https://muyunyun.cn/blog/zv9zkp1d)

* [组件 和 state|props](https://muyunyun.cn/blog/bfdttr5b)

* [生命周期](https://muyunyun.cn/blog/dr9fpnig)

* [diff 算法](https://muyunyun.cn/blog/3r7gdpzk)

* [setState 优化](https://muyunyun.cn/blog/um9lmlbq)

* [ref 的实现](https://muyunyun.cn/blog/jee59i99)

* [PureComponent 的实现](https://muyunyun.cn/blog/x9xp4uob)

* [HOC 探索](https://muyunyun.cn/blog/hyavrsmu)

* [onChange 事件以及受控组件](https://muyunyun.cn/blog/v3n4ihlt)

#### Modern Testing

* [React 现代化测试](https://muyunyun.cn/blog/xghy9857)

* [Jest 与 react-testing-Library](https://muyunyun.cn/blog/cvrgghl3)

### TypeScript

* [TypeScript 基础篇](https://muyunyun.cn/blog/qy2pz4hv)

* [TypeScript 中的类型](https://muyunyun.cn/blog/a3a3qa6u)

* [TypeScript 中的函数使用](https://muyunyun.cn/blog/gqpyuise)

* [TypeScript 中的工具类型](https://muyunyun.cn/blog/fvrpelzp)

* [Types vs Interfaces](https://muyunyun.cn/blog/z9tf63bq)

* [TypeScript extends 精读与实践](https://muyunyun.cn/blog/d1jkxo7l)

### FE Cloud

This section will explore the colorful world of frontend development.

#### JavaScript

* [你不知道的 JavaScript](https://github.com/MuYunyun/blog/issues/2)

* [红皮书里的细节](https://muyunyun.cn/blog/cudw5n7t)

* [探寻 JavaScript 精度问题](https://muyunyun.cn/blog/dzjdfedl)

* [函数式编程入门](https://muyunyun.cn/blog/hlkezw7u)

* [Decorator](https://muyunyun.cn/blog/396wjsh1)

* [Promise](https://muyunyun.cn/blog/l9w7axkn)_{(相关项目)}

* [Generator](https://muyunyun.cn/blog/l3p7jbgc)

* [Async](https://muyunyun.cn/blog/y1nlgvkb)

* [CommonJS 模块与 ES6 模块间的差异](https://muyunyun.cn/blog/muao7eyd)

* [ES6 继承与 ES5 继承的差异](https://muyunyun.cn/blog/czmq4cx2)

* [扩展运算符](https://muyunyun.cn/blog/yvcua1zk)

* [箭头函数](https://muyunyun.cn/blog/esoqf37z)

* [Reflect](https://muyunyun.cn/blog/lm3wt8vq)

#### CSS

* [INHERITED AND NON-INHERITED](https://muyunyun.cn/blog/nehdqz9q)

  more

* [水平布局解决方案](https://muyunyun.cn/blog/mf7g91hg)

* [聊聊 BFC](https://muyunyun.cn/blog/5wjknen4)

* [过渡与动画](https://muyunyun.cn/blog/tc5w4yiz)

#### Node.js

* [简版 express.js 的实现](https://muyunyun.cn/blog/ni1jporq)

* [简版 koa.js 的实现](https://muyunyun.cn/blog/pd6i666j)

* [Node.js 异步异闻录](https://github.com/MuYunyun/blog/issues/7)

_{(相关项目)}

* [用 Node.js 把玩一番 Alfred Workflow](https://github.com/MuYunyun/blog/issues/6) _{(相关项目)}

#### FE CLOUD

* [基于 SSR 的预渲染首屏直出方案](http://muyunyun.cn/blog/g3v1c5bq)

* [SEO 在 SPA 站点中的实践](http://muyunyun.cn/blog/ettzfags)

* [Talk about TC39](https://muyunyun.cn/blog/sezgk3yj)

* [跨域二三事](https://muyunyun.cn/blog/j7uygw6y) _{(相关项目)}

* [HTTP 小册](https://muyunyun.cn/blog/mx6wr51s)

* [HTML5](https://muyunyun.cn/blog/oizmpcx4)

* [探寻 webpack 插件机制](https://muyunyun.cn/blog/96xkvdzm) _{(相关项目)}

* [Babel 执行机制](https://muyunyun.cn/blog/yb1qmuv1)

* [npm 与 yarn](https://muyunyun.cn/blog/iwwepxpg)

* [移动端场景知识](https://muyunyun.cn/blog/4ocu6ahz)

* [原生 JS 实现一个瀑布流插件](https://github.com/MuYunyun/FeCloud/issues/12) _{(相关项目)}

* [实现一个自定义工具类库](https://github.com/MuYunyun/blog/issues/9) _{(相关项目)}

* [走近 Python](https://github.com/MuYunyun/blog/issues/8)

#### Project Framework

* [CAS 登入流程](https://muyunyun.cn/blog/p7j9m7jg)

* [RPC 在网关项目中的实践](https://muyunyun.cn/blog/exzzjh9z)

* [解读 IoC 框架 —— InversifyJS](https://muyunyun.cn/blog/9szgkw3d)

### RaspberryPi

Let's have some fun! This Raspberry Pi journey will unlock your server, Linux, and Nginx skills.

> Thanks for the [pi](https://github.com/zhaoolee/pi) project specially.

1. [树莓派简介&烧录系统](https://muyunyun.cn/blog/rahvuwkb)

2. [内网穿透](https://muyunyun.cn/blog/fes9wogn)

3. [基于树莓派搭建家庭服务器](https://muyunyun.cn/blog/r4zxdn6n)

4. [给树莓派安装 Docker 环境](https://muyunyun.cn/blog/2a97pq3a)

5. [给树莓派部署 RSSHub](https://muyunyun.cn/blog/wns8hpzc)

6. [HTTPS 协议配置](https://muyunyun.cn/blog/mx5pvgl1)

7. [基于树莓派部署 code-server](https://muyunyun.cn/blog/n45adwng)

8. [基于树莓派部署 filebrowser](https://muyunyun.cn/blog/do5qh9dg)

### Sponsor

If you enjoy this project, you are welcome to either watch or star it✨. Alternatively, you can show your support by buying me a cup of coffee.



### Thanks

I would like to thank my dear [rabbit🐰](https://github.com/DaphneChang) for her support.

[![Star History Chart](https://api.star-history.com/svg?repos=MuYunyun/blog&type=Date)](https://star-history.com/#MuYunyun/blog&Date)