Finally, I clicked the skill tree of ASP. NET mvc3.

In order to publicize the C ++ GUI library I wrote, I decided to create a website for him a few months ago. After several months of continuous restructuring, now the website architecture is finalized. I have almost no experience developing websites before, so I will make a summary here to introduce what happened along the way.

At first, we purchased a hichina domain name and a very cheap 500 RMB space for making this website. This space supports earlier versions of Asp.net, but I didn't learn this yet. Later, I began to learn HTML and CSS and made several pages. Different browsers have different bugs, making HTML and CSS quite complicated. In particular, the combination of Div and float is even worse. Later, the entire web page was laid out in a table. Although table layout is not a popular practice, gacui's website does not have much complicated content, so in the end, this avoids many cross-browser issues. Of course, if the webpage content becomes too complex in the future, you should always change it back to the div. For me who write graphics and compilers all the year round, I was shocked by the disorder when I first came into contact with htm and CSS. In terms of experience and standards in the field of programming language, HTML, CSS, and JavaScript as programming tools are really bad enough. However, the existence of things is always rational. Looking at the development and history of these three things, we will find that the process is full of various coincidences, these things were just invented to solve some simple problems. Today, just like COBOL, Java, and C, programmers all over the world can only accept the vulnerabilities they cannot ignore and develop them in this way.

After getting familiar with simple HTML and CSS, I began to build a website for gacui. The main purpose of this website is to introduce the features of gacui, display some demos, tell people how to download and use it, and finally provide an online document. The document is the same as that in msdn. Of course, the search function does not exist. At the beginning, I encountered an artist problem. Skill books are all written on system software, and naturally their artists cannot satisfy themselves. Later I found several examples. I think it is still the most pleasing to the eye at http://www.codeplex.com. But its code is complicated to vomiting blood, so I had to draw a gourd Based on the samples, and I began to learn it slowly. I am satisfied with the final replay results. After completing the navigation bar, I found a problem. If you do not use the current framework for Web pages, but use a hand-written method to generate HTML files, you will not be able to DIY. However, at that time, I was not aware of the seriousness of the problem, so I used a simple and crude method to copy the code to complete the five pages. This also laid the groundwork for me to switch to Windows azure.

After that, the demo presentation page is relatively smooth. Because the current demo display method is to paste the C ++ code first, which is very simple and crude. So I immediately encountered a new obstacle, how to write an HTML document similar to msdn. In fact, this issue has nothing to do with website preparation. However, since the decision to provide online documents, this problem cannot be avoided. C ++ has previously studied the method of generating documents. After all, a simple prototype of this function is my work that I participated in the software competition with a few friends in my freshman year. Later, we also considered tools such as doxygen. However, since the documents generated by doxygen are difficult to adjust their styles and integrate them into the style of my website, I finally gave up. Then I remembered the XML annotation function of Visual Studio. After a few studies, I wrote XML annotations for the public class of the entire gacui class library. When I finally want to execute the document generation step, I found that all tools do not support the document generation function of native C ++ programs and XML annotations. But it actually makes sense. After Visual Studio compiles XML annotations, an XML file only contains the correspondence between symbols and annotations. There is no such thing as what a symbol is. So how does a. Net Program generate a document? Naturally, reflection is used. The hard work of C ++ is here. Apart from writing code directly, there is no way. However, it is a pity that I have written so many XML documents and want to give up, so I keep searching for them and find that Visual Studio provides a library called DIA during installation, let me read the PDB file!

This left me ecstatic. Since the Visual C ++ debugger can get all the information by reading PDB (you can see the perfect debugger interface !), I can also find everything in PDB. With this idea, I began to study the semantic structure of the native C ++ PDB file, and later I wrote my experience into these two blogs: NLP. Although PDB does not contain the direct information of the template class, this is not a problem for the time being, because most of the gacui classes are not template classes. After these studies, I got a function equivalent to static reflection. The reason is static because I cannot call a function through reflection like A. Net program. However, this is sufficient for generating documents. Then I wrote a program and read the PDB to get all the symbols dump out an XML file, then write another program to associate the symbols in XML with the symbols in the XML comments generated by Visual Studio (this process is a bit complicated because the Representation Methods on both sides are different ......), We have obtained an XML file containing dozens of MB of characters and corresponding annotations. Then I designed a simple document format and wrote a program to convert the dozens of MB XML files into a document expressed in that simple document format. This is because, in the future, documents in other formats may be generated in addition to HTML, so a program-readable intermediate format is implemented. The last step is to read these files to generate HTML files. The process is as follows:

