If you can't read please download the document
Upload
lincoln-iii
View
10.305
Download
2
Embed Size (px)
DESCRIPTION
PrettyFaces: SEO, Dynamic Parameters, Bookmarks, and Navigation for JSF / JSF2 - As presented at JSFSummit2009 in Orlando Florida. Why should we use PrettyFaces?
Citation preview
2. SiteMap
3. basics 4. navigation 5. SEO 6. examples 7. PrettyFaces is: Url Rewriting http://example.com/faces/store .jsf http://example.com/ store 8. PrettyFaces is: Url Parameterization http://example.com/store/item/ Z34SD498 9. PrettyFaces is: Declarative Data Loading #{storeBean.loadItem} 10. PrettyFaces is: Simplified Navigation viewStore -> http://example.com/store 11. SiteMap
12. basics 13. navigation 14. SEO 15. examples 16. The PrettyFaces Story Lincoln Baxter, III PrettyFaces/PrettyTime Founder ofO cpSoft 17. The PrettyFaces Story Lincoln Baxter, III Founder ofO cpSoft @lincolnthree http://ocpsoft.com http://scrumshark.com http://ocpsoft.com/prettyfaces http://ocpsoft.com/prettytime 18. The Problem
19. Had usability issues, pitfalls 20. Navigation was a pain... 21. No bookmarks? Not entirely true. 22. What about Pretty URLs / SEO? 23. The Result
24. Applied the 80/20 rule 25. Destroyed Thanksgiving 2008 26. The Result
27. Faces-config practically gone 28. Data loading easy & declarative Easy, Bookmarkable JSF 29. :) Life is good 30. Why do we need Pretty URLs?
31. Enhance User Experience 32. Self-Promote 33. SiteMap
34. basics 35. navigation 36. SEO 37. examples 38. Rethinking Navigation The Basics Keep it simple... 39. SiteMap
40. basics 41. navigation 42. SEO 43. examples
45. validate 46. load 47. Keep URLs Clean Build trust by reducing clutter Before: http://example.com/news.xhtml?p=my-new-post After:http://example.com/news/my-new-post/ 48. Keep URLs Clean Real Life: Should have been: http://www.llbean.com/webapp/wcs/stores/servlet/CategoryDisplay?categoryId=28&storeId=1&catalogId=1&langId=-1&nav=hp-gndp http://llbean.com/kids http://www.llbean.com/webapp/wcs/stores/servlet/CategoryDisplay? categoryId=28 & storeId=1 & catalogId=1 & langId=-1 & nav=hp-gndp Vulnerable! 49. Keep URLs Clean Why don't more people buy used cars? 50. Keep URLs Clean They don't trust the last owner. They're afraid of getting a bad deal. 51. Keep URLs Clean
52. Trust me. http:// www.linkedin.com/in/lincolnthree http://ocpsoft.com/prettyfaces http://sourceforge.net/projects/resteasy/ http://www.youtube.com/watch?v=ZOU8GIRUd_g 53. Keep URLs Clean
54. Are self-promoting, benefit SEO 55. Reduce vulnerability 56. Root the user 57. SiteMap
58. basics 59. navigation 60. SEO 61. examples
63. validate 64. load 65. Parameterization (p14n) / root / the / user
67. Keep the query string optional 68. Parameterization (p14n)
69. where I am & what I'm looking at 70. user accessible 71. Parameterization (p14n) Examples:
http://scrumshark.com/project/PrettyFaces http://scrumshark.com/project/PrettyFaces /s7 http://scrumshark.com/project/PrettyFaces /iterations http://scrumshark.com/project/PrettyFaces /iterations/Sprint1 http://scrumshark.com/PrettyFaces/Sprint1/iterations/project 72. Problem solved ... / project / #{currentProjectBean.project} /faces/project/view.xhtml PrettyFaces 73. SiteMap
74. basics 75. navigation 76. SEO 77. examples
79. validate 80. load 81. Validation
82. End-users haveDIRECT ACCESS 83. Validate everything 84. Validation @FacesValidator( projectName ) public class ProjectNameValidator { public void validate(...) } /faces/project/view.xhtml pretty-config.xml 85. Validation Yes pretty:id or empty PrettyFaces Validation Send 404 Is onError handlerdefined? Handler returned Successfully? Inject values & continue or redirect to pretty:idThrow Exception 86. SiteMap
87. basics 88. navigation 89. SEO 90. examples
92. validate 93. load 94. Data Loading A few ways to do it:
96. Declarative Loading (On event) 97. Data Loading
98. Enables deterministic behavior 99. JSF2 helps a lot
100. Nothing fancy ... /project/#{currentProjectBean.project} /faces/project/view.xhtml #{currentProjectBean.load} PrettyFaces 101. Action Methods RESTORE_VIEW APPLY_REQUEST_VALUES PROCESS_VALIDATION ANY_PHASE CurrentProjectBean +load() PrettyFaces Action Invocation#{currentProjectBean.load} Trigger Navigation Continue Lifecycle 102. Alternatives More Configuration +3 +8 +1+n +4 Lines: = ~4 :)PrettyFaces = ~17! 2.0 view params Url Rewrite Filter 2.0 event listeners 1.x: requires seam or other pretty-config.xml 103. The Basics
104. Logical Parameter Order Root the User 105. Validate everything 106. Load data declaratively 107. SiteMap
108. basics 109. navigation 110. SEO 111. examples
113. validate 114. load 115. Rethinking Navigation Rethinking Navigation so many channels, so little time... 116. SiteMap
117. basics 118. navigation 119. SEO 120. examples
122. de-coupling 123. GET 124. History: the old * * viewProject/faces/project/view.xhtml 125. History: the new 126. History: Navigation Cases
127. Conditional evaluation and outcomes 128. Selectively pass page-params
129. How often do we need them? pretty:hospital The baby's coming! It might be a late night, Should we get some coffee? No... What if we don't remember This? Let's get a video Camera!NO! Should I pick up my mother?DRIVE!! 130. SiteMap
131. basics 132. navigation 133. SEO 134. examples
136. de-coupling 137. GET 138. pretty:mappingId private String actionMethod() { if(user.isMember) { return pretty:viewProject ; } return pretty:joinProject ; } < p:linkmappingId= hospital > < /p:link > 139. That Same Configuration The mapping ID ... /project/ #{currentProjectBean.project} /faces/project/view.xhtml #{currentProjectBean.load} PrettyFaces 140. P14N is a Scope P14N is a Scope private String createProject() { if(dao.createProject(project)) { currentProjectBean.setProject( scrumshark ); return pretty:viewProject; } FacesUtils.addError(Something went wrong! Try again.); return null; } project.getName() 141. SiteMap
142. basics 143. navigation 144. SEO 145. examples
147. de-coupling 148. GET 149. But what about coupling?
150. JSF2- Coupling view locations to action methods(what happens when you need to refactor?) Take your pick... 151. But what about coupling? JSF2 /WebContent /faces /project view.xhtml ActionMethods faces-config.xml 152. But what about coupling? PrettyFaces /WebContent /faces /project view.xhtml ActionMethods faces-config.xml pretty:viewProject 153. But what about coupling?
154. You GET what you ask for 155. SiteMap
156. basics 157. navigation 158. SEO 159. examples
161. de-coupling 162. GET 163. You GET what you ask for GET /project/scrumshark Create Project Action #{bean.create} GET /newproject Invoke Navigation pretty:viewProject Load Project Data Render Response ? 164. You GET what you ask for Option to handle behavior up front, instead of behind a submit. GET /project/scrumshark Load Project Data ? 165. Can I still use JSF navigation?
166. In summary
167. Encapsulation, de-coupling from view-location 168. Extension to existing JSF navigation 169. SiteMap
170. basics 171. navigation 172. SEO 173. examples
175. de-coupling 176. GET 177. Search Engine Optimization 178. SiteMap
179. basics 180. navigation 181. SEO 182. examples
184. change 185. Keywords
#1 Self-promoting Links 186. Keywords examples Poor: http://example.com/shop.jsf?catId=23&itemId=Z34FK94SE Partly there: http://example.com/shop.jsf?cat=books&item=how-to-start-a-web-store Perfect: http://example.com/shop/books?item=how-to-start-a-web-store Self-promoting Links 187. Keywords examples /shop/#{catBean.item} {itemBean.itemName} /faces/shop.jsf #{itemBean.load} 188. Why do we need Pretty URLs?
189. Enhance User Experience 190. Self-Promote, SEO 191. SiteMap
192. basics 193. navigation 194. SEO 195. examples
197. change 198. SEO is all you need False 199. Install Google Analytics http://ocpsoft.com July 2008: 0 Nov 2009: 13,287views 68% from search 200. Three Fundamentals
201. Get people to say they believe you 202. Get search engines to believe you both 203. That means...
Choose your keywords, make sure they are appropriate for your content. 204. That means...
Get other people to link back to your site, or create those links yourself. 205. That means...
206. Make sure your external links appear on pages relevant to your content. 207. SiteMap
208. basics 209. navigation 210. SEO 211. examples
213. change 214. Plan for Change .jsf .jsp .php .do .cgi .asp 215. Clean up your URLs Technology changes... be agnostic. / 216. SiteMap
217. basics 218. navigation 219. SEO 220. examples
222. change 223. Examples what a view 224. Setup Add Pretty Filter in web.xml Pretty Filtercom.ocpsoft.pretty.PrettyFilterPretty Filter/*REQUESTFORWARD 225. Map your first pages Create /WEB-INF/pretty-config.xml /home /faces/home.jsf /faces/story/comment.jsf 226. Add some actions Take action ;) /home /faces/home.jsf #{homeBean.loadUserLayout} /faces/story/comment.jsf #{myBean.load} 227. Validate (2.0.x series only) /home /faces/home.jsf #{homeBean.loadUserLayout} /faces/story/comment.jsf#{myBean.load} 228. Navigate viewComment.xhtml Go to Comment. (This is Link Text) View next comment. (This is Link Text) 229. The SiteMap If this presentation were a website... /prettyfaces /faces/home.jsf /prettyfaces/#{presBean.levelOne} /faces/present.jsf /prettyfaces/#{presBean.levelOne}/#{presBean.levelTwo} /faces/present.jsf 230. Questions? Lincoln Baxter, III Founder ofO cpSoft @lincolnthree http://ocpsoft.com http://scrumshark.com http://ocpsoft.com/prettyfaces http://ocpsoft.com/prettytime