final version for 2025

2025-10-16 04:56:10 +08:00
parent 7bfd5dc641
commit 13fc08a5dc
5 changed files with 130 additions and 130 deletions
@@ -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
@@ -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 <your-repository-url>
+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 <http://localhost:8080>)
+- `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.
@@ -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"
-  }
-}
@@ -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"
-  }
-}
@@ -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",