Create a variable called department and assign the string "Sales" to it.
Understand web applications
- Dreamweaver User Guide
- Dreamweaver and Creative Cloud
- Dreamweaver workspaces and views
- Set up sites
- About Dreamweaver sites
- Set up a local version of your site
- Connect to a publishing server
- Set up a testing server
- Import and export Dreamweaver site settings
- Bring existing websites from a remote server to your local site root
- Accessibility features in Dreamweaver
- Advanced settings
- Set site preferences for transferring files
- Specify proxy server settings in Dreamweaver
- Synchronize Dreamweaver settings with Creative Cloud
- Using Git in Dreamweaver
- Manage files
- Create and open files
- Manage files and folders
- Getting and putting files to and from your server
- Check in and check out files
- Synchronize files
- Compare files for differences
- Cloak files and folders in your Dreamweaver site
- Enable Design Notes for Dreamweaver sites
- Preventing potential Gatekeeper exploit
- Layout and design
- Understand Cascading Style Sheets
- Laying out pages using CSS Designer
- Using CSS preprocessors in Dreamweaver
- How to set CSS Style preferences in Dreamweaver
- Move CSS rules in Dreamweaver
- Convert inline CSS to a CSS rule in Dreamweaver
- Work with div tags
- Apply gradients to background
- Create and edit CSS3 transition effects in Dreamweaver
- Format code
- Page content and assets
- Set page properties
- Set CSS heading properties and CSS link properties
- Work with text
- Find and replace text, tags, and attributes
- DOM panel
- Edit in Live View
- Encoding documents in Dreamweaver
- Select and view elements in the Document window
- Set text properties in the Property inspector
- Spell check a web page
- Using horizontal rules in Dreamweaver
- Add and modify font combinations in Dreamweaver
- Work with assets
- Insert and update dates in Dreamweaver
- Create and manage favorite assets in Dreamweaver
- Insert and edit images in Dreamweaver
- Add media objects
- Adding videos in Dreamweaver
- Insert HTML5 video
- Insert SWF files
- Add audio effects
- Insert HTML5 audio in Dreamweaver
- Work with library items
- Using Arabic and Hebrew text in Dreamweaver
- Linking and navigation
- jQuery widgets and effects
- Coding websites
- About coding in Dreamweaver
- Coding environment in Dreamweaver
- Set coding preferences
- Customize code coloring
- Write and edit code
- Code hinting and code completion
- Collapse and expand code
- Reuse code with snippets
- Lint code
- Optimize code
- Edit code in Design view
- Work with head content for pages
- Insert server-side includes in Dreamweaver
- Using tag libraries in Dreamweaver
- Importing custom tags into Dreamweaver
- About XML and XSLT
- Perform server-side XSL transformations in Dreamweaver
- Performing client-side XSL transformations in Dreamweaver
- Add character entities for XSLT in Dreamweaver
- Format code
- Cross-product workflows
- Installing and using extensions to Dreamweaver
- In-App updates in Dreamweaver
- Insert Microsoft Office documents in Dreamweaver (Windows only)
- Working with Fireworks and Dreamweaver
- Edit content in Dreamweaver sites using Contribute
- Dreamweaver-Business Catalyst integration
- Create personalized email campaigns
- About Dreamweaver templates
- Recognizing templates and template-based documents
- Create a Dreamweaver template
- Create editable regions in templates
- Create repeating regions and tables in Dreamweaver
- Use optional regions in templates
- Define editable tag attributes in Dreamweaver
- How to create nested templates in Dreamweaver
- Edit, update, and delete templates
- Export and import xml content in Dreamweaver
- Apply or remove a template from an existing document
- Edit content in Dreamweaver templates
- Syntax rules for template tags in Dreamweaver
- Set highlighting preferences for template regions
- Benefits of using templates in Dreamweaver
- Mobile and multiscreen
- Dynamic sites, pages and web forms
- Understand web applications
- Set up your computer for application development
- Troubleshoot database connections
- Removing connection scripts in Dreamweaver
- Design dynamic pages
- Dynamic content sources overview
- Define sources of dynamic content
- Add dynamic content to pages
- Changing dynamic content in Dreamweaver
- Display database records
- Provide and troubleshoot live data in Dreamweaver
- Add custom server behaviors in Dreamweaver
- Building forms using Dreamweaver
- Use forms to collect information from users
- Create and enable ColdFusion forms in Dreamweaver
- Create web forms
- Enhanced HTML5 support for form elements
- Develop a form using Dreamweaver
- Building applications visually
- Build master and detail pages in Dreamweaver
- Build search and results pages
- Build a record insert page
- Build an update record page in Dreamweaver
- Building record delete pages in Dreamweaver
- Use ASP commands to modify database in Dreamweaver
- Build a registration page
- Build a login page
- Build a page that only authorized users can access
- Securing folders in Coldfusion using Dreamweaver
- Using ColdFusion components in Dreamweaver
- Test, preview, and publish websites
The user interface has been simplified in Dreamweaver CC and later. As a result, you may not find some of the options described in this article in Dreamweaver CC and later. For more information, see this article.
About web applications
A web application is a website that contains pages with partly or entirely undetermined content. The final content of a page is determined only when the visitor requests a page from the web server. Because the final content of the page varies from request to request based on the visitor’s actions, this kind of page is called a dynamic page.
Web applications are built to address a variety of challenges and problems. This section describes common uses for web applications and gives a simple example.
Common uses for web applications
Web applications have many uses for both site visitors and developers, including the following:
Let visitors find information quickly and easily on a content-rich website.
This kind of web application gives visitors the ability to search, organize, and navigate content as they see fit. Examples include company intranets, Microsoft MSDN (www.msdn.microsoft.com), and Amazon.com (www.amazon.com).
Collect, save, and analyze data provided by site visitors.
In the past, data entered in HTML forms was sent as e‑mail messages to employees or CGI applications for processing. A web application can save form data directly into a database and also extract the data and create web-based reports for analysis. Examples include online banking pages, store check-out pages, surveys, and user-feedback forms.
Update websites that have constantly changing content.
A web application frees the web designer from continually updating the site’s HTML. Content providers such as news editors provide the web application with content, and the web application updates the site automatically. Examples include the Economist (www.economist.com) and CNN (www.cnn.com).
Web application example
Janet is a professional web designer and longtime Dreamweaver user responsible for maintaining the intranet and Internet sites of a medium-sized company of 1000 employees. One day, Chris from Human Resources comes to her with a problem. HR administers an employee fitness program that gives employees points for every mile walked, biked, or run. Each employee must report his or her monthly mile totals in an e‑mail to Chris. At the end of the month, Chris gathers all the e‑mail messages and awards employees small cash prizes according to their point totals.
Chris’s problem is that the fitness program has grown too successful. So many employees now participate that Chris is inundated with e‑mails at the end of each month. Chris asks Janet if a web‑based solution exists.
Janet proposes an intranet-based web application that performs the following tasks:
Lets employees enter their mileage on a web page using a simple HTML form
Stores the employees’ mileage in a database
Calculates fitness points based on the mileage data
Lets employees track their monthly progress
Gives Chris one-click access to point totals at the end of each month
Janet gets the application up and running before lunchtime using Dreamweaver, which has the tools she needs to build this kind of application quickly and easily.
How a web application works
A web application is a collection of static and dynamic web pages. A static web page is one that does not change when a site visitor requests it: The web server sends the page to the requesting web browser without modifying it. In contrast, a dynamic web page is modified by the server before it is sent to the requesting browser. The changing nature of the page is why it’s called dynamic.
For example, you could design a page to display fitness results, while leaving certain information (such as employee name and results) to be determined when the page is requested by a particular employee.
The next sections describe how web applications work in greater detail.
Process static web pages
A static website comprises a set of related HTML pages and files hosted on a computer running a web server.
A web server is software that serves web pages in response to requests from web browsers. A page request is generated when a visitor clicks a link on a web page, selects a bookmark in a browser, or enters a URL in a browser’s address text box.
The final content of a static web page is determined by the page designer and doesn’t change when the page is requested. Here’s an example:
<html> <head> <title>Trio Motors Information Page</title> </head> <body> <h1>About Trio Motors</h1> <p>Trio Motors is a leading automobile manufacturer.</p> </body> </html>
Every line of the page’s HTML code is written by the designer before the page is placed on the server. Because the HTML doesn’t change once it’s on the server, this kind of page is called a static page.
Strictly speaking, a “static” page may not be static at all. For example, a rollover image or Flash content (a SWF file) can make a static page come alive. However, this documentation refers to a page as static if it is sent to the browser without modifications.
When the web server receives a request for a static page, the server reads the request, finds the page, and sends it to the requesting browser, as the following example shows:
A. Web browser requests static page. B. Web server finds page. C. Web server sends page to requesting browser.
In the case of web applications, certain lines of code are undetermined when the visitor requests the page. These lines must be determined by some mechanism before the page can be sent to the browser. The mechanism is discussed in the following section.
Process dynamic pages
When a web server receives a request for a static web page, the server sends the page directly to the requesting browser. When the web server receives a request for a dynamic page, however, it reacts differently: It passes the page to a special piece of software responsible for finishing the page. This special software is called an application server.
The application server reads the code on the page, finishes the page according to the instructions in the code, and then removes the code from the page. The result is a static page that the application server passes back to the web server, which then sends the page to the requesting browser. All the browser gets when the page arrives is pure HTML. Here’s a view of the process:
A. Web browser requests dynamic page. B. Web server finds page and passes it to application server. C. Application server scans page for instructions and finishes page. D. Application server passes finished page back to web server E. Web server sends finished page to requesting browser
Access a database
An application server lets you work with server-side resources such as databases. For example, a dynamic page may instruct the application server to extract data from a database and insert it into the page’s HTML. For more information, see www.adobe.com/go/learn_dw_dbguide.
Using a database to store content allows you to separate your website’s design from the content you want to display to site users. Instead of writing individual HTML files for every page, you only need to write a page—or template—for the different kinds of information you want to present. You can then upload content into a database and then have the website retrieve that content in response to a user request. You can also update information in a single source, and then populate that change throughout the website without having to manually edit each page. You can use Adobe Dreamweaver to design web forms to insert, update, or delete data from the database.
The instruction to extract data from a database is called a database query. A query consists of search criteria expressed in a database language called SQL (Structured Query Language). The SQL query is written into the page’s server-side scripts or tags.
An application server cannot communicate directly with a database because the database’s proprietary format renders the data undecipherable in much the same way that a Microsoft Word document opened in Notepad or BBEdit may be undecipherable. The application server can communicate with the database only through the intermediary of a database driver: software that acts like an interpreter between the application server and the database.
After the driver establishes communication, the query is executed against the database and a recordset is created. A recordset is a set of data extracted from one or more tables in a database. The recordset is returned to the application server, which uses the data to complete the page.
Here’s a simple database query written in SQL:
SELECT lastname, firstname, fitpoints FROM employees
This statement creates a three-column recordset and fills it with rows containing the last name, first name, and fitness points of all employees in the database. For more information, see www.adobe.com/go/learn_dw_sqlprimer.
The following example shows the process of querying a database and returning data to the browser:
A. Web browser requests dynamic page. B. Web server finds page and passes it to application server. C. Application server scans page for instructions. D. Application server sends query to database driver. E. Driver executes the query against the database. F. Recordset is returned to driver. G. Driver passes recordset to application server H. Application server inserts data in page, and then passes the page to the web server I. Web server sends finished page to requesting browser.
You can use almost any database with your web application, as long as the appropriate database driver for it is installed on the server.
If you plan to build small low-cost applications, you can use a file-based database, such as one created in Microsoft Access. If you plan to build robust, business-critical applications, you can use a server-based database, such as one created in Microsoft SQL Server, Oracle 9i, or MySQL.
If your database is located on a system other than your web server, make sure you have a fast connection between the two systems so that your web application can operate quickly and efficiently.
Author dynamic pages
Authoring a dynamic page consists of writing the HTML first, and then adding the server-side scripts or tags to the HTML to make the page dynamic. When you view the resulting code, the language appears embedded in the page’s HTML. Accordingly, these languages are known as HTML embedded programming languages. The following basic example uses ColdFusion Markup Language (CFML):
note: CFML support is removed from Dreamweaver CC and later.
<html> <head> <title>Trio Motors Information Page</title> </head> <body> <h1>About Trio Motors</h1> <p>Trio Motors is a leading automobile manufacturer.</p> <!--- embedded instructions start here ---> <cfset department="Sales"> <cfoutput> <p>Be sure to visit our #department# page.</p> </cfoutput> <!--- embedded instructions end here ---> </body> </html>
The embedded instructions on this page perform the following actions:
Insert the variable’s value, "Sales", in the HTML code.
The application server returns the following page to the web server:
<html> <head> <title>Trio Motors Information Page</title> </head> <body> <h1>About Trio Motors</h1> <p>Trio Motors is a leading automobile manufacturer.</p> <p>Be sure to visit our Sales page.</p> </body> </html>
The web server sends the page to the requesting browser, which displays it as follows:
About Trio Motors
Trio Motors is a leading automobile manufacturer.
Be sure to visit our Sales page.
You choose a scripting or tag-based language to use depending on the server technology available on your server. Here are the most popular languages for the server technologies supported by Dreamweaver:
ColdFusion Markup Language (CFML)
Active Server Pages (ASP)
Dreamweaver can create the server-side scripts or tags necessary to make your pages work, or you can write them by hand in the Dreamweaver coding environment.
Web application terminology
This section defines frequently used terms relating to web applications.
An application server
Software that helps a web server process web pages containing server-side scripts or tags. When such a page is requested from the server, the web server hands the page off to the application server for processing before sending the page to the browser. For more information, see How a web application works.
Common application servers include ColdFusion and PHP.
A collection of data stored in tables. Each row of a table constitutes one record and each column constitutes a field in the record, as shown in the following example:
A database driver
Software that acts as an interpreter between a web application and a database. Data in a database is stored in a proprietary format. A database driver lets the web application read and manipulate data that would otherwise be undecipherable.
A database management system
(DBMS, or database system) Software used to create and manipulate databases. Common database systems include Microsoft Access, Oracle 9i, and MySQL.
A database query
The operation that extracts a recordset from a database. A query consists of search criteria expressed in a database language called SQL. For example, the query can specify that only certain columns or only certain records be included in the recordset.
A dynamic page
A web page customized by an application server before the page is sent to a browser.
A set of data extracted from one or more tables in a database, as in the following example:
A relational database
A database containing more than one table, with the tables sharing data. The following database is relational because two tables share the DepartmentID column.
A server technology
The technology that an application server uses to modify dynamic pages at runtime.
The Dreamweaver development environment supports the following server technologies:
Microsoft Active Server Pages (ASP)
PHP: Hypertext Preprocessor (PHP)
You can also use the Dreamweaver coding environment to develop pages for any other server technology not listed.
A static page
A web page that is not modified by an application server before the page is sent to a browser. For more information, see Processing static web pages.
A web application
A website that contains pages with partly or entirely undetermined content. The final content of these pages is determined only when a visitor requests a page from the web server. Because the final content of the page varies from request to request based on the visitor’s actions, this kind of page is called a dynamic page.
A web server
Software that sends out web pages in response to requests from web browsers. A page request is generated when a visitor clicks a link on a web page in the browser, selects a bookmark in the browser, or enters a URL in the browser’s address text box.
Popular web servers include Microsoft Internet Information Server (IIS) and Apache HTTP Server.