开发这个网站起于在工作中总是要开发组件，功能函数之类的，有时还会重复开发造轮子，所以想着开发一个网站解决这类事情的发生。
用到的技术栈主要是前端React+vite+less，后端node，数据库MongoDB。具体到ui库之类的就不详细介绍了。
初期功能比较简单，一个一个来实现。
代码提交规范
feat：新功能（feature）。
fix/to：修复bug，可以是QA发现的BUG，也可以是研发自己发现的BUG。
- fix：产生diff并自动修复此问题。适合于一次提交直接修复问题
- to：只产生diff不自动修复此问题。适合于多次提交。最终修复问题提交时使用fix
docs：文档（documentation）。
style：格式（不影响代码运行的变动）。
refactor：重构（即不是新增功能，也不是修改bug的代码变动）。
perf：优化相关，比如提升性能、体验。
test：增加测试。
chore：构建过程或辅助工具的变动。
revert：回滚到上一个版本。
merge：代码合并。
sync：同步主线或分支的Bug。
scope(可选)
scope用于说明 commit 影响的范围，比如数据层、控制层、视图层等等，视项目不同而不同。
例如在Angular，可以是location，browser，compile，compile，rootScope， ngHref，ngClick，ngView等。如果你的修改影响了不止一个scope，你可以使用*代替。
subject(必须)
subject是commit目的的简短描述，不超过50个字符。
建议使用中文（感觉中国人用中文描述问题能更清楚一些）。
- 结尾不加句号或其他标点符号。
项目基础布局
布局代码
const HomePage: React.FC = ({ children }) => {
// 收缩侧边栏
const [collapsed, setCollapsed] = useState<boolean>(false);
return (
<Layout
className="layout"
style={{
minHeight: "100vh",
}}
>
<Header
style={{
background: "#fff",
padding: 0,
}}
>
<div className={`${styles.nav_header} ${styles.box_shadow}`}>
<HomeHeader />
</div>
</Header>
<Layout
style={{
paddingTop: "10px",
}}
>
<Sider
collapsible
theme="light"
collapsed={collapsed}
onCollapse={() => setCollapsed(!collapsed)}
className={styles.box_shadow}
>
<Menu
defaultSelectedKeys={[`${useLocation().pathname}`]}
mode="inline"
>
<Menu.SubMenu key="sub2" icon={<DesktopOutlined />} title="测试">
<Menu.Item key="/custom">
<Link to={"/custom"}>测试</Link>
</Menu.Item>
</Menu.SubMenu>
<Menu.Item key="/locale" icon={<FileOutlined />}>
<Link to={"/locale"}> 测试</Link>
</Menu.Item>
</Menu>
</Sider>
<Layout>
<Content
className="site-layout-background"
style={{
padding: 15,
minHeight: 280,
}}
// style={{ margin: "16px 16px" }}
>
{children}
</Content>
<Footer style={{ textAlign: "center" }}>
vite-react-template ©2022 Created by yang
</Footer>
</Layout>
</Layout>
</Layout>
);
};
项目持续更新，先做主要功能，后期再进行优化代码
end
