shu-scheduling-helper-frontend

A web-based timetabler helping SHUers filter and preselect courses easily.

This is a continuation of SHU-scheduling-helper (a Chrome extension). Considering that the update method of the extension cannot adapt to the new online courses selecting system of Shanghai University in a timely way, we decided to make this project online.

The shu-scheduling-helper project has a frontend part and a backend part. For safety reasons, the backend part is private, but its APIs are open.

View Demo View Github

Features

  • Courses looking up and filtering
  • Reserved courses list
  • Colorful timetable with editable random seed
  • Quick inputting
  • Exporting text, backup and restoring
  • Automatic conflicts solving
Frameworks & Main Libraries
Frontend vue
ant-design-vue (UI)
axios (HTTP client)
localforage (Data persistence)
pako (Compression)
vuex (State management)
...
Backend flask
...

Development

Backend APIs

API 1

https://app.zkllab.com/xk/courses/info

API 2

{hash} is presented by API 1

https://app.zkllab.com/xk/courses/{hash}.json

Frontend quick start

$ git clone https://github.com/ZKLlab/shu-scheduling-helper-frontend.git
$ cd shu-scheduling-helper-frontend
$ yarn # install
$ yarn serve # serve at localhost:8080

Build for production

$ yarn build

Directory structure

.
├── babel.config.js
├── public
│   └── ......
├── src
│   ├── apiConfig.js
│   ├── assets
│   │   └── ......
│   ├── mixins   # Mixins for common components
│   │   └── ......
│   ├── pages
│   │   ├── index   # Desktop version
│   │   │   ├── App.vue
│   │   │   ├── components
│   │   │   │   └── ......
│   │   │   └── main.js
│   │   ├── m   # Mobile version
│   │   │   ├── App.vue
│   │   │   ├── components
│   │   │   │   └── ......
│   │   │   └── main.js
│   │   ├── quick-inputting
│   │   │   ├── App.vue
│   │   │   └── main.js
│   │   └── redirect
│   │       └── main.js
│   ├── plugins
│   │   └── ant-design-vue.js
│   ├── storage.js   # Data persistence (compression)
│   ├── store.js   # Core part processing data
│   └── utils.js   # Some reusable logics
└── vue.config.js

GitHub