The document discusses web apps, defining them as websites that perform a useful function, are targeted at smartphones, and are built using web technologies with some native code. It covers aspects of developing web apps such as tools, tricks, and trade-offs involved in the development process. The key tasks in developing a web app are conceptualizing what it will do, creating wireframes, developing the server-side code, client-side code, and native wrappers for different devices.

1. web apps
with christopher pitt

2. what are web apps?

3. what are web apps?
web apps are different things to different
people

4. what are web apps?
web apps are different things to different
people
we need to define what web apps are before
we know what to build

5. definition

6. definition
web apps are websites

7. definition
web apps are websites
web apps perform a useful function

8. definition
web apps are websites
web apps perform a useful function
web apps are targeted at smartphones

9. definition
web apps are websites
web apps perform a useful function
web apps are targeted at smartphones
web apps are built in web technologies but
also require some native code to function
well

10. case studies
what popular websites can you think of
that might benefit from being web apps?

11. case studies
what popular websites can you think of
that might benefit from being web apps?
facebook as a web app...

12. case studies
what popular websites can you think of
that might benefit from being web apps?
facebook as a web app...
gmail as a web app...

13. native
what native languages are used for
iphone, android and blackberry?

14. native
what native languages are used for
iphone, android and blackberry?
objective-c (c/c++)

15. native
what native languages are used for
iphone, android and blackberry?
objective-c (c/c++)
java

16. native
what native languages are used for
iphone, android and blackberry?
objective-c (c/c++)
java
qt

17. native
what native languages are used for
iphone, android and blackberry?
objective-c (c/c++)
java
qt
html (proprietary)

18. client
what client-side languages might
we use in building web apps?

19. client
what client-side languages might
we use in building web apps?
html(5)

20. client
what client-side languages might
we use in building web apps?
html(5)
css(3)

21. client
what client-side languages might
we use in building web apps?
html(5)
css(3)
javascript

22. server
what server-side languages might
we use in building web apps?

23. server
what server-side languages might
we use in building web apps?
php

24. server
what server-side languages might
we use in building web apps?
php
sql

25. server
what server-side languages might
we use in building web apps?
php
sql
...node.js

26. aspects of development

27. aspects of development
tools

28. aspects of development
tools
tricks

29. aspects of development
tools
tricks
trade

30. tools

31. tools
sdk

32. tools
sdk
ide (dreamweaver, xcode)

33. tools
sdk
ide (dreamweaver, xcode)
browser (chrome, please!)

34. tools
sdk
ide (dreamweaver, xcode)
browser (chrome, please!)
console

35. tools
sdk
ide (dreamweaver, xcode)
browser (chrome, please!)
console
dms (phpmyadmin)

36. tools
sdk
ide (dreamweaver, xcode)
browser (chrome, please!)
console
dms (phpmyadmin)
cvs (git/github)

37. tricks

38. tricks
edgy html/css/javascript

39. tricks
edgy html/css/javascript
thinking in screens

40. tricks
edgy html/css/javascript
thinking in screens
keeping it lean

41. tricks
edgy html/css/javascript
thinking in screens
keeping it lean
client pitfalls

42. trade

43. trade
wireframe

44. trade
wireframe
prototype

45. trade
wireframe
prototype
design

46. trade
wireframe
prototype
design
server-side

47. trade
wireframe
prototype
design
server-side
client-side

48. trade
wireframe
prototype
design
server-side
client-side
native wrapper

49. tasks

50. tasks
conceptualise

51. tasks
conceptualise
wireframe

52. tasks
conceptualise
wireframe
server

53. tasks
conceptualise
wireframe
server
client

54. tasks
conceptualise
wireframe
server
client
native

55. conceptualise

56. conceptualise
what does the application do?

57. conceptualise
what does the application do?
what are the data objects involved?

58. conceptualise
what does the application do?
what are the data objects involved?
how do they interact?

59. wireframe

60. wireframe
what do the screens look like?

61. wireframe
what do the screens look like?
what does each button do?

62. wireframe
what do the screens look like?
what does each button do?
can some elements be named/grouped?

63. server

64. server
create database objects

65. server
create database objects
create api endpoints

66. client

67. client
create interface structure

68. client
create interface structure
create ajax requests for api endpoints

69. client
create interface structure
create ajax requests for api endpoints
create screens from wireframes

70. native

71. native
create wrapper for iphone/ipad

72. native
create wrapper for iphone/ipad
create wrapper for android

73. native
create wrapper for iphone/ipad
create wrapper for android
create wrapper for blackberry