This is my graduation project topic, originally chose this topic thought is the simplest, did not expect to do a website. But since you have chosen, do it well!

## Development environment

  1. Operating system: Windows 10
  2. Database: Mysql 8.0.22
  3. Vue: 2.9.6
  4. Development tools: Pycharm Community Edition 2020.1.2, VScode
  5. Development language: Python, HTML, JS, CSS

System architecture

Function is introduced

Real-time tracking of the global epidemic

The real-time tracking page of the global epidemic, which supports the display of broken line charts, bar charts, fan charts and thermal maps. Charts are realized by Echarts, and the jump to the sidebar in the upper left corner is supported.

Real-time tracking of the epidemic situation in China

The real-time tracking page of the national epidemic situation supports the display of broken line charts, bar charts, fan charts and thermal maps. The charts are realized by Echarts and the jump to the sidebar in the upper left corner is supported.

Epidemic Information at home and abroad

The display page of domestic and foreign epidemic information, the display page of official headlines, and the page of domestic and foreign news can be clicked to jump to the specific news page.

The login page

Including login, password input, login button, reset button.

Background data Management

Background data management page, including data source selection, data add button, data modify button, data delete button, logout button

Site deployment

The front-end deployment

packaging

1. Locate the config/index.js file and change the path of assetPublicPath to./ 2. In build directory utils.js, find the following configuration to add publicPath: ‘.. /.. / ‘

if (options.extract) { return ExtractTextPlugin.extract({ use: loaders, fallback: 'vue-style-loader', publicPath: '.. /.. } else {return ['vue-style-loader']. Concat (loaders)}Copy the code

3. NPM run build generates the dist folder

Install nginx

Sudo yum -y install nginx sudo systemctl start nginx if you want to enable nginx on system startup. Run the sudo systemctl enable nginx commandCopy the code

Upload the deployment

Conf file in include /etc/nginx/default.d/*.conf. Location / {root /var/myapp/dist/; index index.html index.htm; try_files $uri $uri/ /index.html; } sudo systemctl restart nginxCopy the code

The back-end deployment

Python3 installation

Install the necessary tools yum-utils, Sudo yum install yum-utils Use yum-builddep to build Python3, install missing software dependencies, sudo yum-builddep will automatically handle using the following command Python Python3 after the completion of the download the source code package curl -o https://www.python.org/ftp/python/3.7.6/Python-3.7.6.tgz last step, compile Python3 installation, The default installation directory is /usr/local tar xf python-3.7.6. TGZ CD python-3.7.6. /configure make sudo make install If you want to use Python3 as the default version of Python, you need to modify the #bashrc file, Add a line of alias #alias python='/usr/local/bin/python3.7'. CentOS 7 recommends not to use the /etc/bashrc file. Run the vi /etc/profile.d/python.sh command to write alias python='/usr/local/bin/python3.7' chmod 755 /etc/profile.d/python.sh Restart the session for the configuration to take effect. Source /etc/profile.d/python.shCopy the code

Install the required libraries

The background

Nohup /usr/local/bin/python3.7 -u app.py > test.log 2>&1 & Run the following command to view the scheduled task list in the current system: crontab -l Run the following command to edit the crontab crontab -e 0 6,12,20 * * * /usr/local/bin/python3.7 /home/ec2-user/cov19/app.py > After the crontab service is restarted, run the service crond restart command to restart the crontab serviceCopy the code

Installing the Database

Download and install

Configure the MySQL 8.0 RPM installation source sudo - Uvh https://dev.mysql.com/get/mysql80-community-release-el7-1.noarch.rpm install MySQL 8.0 sudo yum --enablerepo=mysql80-community install mysql-community-server Enable the command systemctl start mysqld check the status systemctl status mysqld Grep "password" /var/log/mysqld.log mysql -uroot -p replace 'new password' with the password you want to set. Note: The password must be lowercase, alphanumeric and special characters (,/'; ALTER USER 'root'@'localhost' IDENTIFIED BY 'new password'; Mysql > use mysql; mysql> select host, user, authentication_string, plugin from user; Mysql > CREATE USER 'root'@'%' IDENTIFIED BY 'Password'; Mysql > GRANT ALL ON *.* TO 'root'@'%'; Mysql >ALTER USER 'root'@'%' IDENTIFIED WITH mysql_native_password BY '040315'; Mysql_native_password mysql> flush PRIVILEGES;Copy the code

Existing BUG

  1. When the page switches, the previous page’s request to the back end still exists and is not destroyed
  2. The login implementation relies on the status field in the database, and cannot save the login status and exit due to timeout
  3. The global Pandemic map shows data graphically in English, but fails to be translated into Chinese

The project address

Github.com/ndmiao/cov-…

reference

The system large screen display page referencewww.bilibili.com/video/BV177…implementation


GitHub @ndmiao · BiliBili @South Island U · Zhihu @South Island U · CSDN @South Island U · Blog park @South Island U · Personal site @South Island U