陈楠

男 | 23岁 | 前端开发 | 退役军人

手机：13725390095 | 微信：heycn1 | 邮箱：heycn@foxmail.com

我的博客目前已有 70 篇技术文章：博客链接

我的 GitHub 过去一年有 4000 次提交：GitHub

工作经历

  1. 博森科技

    前端开发

    -
    • 独立负责部门 前端项目的开发与维护，包括 PC 端与 移动端、主要使用 React + TypeScript 开发
    • 负责 Web3、智能量化 相关项目的开发、重构、维护与迭代
    • 协同后端开发团队完成 接口对接和联调，按时按量完成项目开发任务
    • 负责与产品组配合，深度参与产品需求讨论，功能定义等
    • 制定团队 代码规范，建立起开发质量控制方法，有效提高前端团队的开发效率

  2. 网易游戏

    游戏前端

    -
    • 独立负责 前端界面的拼接、UI 动画制作，完美还原设计稿
    • 负责团队的 工具开发，使项目开发、测试阶段能够更加顺利进行
    • 负责 UI 资源库 管理、迭代、测试、优化与维护，制作流程文档撰写
    • 微信小程序搜索：跑跑狼人杀（前端界面都是由我实现的）

  3. 中国人民解放军

    战士

    -
    • 担任：思想骨干、副班长、风气监督员
    • 荣获：优秀士兵、个人嘉奖、集体三等功、训练标兵、比武第一名

技能

  • 拥有 独立开发项目 的能力，以及良好的 编码品味，善于业务 组件的封装，便于复用
  • 熟悉并且能够编写 语义化的 HTML，模块化的 CSS，包括 SASS / LESS
  • 掌握 TypeScript 的使用，熟悉 ECMAScript 新特性，我把常用的特性总结成一篇 博客
  • 掌握 React 全家桶 的使用，包括 create-react-app、styled-component、ReactRouter、SWR 等
  • 掌握 Vue 的使用，包括 Vue3、VueCli、VueRouter、Vuepress 等
  • 了解 前后端分离 技术，包括 AJAX、同源策略、MVC、HTTP、Session、Cookie 等
  • 了解 Vite、Webpack 的配置，在项目中我写过一个 Vite 插件，并将其思路总结成一篇 博客
  • 掌握 Vim、Git、Docker、SVN、npm、Yarn、pnpm 工作流 / 常用命令，有一定的 Shell 编写能力

项目经历

  1. MetaMagus 链游官网「移动端」2022.6 - 2022.7

    预览链接

    此项目是由我独立开发完成的链游发行社区，主要功能包括 实现与 Web3 平台的交互、NFT 展示、
    NFT 交易、代理邀请    、Web3 钱包账户管理等

    使用到的技术栈有 React18、TypeScript、scss、Vite3、styled-components、Axios、Web3 等

    封装 HttpClient中间层，解决以后使用其他请求库时，能够减少重构成本，我将其总结成了一篇 博客

    采用模块化&模块化开发风格，使得项目易于阅读与维护，尽量不使用第三方库，以手写组件为主，
    包括 ProgressBar、Dropdown、Toast、Aside、Nav、Spin、Message、Button 等组件

  2. GameFi 社区官网「PC 端」2022.4 - 2022.6

    预览链接

    此项目是一个集成一级市场、NFT合成、二级市场、用户中心、DAO等功能的综合性平台

    使用到的技术栈有 React Hooks、Ant Design、scss、styled-components、Axios 等

    使用 MJML 解决了 HTML 在各个邮箱平台无法适配问题，从而实现了 响应式邮件

  3. 业务业绩返佣系统「前台 & 后台」2022.6 - 2022.9

    后台是由 Ant Design Pro、Ant Design、less、Axios，前台是由 React18、TypeScript、Ant Design、Axios、Echarts、styled-components、Webpack 开发的

    前台：供业务员查看并核对每月业绩；后台：供管理员上传业绩情况且快速计算与管理员工每月业绩

    主要功能包括 谷歌登录验证、表格上传、表格保存，各组、部门、员工的管理、以及业务层的增删改查

开源作品

  1. UI 组件库「 Vue2 & Vue3 」

    源码链接 预览链接

    这是我在学习 Vue2 和 Vue3 的时候开发 的 UI 组件库，涵盖了 Switch、Tabs、Button、Input、Grid、Toast、Layout、Collapse、Popover 等常见 UI 组件

    Vue2 版基于 Vue2 / SVG Icon / SCSS / Vuepress 实现的，每个组件都以测试驱动，保证组件的使用质量

    Vue3 版是我在学习 Vue3 时基于 Vue3 / TypeScript / Vite 实现的，通过 Vite 与 Vue3 相结合，尝鲜使用了 setup、onMounted、watchEffect、ref、computed 等 API

    模块化 的源代码简洁明了，易于阅读，制作过程让我对 Vue 有了新的认识，我将其总结成了一篇 博客

  2. 智慧公安 - 大屏可视化项目

    源码链接 预览链接

    这个项目是我在学习 前端可视化 与 Echarts 时基于 React / TypeScript / ReactRouter / Echarts 实现的

    页面布局使用了 Grid 和 Flex 布局，为了适应所有屏幕，我使用了 动态 rem 方案

    项目中包含的图例有 柱形图、折线图、饼图、地图和表格等，部分图例还可以 更新数据 并以动画交互

    通过这个项目，我掌握了大屏可视化项目的制作技巧以及 适配方案，并且总结成了一篇 博客

  3. 记账应用「 React & Vue2 」

    源码链接 扫码预览

    这是我为了满足家人的需求而独立实现出的一款记账应用，特点是 快速记账，并且可以查看消费记录

    React 版基于 React / TypeScript / Hooks / React Router / LocalStorage 实现

    Vue 版基于 Vue2 / TypeScript / Vue Router / Vuex 实现，使用到了装饰器语法

  4. 在线笔记

    源码链接 预览链接

    这是一个基于 Vue / element-ui / Vuex 实现与 后端交互 的 PC 端在线笔记

    主要功能包括：账户创建/登录、新建笔记本、Markdown 支持、删除笔记放入回收站、笔记恢复、笔记彻底删除、用户退出登录等，该项目使我与后端交互有了更多的了解，我将其总结了一篇 博客

  5. 画只皮卡丘给你！

    源码链接 项目预览

    我在学习 CSS3 时制作的一个可爱作品

  6. 简易画板

    源码链接 项目预览

    我在学习 Canvas 时做的一个小作品

教育经历

广东亚视演艺学院 计算机应用技术