├── docs ├── .nojekyll ├── assets │ └── heart.png ├── dev │ ├── poi.config.js │ └── index.ejs ├── content.yaml ├── content.json ├── resume-en.html └── index.html ├── .gitattributes ├── .gitignore ├── src ├── index.js ├── aoba.js ├── lang.js ├── components │ ├── loading.vue │ └── App.vue └── content.json ├── renovate.json ├── .editorconfig ├── circle.yml ├── LICENSE ├── package.json └── README.md /docs/.nojekyll: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /.gitattributes: -------------------------------------------------------------------------------- 1 | * text=auto 2 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | node_modules 2 | dist 3 | -------------------------------------------------------------------------------- /src/index.js: -------------------------------------------------------------------------------- 1 | module.exports = require('./aoba').default 2 | -------------------------------------------------------------------------------- /renovate.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": [ 3 | "config:base" 4 | ] 5 | } 6 | -------------------------------------------------------------------------------- /docs/assets/heart.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/luyilin/Aoba/HEAD/docs/assets/heart.png -------------------------------------------------------------------------------- /.editorconfig: -------------------------------------------------------------------------------- 1 | root = true 2 | 3 | [*] 4 | indent_style = space 5 | indent_size = 2 6 | end_of_line = lf 7 | charset = utf-8 8 | trim_trailing_whitespace = true 9 | insert_final_newline = true 10 | 11 | [*.md] 12 | trim_trailing_whitespace = false -------------------------------------------------------------------------------- /docs/dev/poi.config.js: -------------------------------------------------------------------------------- 1 | const path = require('path') 2 | const pkg = require('../../package') 3 | 4 | module.exports = { 5 | entry: 'src/index.js', 6 | html: { 7 | title: pkg.name, 8 | description: pkg.description, 9 | template: path.join(__dirname, 'index.ejs'), 10 | inject: false 11 | }, 12 | port: 4002, 13 | vendor: false, 14 | presets: [ 15 | require('poi-preset-bundle-report')() 16 | ], 17 | env: { 18 | AOBA_VERSION: pkg.version 19 | } 20 | } 21 | -------------------------------------------------------------------------------- /circle.yml: -------------------------------------------------------------------------------- 1 | version: 2 2 | jobs: 3 | build: 4 | docker: 5 | - image: circleci/node:latest 6 | working_directory: ~/repo 7 | 8 | steps: 9 | - checkout 10 | - restore_cache: 11 | keys: 12 | - v1-dependencies-{{ checksum "yarn.lock" }} 13 | 14 | - run: yarn install 15 | 16 | - save_cache: 17 | paths: 18 | - node_modules 19 | key: v1-dependencies-{{ checksum "yarn.lock" }} 20 | 21 | - run: yarn test 22 | -------------------------------------------------------------------------------- /docs/dev/index.ejs: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | <% if (htmlWebpackPlugin.options.description) { %> 9 | 10 | <% } %> 11 | 12 | 13 | 16 |
17 | 18 | 24 | 25 | 26 | -------------------------------------------------------------------------------- /src/aoba.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | import Inter from 'vue-inter' 3 | import App from './components/App.vue' 4 | import content from './content' 5 | import lang from './lang' 6 | 7 | Vue.use(Inter) 8 | 9 | let inter 10 | 11 | class Aoba { 12 | constructor(i) { 13 | this.content = Object.assign({ 14 | lang: 'zh', 15 | path: './', 16 | indexFile: 'content.yaml', 17 | color: '' 18 | }, content, i) 19 | inter = new Inter({ 20 | locale: (i && i.lang) || 'zh', 21 | locales: lang 22 | }) 23 | } 24 | 25 | start(el) { 26 | return new Vue({ 27 | inter, 28 | el, 29 | render: h => h(App, { props: { opts: this.content } }) 30 | }) 31 | } 32 | } 33 | 34 | export default function aoba(content) { 35 | return new Aoba(content) 36 | } 37 | 38 | if (process.env.NODE_ENV === 'development') { 39 | window.Aoba = aoba 40 | } 41 | 42 | window.AOBA_VERSION = process.env.AOBA_VERSION 43 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | The MIT License (MIT) 2 | 3 | Copyright (c) luyilin (https://github.com/luyilin) 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in 13 | all copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN 21 | THE SOFTWARE. 22 | -------------------------------------------------------------------------------- /src/lang.js: -------------------------------------------------------------------------------- 1 | const lang = { 2 | zh: { 3 | resume: '的简历', 4 | basicInfoTitle: 'Basic info 基本信息', 5 | contactTitle: 'Contact 联系方式', 6 | application: 'Application 应聘岗位', 7 | workExperience: 'Experience 项目与工作经验', 8 | personalProject: '个人项目', 9 | skill: 'Skill 技能', 10 | basicInfo: { 11 | name: '个人信息', 12 | birthday: '出生日期', 13 | school: '毕业院校', 14 | major: '专业', 15 | blog: '博客' 16 | }, 17 | contact: { 18 | tel: '电话', 19 | email: '邮箱', 20 | wechat: '微信' 21 | }, 22 | sourceCode: '源代码', 23 | present: '至今' 24 | }, 25 | en: { 26 | resume: '\'s resume', 27 | basicInfoTitle: 'Basic info', 28 | contactTitle: 'Contact', 29 | application: 'Application', 30 | workExperience: 'Work Experience', 31 | personalProject: 'Personal Project', 32 | skill: 'Skill', 33 | basicInfo: { 34 | name: 'Name', 35 | birthday: 'Birthday', 36 | school: 'School', 37 | major: 'Major', 38 | blog: 'Blog' 39 | }, 40 | contact: { 41 | tel: 'Tel', 42 | email: 'Email', 43 | wechat: 'Wechat' 44 | }, 45 | sourceCode: 'source code', 46 | present: 'present' 47 | } 48 | } 49 | 50 | module.exports = lang 51 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "aoba-resume", 3 | "version": "1.0.6", 4 | "description": "Create a lovely resume just with a config file.", 5 | "repository": { 6 | "url": "https://github.com/luyilin/Aoba.git", 7 | "type": "git" 8 | }, 9 | "main": "dist/aoba", 10 | "files": [ 11 | "dist" 12 | ], 13 | "keywords": [ 14 | "resume" 15 | ], 16 | "scripts": { 17 | "test": "npm run lint && npm run build", 18 | "lint": "xo", 19 | "dev": "poi -c docs/dev/poi.config.js", 20 | "build": "poi build -c docs/dev/poi.config.js --component aoba", 21 | "prepublish": "npm run build" 22 | }, 23 | "author": "luyilin ", 24 | "license": "MIT", 25 | "dependencies": { 26 | "color": "^2.0.1", 27 | "js-yaml": "^3.10.0", 28 | "unfetch": "^3.0.0", 29 | "vue": "^2.5.9", 30 | "vue-inter": "^1.1.1" 31 | }, 32 | "devDependencies": { 33 | "eslint-config-rem": "^3.0.0", 34 | "node-sass": "^4.7.2", 35 | "poi": "^9.6.13", 36 | "poi-preset-bundle-report": "^2.0.2", 37 | "sass-loader": "^6.0.6", 38 | "vue-template-compiler": "^2.5.9", 39 | "xo": "^0.18.0" 40 | }, 41 | "xo": { 42 | "extends": "rem", 43 | "envs": [ 44 | "browser" 45 | ] 46 | } 47 | } 48 | -------------------------------------------------------------------------------- /src/components/loading.vue: -------------------------------------------------------------------------------- 1 | 45 | 46 | 55 | -------------------------------------------------------------------------------- /docs/content.yaml: -------------------------------------------------------------------------------- 1 | --- 2 | basicInfo: 3 | name: Aoba Suzukaze 4 | gender: 女 5 | birthday: 6 | avatar: https://wx4.sinaimg.cn/mw690/a2117cdbgy1fm50e95u2wj20570543yj.jpg 7 | desc: 今天也要加油哦~ 8 | school: 某高中 9 | major: 动画设计（我猜的.. 10 | blog: □□□□□ 11 | github: □□□□□ 12 | contact: 13 | tel: □□□□□ 14 | email: □□□□□ 15 | wechat: □□□□□ 16 | qq: □□□□□ 17 | telegram: □□□□□ 18 | application: 角色设计 19 | workExperience: 20 | - companyLogo: https://wx2.sinaimg.cn/mw690/a2117cdbgy1fm5xlwuqt2j206y058jrl.jpg 21 | companyName: 飞鹰跃动工作室（Eagle Jump） 22 | startDate: 2013.01 23 | endDate: present 24 | project: 25 | - name: 精灵物语3 26 | description: 精灵物语3 是 Eagle Jump 主导开发、发行的一款动作冒险游戏。作为游戏的视觉设计团队的一员，主要负责 3D 制作。 27 | sourceCode: 28 | demo: https://zh.moegirl.org/zh-hans/%E7%B2%BE%E7%81%B5%E7%89%A9%E8%AF%AD3, 29 | previewImage: https://wx2.sinaimg.cn/mw690/a2117cdbgy1fm609x0v47j206x04g75d.jpg 30 | - name: PECO 31 | sourceCode: 32 | demo: 33 | description: PECO 是一款讲述现代少女坠入了充满玩偶怪物的异世界的游戏。主角的设计灵感来自萌萌的熊型睡袋，和八神光一起完成游戏的角色设计。 34 | previewImage: https://wx3.sinaimg.cn/mw690/a2117cdbgy1fm6zeddd3pj20gl0mfq8d.jpg 35 | personalProject: 36 | - name: emmm 好像还没有 37 | description: 萌还不够么.. 38 | sourceCode: 39 | demo: 40 | previewImage: https://wx3.sinaimg.cn/mw690/a2117cdbgy1fm705blrdlj20jg0jg0ue.jpg 41 | skills: 42 | - name: 板绘 43 | description: 44 | - 其实我画画蛮不错的 (⁎˃ᴗ˂⁎)，虽然没有八神光前辈好 45 | - name: 3D 制作 46 | description: 47 | - 从萌新到大佬的进阶之路 48 | - name: 其他属性 49 | description: 50 | - 性格认真，永远积极向上的思考 51 | abandoned: 52 | - 谁能想到坐拥后宫的女人竟然是个合法萝莉！ 53 | -------------------------------------------------------------------------------- /docs/content.json: -------------------------------------------------------------------------------- 1 | { 2 | "basicInfo": { 3 | "name": "Aoba Suzukaze", 4 | "gender": "女", 5 | "birthday": "", 6 | "avatar": "https://wx4.sinaimg.cn/mw690/a2117cdbgy1fm50e95u2wj20570543yj.jpg", 7 | "desc": "今天也要加油哦~", 8 | "school": "某高中", 9 | "major": "动画设计（我猜的..", 10 | "blog": "□□□□□", 11 | "github": "□□□□□" 12 | }, 13 | "contact": { 14 | "tel": "□□□□□", 15 | "email": "□□□□□", 16 | "wechat": "□□□□□", 17 | "qq": "□□□□□", 18 | "telegram": "□□□□□" 19 | }, 20 | "application": "角色设计", 21 | "workExperience": [ 22 | { 23 | "companyLogo": "https://wx2.sinaimg.cn/mw690/a2117cdbgy1fm5xlwuqt2j206y058jrl.jpg", 24 | "companyName": "飞鹰跃动工作室（Eagle Jump）", 25 | "startDate": "2013.01", 26 | "endDate": "present", 27 | "project": [ 28 | { 29 | "name": "精灵物语3", 30 | "sourceCode": "", 31 | "demo": "https://zh.moegirl.org/zh-hans/%E7%B2%BE%E7%81%B5%E7%89%A9%E8%AF%AD3", 32 | "description": "精灵物语3 是 Eagle Jump 主导开发、发行的一款动作冒险游戏。作为游戏的视觉设计团队的一员，主要负责 3D 制作。", 33 | "previewImage": "https://wx2.sinaimg.cn/mw690/a2117cdbgy1fm609x0v47j206x04g75d.jpg" 34 | }, 35 | { 36 | "name": "PECO", 37 | "sourceCode": "", 38 | "demo": "", 39 | "description": "PECO 是一款讲述现代少女坠入了充满玩偶怪物的异世界的游戏。主角的设计灵感来自萌萌的熊型睡袋，和八神光一起完成游戏的角色设计。", 40 | "previewImage": "https://wx3.sinaimg.cn/mw690/a2117cdbgy1fm6zeddd3pj20gl0mfq8d.jpg" 41 | } 42 | ] 43 | } 44 | ], 45 | "personalProject": [ 46 | { 47 | "name": "emmm 好像还没有", 48 | "description": "萌还不够么..", 49 | "sourceCode": "", 50 | "demo": "", 51 | "previewImage": "https://wx3.sinaimg.cn/mw690/a2117cdbgy1fm705blrdlj20jg0jg0ue.jpg" 52 | } 53 | ], 54 | "skills": [ 55 | { 56 | "name": "板绘", 57 | "description": ["其实我画画蛮不错的 (⁎˃ᴗ˂⁎)，虽然没有八神光前辈好"] 58 | }, 59 | { 60 | "name": "3D 制作", 61 | "description": ["从萌新到大佬的进阶之路"] 62 | }, 63 | { 64 | "name": "其他属性", 65 | "description": ["性格认真，永远积极向上的思考"], 66 | "abandoned": ["谁能想到坐拥后宫的女人竟然是个合法萝莉！"] 67 | } 68 | ] 69 | } 70 | -------------------------------------------------------------------------------- /src/content.json: -------------------------------------------------------------------------------- 1 | { 2 | "basicInfo": { 3 | "name": "Aoba Suzukaze", 4 | "gender": "女", 5 | "birthday": "", 6 | "avatar": "https://wx4.sinaimg.cn/mw690/a2117cdbgy1fm50e95u2wj20570543yj.jpg", 7 | "desc": "今天也要加油哦~", 8 | "school": "某高中", 9 | "major": "动画设计（我猜的..", 10 | "blog": "□□□□□", 11 | "github": "□□□□□" 12 | }, 13 | "contact": { 14 | "tel": "□□□□□", 15 | "email": "□□□□□", 16 | "wechat": "□□□□□", 17 | "qq": "□□□□□", 18 | "telegram": "□□□□□" 19 | }, 20 | "application": "角色设计", 21 | "workExperience": [ 22 | { 23 | "companyLogo": "https://wx2.sinaimg.cn/mw690/a2117cdbgy1fm5xlwuqt2j206y058jrl.jpg", 24 | "companyName": "飞鹰跃动工作室（Eagle Jump）", 25 | "startDate": "2013.01", 26 | "endDate": "present", 27 | "project": [ 28 | { 29 | "name": "精灵物语3", 30 | "sourceCode": "", 31 | "demo": "https://zh.moegirl.org/zh-hans/%E7%B2%BE%E7%81%B5%E7%89%A9%E8%AF%AD3", 32 | "description": "精灵物语3 是 Eagle Jump 主导开发、发行的一款动作冒险游戏。作为游戏的视觉设计团队的一员，主要负责 3D 制作。", 33 | "previewImage": "https://wx2.sinaimg.cn/mw690/a2117cdbgy1fm609x0v47j206x04g75d.jpg" 34 | }, 35 | { 36 | "name": "PECO", 37 | "sourceCode": "", 38 | "demo": "", 39 | "description": "PECO 是一款讲述现代少女坠入了充满玩偶怪物的异世界的游戏。主角的设计灵感来自萌萌的熊型睡袋，和八神光一起完成游戏的角色设计。", 40 | "previewImage": "https://wx3.sinaimg.cn/mw690/a2117cdbgy1fm6zeddd3pj20gl0mfq8d.jpg" 41 | } 42 | ] 43 | } 44 | ], 45 | "personalProject": [ 46 | { 47 | "name": "emmm 好像还没有", 48 | "description": "萌还不够么..", 49 | "sourceCode": "", 50 | "demo": "", 51 | "previewImage": "https://wx3.sinaimg.cn/mw690/a2117cdbgy1fm705blrdlj20jg0jg0ue.jpg" 52 | } 53 | ], 54 | "skills": [ 55 | { 56 | "name": "板绘", 57 | "description": ["其实我画画蛮不错的 (⁎˃ᴗ˂⁎)，虽然没有八神光前辈好"] 58 | }, 59 | { 60 | "name": "3D 制作", 61 | "description": ["从萌新到大佬的进阶之路"] 62 | }, 63 | { 64 | "name": "其他属性", 65 | "description": ["性格认真，永远积极向上的思考"], 66 | "abandoned": ["谁能想到坐拥后宫的女人竟然是个合法萝莉！"] 67 | } 68 | ] 69 | } 70 | -------------------------------------------------------------------------------- /docs/resume-en.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Aoba's resume 8 | 9 | 10 | 11 | 27 | 28 | 29 |
30 | 31 | 32 | 33 | 34 | 35 | 41 | 42 | 43 | -------------------------------------------------------------------------------- /docs/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Aoba's resume 8 | 9 | 10 | 11 | 29 | 30 | 31 |
32 | 33 | 34 | 35 | 36 | 37 | 41 | 42 | 43 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Aoba 2 | 3 | [Aoba's resume](https://luyilin.github.io/Aoba/) 4 | 5 | [English resume](https://luyilin.github.io/Aoba/resume-en) 6 | 7 | ## Introduction 8 | 9 | Aoba is a single JavaScript file that fetches a configuration file (such as a .json file or a .yaml file), and renders it as a lovely one-page resume. 10 | 11 | The project is build by [poi](https://github.com/egoist/poi), then we need not git clone && run build to create a resume, just use it. The design is inspired by the cute [resume](https://github.com/DIYgod/Resume) made by DIYgod. Thanks for the awesome work they done. 12 | 13 | The name is inspired by lovely Aoba Suzukaze in *New Game!*, maybe it can be a gift for young people who enter the workforce, with my best wishes. 14 | 15 | ![Aoba Suzukaze](https://wx3.sinaimg.cn/mw690/a2117cdbly1fm7csm5gopj208z07ijvh.jpg) 16 | 17 | ## Quick Start 18 | 19 | ### Work with the single JavaScript file and the css file. 20 | 21 | * CDN: [UNPKG](https://unpkg.com/aoba-resume@latest/) | [jsDelivr](https://cdn.jsdelivr.net/npm/aoba-resume@latest/dist/) 22 | 23 | * Create an HTML file: `index.html` which will be be your resume: 24 | 25 | ```html 26 | 27 | 28 | 29 | 30 | 31 | 32 | My resume 33 | 34 | 35 | 36 | 37 |
38 | 39 | 40 | 41 | 45 | 46 | 47 | ``` 48 | 49 | * Then write a .json or .yaml file at the same directory where `index.html` is located. 50 | 51 | The file has six parts, basicInfo, contact, application, workExperience, personalProject and skills. See [content.json](https://github.com/luyilin/Aoba/blob/master/docs/content.json) or [content.yaml](https://github.com/luyilin/Aoba/blob/master/docs/content.yaml) for details. 52 | 53 | * Then serve this directory as a static website to deploy an online resume. 54 | 55 | - node.js: `npm i -g serve` && `serve ./docs` 56 | - python: `cd ./docs` && `python -m SimpleHTTPServer` 57 | - golang: `cd ./docs` && `caddy` 58 | - ...etc, you can use any static file server as you like. 59 | 60 | * Finally save the file as pdf, open the file in a browser, choose print and save. 61 | 62 | In case the resume's background color or the circles cannot be displayed when print to pdf, please tick the option: Print - More settings - Background. 63 | 64 | ## Deploy 65 | 66 | ### GitHub Pages 67 | 68 | Simply put all your files in `docs` folder on `master` branch, or root directory on the `gh-pages` branch. 69 | 70 | Don't forget to add `.nojekyll` file to tell GitHub to treat it as a normal static website. 71 | 72 | ## API 73 | 74 | ### Constructor 75 | 76 | ```js 77 | const resume = new aoba(options) 78 | ``` 79 | 80 | ### options 81 | 82 | #### lang 83 | 84 | Type: `string`
85 | Default: `zh` 86 | 87 | support zh & en 88 | 89 | #### path 90 | 91 | Type: `string`
92 | Default: `./` 93 | 94 | #### indexFile 95 | 96 | Type: `string`
97 | Default: `content.yaml` 98 | 99 | The configuration file. 100 | 101 | E.g. [content.json](https://github.com/luyilin/Aoba/blob/master/docs/content.json), [content.yaml](https://github.com/luyilin/Aoba/blob/master/docs/content.yaml) 102 | 103 | The description fields support html syntax. 104 | 105 | #### color 106 | 107 | Type: `string`
108 | Default: `#8d9cd2` 109 | 110 | The theme color. 111 | 112 | E.g. #999, rgb(137,214,217), lightsalmon and so on. 113 | 114 | ### resume.start(target) 115 | 116 | #### target 117 | 118 | Type: `string` `HTMLElement` 119 | 120 | The place to mount app. 121 | 122 | ## License 123 | 124 | MIT © [luyilin](http://github.com/luyilin) 125 | -------------------------------------------------------------------------------- /src/components/App.vue: -------------------------------------------------------------------------------- 1 | 115 | 116 | 166 | 167 | 367 | --------------------------------------------------------------------------------