JAMStack refers to a modern web development architecture for building sites on client side Javascript, APIs and prebuilt markup. Brian is the host of JAMStack Radio and is the Lead Developer Advocate for Netlify, a company that automates the pain away of managing static site deployments. Brian will show us why the JAMStack is becoming an architecture of choice for all sorts of projects and how it can be applied in building fast, scalable civic-impact projects.

1. Civic Hack on
the JAMstack
@bdougieYO

2. learning from
what works
@bdougieYO

3. Grand Master Flash
& The Furious Five
@bdougieYO@bdougieYO

4. @bdougieYO@bdougieYO

5. Simplicity
Cost
Speed
@bdougieYO@bdougieYO

6. @bdougieYO@bdougieYO

7. @bdougieYO@bdougieYO

8. The JAM Structure
Browser
Client
Build Tool
microservices
@bdougieYO@bdougieYO

9. @bdougieYO
@bdougieYO
Monolithic
Architecture
@bdougieYO

10. @bdougieYOsandwich.netlify.com
@bdougieYO
The JAM Architecture
APIClient
@bdougieYO

11. @bdougieYOsandwich.netlify.com
@bdougieYO
The JAM Architecture
APIClient
@bdougieYO

12. @bdougieYOsandwich.netlify.com
@bdougieYO
Spread the JAM
@bdougieYO

13. Sample from what is
good

14. @bdougieYO@bdougieYO

15. @bdougieYO@bdougieYO

16. @bdougieYO@bdougieYO
API Client

17. @bdougieYO@bdougieYO@bdougieYO

18. @bdougieYO@bdougieYO@bdougieYO

19. @bdougieYO@bdougieYO
Markdown powered client

20. @bdougieYO@bdougieYO@bdougieYO

21. History

22. @bdougieYO@bdougieYO

23. about contact
The Static Website
index.html
@bdougieYO@bdougieYO

24. @bdougieYO@bdougieYO

25. @bdougieYO@bdougieYO

26. Not
JAM
stack
@bdougieYO@bdougieYO

27. The Website Architecture
Client
Web Server
App Server
Database
@bdougieYO@bdougieYO

28. The Website
Client
Web Server
App Server
Database
Monolithic
Application
@bdougieYO@bdougieYO

29. @bdougieYO@bdougieYO

30. Wordpress
@bdougieYO@bdougieYO

31. The Website w/plugins
Client
Web Server
App Server
Database
Monolithic
Application
@bdougieYO@bdougieYO
plugins
plugins
plugins
plugins

32. @bdougieYO
Who is handling?
speed, cost, security
@bdougieYO

33. @bdougieYO
Wordpress
@bdougieYO

34. sandwich.netlify.com @bdougieYO
@bdougieYO
@bdougieYO@bdougieYO

35. The durag error for rap
sandwich.netlify.com @bdougieYO
bundled.netlify.com @bdougieYO
@bdougieYO@bdougieYO

36. Through the fire
sandwich.netlify.com @bdougieYO
bundled.netlify.com @bdougieYO
@bdougieYO@bdougieYO
Through the wire

37. @bdougieYOsandwich.netlify.com
@bdougieYO
The JAM Architecture
APIClient
@bdougieYO

38. Today

39. (sort-of)
@bdougieYO@bdougieYO

40. index.html about contact
Statically Bundled Output
@bdougieYO@bdougieYO

41. Static Site Generators
@bdougieYO@bdougieYO

42. @bdougieYO
index.html about contact
Markdown Files
@bdougieYO

43. @bdougieYO@bdougieYO

44. Continuos Integration
@bdougieYO@bdougieYO

45. The JAM Architecture
Client
Git
@bdougieYO
CI
@bdougieYO

46. Continuous Integration (CI)
CDN
Continuous Delivery
Git
@bdougieYO@bdougieYO

47. Continuous Delivery
Browser
Client
Build Tool
microservices
@bdougieYO@bdougieYO

48. The Modern Website
CDN
Continuous Delivery
Git
@bdougieYO@bdougieYO

