From 13fc08a5dc71ce8a9d6ab6e2fa2fd67f0afa332f Mon Sep 17 00:00:00 2001 From: hoelee Date: Thu, 16 Oct 2025 04:56:10 +0800 Subject: [PATCH] final version for 2025 --- .gitignore | 25 ++++++ README.md | 121 +++++++++++++++++++++++++----- package-backup.json | 54 ------------- package-updated-conservative.json | 54 ------------- package.json | 6 +- 5 files changed, 130 insertions(+), 130 deletions(-) delete mode 100644 package-backup.json delete mode 100644 package-updated-conservative.json diff --git a/.gitignore b/.gitignore index c1aab8b..f6bbfe0 100644 --- a/.gitignore +++ b/.gitignore @@ -13,6 +13,10 @@ node_modules/ npm-debug.log* yarn-debug.log* yarn-error.log* +lerna-debug.log* + +# Vite +.vite/ # IDE .idea/ @@ -22,6 +26,7 @@ yarn-error.log* # OS Thumbs.db +.DS_Store # Environment .env @@ -29,3 +34,23 @@ Thumbs.db .env.development.local .env.test.local .env.production.local + +# Logs +logs +*.log + +# Coverage directory used by tools like istanbul +coverage +*.lcov + +# Optional npm cache directory +.npm + +# Optional eslint cache +.eslintcache + +# Package backup files (if you want to ignore them) +package-backup.json +package-modern.json +package-updated-conservative.json +package-vue2-working.json diff --git a/README.md b/README.md index 928de8e..825e9d7 100644 --- a/README.md +++ b/README.md @@ -1,34 +1,117 @@ -本项目源于：https://github.com/jirengu-inc/animating-resume。向作者表示深深的敬意。 +# Mr. Hoelee Resume - Animated Resume -## 使用方法 +This project is inspired by: [Animating Resume](https://github.com/jirengu-inc/animating-resume) +Deep respect to the original author. -1. 安装Node.js环境：https://nodejs.org/ +An interactive animated resume built with Vue 3 and Vite that showcases your professional profile in a unique and engaging way. Features responsive design with separate mobile and desktop experiences. -2. 安装git: https://git-scm.com/ +## Prerequisites -3. 执行以下命令： +- **Node.js**: >= 18.0.0 ([Download](https://nodejs.org/)) +- **npm**: >= 9.0.0 +- **Git**: [Download](https://git-scm.com/) -``` bash -git clone https://github.com/sitexa/anires.git -cd anires +## Usage + +1. Clone this repository: + +```bash +git clone +cd hoelee-profile2 npm install npm run dev ``` -## 部署方法 +2. The development server will automatically open in your browser at `http://localhost:8080` -1. 编辑 config/index.js，修改第 10 行的 assetsPublicPath，值为 `项目名/public`。如果你没有修改项目名 anires，则可跳过此步骤。 +## Build and Deployment -2. 编译、上传 - -``` -bash +### Building for Production + +1. Build the project: + +```bash npm run build -git add . -git commit -m "update" -git push ``` -3. 开启 GitHub Pages 功能, 或者，把生成的目标文件```public/*```放在你的web服务器上。 +2. The built files will be generated in the `dist/` directory -4，访问地址：https://your-github-username.github.io/anires/public +### Deployment Options + +#### Option 1: Static Web Server + +Upload the contents of the `dist/` directory to any static web server (Netlify, Vercel, GitHub Pages, etc.) + +#### Option 2: Preview Locally + +Test the production build locally: + +```bash +npm run preview +``` + +## Development + +- `npm run dev` - Start development server with hot reload (opens at ) +- `npm run build` - Build for production (outputs to `dist/` directory) +- `npm run preview` - Preview production build locally + +## Project Structure + +```text +src/ +├── App.vue # Desktop version of the resume +├── Mobile.vue # Mobile-optimized version +├── main.js # Entry point with responsive logic +├── assets/ # Stylesheets and static assets +│ └── reset.css # CSS reset styles +└── components/ # Resume components + ├── ResumeEditor.vue # Resume content editor + ├── StyleEditor.vue # Style/CSS editor + └── ThankEditor.vue # Thank you section +``` + +## Features + +- **Responsive Design**: Automatically switches between desktop and mobile versions based on screen width (500px breakpoint) +- **Interactive Animation**: Type-writer effect for resume content +- **Live Preview**: Real-time preview of resume as it's being "typed" +- **Modern Stack**: Built with Vue 3 composition API and Vite for fast development +- **Syntax Highlighting**: Integrated Prism.js for code highlighting +- **Markdown Support**: Uses marked.js for markdown parsing + +## Customization + +### Personalizing Your Resume + +1. **Content**: Edit the resume content in `src/components/ResumeEditor.vue` +2. **Styling**: Modify CSS styles in `src/components/StyleEditor.vue` +3. **Layout**: Adjust the main layout in `src/App.vue` (desktop) or `src/Mobile.vue` (mobile) +4. **Title**: Update the page title in `index.html` + +### Configuration + +- **Port**: Development server port is set to 8080 in `vite.config.js` +- **Build Output**: Configured to output to `dist/` directory with organized asset structure +- **Aliases**: Path aliases are set up for easy imports (`@`, `src`, `assets`, `components`) + +## Technologies Used + +- **Vue 3** - Progressive JavaScript framework with Composition API +- **Vite** - Next-generation frontend build tool +- **Prism.js** - Syntax highlighting library +- **Marked** - Markdown parser and compiler +- **CSS3 Animations** - Smooth typing animations and transitions +- **PostCSS & Autoprefixer** - CSS processing and vendor prefixing + +## Browser Support + +This project uses modern JavaScript features and is compatible with: + +- Chrome/Edge 88+ +- Firefox 85+ +- Safari 14+ + +## License + +This project is for personal/educational use. Please respect the original author's work. diff --git a/package-backup.json b/package-backup.json deleted file mode 100644 index 8e98401..0000000 --- a/package-backup.json +++ /dev/null @@ -1,54 +0,0 @@ -{ - "name": "animation-resume", - "version": "1.0.0", - "description": "animation resume", - "author": " <>", - "private": true, - "scripts": { - "dev": "node build/dev-server.js", - "build": "node build/build.js" - }, - "dependencies": { - "marked": "^0.3.9", - "prismjs": "^1.6.0", - "vue": "^2.1.10" - }, - "devDependencies": { - "autoprefixer": "^6.7.2", - "babel-core": "^6.22.1", - "babel-loader": "^6.2.10", - "babel-plugin-transform-runtime": "^6.22.0", - "babel-preset-es2015": "^6.22.0", - "babel-preset-stage-2": "^6.22.0", - "babel-preset-stage-3": "^6.22.0", - "babel-register": "^6.22.0", - "chalk": "^1.1.3", - "connect-history-api-fallback": "^1.3.0", - "css-loader": "^0.26.1", - "eventsource-polyfill": "^0.9.6", - "express": "^4.14.1", - "extract-text-webpack-plugin": "^2.0.0-rc.2", - "file-loader": "^0.10.0", - "friendly-errors-webpack-plugin": "^1.1.3", - "function-bind": "^1.1.0", - "html-webpack-plugin": "^2.28.0", - "http-proxy-middleware": "^0.17.3", - "opn": "^4.0.2", - "ora": "^1.1.0", - "semver": "^5.3.0", - "shelljs": "^0.7.6", - "url-loader": "^0.5.7", - "vue-loader": "^10.3.0", - "vue-style-loader": "^2.0.0", - "vue-template-compiler": "^2.1.10", - "webpack": "^2.2.1", - "webpack-bundle-analyzer": "^2.2.1", - "webpack-dev-middleware": "^1.10.0", - "webpack-hot-middleware": "^2.16.1", - "webpack-merge": "^2.6.1" - }, - "engines": { - "node": ">= 4.0.0", - "npm": ">= 3.0.0" - } -} diff --git a/package-updated-conservative.json b/package-updated-conservative.json deleted file mode 100644 index e848c32..0000000 --- a/package-updated-conservative.json +++ /dev/null @@ -1,54 +0,0 @@ -{ - "name": "animation-resume", - "version": "1.0.0", - "description": "animation resume", - "author": " <>", - "private": true, - "scripts": { - "dev": "node build/dev-server.js", - "build": "node build/build.js" - }, - "dependencies": { - "marked": "^2.1.3", - "prismjs": "^1.30.0", - "vue": "^2.7.16" - }, - "devDependencies": { - "autoprefixer": "^6.7.7", - "babel-core": "^6.26.3", - "babel-loader": "^6.4.1", - "babel-plugin-transform-runtime": "^6.23.0", - "babel-preset-es2015": "^6.24.1", - "babel-preset-stage-2": "^6.24.1", - "babel-preset-stage-3": "^6.24.1", - "babel-register": "^6.26.0", - "chalk": "^1.1.3", - "connect-history-api-fallback": "^1.6.0", - "css-loader": "^0.28.11", - "eventsource-polyfill": "^0.9.6", - "express": "^4.21.2", - "extract-text-webpack-plugin": "^2.1.2", - "file-loader": "^0.11.2", - "friendly-errors-webpack-plugin": "^1.7.0", - "function-bind": "^1.1.2", - "html-webpack-plugin": "^2.30.1", - "http-proxy-middleware": "^0.17.4", - "opn": "^4.0.2", - "ora": "^1.4.0", - "semver": "^5.7.2", - "shelljs": "^0.7.8", - "url-loader": "^0.6.2", - "vue-loader": "^10.3.0", - "vue-style-loader": "^2.0.5", - "vue-template-compiler": "^2.7.16", - "webpack": "^2.7.0", - "webpack-bundle-analyzer": "^2.13.1", - "webpack-dev-middleware": "^1.12.2", - "webpack-hot-middleware": "^2.26.1", - "webpack-merge": "^2.6.1" - }, - "engines": { - "node": ">= 12.0.0", - "npm": ">= 6.0.0" - } -} \ No newline at end of file diff --git a/package.json b/package.json index ab5a715..8b882b7 100644 --- a/package.json +++ b/package.json @@ -1,8 +1,8 @@ { - "name": "animation-resume", + "name": "hoelee-profile", "version": "2.0.0", - "description": "animation resume - modernized", - "author": " <>", + "description": "Hoelee's animated resume - modernized", + "author": "Hoelee <>", "private": true, "scripts": { "dev": "vite",