You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@tapestry.apache.org by bu...@apache.org on 2014/01/20 00:20:51 UTC
svn commit: r894793 - in /websites/production/tapestry/content:
cache/main.pageCache creating-the-skeleton-application.html
Author: buildbot
Date: Sun Jan 19 23:20:51 2014
New Revision: 894793
Log:
Production update by buildbot for tapestry
Modified:
websites/production/tapestry/content/cache/main.pageCache
websites/production/tapestry/content/creating-the-skeleton-application.html
Modified: websites/production/tapestry/content/cache/main.pageCache
==============================================================================
Binary files - no diff available.
Modified: websites/production/tapestry/content/creating-the-skeleton-application.html
==============================================================================
--- websites/production/tapestry/content/creating-the-skeleton-application.html (original)
+++ websites/production/tapestry/content/creating-the-skeleton-application.html Sun Jan 19 23:20:51 2014
@@ -29,6 +29,8 @@
<link href='http://cxf.apache.org/resources/highlighter/styles/shThemeCXF.css' rel='stylesheet' type='text/css' />
<script src='http://cxf.apache.org/resources/highlighter/scripts/shCore.js' type='text/javascript'></script>
<script src='http://cxf.apache.org/resources/highlighter/scripts/shBrushJava.js' type='text/javascript'></script>
+ <script src='http://cxf.apache.org/resources/highlighter/scripts/shBrushXml.js' type='text/javascript'></script>
+ <script src='http://cxf.apache.org/resources/highlighter/scripts/shBrushPlain.js' type='text/javascript'></script>
<script type="text/javascript">
SyntaxHighlighter.defaults['toolbar'] = false;
SyntaxHighlighter.all();
@@ -77,35 +79,10 @@ table.ScrollbarTable td.ScrollbarParent
table.ScrollbarTable td.ScrollbarNextName {text-align: right;border: none;}
table.ScrollbarTable td.ScrollbarNextIcon {text-align: center;width: 16px;border: none;}
-/*]]>*/</style><div class="Scrollbar"><table class="ScrollbarTable"><tr><td colspan="1" rowspan="1" class="ScrollbarPrevIcon"><a shape="rect" href="dependencies-tools-and-plugins.html"><img align="middle" border="0" src="https://cwiki.apache.org/confluence/images/icons/back_16.gif" width="16" height="16"></a></td><td colspan="1" rowspan="1" class="ScrollbarPrevName" width="33%"><a shape="rect" href="dependencies-tools-and-plugins.html">Dependencies, Tools and Plugins</a> </td><td colspan="1" rowspan="1" class="ScrollbarParent" width="33%"><sup><a shape="rect" href="tapestry-tutorial.html"><img align="middle" border="0" src="https://cwiki.apache.org/confluence/images/icons/up_16.gif" width="8" height="8"></a></sup><a shape="rect" href="tapestry-tutorial.html">Tapestry Tutorial</a></td><td colspan="1" rowspan="1" class="ScrollbarNextName" width="33%"> <a shape="rect" href="loading-the-project-into-eclipse.html">Loading the Project Into Eclipse</a></td><td colspan="1" rowspan
="1" class="ScrollbarNextIcon"><a shape="rect" href="loading-the-project-into-eclipse.html"><img align="middle" border="0" src="https://cwiki.apache.org/confluence/images/icons/forwd_16.gif" width="16" height="16"></a></td></tr></table></div>
-
-<p>Before we can get down to the fun, we have to create an empty application. Tapestry uses a feature of Maven to do this: <strong>archetypes</strong> (a too-clever way of saying "project templates").</p>
-
-<p>What we'll do is create an empty shell application using Maven, then import the application into Eclipse to do the rest of the work.</p>
-
-<p>For the tutorial, we're using a fresh install of Eclipse and an empty workspace at <code>/Users/joeuser/workspace</code>. You may need to adjust a few things for other operating systems or local paths.</p>
-
-<h2 id="CreatingTheSkeletonApplication-UsingtheQuickstartArchetype">Using the Quickstart Archetype</h2>
-
-<p>From our workspace directory, we'll use Maven to create a skeleton Tapestry project. </p>
-
-<p>Before proceeding, we have to decide on four things: A Maven <em>group id</em> and <em>artifact id</em> for our project, a <em>version</em>, and a <em>base package name</em>.</p>
-
-<p>Maven uses the group id and artifact id to provide a unique identity for the application, and Tapestry needs to have a base package name so it knows where to look for pages and components.</p>
-
-<p>For this example, we'll use the group id <strong>com.example</strong>, artifact id <strong>tutorial1</strong>, version <strong>1.0-SNAPSHOT</strong> and we'll use <strong>com.example.tutorial</strong> as the base package.</p>
-
-<p>Our final command line is:</p>
-
-<div class="code panel pdl" style="border-width: 1px;"><div class="codeContent panelContent pdl">
-<script class="theme: Default; brush: java; gutter: false" type="syntaxhighlighter"><![CDATA[
-mvn archetype:generate -DarchetypeCatalog=http://tapestry.apache.org
+/*]]>*/</style><div class="Scrollbar"><table class="ScrollbarTable"><tr><td colspan="1" rowspan="1" class="ScrollbarPrevIcon"><a shape="rect" href="dependencies-tools-and-plugins.html"><img align="middle" border="0" src="https://cwiki.apache.org/confluence/images/icons/back_16.gif" width="16" height="16"></a></td><td colspan="1" rowspan="1" class="ScrollbarPrevName" width="33%"><a shape="rect" href="dependencies-tools-and-plugins.html">Dependencies, Tools and Plugins</a> </td><td colspan="1" rowspan="1" class="ScrollbarParent" width="33%"><sup><a shape="rect" href="tapestry-tutorial.html"><img align="middle" border="0" src="https://cwiki.apache.org/confluence/images/icons/up_16.gif" width="8" height="8"></a></sup><a shape="rect" href="tapestry-tutorial.html">Tapestry Tutorial</a></td><td colspan="1" rowspan="1" class="ScrollbarNextName" width="33%"> <a shape="rect" href="loading-the-project-into-eclipse.html">Loading the Project Into Eclipse</a></td><td colspan="1" rowspan
="1" class="ScrollbarNextIcon"><a shape="rect" href="loading-the-project-into-eclipse.html"><img align="middle" border="0" src="https://cwiki.apache.org/confluence/images/icons/forwd_16.gif" width="16" height="16"></a></td></tr></table></div><p>Before we can get down to the fun, we have to create an empty application. Tapestry uses a feature of Maven to do this: <strong>archetypes</strong> (a too-clever way of saying "project templates").</p><p>What we'll do is create an empty shell application using Maven, then import the application into Eclipse to do the rest of the work.</p><p>For the tutorial, we're using a fresh install of Eclipse and an empty workspace at <code>/Users/joeuser/workspace</code>. You may need to adjust a few things for other operating systems or local paths.</p><h2 id="CreatingTheSkeletonApplication-UsingtheQuickstartArchetype">Using the Quickstart Archetype</h2><p>From our workspace directory, we'll use Maven to create a skeleton Tapestry project.</p><p>Before
proceeding, we have to decide on four things: A Maven <em>group id</em> and <em>artifact id</em> for our project, a <em>version</em>, and a <em>base package name</em>.</p><p>Maven uses the group id and artifact id to provide a unique identity for the application, and Tapestry needs to have a base package name so it knows where to look for pages and components.</p><p>For this example, we'll use the group id <strong>com.example</strong>, artifact id <strong>tutorial1</strong>, version <strong>1.0-SNAPSHOT</strong> and we'll use <strong>com.example.tutorial</strong> as the base package.</p><p>Our final command line is:</p><div class="code panel pdl" style="border-width: 1px;"><div class="codeContent panelContent pdl">
+<script class="theme: Default; brush: text; gutter: false" type="syntaxhighlighter"><![CDATA[mvn archetype:generate -DarchetypeCatalog=http://tapestry.apache.org
]]></script>
-</div></div>
-
-<p>It will then prompt you to pick the archetype - choose the latest <strong>Tapestry 5.X Quickstart Project</strong>, enter the group id, artifact id, version and package when prompted.</p>
-
-<div class="preformatted panel" style="border-width: 1px;"><div class="preformattedContent panelContent">
+</div></div><p>It will then prompt you to pick the archetype - choose the latest <strong>Tapestry 5.X Quickstart Project</strong>, enter the group id, artifact id, version and package when prompted.</p><div class="preformatted panel" style="border-width: 1px;"><div class="preformattedContent panelContent">
<pre>$ mvn archetype:generate -DarchetypeCatalog=http://tapestry.apache.org
[INFO] Scanning for projects...
[INFO]
@@ -167,29 +144,18 @@ package: com.example.tutorial
[INFO] Final Memory: 7M/81M
[INFO] ------------------------------------------------------------------------
</pre>
-</div></div>
-
- <div class="aui-message hint shadowed information-macro">
+</div></div> <div class="aui-message hint shadowed information-macro">
<span class="aui-icon icon-hint">Icon</span>
<div class="message-content">
-
-<p>The first time you use Maven, you'll see quite a bit more output, mostly about downloading all sorts of JARs and other files. These downloaded files are cached locally and will not need to be downloaded again, but you do have to be patient on first use.</p>
+ <p>The first time you use Maven, you'll see quite a bit more output, mostly about downloading all sorts of JARs and other files. These downloaded files are cached locally and will not need to be downloaded again, but you do have to be patient on first use.</p>
</div>
</div>
-
-
-<p>After executing the command, you'll see a new directory, <code>tutorial1</code>.</p>
-
- <div class="aui-message hint shadowed information-macro">
+<p>After executing the command, you'll see a new directory, <code>tutorial1</code>.</p> <div class="aui-message hint shadowed information-macro">
<p class="title">Maven Behind a Firewall</p>
<span class="aui-icon icon-hint">Icon</span>
<div class="message-content">
-
-<p>If you are behind a firewall, before running any "mvn" commands, you will need to configure your proxy settings in settings.xml. Here is an example:</p>
-
-<div class="code panel pdl" style="border-width: 1px;"><div class="codeHeader panelHeader pdl" style="border-bottom-width: 1px;"><b>settings.xml</b></div><div class="codeContent panelContent pdl">
-<script class="theme: Default; brush: java; gutter: false" type="syntaxhighlighter"><![CDATA[
-<settings>
+ <p>If you are behind a firewall, before running any "mvn" commands, you will need to configure your proxy settings in settings.xml. Here is an example:</p><div class="code panel pdl" style="border-width: 1px;"><div class="codeHeader panelHeader pdl" style="border-bottom-width: 1px;"><b>settings.xml</b></div><div class="codeContent panelContent pdl">
+<script class="theme: Default; brush: xml; gutter: false" type="syntaxhighlighter"><![CDATA[<settings>
<proxies>
<proxy>
<active>true</active>
@@ -204,29 +170,13 @@ package: com.example.tutorial
<localRepository>C:/Users/joeuser/.m2/repository</localRepository>
</settings>
]]></script>
-</div></div>
-<p>Of course, adjust the <code>localRepository</code> element to match the correct path for your computer.</p>
+</div></div><p>Of course, adjust the <code>localRepository</code> element to match the correct path for your computer.</p>
</div>
</div>
-
-
-<h2 id="CreatingTheSkeletonApplication-RunningtheNewApplicationusingJetty">Running the New Application using Jetty</h2>
-
-<p>One of the first things you can do is use Maven to run Jetty directly.</p>
-
-<p>Change into the newly created directory, and execute the command:</p>
-
-<div class="code panel pdl" style="border-width: 1px;"><div class="codeContent panelContent pdl">
-<script class="theme: Default; brush: java; gutter: false" type="syntaxhighlighter"><![CDATA[
-mvn jetty:run
+<h2 id="CreatingTheSkeletonApplication-RunningtheNewApplicationusingJetty">Running the New Application using Jetty</h2><p>One of the first things you can do is use Maven to run Jetty directly.</p><p>Change into the newly created directory, and execute the command:</p><div class="code panel pdl" style="border-width: 1px;"><div class="codeContent panelContent pdl">
+<script class="theme: Default; brush: text; gutter: false" type="syntaxhighlighter"><![CDATA[mvn jetty:run
]]></script>
-</div></div>
-
-<p>Again, the first time, there's a dizzying number of downloads, but before you know it, the Jetty servlet container is up and running.</p>
-
-<p>Once Jetty is initialized (which only takes a few seconds), you'll see the following in your console:</p>
-
-<div class="preformatted panel" style="border-width: 1px;"><div class="preformattedContent panelContent">
+</div></div><p>Again, the first time, there's a dizzying number of downloads, but before you know it, the Jetty servlet container is up and running.</p><p>Once Jetty is initialized (which only takes a few seconds), you'll see the following in your console:</p><div class="preformatted panel" style="border-width: 1px;"><div class="preformattedContent panelContent">
<pre> TranslatorSource: DEFINED
TypeCoercer: REAL
URLEncoder: DEFINED
@@ -251,107 +201,12 @@ Application 'app' (version 1.0-SNAPSHOT-
2011-11-22 11:46:45.636::INFO: Started SelectChannelConnector@0.0.0.0:8080
[INFO] Started Jetty Server
</pre>
-</div></div>
-
-<p>You can now open a web browser to <a shape="rect" class="external-link" href="http://localhost:8080/tutorial1/" >http://localhost:8080/tutorial1/</a> to see the running application:</p>
-
-<p><img class="confluence-embedded-image confluence-thumbnail image-center" src="creating-the-skeleton-application.thumbs/startpage.png" data-image-src="/confluence/download/attachments/23340356/startpage.png?version=5&modificationDate=1321973423000&api=v2"></p>
-
-<p>The date and time in the middle of the page proves that this is a live application.</p>
-
-<p>This is a complete little application; it doesn't do much, but it demonstrate how to create a number of pages sharing a common layout, and demonstrates some simple navigation and link handling. You can see that it has three different pages that share a common layout</p><p><style type='text/css'>
-.FootnoteMarker, .FootnoteNum a {
- background: transparent url(/confluence/download/resources/com.adaptavist.confluence.footnoteMacros:footnote/gfx/footnote.png) no-repeat top right;
- padding: 1px 2px 0px 1px;
- border-left: 1px solid #8898B8;
- border-bottom: 1px solid #6B7C9B;
- margin: 1px;
- text-decoration: none;
-}
-.FootnoteNum a {
- margin-top: 2px;
- margin-right: 0px;
-}
-.FootnoteNum {
- font-size: x-small;
- text-align: right;
- padding-bottom: 4px;
-}
-.footnote-th1 {
- text-align: right;
-}
-.Footnote {
- padding-left: 7px;
- margin-bottom: 4px;
- border: 1px none #DDDDDD;
- writingMode: tb-rl;
-}
-.accessibility {
- display: none;
- visibility: hidden;
-}
-@media aural,braille,embossed {
- .FootnoteMarker, .FootnoteNum a {
- border: 1px solid #000000;
- background: #ffffff none;
- }
- .accessibility {
- display: run-in;
- visibility: visible;
- }
-}
-</style>
-<script type='text/javascript' language='JavaScript'>
-//<!--\n
-var effectInProgress = {};
-var despamEffect = function (id,effectType,duration) {
- if ((effectInProgress[id]) || (typeof(Effect)=="undefined") || (typeof(Effect[effectType])=="undefined")) return;
- new Effect[effectType](id);
- effectInProgress[id]=true;
- setTimeout('effectInProgress[\"'+id+'\"]=false;',duration*1000);
-};
-var oldFootnoteId = '';
-var footnoteHighlight = function(id,pulsateNum) {
- if (oldFootnoteId!='') document.getElementById('Footnote'+oldFootnoteId).style['borderStyle'] = 'none';
- oldFootnoteId = id;
- document.getElementById('Footnote'+id).style['borderStyle'] = 'solid';
- despamEffect('Footnote'+id,'Highlight',1)
- if (pulsateNum) despamEffect('FootnoteNum'+id,'Pulsate',3)
-}
-var footnoteMarkerHighlight = function(id) {
- if (oldFootnoteId!='') document.getElementById('Footnote'+oldFootnoteId).style['borderStyle'] = 'none';
- oldFootnoteId = '';
- despamEffect('FootnoteMarker'+id,'Pulsate',3)
-}
-//-->
-</script>
-
-<sup id="FootnoteMarker1">
- <a shape="rect" class="FootnoteMarker" name="FootnoteMarker1" href="#Footnote1" onclick="footnoteHighlight("1",true);" alt="Footnote: Click here to display the footnote" title="Footnote: Click here to display the footnote">
- 1
- </a>
-</sup>
-</p>.<p></p>
-
- <div class="aui-message problem shadowed information-macro">
+</div></div><p> </p><p>You can now open a web browser to <a shape="rect" class="external-link" href="http://localhost:8080/tutorial1/" >http://localhost:8080/tutorial1/</a> to see the running application:</p><p> </p><p><img class="confluence-embedded-image confluence-content-image-border image-left" height="525" width="700" src="https://cwiki.apache.org/confluence/download/attachments/23340356/startpage.png?version=5&modificationDate=1321973423000&api=v2" data-image-src="/confluence/download/attachments/23340356/startpage.png?version=5&modificationDate=1321973423000&api=v2"></p><p> </p><div style="clear: both"></div><p style="text-align: left;">The date and time in the middle of the page proves that this is a live application.</p><p>This is a complete little application; it doesn't do much, but it demonstrate how to create a number of pages sharing a common layout, and demonstrates some simple navigation and link handling. You can see that it has three
different pages that share a common layout. (<span style="line-height: 1.4285715;"><em>Layout</em> is a loose term meaning common look and feel and navigation across many or all of the pages of an application. Often an application will include a Layout component to provide that commonness.)</span></p> <div class="aui-message problem shadowed information-macro">
<span class="aui-icon icon-problem">Icon</span>
<div class="message-content">
-
-<p>You should hit Control-C in the Terminal window to close down Jetty before continuing with the tutorial.</p>
+ <p>You should hit Control-C in the Terminal window to close down Jetty before continuing with the tutorial.</p>
</div>
</div>
-
-
-<hr>
-
-<p></p><p><table class="Footnotes" style="width: 100%; border:none;" cellspacing="0" cellpadding="0" summary="This table contains one or more notes for references made elsewhere on the page."><caption class="accessibility">Footnotes</caption><thead class="accessibility"><tr class="accessibility"><th colspan="1" rowspan="1" class="accessibility" id="footnote-th1">Reference</th><th colspan="1" rowspan="1" class="accessibility" id="footnote-th2">Notes</th></tr></thead><tbody><tr name="Footnote1"><td colspan="1" rowspan="1" valign="top" class="FootnoteNum" headings="footnote-th1">
- <a shape="rect" id="FootnoteNum1" href="#FootnoteMarker1" onclick="footnoteMarkerHighlight("1");" onmouseover="footnoteHighlight("1",false);" alt="Footnote: Click to return to reference in text" title="Footnote: Click to return to reference in text">
- 1
- </a>
- </td><td colspan="1" rowspan="1" valign="top" class="Footnote" id="Footnote1" width="100%" headings="footnote-th2">
- Layout is a loose term meaning common look and feel and navigation across many or all of the pages of an application. Often an application will include a Layout component to provide that commonness.
- </td></tr></tbody></table></p><p></p>
-
<style type="text/css">/*<![CDATA[*/
table.ScrollbarTable {border: none;padding: 3px;width: 100%;padding: 3px;margin: 0px;background-color: #f0f0f0}
table.ScrollbarTable td.ScrollbarPrevIcon {text-align: center;width: 16px;border: none;}