PDB (provided by VC ++ compiler)-> symbols. XML (because Dia is a COM component, I use C ++ to write this step. All the steps below are written in C. C # it's easier to use ......)
Symbols. XML + comment. XML (provided by VC ++ compiler)-> fullsymbols. xml
Fullsymbols. XML-> * .docitem.txt
* .Docitem.txt-> *. html

After these steps, I got more than one thousand five hundred HTML files in a whole folder. Then I uploaded these files together with my website and got the first version of gacui Website: http://www.gaclib.net /. Of course, the first version of the website is no longer visible. After completing these steps, I paused and continued to develop gacui. While developing a demo, you can add a demo page to generate new documents and eliminate useless function documents. It is easy to write code. When the code changes are reflected on this website, it shows the weakness of a handwritten pure static Website: It is really troublesome to maintain TMD! Although the above steps have been merged into a bat file, it can be automatically completed every time you double-click it, but the demo page is modified by humans. This makes me very uncomfortable.

By chance, I registered a Windows azure space with a credit card. This space is actually not powerful. It only gives me the computing power of six CPUs. However, this website is sufficient. I thought that every time I modify my website, I had to copy the HTML code. If I modified the structure, I had to move all the HTML files. After about a month, I made up my mind to make HTML dynamically generated. After reading some introduction to Windows Azure, I think ASP. Net mvc3 and simple storage functions of Windows azure are very suitable for this kind of thing.

It was difficult for me to get started with mvc3, but the biggest difficulty was to understand the router mechanism. The content of gacui websites is simple, so other advanced technologies of ASP. NET are not required. As a result, all the difficulties occur in the router mechanism. After two days of study, I initially learned how to use it. The router of mvc3 is basically a pattern matching process, which maps your url to a call to the Controller. You can not only map the class name and function name of the controller, but also extract some parameters from the URL. After understanding the principle of router, it feels like writing Haskell, And it is straightforward and refreshing. The next step is the razor template. From the perspective of programming language, Razor is a well-designed template language. The first feature is the close integration with the host language C #, and the second feature is that there is almost no syntax noise. People who have used the original ASP and PHP know that the code is full of <%>. Every code and HTML switch must be <%>, and the entire file is a mess at a glance. Razor solves this problem well. He uses a complicated method to identify what is C # And what is HTML. Switching a small part of C # And HTML requires a @ symbol, and most switches are automatic. Although Razor may occasionally analyze errors, it still provides the @: operator to let us work around this analysis process. There is no syntax noise in the template language. It is very straightforward and clean to write.

After the website is almost complete, I added a function to the program that generates HTML documents: generate an XML containing HTML document content and metadata. Then I wrote a program to inject this large amount of XML into windows azure blob storage. Blob storage is the same as a hard disk. It can be used to store a large amount of data that does not need to be computed (SQL database is the kind of data that needs to be computed. Then I created a unified model for each document page. The model contains the "read and analyze these XML files" function, and the Controller implements a simple forwarding, in the model, all the URLs marked by the model to be rewritten are used @ URL. action. I learned a razor trick in this process: although it is not safe, mvchtmlstring can be used in razor to bypass the HTML encoding function, embed the HTML code stored in the variable into the page. In this case, you need to be conscious.

Now gacui has an image Website: http://asia.gaclib.net/and http://us.gaclib.net. The broken Space of hichina naturally cannot directly access windows azure storage. So I used a seemingly silly method. First, I modified the website and uploaded it to the Eastasia and West us servers. Then I wrote a program to download each generated HTML page. The download process is similar to the write crawler. Every time a new HTML file is obtained, the link is analyzed and the download continues. After writing the code, I found that this applet still has the function of discovering dead links, and found several bugs in website code. After the download, FTP will be sent to the hichina space. This server is located in Hangzhou. Therefore, the website has three servers.

The entire process takes about half a year, and is completed every day after work. I clicked a new sub-tree of the skill tree and gained some experience. I felt that these experiences may have reference value for some people. So I wrote this blog and shared it with everyone.