design

homepage

5 functional areas: commodity search function, website navigation, advertising round, commodity classification hot sales, website tail

Merchandise list page

4 functional areas: commodity search function, website navigation, commodity classification, commodity list information

Product details page

5 functional areas: product search function, website navigation, basic information of products, detailed introduction of products, hot sales recommendation

Shopping cart page

Three functional areas: commodity search function, website navigation, commodity purchase cost accounting

Personal Center Page

4 functional areas: commodity search function, website navigation, user basic information, order information

The user logs in to the registration page

Three functional areas: product search function, website navigation, login registration form

Data structure diagram

Set up project function configuration

Create project applications (App) Index, Commodity and Shopper

Command line input

python manage.py startapp index
python manage.py startapp commodity
python manage.py startapp shopper
Copy the code

Create folders media, pstatic, and template

The babys folder is the same as the project name and contains the files __init__.py, asgi.py, settings.py, urls.py, and wsgi.py

Commodity is a Django created project application (App). The folder contains __init__.py, admin.py, apps.py, models.py, tests.py, and views.py files.

Index is a djangos created project application (App) folder containing the same files as The Project Application (App) Commodity, which implements the home page of the web site.

Media is the media resource of the website, which is used to store the main picture and detailed picture of the product.

Pstatic is the static resource of a website. It is used to store the static resource files of a website, such as CSS, JavaScript, and interface images.

Shopper is also a project application created by Django. It mainly implements shopping cart page, personal center page, user login and registration page, online payment functions, etc.

Templates is used to house HTML template files, the page files of your web site.

Manage.py is a command line tool for your project with a variety of built-in methods to interact with your project.

Manage.py help to view the tool’s instructions.

Adding a project application

Admin: built-in background management system. Auth: built-in user authentication system. Contenttypes: Logs all model metadata in your project (Djangos ORM framework). Sessions: Session Indicates the Session function, which identifies the current user who accesses the website and records related user information. Messages: message prompt function. Staticfiles: Finds static resource paths.

Adding Middleware

SecurityMiddleware: A built-in security mechanism that helps secure communication between users and web sites. SessionMiddleware: Session Session functionality. LocaleMiddleware: Internationalization and localization capabilities. CommonMiddleware: Processes request messages and normalizes request content. CsrfViewMiddleware: Enables CSRF protection. AuthenticationMiddleware: Enables the built-in user authentication system. MessageMiddleware: Enables the built-in message prompt function. XFrameOptionsMiddleware: Prevents malware from single-click hijacking.

Configuring the Database

Create a database and configure it to enter your corresponding database name, user, password, address, port,

Check the database: If a data table appears in the database, the configuration is successful

Configuring Static Resources

Settings. In py

STATIC_URL = '/pstatic/'
Djangos static resources are routed to enable the browser to access Django static resources successfully.
STATICFILES_DIRS = [
    os.path.join(BASE_DIR,'pstatic'),]// To access static resource files on a web page, write the pstatic folder to the resource collection STATICFILES_DIRS
STATIC_ROOT = os.path.join(BASE_DIR,'AllStatic')
// Implement the mapping between server and project. STATIC_ROOT collects static resources for the entire project and stores them in a new folder, which is then mapped to the server.
Copy the code

Configuring Media Resources

Typically, STATIC_URL is the routing address for static files, such as CSS style files, JavaScript files, and commonly used images. For some frequently changing resources, they are usually stored in the media resources folder, such as the user profile picture, the main image of the product, the product details, and so on.

MEDIA_URL='/media/'
MEDIA_ROOT = os.path.join(BASE_DIR,'media')

Copy the code

Resources: Mastering Django 3 Web Development