Transfer from https://www.cnblogs.com/mdengcc/p/6475733.htmlhave been doing the front-end, suddenly thought that if one day leaders let themselves bear a Web project if there is enough capacity to take this task, to learn to build some basic tool information. All of this in the heart to have a general process, or the real time will inevitably be rushed up, can not do this job inevitably lost a performance of their own opportunities, the next do the worse, the more impact on the money, the future AH. Therefore, this paper summarizes the process of doing PC-side project.
first, understand and clear the need. This should be the first step, do not understand the requirements you do not know why to do, how to do the work of the project. (1) Clear demand is very important, it is necessary to communicate with product managers, designers, need to understand each button, each switch the meaning of existence, this requires the design staff to understand the needs of the project. Before doing a project is like this, pay a lot of money to ask a UI design company designed a very tall products, various kinds of page cool, leadership feel very satisfied, hurriedly let us do, the result, really to our developers in the hands of the development of the time, only to find some things although here is cool, But it's not supposed to be here. For example, do you put the add-on button under the management of the people group, rather than people management, what's the point? The results can be imagined, not only some functional white design and due to the project time relationship also we have to develop to assume the design, redesign the function of the display location, which undoubtedly delayed the progress of the project. (2) Background interface problems, the general large company foreground and background is separate, if the separation needs to go with the background to determine the various interfaces, to have a document to manage these background interfaces, to have samples, test data. Now it's generally a restful API for easy invocation. Management platform The first company is an internal interface management system called OSG, here is a transit point for all interfaces, the interface of each department goes from here, and some use Showdoc to manage. If the front and back end is not separated, the backstage will have to develop their own, this with node or other languages, but also to do a corresponding treatment. (3), clear function points, do the task assignment. If you are a leader, then this part of the work may require you to do, listing all the business function points, listed as an Excel file, clear the owner of each function, completion time, technical difficulties and so on. This step is also a very important step. (4) Development time to determine this to ensure that the development time is sufficient, or hurry to finish a bunch of bug change is also very painful. This and back and forth together to confirm, otherwise the front end is finished, found that the backend interface is not perfect, but also a delay time.
Second, clear technology selection. This step is also very important and needs to be designed by the designer to determine what framework the job should be used to do. (1) The most basic page layout work, is to use bootstrap, flex or handwritten CSS layout or other, need to go to the beginning to determine, otherwise really do, different developers use different things, obviously will cause confusion of project code. (2) is the CSS on the page purely handwritten or less or sass? This is done according to the circumstances of the project, and once used, these scripts need to be compiled, which can be performed with some automation tools such as Gulp Webpack, You can also use sublime (I used this), Webstorm and other editors to bring their own plug-ins, or use the koala compile to compile. (3), JS module is used sea.js or require.js? is still not modular. No modularity when the project is very large, the code will become very difficult to maintain, so it is recommended to modular, as to whether it is to use sea.js or require.js this to see their favorite, the difference is mainly one is asynchronous one is synchronous, specific differences asked degrees Niang, Google. (4), Chart module, table, etc. with what to achieve. The chart has: Echarts, highcharts, table has bootstrap table, jggrid,datatables and so on.
third, the use of automated tools. Now a variety of automation tools, such as: Webpack, Gulp, Grunt, and so on, (technical update is too fast), to the present I will only gulp a little low, feel the sense of the Times. This step of the work is mainly to reduce some duplication of work, such as compression js, CSS, page real-time refresh and other work. My most recent project is to use the Gulp in the project HTML, JS file for multilingual processing, With Gulp read each sentence in the language.js of the corresponding variable, and then replace the page into an English version and the Chinese version of the two copies, such work must also be automatic tools to deal with, or write two of the words shall not be painful to die.
Four, the basic code of the modularization. All of these are preparatory work, but also a very important part. This step starts with a real start on the job. (1), if the use of automation, automated script is to write, specifically how to achieve the automation you need to work, how to reduce duplication, boring work will greatly improve development efficiency, shorten development time. (2), and further is the page Alert, dialog box (confirm), modal window (Layer,boostrap modal), authentication module (such as: mailbox, phone number verification, not empty validation, etc.), date processing (such as: Date add, format, etc.), These need to be dedicated to modularity, and must be done before the real business code starts, otherwise it will be very laborious to modify later. (3) There is a need for someone to work on the difficult technical problems in the project ahead of time to ensure that the real business began to develop, the technology can be achieved.
v. The modularization of the business code. The start of this step is to really start to touch the business of things. Before you start this step, of course, you have to have a design document, assuming you already have one. Function code can also be modular, the project design documents appear in the more than the display of the content of the extraction, such as tables, displays, common style, page layout and so on, extraction out, specify a dedicated two developers to develop, modular, and then have a person to make calls to these modules, assembly. This part of the work for the most familiar people to do the corresponding work, can improve the development efficiency. This section includes interfaces with the background, so make sure that you have an interface to make calls.
six or 0 broken task assignments. After the function of large chunks is the function point, this should be assigned when the task is allocated, of course, when the previous work is done to see the work of the developers to allocate, to ensure that everyone has a job, to ensure that the project will not procrastinate.
when the above work is finished, the function of the whole project is basically completed. It's a good idea to have your own developers test their own functionality. After the self-test is completed and tested for testing, follow-up is a bug fix problem.
Viii. Summary of the project. The project is finished to summarize, you can open an internal meeting, the development of their own difficulties in the process of problems raised, we listen to how to solve the problem, or who is interested in what other people develop, want to know how to achieve and internal principles, at this time can communicate the exchange, This kind of communication is very helpful to improve the skills of team members. Then we'll have a meal together to improve the friendship of the team. In the process, if a developer has done a similar function for too long, it may feel dull, so it is painful to avoid the development of a large piece of content by a single person, even if there is no one to communicate with. Because I have this kind of experience. The above is some of my summary, I hope that we can have a bit of help. If there are different views, please ask. ——— End
Web project development process PC-side
