diff --git a/docs/resume/css/base.less b/docs/resume/css/base.less new file mode 100755 index 0000000..f458fde --- /dev/null +++ b/docs/resume/css/base.less @@ -0,0 +1,488 @@ +.resume { + padding-bottom: 100px; + :global { + // 基础样式 + @color-main: #00b38a; // 主色 + @font-family: 'Helvetica Neue', Helvetica, 'PingFang SC', 'Microsoft YaHei', '微软雅黑', Arial, sans-serif; // 普通字体 + @font-family-title: 'Lucida Grande', 'Hiragino Sans GB', 'Hiragino Sans GB W3', @font-family; // 标题字体 + + .kill-ie { + margin: 0; + padding: .5em 0; + color: #333; + text-align: center; + background: #fff8e2; + } + + .last-modified { + position: absolute; + top: 30px; + left: 50%; + width: 1000px; + transform: translateX(-50%); + text-align: right; + font-size: 12px; + color: #bbb; + transition: all .2s ease-in-out; + animation: fade 1.6s; + @media screen and (max-width: 1024px) { + width: auto; + top: auto; + bottom: 10px; + text-align: left; + color: #d1d1d1; + } + } + .content { + position: relative; + width: 1024px; + margin: 10px auto 30px; + background-color: #fff; + border-radius: 5px; + box-shadow: 0 0 15px #c0c0c0; + overflow: hidden; + transition: all .2s ease-in-out; + // opacity: 0; + transform: translate3d(0,50px,0); + animation: fadeUp 2s cubic-bezier(0.19,1,0.22,1) forwards; + @keyframes fadeUp { + from { opacity: 0; transform: translate3d(0,50px,0); } + to { opacity: 1; transform: translate3d(0,0,0); } + } + @media screen and (max-width: 1024px) { + width: 100%; + margin: 0; + border-radius: 0; + } + } + .content-hd { + padding: 30px 50px; + color: #fff; + background-color: @color-main; + overflow: hidden; + @media screen and (max-width: 720px) { + padding: 25px; + } + .title { + padding-bottom: 5px; + margin-bottom: 5px; + border-bottom: 2px solid darken(@color-main, 2%); + font-size: 52px; + overflow: hidden; + } + .name, + .job, + .info, + .contact { + width: 50%; + @media screen and (max-width: 720px) { + width: 100%; + text-align: center; + } + } + .name, + .info { + float: left; + } + .job, + .contact { + float: right; + text-align: right; + } + .name { + h1 { + font-family: @font-family-title; + font-weight: 500; + letter-spacing: 5px; + @media screen and (max-width: 720px) { + margin-top: 10px; + letter-spacing: 0; + line-height: 1.25; + } + small { + padding-left: 10px; + font-size: 24px; + font-weight: 400; + letter-spacing: 0; + @media screen and (max-width: 720px) { + display: block; + padding-left: 0; + font-size: 20px; + line-height: 1; + } + } + } + } + .job { + font-weight: 300; + -webkit-font-smoothing: subpixel-antialiased; + @media screen and (max-width: 720px) { + text-align: center; + } + h2 { + display: inline-block; + font-size: 24px; + @media screen and (max-width: 720px) { + margin: 5px auto 0; + padding: 10px; + border-top: 1px solid darken(@color-main, 2%); + } + small { + font-size: 14px; + } + } + } + .info { + padding-left: 5px; + line-height: 30px; + h2 { + margin: 8px 0 4px; + font-size: 18px; + } + h3 { + font-size: 16px; + } + } + .contact { + padding-right: 5px; + ul { + margin-top: 8px; + @media screen and (max-width: 720px) { + margin: 16px 0 0; + text-align: center; + } + > li { + height: 23px; + @media screen and (max-width: 720px) { + display: inline-block; + } + > a { + font-family: @font-family-title; + font-size: 14px; + line-height: 23px; + color: #fff; + &:hover { + color: #e8e8e8; + } + .contact-link { + @media screen and (max-width: 720px) { + display: none; + } + } + .iconfont { + margin-left: 6px; + vertical-align: middle; + @media screen and (max-width: 720px) { + font-size: 20px; + } + } + } + } + } + } + } + .content-bd { + min-height: 200px; + padding: 18px 30px 50px; + overflow: hidden; + @media screen and (max-width: 720px) { + padding: 15px 10px 50px; + } + .content-left, + .content-right { + width: 50%; + @media screen and (max-width: 1024px) { + width: 100%; + } + } + .content-left { + float: left; + } + .content-right { + float: right; + } + section { + padding: 10px 18px; + overflow: hidden; + } + .section-hd { + position: relative; + height: 32px; + margin: 10px auto 8px; + overflow: hidden; + } + .section-bd { + overflow: hidden; + + .section-bd { + margin-top: 2px; + } + } + .section-title-l, + .section-title-r { + display: inline-block; + position: absolute; + top: 50%; + width: 32%; + height: 0; + border-top: 1px solid #ededed; + vertical-align: middle; + } + .section-title-l { + left: 0; + } + .section-title-r { + right: 0; + } + .section-title { + position: relative; + z-index: 1; + width: 24%; + min-width: 100px; + margin: 0 auto; + padding: 4px 10px; + border-radius: 32px; + font-size: 16px; + text-align: center; + font-weight: 400; + background-color: #eee; + } + ul.section-list { + padding: 8px 0 4px; + > li:last-child { + .section-content { + margin-bottom: 0; + } + } + } + .item-main { + .item-hd { + padding-top: 10px; + } + .item-bd { + margin-bottom: 4px; + } + ~ .item { + padding-left: 1px; + .item-hd { + padding-top: 6px; + } + .item-bd { + margin-bottom: 4px; + } + &:last-child { + .item-bd { + margin-bottom: 10px; + } + } + } + } + .item-stage { + color: #666; + font-size: 13px; + .item-hd { + padding: 0 0 2px; + .item-time { + font-size: 13px; + } + } + } + .item-hd { + position: relative; + padding: 8px 0 5px; + font-weight: 500; + line-height: 22px; + overflow: hidden; + .iconfont { + color: @color-main; + } + .item-time { + float: left; + display: inline-block; + font-size: 14px; + width: 135px; + @media screen and (max-width: 720px) { + width: 100%; + margin-bottom: 5px; + } + } + .item-more { + float: right; + height: 22px; + line-height: 22px; + margin-left: 5px; + @media screen and (max-width: 720px) { + &.btn { + position: absolute; + right: 0; + top: 10px; + margin-top: 1px; + } + } + } + .item-name { + font-weight: bold; + float: left; + display: inline-block; + line-height: 25px; + } + } + .item-bd { + margin-bottom: 6px; + } + .section-content { + line-height: 25px; + text-align: justify; + word-break: break-all; + margin-bottom: 2px; + .iconfont { + color: @color-main; + } + em { + display: inline-block; + cursor: pointer; + font-family: Monaco, Menlo, @font-family; + font-size: 13px; + line-height: 15px; + border: 1px solid #e6e6e6; + border-radius: 3px; + color: #383838; + margin: 0 3px; + padding: 0 4px; + transition: all .2s ease-in-out; + background-color: #f6f6f6; + &:hover { + border: 1px solid @color-main; + } + } + strong { + font-family: @font-family; + font-size: 13px; + line-height: 15px; + font-weight: 500; + color: #494949; + margin: 0 3px; + font-weight: 500; + padding: 0 4px; + border-bottom: 1px solid #eee; + transition: all .2s ease-in-out; + box-shadow: inset 0 -5px #eee; + cursor: pointer; + &:hover { + box-shadow: inset 0 -10px rgb(220, 217, 217); + } + } + } + } + .iconfont { + vertical-align: middle; + &.icon-dot { + vertical-align: -1px; + } + } + .btn { + display: inline-block; + padding: 0 5px; + border: 1px solid @color-main; + border-radius: 3px; + font-family: Menlo, @font-family; + height: 20px !important; + font-size: 14px !important; + line-height: 20px !important; + margin: 2px 0; + text-align: center; + color: @color-main; + &:hover { + color: #fff; + background-color: @color-main; + } + } + .pdf { + display: inline-block; + position: fixed; + z-index: 10; + bottom: 6px; + left: 50%; + margin-left: 520px; + padding: 0 8px; + border-radius: 3px; + font-size: 16px; + line-height: 26px; + color: #fff; + background-color: @color-main; + transition: all .2s ease-in-out; + animation: fade 1.6s; + @media screen and (max-width: 1246px) { + left: auto; + right: 8px; + margin-left: 0; + } + } + footer { + text-align: center; + transition: all .2s ease-in-out; + animation: fade 1.6s; + &.github-footer { + display: block; + } + &.print-footer { + display: none; + } + .footer-link { + display: inline-block; + margin-top: 10px; + margin-bottom: 30px; + color: #d1d1d1; + .iconfont { + vertical-align: middle; + margin-right: 2px; + } + @media screen and (max-width: 1024px) { + margin-top: 40px; + margin-bottom: 50px; + } + } + } + + @keyframes fade { + from { opacity: 0; } + to { opacity: 1; } + } + + ::-webkit-scrollbar { + background-color: #f1f1f1; + overflow: visible; + width: 3px; + height: 3px; + } + ::-webkit-scrollbar-thumb { + background-color: rgba(0, 0, 0, .2); + background-clip: padding-box; + min-height: 15px; + box-shadow: inset 1px 1px 0 rgba(0, 0, 0, .1), inset 0 -1px 0 rgba(0, 0, 0, .07); + } + ::-webkit-scrollbar-thumb:vertical:hover { + background-color: rgba(0, 0, 0, .3); + } + ::-webkit-scrollbar-thumb:vertical:active { + background-color: rgba(0, 0, 0, .5); + } + ::-webkit-scrollbar-button { + height: 0; + width: 0; + } + ::-webkit-scrollbar-track { + background-clip: padding-box; + border: solid transparent; + border-width: 0 0 0 4px; + } + ::-webkit-scrollbar-corner { + background: transparent; + } + + ::selection { + background: #d1d1d1; + } + + + } +} diff --git a/docs/resume/css/font/iconfont.eot b/docs/resume/css/font/iconfont.eot new file mode 100755 index 0000000..0808523 Binary files /dev/null and b/docs/resume/css/font/iconfont.eot differ diff --git a/docs/resume/css/font/iconfont.svg b/docs/resume/css/font/iconfont.svg new file mode 100755 index 0000000..0901baa --- /dev/null +++ b/docs/resume/css/font/iconfont.svg @@ -0,0 +1,47 @@ + + + + + +Created by iconfont + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/docs/resume/css/font/iconfont.ttf b/docs/resume/css/font/iconfont.ttf new file mode 100755 index 0000000..79003ca Binary files /dev/null and b/docs/resume/css/font/iconfont.ttf differ diff --git a/docs/resume/css/font/iconfont.woff b/docs/resume/css/font/iconfont.woff new file mode 100755 index 0000000..157baa7 Binary files /dev/null and b/docs/resume/css/font/iconfont.woff differ diff --git a/docs/resume/css/font/iconfont.woff2 b/docs/resume/css/font/iconfont.woff2 new file mode 100755 index 0000000..3c42023 Binary files /dev/null and b/docs/resume/css/font/iconfont.woff2 differ diff --git a/docs/resume/css/iconfont.css b/docs/resume/css/iconfont.css new file mode 100755 index 0000000..6332bd7 --- /dev/null +++ b/docs/resume/css/iconfont.css @@ -0,0 +1,45 @@ +@font-face {font-family: "iconfont"; + src: url('font/iconfont.eot?t=1561992927873'); /* IE9 */ + src: url('font/iconfont.eot?t=1561992927873#iefix') format('embedded-opentype'), /* IE6-IE8 */ + url('data:application/x-font-woff2;charset=utf-8;base64,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') format('woff2'), + url('font/iconfont.woff?t=1561992927873') format('woff'), + url('font/iconfont.ttf?t=1561992927873') format('truetype'), /* chrome, firefox, opera, Safari, Android, iOS 4.2+ */ + url('font/iconfont.svg?t=1561992927873#iconfont') format('svg'); /* iOS 4.1- */ +} + +.iconfont { + font-family: "iconfont" !important; + font-size: 16px; + font-style: normal; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; +} + +.icon-homepage:before { + content: "\e8fa"; +} + +.icon-github:before { + content: "\e600"; +} + +.icon-email:before { + content: "\e606"; +} + +.icon-phone:before { + content: "\e6f9"; +} + +.icon-dot:before { + content: "\e605"; +} + +.icon-link:before { + content: "\e602"; +} + +.icon-pdf:before { + content: "\e607"; +} + diff --git a/docs/resume/css/index.less b/docs/resume/css/index.less new file mode 100755 index 0000000..62ec2f6 --- /dev/null +++ b/docs/resume/css/index.less @@ -0,0 +1,5 @@ +@import './reset.less'; +@import './iconfont.css'; +@import './base.less'; +@import './print.less'; +@import './style.less'; diff --git a/docs/resume/css/print.less b/docs/resume/css/print.less new file mode 100755 index 0000000..8e76c11 --- /dev/null +++ b/docs/resume/css/print.less @@ -0,0 +1,109 @@ +// 打印样式 +// 调试方式 Chrome Devtools > Menu > More Tools > Rendering -> Emulate CSS media: print. +:global { + @media print { + body { + padding-top: 0; + } + .content { + width: 1024px; + height: 1450px; // A4 大小 + margin: 0 auto; + border-radius: 0; + box-shadow: none; + .content-hd { + padding-top: 60px; + padding-bottom: 40px; + .title { + font-size: 56px; + padding-bottom: 5px; + margin-bottom: 5px; + } + .name h1 small { + font-size: 26px; + padding-left: 12px; + } + .job h2 { + font-size: 26px; + } + .info { + line-height: 32px; + h2 { + font-size: 19px; + } + h3 { + font-size: 17px; + } + } + .contact ul { + > li { + height: 25px; + > a { + font-size: 15px; + } + } + } + } + .content-bd { + padding-top: 25px; + padding-bottom: 50px; + } + section { + padding-top: 12px; + padding-bottom: 12px; + ~ section { + padding-top: 0; + } + } + .section-hd { + padding-bottom: 10px; + } + .item-hd { + padding-bottom: 6px; + } + .item-bd { + margin-bottom: 8px; + } + .section-content { + line-height: 26px !important; + } + .print-hidden { + display: none; + } + } + .pdf { + display: none; + } + .last-modified { + position: absolute; + z-index: 1; + width: 970px; + top: auto; + bottom: 25px; + text-align: left; + padding-left: 20px; + color: #d1d1d1; + } + footer { + position: absolute; + z-index: 1; + width: 970px; + bottom: 25px; + left: 50%; + transform: translateX(-50%); + text-align: right; + padding-right: 20px; + &.github-footer { + display: none; + } + &.print-footer { + display: block; + .footer-link { + margin: 0; + } + } + } +} +} + + diff --git a/docs/resume/css/reset.less b/docs/resume/css/reset.less new file mode 100755 index 0000000..44738e5 --- /dev/null +++ b/docs/resume/css/reset.less @@ -0,0 +1,73 @@ +.resume { + @color-main: #00b38a; // 主色 + @font-family: 'Helvetica Neue', Helvetica, 'PingFang SC', 'Microsoft YaHei', '微软雅黑', Arial, sans-serif; // 普通字体 + @font-family-title: 'Lucida Grande', 'Hiragino Sans GB', 'Hiragino Sans GB W3', @font-family; // 标题字体 + line-height: 1; + position: relative; + -webkit-font-smoothing: antialiased; + -webkit-text-size-adjust: none; + font-family: @font-family; + font-size: 14px; + line-height: 22 / 14; + color: #333; + background-color: #eee; + padding-top: 5px; + overflow: auto; + @media screen and (max-width: 1024px) { + padding-top: 0; + } + :global { + /* reset */ + a, abbr, acronym, address, applet, article, aside, audio, b, big, blockquote, + body, canvas, caption, center, cite, code, dd, del, details, dfn, div, dl, + dt, em, embed, fieldset, figcaption, figure, footer, form, h1, h2, h3, h4, + h5, h6, header, hgroup, html, i, iframe, img, ins, kbd, label, legend, li, + mark, menu, nav, object, ol, output, p, pre, q, ruby, s, samp, section, small, + span, strike, strong, sub, summary, sup, table, tbody, td, tfoot, th, thead, + time, tr, tt, u, ul, var, video { + margin: 0; + padding: 0; + border: 0; + font: inherit; + font-size: 100%; + vertical-align: baseline; + } + + ol, ul { + list-style: none; + } + + table { + border-collapse: collapse; + border-spacing: 0; + } + + caption, td, th { + text-align: left; + font-weight: 400; + vertical-align: middle; + } + + blockquote, q { + quotes: none; + } + + blockquote:after, blockquote:before, q:after, q:before { + content: ""; + content: none; + } + + a img { + border: none; + } + + elements-of-type(html5-block) { + display: block; + } + + a { + text-decoration: none; + transition: all .2s ease-in-out; + } + } +} diff --git a/docs/resume/css/style.less b/docs/resume/css/style.less new file mode 100755 index 0000000..89422a4 --- /dev/null +++ b/docs/resume/css/style.less @@ -0,0 +1,15 @@ +// 定制化样式 +#experience { + .item-main { + font-size: 15px; + } +} +#skill { + .section-content { + margin-bottom: 6px; + } +} +// 打印样式 +@media print { + +} diff --git a/docs/resume/index.md b/docs/resume/index.md new file mode 100644 index 0000000..5d2812e --- /dev/null +++ b/docs/resume/index.md @@ -0,0 +1,10 @@ +--- +nav: + title: 关于我 + path: /resume +group: + order: 99 +gapless: true +--- + + diff --git a/docs/resume/index.tsx b/docs/resume/index.tsx new file mode 100644 index 0000000..2f99502 --- /dev/null +++ b/docs/resume/index.tsx @@ -0,0 +1,202 @@ +import React, { useEffect } from 'react'; + +import styles from './css/index.less' + +export default () => { + + useEffect(() =>{ + const header = document.querySelector('.__dumi-default-navbar') + const cont = document.querySelector('.__dumi-default-layout-content') + + cont.style['position'] = 'relative' + cont.style['top'] = '-64px' + header.style.display = 'none' + }, []) + + return ( +
+

最后更新时间：2022年05月

+
+
+
+
+

江志雄Jiang Zhixiong

+
+
+

Web前端开发工程师 / 杭州

+
+
+
+

男 · 本科

+

2018年毕业 · 5年工作经验

+

东华理工大学 · 软件工程

+
+
+ +
+
+
+
+
+
+ +

工作经验

+ +
+
+
+
+ 2017.10 ~ 2020.03 + 官网 +

杭州早稻科技有限公司

+
+
+
+
+

官网 · nextJs、reactJs、antd、pm2

+
+
+

+ 项目负责人前端开发 + 负责优化旧版官网，针对之前用户体验差的基础上向领导提出优化引入服务端渲染框架nextJs，使用antd作为官网辅助样式，使用ant Motion作为动画库，并使用Pm2部署在服务器上，该项目属于公司第一个node项目，对于公司前端具有一定的里程碑意义。 +

+ +
+
+
+
+

定制H5 · webpack、typescript

+
+
+

+ 项目负责人前端开发 + 从最初版本的gulp版本使用Webpack重新搭建脚手架将资源优化到更节约，并引入typescript + 强制规范开发规范，使代码更易读更容易维护，其中开发过的月饼大作战和约会大乱斗 + 两款小游戏使用了大量css样式，趣味性颇受领导好评。 +

+
+
+
+
+

定制工具库 · webpack、typescript

+
+
+

+ 项目负责人前端开发 + 该活动依赖于公司最底层工具库，并服务于活动开发，主要作用是为了统一管理优化在活动开发时使用的多端约定的函数方法，该工具包使用typescript规范开发，并放置于公司私有npm仓库中维护，内容包括但不限于：登录授权、 + 分享、语音验证验证码登录、获取验证码等等... +

+
+
+
+
+

运营管理平台 · ReactJs、Redux、Dva、Antd

+
+
+

+ 前端开发 + 负责运营平台商品营销模块、渠道管理模块、会员管理模块、数据配置模块。 + 基于reactreduxantd开发，实现单文件页面组件化开发、依赖处理等能力；封装部分重复组件和函数方法，减少重复工作量。 +

+
+
+
+
+
+
+
+
+ +

专业能力

+ +
+
+
    +

  • + 掌握Web前端开发基本技能，熟悉W3C标准、HTML、CSS、UI重构、页面布局，重视页面交互与用户体验。 +

    • +

  • + 对JavaScript、各类UI组件库、JS类库、模板引擎、MV*框架、工程化工具等有着较熟练的实践和较深刻的感悟。 +

    • +

  • + 对Node.js、模块化规范、CSS预处理器、数据可视化、设计模式、性能优化、前端安全等也有一定的应用与思考。 +

    • +

  • + 熟练使用ES6代码洁癖高质量可维护性。以ReactscssWebpackNode.js等为常用技术栈，同时也了解主流的Vuegulpkoa等技术。 +

    • +

  • + 熟练使用Git进行版本控制和代码托管、Markdown进行文档编写，了解项目常规开发流程、开发调试技巧、发布部署步骤，掌握类Unix服务器基本运维能力。 +

    • +

  • + 以极简主义作为人生信仰，喜欢美好的事物和创造美好的事物，对新潮的事物和技术充满好奇，热爱学习，热爱生活，乐于和他人沟通与交流。 +

    • +
+
+
+
+
+ +

个人作品

+ +
+
+
+
+

NiceCode

+ NiceCode +
+
+

+ 作为 nicecoder 项目发起人，该项目包含各个技术栈的工具库，为帮助他人提高工作效率，减少重复工作，目前成熟的工具有： + @nicecode/changelog@nicecode/lint@nicecode/commit@nicecode/tools...等 +

+
+
+
+
+

技术博客

+ NiceNote +
+
+

+ 爱好琢磨一些有趣有意思的东西，记录一些自己的学习记录和生活感悟，该博客系统使用之前使用主流博客系统Hexo搭建，后为了更方便记录案例代码，修改为Dumi，代码托管于gitee仓库 +

+
+
+
+
+

语音聊天室

+ +
+
+

+ 之前觉得websocket挺有意思，就想试着玩一下，所以就做了这个项目，它前端使用了Vue全家桶开发，muse-Ui作为UI框架，axios作为接口请求工具，后端使用了socket.io库开发。 +

+
+
+ +
+
+

二手商城系统

+ +
+
+

+ 大学快毕业时感觉前端学了半年想自己写一个全栈项目，就选择了这个题材，它前端使用了vue全家桶，muse-UI作为UI框架，后端使用了express作为框架，阿里云oss作为文件资源处理库，mongoDB作为数据库。 +

+
+
+
+
+
+
+
+ {/*

chrome浏览器 > 打印 > 目标另存为`PDF` > 更多设置无边距 > 即可导出

*/} + PDF简历 +
+ ) +} diff --git a/docs/resume/static/【react前端开发_杭州】江志雄 3年.pdf b/docs/resume/static/【react前端开发_杭州】江志雄 3年.pdf new file mode 100644 index 0000000..6f78f4d Binary files /dev/null and b/docs/resume/static/【react前端开发_杭州】江志雄 3年.pdf differ diff --git a/docs/resume/static/江志雄-前端开发15088662107.pdf b/docs/resume/static/江志雄-前端开发15088662107.pdf new file mode 100644 index 0000000..dbbf56e Binary files /dev/null and b/docs/resume/static/江志雄-前端开发15088662107.pdf differ diff --git a/docs/resume/static/阿里JD及内面题库_WEB前端开发.xlsx b/docs/resume/static/阿里JD及内面题库_WEB前端开发.xlsx new file mode 100644 index 0000000..d471457 Binary files /dev/null and b/docs/resume/static/阿里JD及内面题库_WEB前端开发.xlsx differ