Summary of technical points used in single page development web App projects

First of all the technologies needed in the project depend on the business, so let's say business overview

1. Business Overview

Individual users apply for listings online

2. Technology decomposition

2.1 Project Layout structure

2.2 Development environment

2.2.1 Installation Nodejs Environment

@echo off
REM ======= How to install the handlebars compiler =======
rem 1. Download and install the Nodejs to https://nodejs.org/
REM 2. Open cmd and navigate to the project directory
REM 3. Execute npm Install handlebars-g command
REM 4. Execute npm Install grunt-cli-g command
REM 5. Execute NPM Install command
REM 6. Execute Grunt Watch command
REM ========================================

Grunt Watch

2.2.2 Turn on precompiled monitoring before each development
Open the cmd window ( with Administrator's permission )and execute the following command: Grunt watch
Purpose: Automatically generate JS script (generate to release folder) for page presentation

2.3 General ideas using Mobilebone.js-mobile Mobile web App single page toggle skeleton

The following is the JS description:

2.3.1 JS: Storage core JS file, including Project business JS file

JS\BIAPI.JS:API Data Communication (JSONP cross-domain)

Js\biui.js:handlebars.js (JS template engine)

Js\bifile.js: Uploading Files

Js\birouter.js: Routing

JS\DISPATCHER.JS:JS configuration file

------------------------------------

Third-party references:

Lib:jquery.min.js:JavaScript Library

LIB\MD5.MIN.JS:MD5 encryption

Lib\fastclick.min.js: As you may all know, on mobile devices, there is a click long delay, the user in the operation of the time will always be a bit strange not smooth feeling

Lib\mobilebone.min.js:mobilebone.js-mobile Mobile web App single page toggle skeleton

Dynamic load script file in Lib\lab.min.js:labjs

2.3.2.templates: Store the page template file, automatically compiled by node to JS generated into the release directory;

2.3.3.release: Post-generated JS file for page presentation

Summary of technical points used in single page development web App projects