WebMatrix Development ASP.net trial notes

Source: Internet
Author: User
Tags iis modify access database port number visual studio
Asp.net|web
Objective

Admittedly, Microsoft's Heavyweight development tool Visual Studio.NET does provide us with a very powerful, excellent. NET Application System integrated development environment. However, the use of vs.net also have to face some problems, such as: Vs.net to pay (of course, D version), vs.net installation is more trouble, vs.net occupy a large space, the machine requirements are also higher. Therefore, the use of vs.net to develop to pay a relatively high cost, only applied to large-scale system development to have a better performance ratio.

Is it important to use a powerful and expensive Visual Studio.NET if you're just going to develop a small, asp.net web-based application system?

The answer is in the negative. Recently, Microsoft has provided developers with a free, compact and easy-to-use development ASP.net tool, which is WebMatrix.

Figure 1:http://www.asp.net/webmatrix

Figure 1 is the homepage of the WebMatrix Project, WebMatrix originated in December 2000, and Microsoft engineers fully adopted the. NET Framework and C # Language development of a free lightweight asp.net rapid development tool, you can quickly and easily complete the development of Web application systems.

WebMatrix is the most prominent feature is small and flexible, the entire installation file is about 1.3M, after the installation of all the size is only 2.8M or so, use it only basic. NET Framework support, you can not even need to install IIS, Because WebMatrix has a Microsoft asp.net Web Matrix Server, you can publish and run ASP.net applications.
Come near WebMatrix

L) Installation of WebMatrix

The operating system that WebMatrix currently supports is Windows 2000 and Windows XP and can be downloaded free of charge from http://www.asp.net/webmatrix/.

Before installing WebMatrix, you must install the Microsoft. NET Framework 1.1 and Internet Expleror 5.5 versions. The installation process is fool-like, just go "Next" on the line. After installation, you can see the WebMatrix main interface as shown in Figure 2. Its interface layout is similar to the vs.net, the upper part is a menu/toolbar, the left is a toolbox, provides the various control tools needed to develop ASP.net, the right side is the workspace management bar and the property bar, respectively, for file/data management and control property configuration, in the middle of the main workspace.

Figure 2:webmatrix Main interface



2 first asp.net program Hello webmatrix!

First we'll create the first ASP.net program, a new file from the File menu, and a new File dialog box (Figure 3).

Figure 3: New File dialog box

A big difference between WebMatrix and vs.net is that WebMatrix is based on file development management rather than project based on projects like Vs.net. This is related to WebMatrix's main development project is small and medium-sized projects, small project development is relatively simple, management is not so complex, webmatrix its own positioning is a lightweight development tool.

From the Open New File dialog box, you can see that WebMatrix supports a new variety of files, including. aspx,. sql,. cs,. xml files, and so on, which can support three typical types. NET Application Development Language--c#, J #, Visual Basic.NET. Select the default asp.net page and enter the filename you want to create hellowebmatrix.aspx, and select C # as the programming language to create a blank aspx paging file.

WebMatrix provides four views for each asp.net file window, Design view, Static code view (HTML), dynamic Code view (codes), and global View (all), with Design view displayed by default.

From the Web controls bar in the left-hand toolbox, select the button control to drag and drop onto page Design view, you can see a button control displayed in the view, and the Text property in the property bar to "Greetings!" , you can see the text on the button changes to "Greetings!" , as shown in Figure 4. From the property bar in the lower-right area of the interface, you can see that the default name for the control is called Button1.

Figure 4: Adding "greetings" in the View area! "button

This completes the visual editing of the Hellowebmatrix program, and then starts editing the code.

Double-click Greetings in the View area! button, you can see that the Page view area is transferred from the Design view to the Code view, WebMatrix automatically creates a function for the Click event of the button Button1--void Button1_Click (object sender, EventArgs e), the function body is not yet content. Add a line of code to the body of the function:

"Button1.Text =" Hello webmatrix! "

The entire development process is complete, as shown in Figure 5.

Figure 5: Adding processing code for the button click event

Click on the Run button on the toolbar to run the program, you can see WebMatrix pop-up a dialog box, ask whether the use of IIS or the Web matrix server to run the program, if the machine does not have IIS installed, you can choose its default Web Matrix server, Enter a native idle port number in the port number, such as 8000, and start running by clicking the Start button, as shown in Figure 6.

Figure 6: Select the running server for the ASP.net application

The Web Matrix Server was first launched during the run (you can see an icon in the Windows System Tray area), and then you can see the run results from the pop-up browser window-a "greeting" button appears on the page and the text on the button after clicking the button changes to "Hello webmatrix! , as shown in Figure 7.

Figure 7:hellowebmatrix Program running effect

Developing Database Access programs

The most common in dynamic web development is the development of database access programs. WebMatrix provides good support for developing ASP.net database access programs. Take a look at the workspace Management Bar (Workspace) on the upper right of the WebMatrix main interface, and you'll find a Data tab next to the Workspace tab, which also provides a database column, Click on the Data tab to enter the Database window, as shown in Figure 8.

Figure 8: Data window

Development database Access program first to establish a database connection, click on the Data window to add a database connection button, you can see the add a New Database Connection Project window, as shown in Figure 9.


Figure 9: Adding a database connection

