This is the first day of my participation in Gwen Challenge

Recently around a lot of front-end friends are asking, if you write a good front-end UI project, simply want to put in the cloud server to access the domain name or host name can see the site UI, how to break?

Student committee thought about it, write Java also need to Use SpringBoot or Tomcat, this finish still have to install Java on the server. That’s a lot of work for the back end or the front end.

So Python’s HTTP Server module came to mind.

This is minimal server code:

  • If the cloud host has Python version 3.X, run the following command in the UI project directory:
python -m http.server 80 
Copy the code
  • If the cloud host has Python version 2.x, run the following command in the UI project directory:
python -m SimpleHTTPServer 80 
Copy the code

Then open the domain name bound to the server to see the UI

Here’s a slightly easier way to do it

A simple script to start the server according to the different Python versions above

Step 1 Set the web.sh script

Create a directory such as “fxcgo”, copy the following code and save it as web.sh

Change the path of the Web page directory (including index.html).


#! /bin/sh

The web variable value is the directory of the target UI file (that is, the directory containing index.html)
web=./ui/

version=$(python -c 'import sys; print(sys.version_info[:1])')

echo $version

log=${web}/.. /server.log# backup log
mv ${log} ${log}`date`

cd ${web}

Determine the current Python version
if [ "$version"= ="(3)"];then
    nohup python -m http.server 80 > ${log}2 > &1 &else
    nohup python -m SimpleHTTPServer 80 > ${log}2 > &1 &fi
Copy the code

Step 2 Create a UI directory and put an index. HTML in it

Create a new “UI” directory within the “fxcGo” directory you created earlier.

This directory is to put the front-end compiled static code, the whole site of static resources, including static pages such as index.html.

For example, the home page shown at the end of this article, go to the “UI” directory and write index.html as follows:

<html> <head> <meta http-equiv="Content-Type" content="text/html; Charset = utf-8 "/ > < title > coalition against plagiarism < / title > < / head > < body > < / body > < / HTML >Copy the code

The project is called fxcGo, so the final directory structure looks like this:

Copy the following command to execute the script to start and check the effect:

bash web.sh
Copy the code

Here is a rendering of the visit to the home page:

Above, the directory name is not “fxcGo”, but the “UI” directory must be placed within the project.

Continuous learning and continuous development, I am Lei Xuewei! Welcome to follow/collect/forward, your support will give me a steady stream of power!

The project code continues to be updated (now supports Linux/Mac one-line installation) : Lite-Server