Component Development WebApp The first chapter of the whole station

1-1 Course Introduction
1-2 Course Schedule
The course arrangement is divided into two areas: development process and technology implementation
1-2-1 Development process
Why do you say the process
What to do with each process
What's wrong with each link
Responsibility for the issue
1-2-2 Technology Implementation
Technical planning, selection
Design easy-to-expand development scenarios
Develop various charting components
1-3web Project Development Process Introduction
1-3-1 Why do you say the development process
1. Can improve development efficiency
2. Prevent back Pot
Division of the 1-3-2 development process
The development process is divided into three stages: before development, in development, after development
1) before development
Product function Design Product Manager output: Product requirements Documentation
Visual/Interactive Design artwork output: Visual design draft, interactive design draft
2) in development
Technical Planning Technical Manager output: Project development documentation (whether product requirements are reasonable, product code can be reused, complex projects can be split)
Front-end development front-end development Engineer output: HTML pages that match the visual manuscript, JS code that matches the interactive manuscript
Backend Development Backend Development engineer output: Back-end logic interaction, data interaction
3) after development
Test and test Engineer output: Perform functional testing on Web pages to meet the needs of product managers
On-line Operations engineer output: Code deployment to the server and external release
1-4 Introduction to Development role abbreviations
1) Product Manager
Product Manager, Pm--product Manager
Mrd--market Requirements Document Market requirements Documentation
2) Artwork
Ui--userinterface Interface Visual Design
Ue--userexperience User Experience Design
3) Technical Manager
Pm--project Manager Project Manager
4) Front-end development
Fe--frontend Developer Engineer
5) Back-end development
Be--backend
Rd--research Developer
6) Testing
Qa--quality Assessment
7) operation and maintenance
Op--operate
1-5 Product Design
1-5-1 Requirements Document--interactive design--visual design artwork
9 pages of 1-5-2 design
Cover core concept (graphic) course distribution (line chart) move tutorial (pie chart) front-end Tutorial (bar chart) back-end Tutorial (radar chart)
Sign up for WAN (Circle map) difficulty distribution (scatter chart) last
1-6 Development Planning
Technical Manager output: project development Documentation
1) Feasibility Confirmation
2) Technology Selection
3) Development/on-line environmental planning
4) Technology Development Program Design
5) How to collaborate in a team

Technology Development Program Design
4.1) page DOM operations
Technology selection: JQuery
Introduction: A Lightweight JS framework
Features: 1) Powerful selector
2) Excellent DOM operation package
3) reliable event-handling mechanism
4.2) page Switching function
Technology selection: Fullpage.js Plug-in
Introduction: jquery Plugin
Features: Simple API, easy to use, cross browser
4.3) Organization content structure scheme
Page--component Page--Components
Broadly divided into two categories: graphic components and chart components
4.4) Technical points
HTML+CSS implementation of bar chart, scatter plot
Canvas for line charts, radar charts, pie charts, ring plots

Component Development WebApp The first chapter of the whole station