WebMatrix can support an Access database or a SQL SERVER/MSDE database/Desktop Engine and, if it is the latter, can be better supported, for the sake of simplicity, you can choose Access databases, click OK, Select an Access database from the pop-up dialog box. For example, access from the sample database: family member Address database file Addrbook.mdb, click OK to see WebMatrix has built a database connection in the Data window, from which you can see the data table in the database, as shown in Figure 10.


Figure 10: A well established data connection

After the database connection is built, the rest of the things are simple, create a new asp.net program file databaseaccess.aspx, and then select a datasheet in the data window (such as "family member" table) drag and drop to the page Design view, You can see that a MxDataGrid control and a Accessdatasourcecontrol control are automatically created on the page, and the Association of the DataSet is automatically completed, as shown in Figure 11.


Figure 11: Effects of dragging and dropping a datasheet into the page Design view area

The development of a database access program with basic data display capabilities has been completed at this time. Click on the Run button to run the program, you can see the display of the page--the page shows a data table about family members information, you can see that the datasheet also has an automatic paging display processing, in the last row of the table is the page Number link Display page, with the mouse click table header columns, The data in the table can be automatically sorted by that column so that the data table already meets the needs of the General page data, and you don't even have to write a line of code at this point.


Figure 12:databaseaccess Program running effect

As a database access program, only the data display function is not enough, but also need to add some basic add, delete, change and other interactive functions, the following we for the Databaseaccess program to add data query function.

Go back to Page Design view, drag the TextBox and button from the WebControls bar to page Design view from the Toolbox, set the button's Text property to query, and drag a DataGrid control to the next line, as shown in Figure 13. You can see that the names of these controls are set by default to TextBox1, DataGrid1, and Button1.


Figure 13: Adding query text boxes and buttons

At this point the program's visual design of the page is completed, then implement a user in the text box to enter the member's surname Query member information function (delete, modify the function can be implemented in a similar way).

Click on the Code tab at the bottom of the Page view area, and the Page view area is transferred to the Codes view, and you can see the WebMatrix in the toolbox on the left side of the interface, as shown in Figure 14.


Figure 14: Code Wizard Bar

You can see that the Code Wizard provides several basic data operations (such as SELECT, INSERT, DELETE, update, and so on) code wizards, and double-click Select Data method to see the screen pop up a Query Code Add Wizard dialog box, as shown in Figure 15.


Figure 15: Query Code Add Wizard dialog box

Follow the wizard sequence,

1 Select the database (Addrbook.mdb) to be queried, as shown in Figure 15;

2 Select the data item (member number, first name, surname, role, etc.) to be displayed in the query results, as shown in Figure 16;


Figure 16: Selecting the data items to display in the query results

3 Click the Where button, select the data items to query and query conditions (last name), such as Figure 17;


Figure 17: Selecting the Data items and query criteria to query

4 after setting up click Next button to enter the Query Test dialog box, click the Test Query button to query test, enter the number "Zhao", you can see the surname Zhao member information is displayed, this shows that the test success, such as Figure 18;


Figure 18: Test Query results

5 finally sets the name of the generated query method (default Myquerymethod) and return type (the default is DataSet), as shown in Figure 19;


Figure 19: Setting the generated Query method name and return type

6 after the completion of the setup back to the code view, you can see the WebMatrix automatically generated Myquerymethod method source code, as shown in Figure 20.


Figure 20: The generated Query method source code

The next step is to associate the click event of the Query button with the Query method.

Click on the Design tab at the bottom of the page view to return to the Design view, double-click the "Query" button that was added to the page, and you can see that the page view is transferred from the Design view to the Code view, and WebMatrix is automatically "query" The Click event of the button creates a function--void button1_click (object sender, EventArgs e), and the function body does not yet have content. Add two lines of code to the body of the function:




DataGrid1.DataSource = Myquerymethod (TextBox1.Text);
Datagrid1.databind ();

The entire development process is complete, as shown in Figure 21.


Figure 21: Adding the associated code for the Click event of the Query button

Click the Run button on the sidebar to run the program, can see the operation effect, the page appears the text box and Query button, in the text box input "Zhao", click "Query" button, the data table in all surname "Zhao" members of the information is found and displayed on the page, as shown in Figure 22.


Figure 22: The running effect of the conditional query on the program by last name

If you feel that the display of the DataGrid in the page is ugly, you can easily adjust the decoration.

Go back to the Program Page Design view window in WebMatrix, click on the control on the page DATAGRID1, you can see the WebMatrix in the lower right area of the property settings in the DataGrid has a variety of property settings, the most convenient way to modify the appearance is to click on the lower part of the area " Auto Format ... "link, choose a style that you like from the Pop-up Automatic Formatting dialog box, as shown in Figure 23.


Figure 23:datagrid Appearance settings

Run again, you can see the interface display effect has been automatically decorated, as shown in Figure 24.


Figure 24: Data Query Program page run effect after adding cosmetic effect

Conclusion

At this point, I believe you have learned the powerful function of the WebMatrix, look back to think, really a little can not believe that this thing is only 2.8M.

WebMatrix in asp.net program code processing and vs.net is different from the WebMatrix of the program's Logical Processing code and page static code in a file, rather than vs.net do the data and display separation. Therefore, the programmer and the Web art of the collaboration will be a bit more trouble, but for the development of small and medium-sized systems, this is not a big problem.

In short, WebMatrix is a small and flexible, A powerful web-based development tool for ASP.NET application systems, although it is a very lightweight development tool relative to vs.net, it is quite characteristic, many features are not inferior to vs.net, it is a good choice for small and medium system development, and most importantly-it is free.


Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.