49. Simplicity

50. New fresh look on the CMS
bundled.netlify.com @bdougieYO
@bdougieYO@bdougieYO

51. @bdougieYO
netlifycms.org
@bdougieYO

52. @bdougieYO
My Middleman Blog
@bdougieYO

53. Netlify CMS
@bdougieYO
Netlify Hugo Marketing/Docs Site
@bdougieYO

54. @bdougieYO
netlify/netlify-cms
@bdougieYO

55. @bdougieYO@bdougieYO
Started door

56. @bdougieYO
JAM Restaurant App
@bdougieYO

57. @bdougieYO
Flexible Menu Updating
@bdougieYO

58. @bdougieYO
Flexible Menu Updating
@bdougieYO

59. @bdougieYO
Flexible Image Gallery
@bdougieYO

60. @bdougieYO
Flexible Image Gallery
@bdougieYO

61. @bdougieYO@bdougieYO

62. @bdougieYO
Reservations
@bdougieYO

63. @bdougieYO
Serverless Reservations
@bdougieYO

64. @bdougieYO
Serverless Reservations
@bdougieYO

65. @bdougieYO
Serverless Reservations
@bdougieYO

66. More Simplicity

67. @bdougieYO
http://www.benmvp.com/bart-salmon/
@bdougieYO

68. @bdougieYO
http://www.benmvp.com/bart-salmon/
@bdougieYO
APIClient

69. @bdougieYO
https://www.opensmc.tech/
@bdougieYO

70. @bdougieYO
https://www.opensmc.tech/
@bdougieYO
BackendClient

71. Cost

72. @bdougieYO
It’s cost less
@bdougieYO

73. @bdougieYO
It’s really does
@bdougieYO

74. @bdougieYO
it’s rude to talk
about money
@bdougieYO

75. @bdougieYO
Outsource
Complexity
@bdougieYO

76. @bdougieYO
Outsource
Complexity
Without the Cost
@bdougieYO

77. @bdougieYO
Auth w/Auth0
@bdougieYO

78. @bdougieYO
Auth w/Auth0
@bdougieYO

79. @bdougieYO
Commerce w/Snipcart
@bdougieYO

80. @bdougieYO@bdougieYO

81. @bdougieYO@bdougieYO

82. @bdougieYO@bdougieYO
do more with actual
plugins

83. Speed

84. performance.sucuri.net
@bdougieYO@bdougieYO

85. *green is good, red is bad
@bdougieYO@bdougieYO

86. @bdougieYO@bdougieYO

87. @bdougieYO
CDN
@bdougieYO

88. @bdougieYO
before after
@bdougieYO

89. Speed, Cost,
Simplicity, but what
about?

90. Server-side
Rendering

91. Serverless-side
Rendering

92. iot
email
rest apis
schedulers
notifications
form handling
user database
continuous automation
@bdougieYOhttps://github.com/serverless/examples @bdougieYO

93. SEO

94. @bdougieYOsandwich.netlify.com
@bdougieYO
The JAM Architecture
APIClient
@bdougieYO
SEO?

95. Static sites don’t
need servers

96. @bdougieYO
It’s Static HTML
@bdougieYO

97. @bdougieYO
or bundles to static
at build time (React)
@bdougieYO

98. Templates

99. @bdougieYO@bdougieYO

100. @bdougieYO
templates.netlify.com
@bdougieYO

101. @bdougieYO
https://www.netlify.com/blog/2017/10/05/coding-modern-
websites-with-the-jamstack-part-1/
@bdougieYO

102. http://bit.ly/tastyEggRolls
@bdougieYO
1. Clone from templates.netlify.com
2. Connect the CMS
3. Add a menu item
4. Change the name of the restaurant
@bdougieYO

103. Some other things

104. @bdougieYO
Site of the week
@bdougieYO

105. @bdougieYO
Algolia Search
@bdougieYO

106. @bdougieYO
SparkPost Emails
@bdougieYO

107. @bdougieYO@bdougieYO

108. @bdougieYO