SlideShare a Scribd company logo
1 of 33
Download to read offline
Small, but
perfectly
formed.

               Minimalism in
             web development
2.5 million parts
1,060 valves
1,440 circuit breakers
230 miles of wire
.. a bit simpler
=
=
“Minimalism describes
movements in various forms of art
and design … where the work is
stripped down to its most
fundamental features.”
“The term minimalist is often
applied colloquially to designate
anything which is spare or stripped
to its essentials.”
Use simple tools.
Build simple things.
      (where appropriate)
1. Small is beautiful.


2. Make each program
do one thing well.


3. Build a prototype
as soon as possible.
Lines of code
Moving parts
Concepts
API
“a self-contained, serverless, zero-
 configuration, transactional SQL
         database engine.”
v 5.1.38                          v 3.6.17



    37.7MB source                        1.04MB source
   download (.tar.gz)                   download (.tar.gz)



1.2 million lines of code              65,000 lines of code



     Client/server
                                          It’s just a file.
     architecture
SQLite will work great as the
database engine for low to medium
         traffic websites..

(which is to say, 99.9%
   of all websites)
                         http://www.sqlite.org/whentouse.html
CSS3
   Take hard stuff..
  that everyone does
   and make it easy.
Before

CSS3


   <div class='rbox_container' id='rbox'><div id='rbox_holder'><div id='rbox_topleft'></div>
   <div class='rbox_top_connector' id='rbox_middle'></div><div id='rbox_topright'></div></div>
   <div id='rbox_content'><div id='mainbox'><div class="content">
                       
                    Your Content Goes Here


   </div></div></div><div id='rbox_holder'><div id='rbox_bottomleft'></div>
   <div class='rbox_bottom_connector' id='rbox_middle' ></div>
   <div id='rbox_bottomright'></div></div></div>




                           http://nuttersmark.com/blog/web-development/-super-fantastic-resizable-pattern-friendly-css-rounded-corners
Before

