✦ Frontend Skills

技能星图
Constellation

每一颗星辰代表一项精进的前端技艺。悬停探索,感受技术宇宙的脉动。

01

核心基础

🏗️

HTML5

Semantic & Structure

SemanticARIASEOCanvas
🎨

CSS3 / SCSS

Styling & Layout

GridFlexboxAnimationBEM

JavaScript

ES6+ & Beyond

ES2024AsyncDOMFP
🔷

TypeScript

Type-safe Development

GenericsInferDecoratorUtility
02

框架生态

⚛️

React

UI = f(state)

HooksNext.jsZustandRSC
💚

Vue.js

Progressive Framework

Vue 3PiniaNuxtComposables
🅰️

Angular

Enterprise-grade

RxJSDISSRSignals
🖥️

Svelte

Compile-time Magic

SvelteKitStoresRunesMotion
03

工程化

📦

Webpack / Vite

Build & Bundle

Code SplitHMRTree ShakingPlugins
🐙

Git

Version Control

CI/CDRebaseActionsHooks
🐳

Docker

Containerization

ComposeCIMulti-stageK8s
🧪

Testing

Quality Assurance

JestVitestCypressE2E
04

设计 & 体验

📐

Responsive Design

Adaptive & Fluid

Media QueryClampContainerMobile-first
🖌️

UI / UX

User-centered Design

FigmaDesign SystemA11yPrototype

Animation

Motion & Micro-interactions

GSAPFramerLottieWAAPI

Performance

Web Vitals & Optimization

LCPLazy LoadBundleCDN
16+
Core Skills
4
Categories
Learning
100%
Passion

Copyright © 海欧的个人微博

All Rights Reserved 苏ICP备2020059382号-1