Refactor: Vue NodeJS #44
Draft
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This commit completes the refactoring of the application from a Python-script-based system to a modern full-stack architecture.
Key changes:
1. **Backend:**
* Implemented a Node.js server using Express.js located in the `backend/` directory.
* The backend fetches data from the AtCoder API (`problem-models.json`, `merged-problems.json`), processes it, and serves it via API endpoints:
* `/api/stats`
* `/api/chart`
* `/api/problem_dict`
* `/api/all_data`
* This replaces the functionality of the old `dict.py`.
2. **Frontend:**
* Developed a Vue.js 3 application (using Vite) located in the `frontend/` directory.
* The frontend consumes data from the Node.js backend.
* It replicates the UI and functionality of the previous static HTML pages, including:
* Displaying AtCoder contest statistics in tabbed tables.
* Showing lists of problems when table cells are clicked.
* Theme toggling (light/dark modes) and color scheme selection.
* Vue Router is used for navigation (though currently simple).
* This replaces the functionality of `main.py` and the static HTML/JS/CSS in the `web-page/` directory.
3. **Project Structure:**
* The codebase is now organized into `backend/` and `frontend/` directories.
4. **Documentation:**
* The `README.md` has been updated with instructions for setting up and running both the backend and frontend, and details about the new architecture.
5. **Cleanup:**
* Removed old Python scripts (`dict.py`, `main.py`, `requirements.txt`).
* Removed the old `web-page/` directory.
* Reusable static assets (logo, favicon) were moved to `frontend/public/`.
This refactoring aims to improve maintainability, scalability, and the developer experience by leveraging modern web technologies.
This commit introduces CI workflows using GitHub Actions and prepares your application for deployment on Vercel.
Key changes:
1. **Backend CI (`.github/workflows/backend-ci.yml`):**
* Sets up ESLint for the Node.js backend.
* Adds a GitHub Actions workflow that triggers on push/pull_request to the `backend/` directory.
* The workflow installs dependencies, runs ESLint, and performs a basic check on the server module.
2. **Frontend CI (`.github/workflows/frontend-ci.yml`):**
* Sets up ESLint for the Vue.js 3 frontend.
* Adds a GitHub Actions workflow that triggers on push/pull_request to the `frontend/` directory.
* The workflow installs dependencies, runs ESLint, and builds the frontend application.
3. **Backend Adaptation for Vercel:**
* Modified `backend/server.js` to export the Express `app` instance instead of calling `app.listen()`, making it compatible with Vercel's serverless Node.js environment.
4. **Cleanup Old Workflows:**
* Removed obsolete GitHub Actions workflow files (`pr-preview.yml`, `test-on-push.yml`, `update-gh-pages.yml`) that were specific to the previous Python-based build and GitHub Pages deployment.
This setup allows for automated checks on code quality and build success before deployment, with Vercel intended to handle the actual deployment (CD) process.
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
No description provided.