CSS3
   div#rbox{height:auto;margin:20px;float:left;}
   div#rbox_holder,div#rbox_topleft, div#rbox_bottomleft, div#rbox_topright,
   div#rbox_bottomright,div#rbox_middle,div#rbox_middle_news, div#rbox_middle_full {height:66px;}
   div#rbox_holder { width:100%;}
   div#rbox_topleft, div#rbox_bottomleft {float:left;width:60px;}
   div#rbox_topleft { background:url('top_left_corner.gif') no-repeat 6px -6px;} /* IE6 */
   html>body div#rbox_topleft { background:url('top_left_corner.png') no-repeat 6px -6px;}
   div#rbox_bottomleft {width:60px; background:url(bottom_left_corner.gif) 0px -12px no-repeat;} /* IE6 */
   html>body div#rbox_bottomleft {width:60px; background:url(bottom_left_corner.png) 0px -12px no-repeat;}
   div#rbox_topright, div#rbox_bottomright {float:right;width:60px;}
   div#rbox_topright {background:url(top_right_corner.gif) no-repeat -14px -2px;} /* IE6 */
   html>body div#rbox_topright {background:url(top_right_corner.png) no-repeat -14px -2px;}
   div#rbox_bottomright {background:url(bottom_right_corner.gif) -14px -12px no-repeat;} /* IE6 */
   html>body div#rbox_bottomright {background:url(bottom_right_corner.png) -14px -12px no-repeat;}
   div#rbox_middle {float:left;}
   div#rbox div#mainbox {background:#fff;width:648px;margin-left:-11px;padding-left:10px;}
   div#rbox div#mainbox div.content {position:relative;top:-50px;}
   div#rbox div#mainbox div.content p {margin:0px;}
   div#rbox_content {padding:0 20px 0 20px; background:transparent url('right_edge.gif') repeat-y; 665px 0px;}  /* IE6  */
   html>body div#rbox_content {padding:0 20px 0 20px; background:transparent url('right_edge.png') repeat-y 665px 0px;}
   .rbox_container {width:700px;}
   .rbox_top_connector, .rbox_mainbox2_bottom {width:580px; background-color:#fff; }
   .rbox_bottom_connector {width:580px; background-color:none; background: url('bottom_edge.gif')  repeat-x 0px -12px;}  /*
   IE6  */
   html>body .rbox_bottom_connector {width:580px; background-color:none; background: url('bottom_edge.png')  repeat-x 0px
   -12px;}



                                     http://nuttersmark.com/blog/web-development/-super-fantastic-resizable-pattern-friendly-css-rounded-corners
CSS3

 h1 { border-radius: 10px; }
CSS3
       border-radius
       border-image
       box-shadow
       text-shadow

   Transforms, transitions,
    variables, animation..
Logo




                 Shadows




Curved corners
Logo
                 100%
                      imag
                    free   e-




                         Shadows




Curved corners
Logo
                                      100%
                                           imag
                                         free   e-


               (except this bit, of course)

                                              Shadows




Curved corners
Graceful Degradation
AKA “it doesn’t look completely shit in IE.”
“a lightweight, high performance web server”
v 2.2.13                            v 0.8.13



   6.9MB source                         0.6MB source
 download (.tar.gz)                   download (.tar.gz)



387,000 lines of code                78,000 lines of code



 Threading/forking
                                   Event-driven architecture
concurrency model
http://blog.webfaction.com/a-little-holiday-present
+         =
    VPS
for static content

       +               +         =
                           VPS
for your application
Microframeworks.
Frameworks do
lots of stuff.         web.py
                       sinatra
Lots of apps don’t    camping
                     limonade
need much stuff.         djng
                        juno
                        newf
Microframeworks         mnml
                         itty
do just enough           glue
                     squatting
stuff.
from itty import get, run_itty

@get('/')
def index(request):
    return 'Hello World!'

run_itty()
Perfection is achieved, not when there is
         nothing more to add..

 but when there is nothing left to take
                away.
FIN.
http://j4mie.org




http://www.flickr.com/photos/moriza/308483890/
http://www.flickr.com/photos/toptechwriter/338573258/
http://www.flickr.com/photos/jamesbondsv/2648217927/
http://www.flickr.com/photos/ppdigital/2327889692/
http://www.flickr.com/photos/define23/2286544411/

More Related Content

What's hot

Bringing Virtual Reality to the Web: VR, WebGL and CSS – Together At Last!
Bringing Virtual Reality to the Web: VR, WebGL and CSS – Together At Last!Bringing Virtual Reality to the Web: VR, WebGL and CSS – Together At Last!
Bringing Virtual Reality to the Web: VR, WebGL and CSS – Together At Last!FITC
 
Levent-Gurses' Introduction to Web Components & Polymer
Levent-Gurses' Introduction to Web Components & PolymerLevent-Gurses' Introduction to Web Components & Polymer
Levent-Gurses' Introduction to Web Components & PolymerErik Isaksen
 
Magento 2 Front-end performance tips & tricks - Nomadmage September 2017
Magento 2 Front-end performance tips & tricks - Nomadmage September 2017Magento 2 Front-end performance tips & tricks - Nomadmage September 2017
Magento 2 Front-end performance tips & tricks - Nomadmage September 2017Bartek Igielski
 
Using The New Flash Stage3D Web Technology To Build Your Own Next 3D Browser ...
Using The New Flash Stage3D Web Technology To Build Your Own Next 3D Browser ...Using The New Flash Stage3D Web Technology To Build Your Own Next 3D Browser ...
Using The New Flash Stage3D Web Technology To Build Your Own Next 3D Browser ...Daosheng Mu
 
Rapid Prototyping FTW!!!
Rapid Prototyping FTW!!!Rapid Prototyping FTW!!!
Rapid Prototyping FTW!!!cloudbring
 
Using Web Standards to create Interactive Data Visualizations for the Web
Using Web Standards to create Interactive Data Visualizations for the WebUsing Web Standards to create Interactive Data Visualizations for the Web
Using Web Standards to create Interactive Data Visualizations for the Webphilogb
 
SPA, isomorphic and back to the server: our journey with JavaScript @ JsDay 2...
SPA, isomorphic and back to the server: our journey with JavaScript @ JsDay 2...SPA, isomorphic and back to the server: our journey with JavaScript @ JsDay 2...
SPA, isomorphic and back to the server: our journey with JavaScript @ JsDay 2...Alessandro Nadalin
 
HTML5와 오픈소스 기반의 Web Components 기술
HTML5와 오픈소스 기반의 Web Components 기술HTML5와 오픈소스 기반의 Web Components 기술
HTML5와 오픈소스 기반의 Web Components 기술Jeongkyu Shin
 
Webové aplikace v JavaScriptu
Webové aplikace v JavaScriptuWebové aplikace v JavaScriptu
Webové aplikace v JavaScriptuPavol Hejný
 
An Introduction to WebVR – or How to make your user sick in 60 seconds
An Introduction to WebVR – or How to make your user sick in 60 secondsAn Introduction to WebVR – or How to make your user sick in 60 seconds
An Introduction to WebVR – or How to make your user sick in 60 secondsGeilDanke
 
ITNetwork - 3D na webu
ITNetwork - 3D na webuITNetwork - 3D na webu
ITNetwork - 3D na webuPavol Hejný
 
CSS3 Takes on the World
CSS3 Takes on the WorldCSS3 Takes on the World
CSS3 Takes on the WorldJonathan Snook
 
3D and VR on the web
3D and VR on the web3D and VR on the web
3D and VR on the webAdam Nagy
 
Thats Not Flash?
Thats Not Flash?Thats Not Flash?
Thats Not Flash?Mike Wilcox
 
A brief look at CSS3 techniques by Aaron Rodgers, Web Designer @ vzaar.com
A brief look at CSS3 techniques by Aaron Rodgers, Web Designer @ vzaar.comA brief look at CSS3 techniques by Aaron Rodgers, Web Designer @ vzaar.com
A brief look at CSS3 techniques by Aaron Rodgers, Web Designer @ vzaar.comapplicake
 
Mobile Web Development
Mobile Web DevelopmentMobile Web Development
Mobile Web DevelopmentJonathan Snook
 
AngularJS Introduction
AngularJS IntroductionAngularJS Introduction
AngularJS IntroductionCarlos Morales
 
CCSP 2012F 早點下班的工具
CCSP 2012F 早點下班的工具 CCSP 2012F 早點下班的工具
CCSP 2012F 早點下班的工具 裕欽 林
 

What's hot (20)

Bringing Virtual Reality to the Web: VR, WebGL and CSS – Together At Last!
Bringing Virtual Reality to the Web: VR, WebGL and CSS – Together At Last!Bringing Virtual Reality to the Web: VR, WebGL and CSS – Together At Last!
Bringing Virtual Reality to the Web: VR, WebGL and CSS – Together At Last!
 
Levent-Gurses' Introduction to Web Components & Polymer
Levent-Gurses' Introduction to Web Components & PolymerLevent-Gurses' Introduction to Web Components & Polymer
Levent-Gurses' Introduction to Web Components & Polymer
 
Magento 2 Front-end performance tips & tricks - Nomadmage September 2017
Magento 2 Front-end performance tips & tricks - Nomadmage September 2017Magento 2 Front-end performance tips & tricks - Nomadmage September 2017
Magento 2 Front-end performance tips & tricks - Nomadmage September 2017
 
Using The New Flash Stage3D Web Technology To Build Your Own Next 3D Browser ...
Using The New Flash Stage3D Web Technology To Build Your Own Next 3D Browser ...Using The New Flash Stage3D Web Technology To Build Your Own Next 3D Browser ...
Using The New Flash Stage3D Web Technology To Build Your Own Next 3D Browser ...
 
Rapid Prototyping FTW!!!
Rapid Prototyping FTW!!!Rapid Prototyping FTW!!!
Rapid Prototyping FTW!!!
 
Using Web Standards to create Interactive Data Visualizations for the Web
Using Web Standards to create Interactive Data Visualizations for the WebUsing Web Standards to create Interactive Data Visualizations for the Web
Using Web Standards to create Interactive Data Visualizations for the Web
 
SPA, isomorphic and back to the server: our journey with JavaScript @ JsDay 2...
SPA, isomorphic and back to the server: our journey with JavaScript @ JsDay 2...SPA, isomorphic and back to the server: our journey with JavaScript @ JsDay 2...
SPA, isomorphic and back to the server: our journey with JavaScript @ JsDay 2...
 
HTML5와 오픈소스 기반의 Web Components 기술
HTML5와 오픈소스 기반의 Web Components 기술HTML5와 오픈소스 기반의 Web Components 기술
HTML5와 오픈소스 기반의 Web Components 기술
 
Webové aplikace v JavaScriptu
Webové aplikace v JavaScriptuWebové aplikace v JavaScriptu
Webové aplikace v JavaScriptu
 
An Introduction to WebVR – or How to make your user sick in 60 seconds
An Introduction to WebVR – or How to make your user sick in 60 secondsAn Introduction to WebVR – or How to make your user sick in 60 seconds
An Introduction to WebVR – or How to make your user sick in 60 seconds
 
ITNetwork - 3D na webu
ITNetwork - 3D na webuITNetwork - 3D na webu
ITNetwork - 3D na webu
 
CSS3 Takes on the World
CSS3 Takes on the WorldCSS3 Takes on the World
CSS3 Takes on the World
 
RIAs
RIAsRIAs
RIAs
 
3D and VR on the web
3D and VR on the web3D and VR on the web
3D and VR on the web
 
Thats Not Flash?
Thats Not Flash?Thats Not Flash?
Thats Not Flash?
 
A brief look at CSS3 techniques by Aaron Rodgers, Web Designer @ vzaar.com
A brief look at CSS3 techniques by Aaron Rodgers, Web Designer @ vzaar.comA brief look at CSS3 techniques by Aaron Rodgers, Web Designer @ vzaar.com
A brief look at CSS3 techniques by Aaron Rodgers, Web Designer @ vzaar.com
 
Mobile Web Development
Mobile Web DevelopmentMobile Web Development
Mobile Web Development
 
AngularJS Introduction
AngularJS IntroductionAngularJS Introduction
AngularJS Introduction
 
Intro to Sails.js
Intro to Sails.jsIntro to Sails.js
Intro to Sails.js
 
CCSP 2012F 早點下班的工具
CCSP 2012F 早點下班的工具 CCSP 2012F 早點下班的工具
CCSP 2012F 早點下班的工具
 

Similar to Minimalism in web development

Rails in the Cloud
Rails in the CloudRails in the Cloud
Rails in the Cloudiwarshak
 
Analyzing the Performance of Mobile Web
Analyzing the Performance of Mobile WebAnalyzing the Performance of Mobile Web
Analyzing the Performance of Mobile WebAriya Hidayat
 
[convergese] Adaptive Images in Responsive Web Design
[convergese] Adaptive Images in Responsive Web Design[convergese] Adaptive Images in Responsive Web Design
[convergese] Adaptive Images in Responsive Web DesignChristopher Schmitt
 
Five Pound App talk: hereit.is, Web app architecture, REST, CSS3
Five Pound App talk: hereit.is, Web app architecture, REST, CSS3Five Pound App talk: hereit.is, Web app architecture, REST, CSS3
Five Pound App talk: hereit.is, Web app architecture, REST, CSS3Jamie Matthews
 
Modular Web Applications With Netzke
Modular Web Applications With NetzkeModular Web Applications With Netzke
Modular Web Applications With Netzkenetzke
 
Everything is Awesome - Cutting the Corners off the Web
Everything is Awesome - Cutting the Corners off the WebEverything is Awesome - Cutting the Corners off the Web
Everything is Awesome - Cutting the Corners off the WebJames Rakich
 
UIWebViewでつくるUI
UIWebViewでつくるUIUIWebViewでつくるUI
UIWebViewでつくるUIcocopon
 
Interface Styling & Scripting on WebKit Mobile
Interface Styling & Scripting on WebKit MobileInterface Styling & Scripting on WebKit Mobile
Interface Styling & Scripting on WebKit MobileDavid Aurelio
 
Exploring Critical Rendering Path
Exploring Critical Rendering PathExploring Critical Rendering Path
Exploring Critical Rendering PathRaphael Amorim
 
Ease into HTML5 and CSS3
Ease into HTML5 and CSS3Ease into HTML5 and CSS3
Ease into HTML5 and CSS3Brian Moon
 
Js foo - Sept 8 upload
Js foo - Sept 8 uploadJs foo - Sept 8 upload
Js foo - Sept 8 uploadDebnath Sinha
 
Adobe MAX 2008: HTML/CSS + Fireworks
Adobe MAX 2008: HTML/CSS + FireworksAdobe MAX 2008: HTML/CSS + Fireworks
Adobe MAX 2008: HTML/CSS + FireworksNathan Smith
 
Speed is Essential for a Great Web Experience
Speed is Essential for a Great Web ExperienceSpeed is Essential for a Great Web Experience
Speed is Essential for a Great Web ExperienceAndy Davies
 
[peachpit] Adaptive Images in Responsive Web Design
[peachpit] Adaptive Images in Responsive Web Design[peachpit] Adaptive Images in Responsive Web Design
[peachpit] Adaptive Images in Responsive Web DesignChristopher Schmitt
 
Virtualization and Cloud Computing with Elastic Server On Demand
Virtualization and Cloud Computing with Elastic Server On DemandVirtualization and Cloud Computing with Elastic Server On Demand
Virtualization and Cloud Computing with Elastic Server On DemandYan Pritzker
 
Make your animations perform well - Anna Migas - Codemotion Rome 2017
Make your animations perform well - Anna Migas - Codemotion Rome 2017Make your animations perform well - Anna Migas - Codemotion Rome 2017
Make your animations perform well - Anna Migas - Codemotion Rome 2017Codemotion
 
[refreshaustin] Adaptive Images in Responsive Web Design
[refreshaustin] Adaptive Images in Responsive Web Design[refreshaustin] Adaptive Images in Responsive Web Design
[refreshaustin] Adaptive Images in Responsive Web DesignChristopher Schmitt
 
Stefan Judis "Did we(b development) lose the right direction?"
Stefan Judis "Did we(b development) lose the right direction?"Stefan Judis "Did we(b development) lose the right direction?"
Stefan Judis "Did we(b development) lose the right direction?"Fwdays
 

Similar to Minimalism in web development (20)

Rails in the Cloud
Rails in the CloudRails in the Cloud
Rails in the Cloud
 
Analyzing the Performance of Mobile Web
Analyzing the Performance of Mobile WebAnalyzing the Performance of Mobile Web
Analyzing the Performance of Mobile Web
 
[convergese] Adaptive Images in Responsive Web Design
[convergese] Adaptive Images in Responsive Web Design[convergese] Adaptive Images in Responsive Web Design
[convergese] Adaptive Images in Responsive Web Design
 
HTML5 - A Whirlwind tour
HTML5 - A Whirlwind tourHTML5 - A Whirlwind tour
HTML5 - A Whirlwind tour
 
Five Pound App talk: hereit.is, Web app architecture, REST, CSS3
Five Pound App talk: hereit.is, Web app architecture, REST, CSS3Five Pound App talk: hereit.is, Web app architecture, REST, CSS3
Five Pound App talk: hereit.is, Web app architecture, REST, CSS3
 
Modular Web Applications With Netzke
Modular Web Applications With NetzkeModular Web Applications With Netzke
Modular Web Applications With Netzke
 
Everything is Awesome - Cutting the Corners off the Web
Everything is Awesome - Cutting the Corners off the WebEverything is Awesome - Cutting the Corners off the Web
Everything is Awesome - Cutting the Corners off the Web
 
UIWebViewでつくるUI
UIWebViewでつくるUIUIWebViewでつくるUI
UIWebViewでつくるUI
 
Interface Styling & Scripting on WebKit Mobile
Interface Styling & Scripting on WebKit MobileInterface Styling & Scripting on WebKit Mobile
Interface Styling & Scripting on WebKit Mobile
 
Exploring Critical Rendering Path
Exploring Critical Rendering PathExploring Critical Rendering Path
Exploring Critical Rendering Path
 
Ease into HTML5 and CSS3
Ease into HTML5 and CSS3Ease into HTML5 and CSS3
Ease into HTML5 and CSS3
 
Js foo - Sept 8 upload
Js foo - Sept 8 uploadJs foo - Sept 8 upload
Js foo - Sept 8 upload
 
Adobe MAX 2008: HTML/CSS + Fireworks
Adobe MAX 2008: HTML/CSS + FireworksAdobe MAX 2008: HTML/CSS + Fireworks
Adobe MAX 2008: HTML/CSS + Fireworks
 
Speed is Essential for a Great Web Experience
Speed is Essential for a Great Web ExperienceSpeed is Essential for a Great Web Experience
Speed is Essential for a Great Web Experience
 
[peachpit] Adaptive Images in Responsive Web Design
[peachpit] Adaptive Images in Responsive Web Design[peachpit] Adaptive Images in Responsive Web Design
[peachpit] Adaptive Images in Responsive Web Design
 
Virtualization and Cloud Computing with Elastic Server On Demand
Virtualization and Cloud Computing with Elastic Server On DemandVirtualization and Cloud Computing with Elastic Server On Demand
Virtualization and Cloud Computing with Elastic Server On Demand
 
Rails入门培训
Rails入门培训Rails入门培训
Rails入门培训
 
Make your animations perform well - Anna Migas - Codemotion Rome 2017
Make your animations perform well - Anna Migas - Codemotion Rome 2017Make your animations perform well - Anna Migas - Codemotion Rome 2017
Make your animations perform well - Anna Migas - Codemotion Rome 2017
 
[refreshaustin] Adaptive Images in Responsive Web Design
[refreshaustin] Adaptive Images in Responsive Web Design[refreshaustin] Adaptive Images in Responsive Web Design
[refreshaustin] Adaptive Images in Responsive Web Design
 
Stefan Judis "Did we(b development) lose the right direction?"
Stefan Judis "Did we(b development) lose the right direction?"Stefan Judis "Did we(b development) lose the right direction?"
Stefan Judis "Did we(b development) lose the right direction?"
 

Recently uploaded

Microsoft 365 Copilot: How to boost your productivity with AI – Part two: Dat...
Microsoft 365 Copilot: How to boost your productivity with AI – Part two: Dat...Microsoft 365 Copilot: How to boost your productivity with AI – Part two: Dat...
Microsoft 365 Copilot: How to boost your productivity with AI – Part two: Dat...Nikki Chapple
 
Microservices, Docker deploy and Microservices source code in C#
Microservices, Docker deploy and Microservices source code in C#Microservices, Docker deploy and Microservices source code in C#
Microservices, Docker deploy and Microservices source code in C#Karmanjay Verma
 
Transcript: New from BookNet Canada for 2024: BNC SalesData and LibraryData -...
Transcript: New from BookNet Canada for 2024: BNC SalesData and LibraryData -...Transcript: New from BookNet Canada for 2024: BNC SalesData and LibraryData -...
Transcript: New from BookNet Canada for 2024: BNC SalesData and LibraryData -...BookNet Canada
 
Arizona Broadband Policy Past, Present, and Future Presentation 3/25/24
Arizona Broadband Policy Past, Present, and Future Presentation 3/25/24Arizona Broadband Policy Past, Present, and Future Presentation 3/25/24
Arizona Broadband Policy Past, Present, and Future Presentation 3/25/24Mark Goldstein
 
React Native vs Ionic - The Best Mobile App Framework
React Native vs Ionic - The Best Mobile App FrameworkReact Native vs Ionic - The Best Mobile App Framework
React Native vs Ionic - The Best Mobile App FrameworkPixlogix Infotech
 
Connecting the Dots for Information Discovery.pdf
Connecting the Dots for Information Discovery.pdfConnecting the Dots for Information Discovery.pdf
Connecting the Dots for Information Discovery.pdfNeo4j
 
2024 April Patch Tuesday
2024 April Patch Tuesday2024 April Patch Tuesday
2024 April Patch TuesdayIvanti
 
Digital Tools & AI in Career Development
Digital Tools & AI in Career DevelopmentDigital Tools & AI in Career Development
Digital Tools & AI in Career DevelopmentMahmoud Rabie
 
4. Cobus Valentine- Cybersecurity Threats and Solutions for the Public Sector
4. Cobus Valentine- Cybersecurity Threats and Solutions for the Public Sector4. Cobus Valentine- Cybersecurity Threats and Solutions for the Public Sector
4. Cobus Valentine- Cybersecurity Threats and Solutions for the Public Sectoritnewsafrica
 
Potential of AI (Generative AI) in Business: Learnings and Insights
Potential of AI (Generative AI) in Business: Learnings and InsightsPotential of AI (Generative AI) in Business: Learnings and Insights
Potential of AI (Generative AI) in Business: Learnings and InsightsRavi Sanghani
 
Long journey of Ruby standard library at RubyConf AU 2024
Long journey of Ruby standard library at RubyConf AU 2024Long journey of Ruby standard library at RubyConf AU 2024
Long journey of Ruby standard library at RubyConf AU 2024Hiroshi SHIBATA
 
Generative AI - Gitex v1Generative AI - Gitex v1.pptx
Generative AI - Gitex v1Generative AI - Gitex v1.pptxGenerative AI - Gitex v1Generative AI - Gitex v1.pptx
Generative AI - Gitex v1Generative AI - Gitex v1.pptxfnnc6jmgwh
 
Tampa BSides - The No BS SOC (slides from April 6, 2024 talk)
Tampa BSides - The No BS SOC (slides from April 6, 2024 talk)Tampa BSides - The No BS SOC (slides from April 6, 2024 talk)
Tampa BSides - The No BS SOC (slides from April 6, 2024 talk)Mark Simos
 
Landscape Catalogue 2024 Australia-1.pdf
Landscape Catalogue 2024 Australia-1.pdfLandscape Catalogue 2024 Australia-1.pdf
Landscape Catalogue 2024 Australia-1.pdfAarwolf Industries LLC
 
JET Technology Labs White Paper for Virtualized Security and Encryption Techn...
JET Technology Labs White Paper for Virtualized Security and Encryption Techn...JET Technology Labs White Paper for Virtualized Security and Encryption Techn...
JET Technology Labs White Paper for Virtualized Security and Encryption Techn...amber724300
 
Time Series Foundation Models - current state and future directions
Time Series Foundation Models - current state and future directionsTime Series Foundation Models - current state and future directions
Time Series Foundation Models - current state and future directionsNathaniel Shimoni
 
Glenn Lazarus- Why Your Observability Strategy Needs Security Observability
Glenn Lazarus- Why Your Observability Strategy Needs Security ObservabilityGlenn Lazarus- Why Your Observability Strategy Needs Security Observability
Glenn Lazarus- Why Your Observability Strategy Needs Security Observabilityitnewsafrica
 
So einfach geht modernes Roaming fuer Notes und Nomad.pdf
So einfach geht modernes Roaming fuer Notes und Nomad.pdfSo einfach geht modernes Roaming fuer Notes und Nomad.pdf
So einfach geht modernes Roaming fuer Notes und Nomad.pdfpanagenda
 
Generative Artificial Intelligence: How generative AI works.pdf
Generative Artificial Intelligence: How generative AI works.pdfGenerative Artificial Intelligence: How generative AI works.pdf
Generative Artificial Intelligence: How generative AI works.pdfIngrid Airi González
 
Abdul Kader Baba- Managing Cybersecurity Risks and Compliance Requirements i...
Abdul Kader Baba- Managing Cybersecurity Risks  and Compliance Requirements i...Abdul Kader Baba- Managing Cybersecurity Risks  and Compliance Requirements i...
Abdul Kader Baba- Managing Cybersecurity Risks and Compliance Requirements i...itnewsafrica
 

Recently uploaded (20)

Microsoft 365 Copilot: How to boost your productivity with AI – Part two: Dat...
Microsoft 365 Copilot: How to boost your productivity with AI – Part two: Dat...Microsoft 365 Copilot: How to boost your productivity with AI – Part two: Dat...
Microsoft 365 Copilot: How to boost your productivity with AI – Part two: Dat...
 
Microservices, Docker deploy and Microservices source code in C#
Microservices, Docker deploy and Microservices source code in C#Microservices, Docker deploy and Microservices source code in C#
Microservices, Docker deploy and Microservices source code in C#
 
Transcript: New from BookNet Canada for 2024: BNC SalesData and LibraryData -...
Transcript: New from BookNet Canada for 2024: BNC SalesData and LibraryData -...Transcript: New from BookNet Canada for 2024: BNC SalesData and LibraryData -...
Transcript: New from BookNet Canada for 2024: BNC SalesData and LibraryData -...
 
Arizona Broadband Policy Past, Present, and Future Presentation 3/25/24
Arizona Broadband Policy Past, Present, and Future Presentation 3/25/24Arizona Broadband Policy Past, Present, and Future Presentation 3/25/24
Arizona Broadband Policy Past, Present, and Future Presentation 3/25/24
 
React Native vs Ionic - The Best Mobile App Framework
React Native vs Ionic - The Best Mobile App FrameworkReact Native vs Ionic - The Best Mobile App Framework
React Native vs Ionic - The Best Mobile App Framework
 
Connecting the Dots for Information Discovery.pdf
Connecting the Dots for Information Discovery.pdfConnecting the Dots for Information Discovery.pdf
Connecting the Dots for Information Discovery.pdf
 
2024 April Patch Tuesday
2024 April Patch Tuesday2024 April Patch Tuesday
2024 April Patch Tuesday
 
Digital Tools & AI in Career Development
Digital Tools & AI in Career DevelopmentDigital Tools & AI in Career Development
Digital Tools & AI in Career Development
 
4. Cobus Valentine- Cybersecurity Threats and Solutions for the Public Sector
4. Cobus Valentine- Cybersecurity Threats and Solutions for the Public Sector4. Cobus Valentine- Cybersecurity Threats and Solutions for the Public Sector
4. Cobus Valentine- Cybersecurity Threats and Solutions for the Public Sector
 
Potential of AI (Generative AI) in Business: Learnings and Insights
Potential of AI (Generative AI) in Business: Learnings and InsightsPotential of AI (Generative AI) in Business: Learnings and Insights
Potential of AI (Generative AI) in Business: Learnings and Insights
 
Long journey of Ruby standard library at RubyConf AU 2024
Long journey of Ruby standard library at RubyConf AU 2024Long journey of Ruby standard library at RubyConf AU 2024
Long journey of Ruby standard library at RubyConf AU 2024
 
Generative AI - Gitex v1Generative AI - Gitex v1.pptx
Generative AI - Gitex v1Generative AI - Gitex v1.pptxGenerative AI - Gitex v1Generative AI - Gitex v1.pptx
Generative AI - Gitex v1Generative AI - Gitex v1.pptx
 
Tampa BSides - The No BS SOC (slides from April 6, 2024 talk)
Tampa BSides - The No BS SOC (slides from April 6, 2024 talk)Tampa BSides - The No BS SOC (slides from April 6, 2024 talk)
Tampa BSides - The No BS SOC (slides from April 6, 2024 talk)
 
Landscape Catalogue 2024 Australia-1.pdf
Landscape Catalogue 2024 Australia-1.pdfLandscape Catalogue 2024 Australia-1.pdf
Landscape Catalogue 2024 Australia-1.pdf
 
JET Technology Labs White Paper for Virtualized Security and Encryption Techn...
JET Technology Labs White Paper for Virtualized Security and Encryption Techn...JET Technology Labs White Paper for Virtualized Security and Encryption Techn...
JET Technology Labs White Paper for Virtualized Security and Encryption Techn...
 
Time Series Foundation Models - current state and future directions
Time Series Foundation Models - current state and future directionsTime Series Foundation Models - current state and future directions
Time Series Foundation Models - current state and future directions
 
Glenn Lazarus- Why Your Observability Strategy Needs Security Observability
Glenn Lazarus- Why Your Observability Strategy Needs Security ObservabilityGlenn Lazarus- Why Your Observability Strategy Needs Security Observability
Glenn Lazarus- Why Your Observability Strategy Needs Security Observability
 
So einfach geht modernes Roaming fuer Notes und Nomad.pdf
So einfach geht modernes Roaming fuer Notes und Nomad.pdfSo einfach geht modernes Roaming fuer Notes und Nomad.pdf
So einfach geht modernes Roaming fuer Notes und Nomad.pdf
 
Generative Artificial Intelligence: How generative AI works.pdf
Generative Artificial Intelligence: How generative AI works.pdfGenerative Artificial Intelligence: How generative AI works.pdf
Generative Artificial Intelligence: How generative AI works.pdf
 
Abdul Kader Baba- Managing Cybersecurity Risks and Compliance Requirements i...
Abdul Kader Baba- Managing Cybersecurity Risks  and Compliance Requirements i...Abdul Kader Baba- Managing Cybersecurity Risks  and Compliance Requirements i...
Abdul Kader Baba- Managing Cybersecurity Risks and Compliance Requirements i...
 

Minimalism in web development

  • 1. Small, but perfectly formed. Minimalism in web development
  • 2. 2.5 million parts 1,060 valves 1,440 circuit breakers 230 miles of wire
  • 3. .. a bit simpler
  • 4. =
  • 5. =
  • 6. “Minimalism describes movements in various forms of art and design … where the work is stripped down to its most fundamental features.”
  • 7. “The term minimalist is often applied colloquially to designate anything which is spare or stripped to its essentials.”
  • 8. Use simple tools. Build simple things. (where appropriate)
  • 9. 1. Small is beautiful. 2. Make each program do one thing well. 3. Build a prototype as soon as possible.
  • 10. Lines of code Moving parts Concepts API
  • 11. “a self-contained, serverless, zero- configuration, transactional SQL database engine.”
  • 12. v 5.1.38 v 3.6.17 37.7MB source 1.04MB source download (.tar.gz) download (.tar.gz) 1.2 million lines of code 65,000 lines of code Client/server It’s just a file. architecture
  • 13. SQLite will work great as the database engine for low to medium traffic websites.. (which is to say, 99.9% of all websites) http://www.sqlite.org/whentouse.html
  • 14. CSS3 Take hard stuff.. that everyone does and make it easy.
  • 15. Before CSS3 <div class='rbox_container' id='rbox'><div id='rbox_holder'><div id='rbox_topleft'></div> <div class='rbox_top_connector' id='rbox_middle'></div><div id='rbox_topright'></div></div> <div id='rbox_content'><div id='mainbox'><div class="content">                                       Your Content Goes Here </div></div></div><div id='rbox_holder'><div id='rbox_bottomleft'></div> <div class='rbox_bottom_connector' id='rbox_middle' ></div> <div id='rbox_bottomright'></div></div></div> http://nuttersmark.com/blog/web-development/-super-fantastic-resizable-pattern-friendly-css-rounded-corners
  • 16. Before CSS3 div#rbox{height:auto;margin:20px;float:left;} div#rbox_holder,div#rbox_topleft, div#rbox_bottomleft, div#rbox_topright, div#rbox_bottomright,div#rbox_middle,div#rbox_middle_news, div#rbox_middle_full {height:66px;} div#rbox_holder { width:100%;} div#rbox_topleft, div#rbox_bottomleft {float:left;width:60px;} div#rbox_topleft { background:url('top_left_corner.gif') no-repeat 6px -6px;} /* IE6 */ html>body div#rbox_topleft { background:url('top_left_corner.png') no-repeat 6px -6px;} div#rbox_bottomleft {width:60px; background:url(bottom_left_corner.gif) 0px -12px no-repeat;} /* IE6 */ html>body div#rbox_bottomleft {width:60px; background:url(bottom_left_corner.png) 0px -12px no-repeat;} div#rbox_topright, div#rbox_bottomright {float:right;width:60px;} div#rbox_topright {background:url(top_right_corner.gif) no-repeat -14px -2px;} /* IE6 */ html>body div#rbox_topright {background:url(top_right_corner.png) no-repeat -14px -2px;} div#rbox_bottomright {background:url(bottom_right_corner.gif) -14px -12px no-repeat;} /* IE6 */ html>body div#rbox_bottomright {background:url(bottom_right_corner.png) -14px -12px no-repeat;} div#rbox_middle {float:left;} div#rbox div#mainbox {background:#fff;width:648px;margin-left:-11px;padding-left:10px;} div#rbox div#mainbox div.content {position:relative;top:-50px;} div#rbox div#mainbox div.content p {margin:0px;} div#rbox_content {padding:0 20px 0 20px; background:transparent url('right_edge.gif') repeat-y; 665px 0px;}  /* IE6  */ html>body div#rbox_content {padding:0 20px 0 20px; background:transparent url('right_edge.png') repeat-y 665px 0px;} .rbox_container {width:700px;} .rbox_top_connector, .rbox_mainbox2_bottom {width:580px; background-color:#fff; } .rbox_bottom_connector {width:580px; background-color:none; background: url('bottom_edge.gif')  repeat-x 0px -12px;}  /* IE6  */ html>body .rbox_bottom_connector {width:580px; background-color:none; background: url('bottom_edge.png')  repeat-x 0px -12px;} http://nuttersmark.com/blog/web-development/-super-fantastic-resizable-pattern-friendly-css-rounded-corners
  • 17. CSS3 h1 { border-radius: 10px; }
  • 18. CSS3 border-radius border-image box-shadow text-shadow Transforms, transitions, variables, animation..
  • 19. Logo Shadows Curved corners
  • 20. Logo 100% imag free e- Shadows Curved corners
  • 21. Logo 100% imag free e- (except this bit, of course) Shadows Curved corners
  • 22. Graceful Degradation AKA “it doesn’t look completely shit in IE.”
  • 23. “a lightweight, high performance web server”
  • 24. v 2.2.13 v 0.8.13 6.9MB source 0.6MB source download (.tar.gz) download (.tar.gz) 387,000 lines of code 78,000 lines of code Threading/forking Event-driven architecture concurrency model
  • 26. + = VPS
  • 27. for static content + + = VPS for your application
  • 29. Frameworks do lots of stuff. web.py sinatra Lots of apps don’t camping limonade need much stuff. djng juno newf Microframeworks mnml itty do just enough glue squatting stuff.
  • 30. from itty import get, run_itty @get('/') def index(request): return 'Hello World!' run_itty()
  • 31.
  • 32. Perfection is achieved, not when there is nothing more to add.. but when there is nothing left to take away.