Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

How IT works - Joomladay UK 2014

Information Technology is an integral part of our daily life. Have you ever wondered what happens under the hood when you visit a webpage? Or what OOP actually means?

In this presentation, Peter explains common concepts like Operating System, Internet, Server, Website, Object Oriented Programming, Joomla in plain English.

In this keynote for Joomladay UK 2014 Peter explains the following subjects:
Computer
Operating System
Local Area Network (LAN)
Internet (Wide Area Network (WAN))
Server
Email
WWW
Website & PHP/MySQL
Object Oriented Programming (OOP)
Joomla

Related Books

Free with a 30 day trial from Scribd

See all

Related Audiobooks

Free with a 30 day trial from Scribd

See all
  • Login to see the comments

How IT works - Joomladay UK 2014

  1. 1. JJoooommllaaddaayy UUKK 22001144 How IT works by Peter Martin www.db8.nl / @pe7er 1
  2. 2. 1.Computer 2.Operating System 3.Network 4.Internet 5.Server JJoooommllaaddaayy UUKK 22001144 How IT works 6.Email 7.WWW 8.Website 9.OOP 10.Joomla
  3. 3. 1. Computer
  4. 4. “Compute”
  5. 5. ENIAC
  6. 6. PDP-1
  7. 7. JJoooommllaaddaayy UUKK 22001144 Definition A computer is a general purpose machine that can be instructed to do a specific task You want a typewriter? “Load” a typewriter programme;
  8. 8. IBM System/360
  9. 9. Altair 8800
  10. 10. Apple ][
  11. 11. Commodore 64
  12. 12. IBM PC
  13. 13. “Hardware” Long Term Memory ROM, Tape, Floppies, Harddisk, SSD INPUT Switches, keyboard, mouse, scanner, joystick, touch screen OUTPUT LEDs, display, monitor, printer Short Term Memory RAM (Random- Access Memory) Central Processing Unit (CPU)
  14. 14. 2. Operating System
  15. 15. Operating System Programme Programme Programme Command line interface Graphical User Interface Hardware Programme Operating System
  16. 16. Command Line Interface
  17. 17. Graphical User Interface
  18. 18. ● +- 1975 – UNIX ● Mainframe computer – Multi-tasking – Multi-user – Safety & stability JJoooommllaaddaayy UUKK 22001144 *nix ● 1991 – Linux ● PC, servers, embedded ● Command Line & GUI
  19. 19. ● +- 1981 – MSDOS ● Command Line JJoooommllaaddaayy UUKK 22001144 Microsoft ● 1985 – Windows GUI for MSDOS ● 1995 – Windows '95 GUI with CMD prompt
  20. 20. ● +- 1984 – System 1 ● for Macintosh 128K JJoooommllaaddaayy UUKK 22001144 Apple ● 1999 – OSX ● Unix-based Operating System + Graphical User Interface ● Terminal (= programme to use Command Line)
  21. 21. ● 2003 by Google ● Open Source ● For Smart Phones ● Linux kernel ! JJoooommllaaddaayy UUKK 22001144 Android
  22. 22. 3. Network JJoooommllaaddaayy UUKK 22001144
  23. 23. Sneakernet
  24. 24. Networking
  25. 25. Networking
  26. 26. Networking
  27. 27. Networking
  28. 28. Ethernet
  29. 29. Hello everyone! I am new! Connecting... Hello new one! I am 192.168.0.1 and your “gateway” to the outside world From now on you are 192.168.0.42 You can look up “IP addresses” of domain names at “DNS” with IP 8.8.8.8 Let's use Dynamic Host Configuration Protocol (DHCP) Oops... Internet Protocol is next item...
  30. 30. 4. Internet JJoooommllaaddaayy UUKK 22001144
  31. 31. JJoooommllaaddaayy UUKK 22001144 Definition 1 Internet = Network between connected local networks; “Inter-network”
  32. 32. Internet
  33. 33. JJoooommllaaddaayy UUKK 22001144 Definition 2 Internet = Packet Switching on TCP/IP Transmission Control Protocol Internet Protocol
  34. 34. JJoooommllaaddaayy UUKK 22001144 Packet Switching ● All transmitted data is divided into blocks, “packets” ● Those “packets” can travel using different routes ● The destination merges the packets
  35. 35. Sharing
  36. 36. JJoooommllaaddaayy UUKK 22001144 Internet Protocol ● Host addressing and identification “who is who” ● Packet routing “shortest route?”
  37. 37. ● Packets travel from router to router to router to router to router to router to router to destination ● Quality Control? Transmission Control Protocol (TCP)! JJoooommllaaddaayy UUKK 22001144 TCP Here's a packet Thanks, I got it! Here's the next packet
  38. 38. JJoooommllaaddaayy UUKK 22001144 DNS What's DNS? 173.194.65.139 is your friend!
  39. 39. Google.com? DNS 173.194.65.139 ! Dear 173.194.65.139, please give me index page
  40. 40. 5. Server JJoooommllaaddaayy UUKK 22001144
  41. 41. Server
  42. 42. JJoooommllaaddaayy UUKK 22001144 Logical ports ● Multi-user ● Multi-tasking: – Front-door (visitors) – Electricity line – Water pipe – Sewer pipe – Telephone line – Cable television line – Internet connection line – Mailbox – Garbage can
  43. 43. JJoooommllaaddaayy UUKK 22001144 Logical ports ● Multi-user ● Multi-tasking: – ftp: 21 – SSH: 22 – SMTP: 25 – HTTP: 80 – POP3: 110 – IMAP: 143
  44. 44. 6. E-mail JJoooommllaaddaayy UUKK 22001144
  45. 45. ● E-mail = text file ● E-mail Header: sender, IP address sender, receiver, return address, message ID, all mail servers on route, spam flags, etc. ● Peter @ db8.nl – POP3 server (or IMAP) @db8.nl handles e-mail – Stores it in text file for Peter – Or replies with bounce message JJoooommllaaddaayy UUKK 22001144 E-mail
  46. 46. JJoooommllaaddaayy UUKK 22001144 Send E-mail From: peter@db8.nl To: bill.gates@microsoft.com Message: Dear Bill, Almost 10 years I discovered Linux and now I am not fond of Windows anymore. If I buy a PC for Linux, I still have to pay license fees for Windows. Could you please refund my money? Kind regards, Peter
  47. 47. JJoooommllaaddaayy UUKK 22001144 Receive E-mail From: bill.gates@microsoft.com To: peter@db8.nl Message: Dear Peter, How are you doing? Sorry to hear that you don’t like our Operating System any more. Please keep in mind that our next Windows version will be much better! Sorry, but we don’t have a refund policy. Yours sincerely, Bill Gates PS: I noticed that your website runs on Joomla. That’s awesome! BTW: Joomla also works on our products Windows IIS + MSSQL!
  48. 48. JJoooommllaaddaayy UUKK 22001144 Bounce Message Undelivered Mail Returned to Sender This is the mail system at host mail-out.microsoft.com. I'm sorry to have to inform you that your message could not be delivered to one or more recipients. It's attached below. For further assistance, please send mail to postmaster. If you do so, please include this problem report. You can delete your own text from the attached returned message. The mail system <bill.gates@microsoft.com>: host microsoft.com[134.170.188.221] said: 550 "Unknown User" Reporting-MTA: dns; mail-out.s1.byte.nl X-Postfix-Sender: rfc822; Arrival-Date: Tue, 9 Sep 2014 11:09:20 +0200 (CEST) Final-Recipient: rfc822; bill.gates@microsoft.com Original-Recipient: rfc822; bill.gates@microsoft.com Action: failed Status: 5.0.0 Remote-MTA: dns; microsoft.com Diagnostic-Code: smtp; 550 "Unknown User"
  49. 49. 7. WWW JJoooommllaaddaayy UUKK 22001144
  50. 50. JJoooommllaaddaayy UUKK 22001144 WWW ● World Wide Web = HyperText Transfer Protocol WWW ≠ Internet ! ● WWW = A collection of HTML documents ● HyperText Markup Language – Text files with information linked to other text files
  51. 51. JJoooommllaaddaayy UUKK 22001144 “Surfing” Browsing on the WWW: YOU ARE NOT VISITING A WEBSITE
  52. 52. JJoooommllaaddaayy UUKK 22001144 HTTP(S) ● HTTP (port 80) – All traffic = plain text ● HTTPS (port 443) – All traffic via encrypted connection – protects your data on route – No safeguard for data on unsafe server....
  53. 53. JJoooommllaaddaayy UUKK 22001144 HTML ● Text file with markup ● Markup defines elements: pagetitle, paragraph, heading, hyperlink, image, CSS ● Hyperlink = created by browser ● Image = just reference, loaded by browser ● CSS = layout definition interpreted by browser
  54. 54. 8. Website JJoooommllaaddaayy UUKK 22001144
  55. 55. ● Dedicated server ● Shared hosting ● VPS JJoooommllaaddaayy UUKK 22001144 Server types
  56. 56. ● Your own rack ● Your own configuration ● Expensive JJoooommllaaddaayy UUKK 22001144 Dedicated
  57. 57. ● Part of one rack ● Share with 100 others ● Same configuration ● Neighbours: – Hacked? – Popular site? JJoooommllaaddaayy UUKK 22001144 Shared
  58. 58. ● Virtual Private Server ● “Virtual machine” ● Scalable ● Your own configuration ● Management – by hosting company – unmanaged = by yourself JJoooommllaaddaayy UUKK 22001144 VPS
  59. 59. JJoooommllaaddaayy UUKK 22001144 Static ● Static website – Just HTML text files – CSS stylesheet – Images ● Not interactive ● Need FTP & local editor
  60. 60. JJoooommllaaddaayy UUKK 22001144 Dynamic ● PHP - Scripting language composes HTML ● MySQL – Database stores all content
  61. 61. 9. OOP JJoooommllaaddaayy UUKK 22001144
  62. 62. JJoooommllaaddaayy UUKK 22001144 Objects ● Object Oriented Programming – Object = a “special” variable some sort of container, contains variables & functions inside
  63. 63. JJoooommllaaddaayy UUKK 22001144 Objects ● Object – “Class” -> Blueprint – “Blackbox” ● Input & output ● Inner-workings unknown ● Documentation how to use object – Reusable
  64. 64. Baking a cake
  65. 65. JJoooommllaaddaayy UUKK 22001144 Baking a cake ● Ingredients: – 150 gr (caster / bastard / brown) sugar – 150 gr (dairy) butter (room temperature!) – 150 gr (patent) flower – 3 eggs (room temperature) – 1 sachet vanilla sugar ( = 8 gr) – 2 gr salt – 1/3 sachet baking powder ( = 5 gr) – Juice from 1/2 lemon
  66. 66. JJoooommllaaddaayy UUKK 22001144 Baking a cake ● Recipe: – Pre-heat oven at 150 degrees Celsius – Grease the (cup) cake tin with butter, and put some flour over it to prevent the cake sticking to the tin – Put butter + sugar + vanilla sugar + salt + lemon juice in a bowl and mix into a smooth mass – While mixing fast, add the eggs one by one – While mixing slow, gently add the flour + backing powder and mix into a smooth mass of dough – Put the dough into the (cup) cake tin – Put the tin in the oven for 55 minutes (do not open the 1st 30 minutes!)
  67. 67. Object!
  68. 68. JJoooommllaaddaayy UUKK 22001144 Object! ● The Mixer – Input: ingredients, “time” – Output: cake dough ● Blackbox – Innerworkings unknown – Mixer can be replaced by other object ● Reusable
  69. 69. JJoooommllaaddaayy UUKK 22001144 Re-use Object Nibble, nibble little mouse, Who's that nibbling at my house Daughter asks daddy for cake (= Object), icing sugar, water & candy Peter + cake recipe becomes object Daddy, I want to make a Hansel & Gretel house
  70. 70. Re-use
  71. 71. JJoooommllaaddaayy UUKK 22001144 OOP in coding ● Create a PDF? ● I don't know how.... but know how to – download a PDF “Class”, e.g. www.fpdf.org – load that PDF class – use that blueprint
  72. 72. JJoooommllaaddaayy UUKK 22001144 Create PDF <?php require('fpdf.php'); $pdf = new FPDF(); $pdf->AddPage(); $pdf->SetFont('Arial','B',16); $pdf->Cell(40,10,'Hello Joomla!'); $pdf->Output(); ?>
  73. 73. 10. Joomla JJoooommllaaddaayy UUKK 22001144
  74. 74. JJoooommllaaddaayy UUKK 22001144 CMS “Joomla is an award-winning content management system (CMS), which enables you to build Web sites and powerful online applications. Many aspects, including its ease-of-use and extensibility, have made Joomla the most popular Web site software available. Best of all, Joomla is an open source solution that is freely available to everyone.” www.joomla.org
  75. 75. JJoooommllaaddaayy UUKK 22001144 Framework Joomla is a framework “A CMS on which to build web applications” Joomla framework = Joomla without CMS “A foundation on which to build web applications
  76. 76. JJoooommllaaddaayy UUKK 22001144 Project Joomla is a project “a community-based project with contributors from all over the world working in many different capacities”.
  77. 77. JJoooommllaaddaayy UUKK 22001144 “OS” Joomla is “a sort of” Operating System, a layer between – Joomla's components & 3rd party components – and the webserver
  78. 78. JJoooommllaaddaayy UUKK 22001144 Admin GUI Joomla is a Graphical User Interface between – the website administrator – and the database that stores all information. Admin GUI → admin template
  79. 79. JJoooommllaaddaayy UUKK 22001144 Visitor's GUI Joomla is a Graphical User Interface between – Website “visitor” – the database with articles Visitor GUI → front-end template + device – Please make it beautiful and user friendly!!!
  80. 80. Conclusion
  81. 81. 1.Computer 2.Operating System 3.Network 4.Internet 5.Server JJoooommllaaddaayy UUKK 22001144 Conclusion 6.Email 7.WWW 8.Website 9.OOP 10.Joomla
  82. 82. 82 JJoooommllaaddaayy UUKK 22001144 Questions? Peter Martin e-mail: info at db8.nl website: www.db8.nl twitter: @pe7er Presentation: http://www.db8.nl Review this presentation: https://joind.in/talk/view/11651
  83. 83. JJoooommllaaddaayy UUKK 22001144 Used Photos Title sheet: ● Steampunk Workshop Flat-Panel LCD Monitor - Jake von Slatt http://steampunkworkshop.com/lcd.shtml ● Map of Netherlands & Germany, Googlemaps 1. Computer ● IBM Electronic Data Processing Machine - GPN-2000-001881, NASA, 1957 http://upload.wikimedia.org/wikipedia/commons/2/20/IBM_Electronic_Data_Processing_Machine_-_GPN-2000- 001881.jpg ● Human computers - Dryden, NACA (NASA), 1949 http://en.wikipedia.org/wiki/File:Human_computers_-_Dryden.jpg ● ENIAC (Electronic Numerical Integrator And Computer) in Philadelphia, Pennsylvania, U.S. Army Photo, 1947 to 1955 http://en.wikipedia.org/wiki/File:Eniac.jpg ● PDP-1, Matthew Hutchinson, 2006 http://en.wikipedia.org/wiki/File:PDP-1.jpg ● DM IBM S360, Ben Franske, 2006 http://en.wikipedia.org/wiki/File:DM_IBM_S360.jpg
  84. 84. JJoooommllaaddaayy UUKK 22001144 Used Photos ● Commodore-64-Computer, Evan-Amos, 2011 http://en.wikipedia.org/wiki/File:Commodore-64-Computer.png ● Tdkc60cassette, Stonda, 2005 http://en.wikipedia.org/wiki/File:Tdkc60cassette.jpg ● Commodore-Datassette, Toni Saarikko, 2006 http://de.wikipedia.org/wiki/Datei:Commodore-Datassette.jpg ● Ibm pc 5150, Ruben de Rijcke, 2010 http://en.wikipedia.org/wiki/File:Ibm_pc_5150.jpg 2. Operating System ● C64c system, Bill Bertram, 2005 http://commons.wikimedia.org/wiki/File:C64c_system.jpg ● Macintosh 128k transparency, Kevin chen, 2006 http://en.wikipedia.org/wiki/File:Macintosh_128k_transparency.png
  85. 85. JJoooommllaaddaayy UUKK 22001144 Used Photos 3. Local Area Network (LAN) ● Wm2005-hackday-guerilla-networking, Andrew Lih, 2005 http://commons.wikimedia.org/wiki/File:Wm2005-hackday-guerilla-networking.JPG ● Floppy disk 2009 G1, George Chernilevsky, 2009 http://en.wikipedia.org/wiki/File:Floppy_disk_2009_G1.jpg ● SanDisk Cruzer Micro, Evan-Amos, 2011 http://en.wikipedia.org/wiki/File:SanDisk_Cruzer_Micro.png ● CD-R Front, Stefan Kühn, 2003 http://commons.wikimedia.org/wiki/File:CD-R_Front.jpg ● Harddisk in USB external box, Vojtěch Brzek, 2011 http://commons.wikimedia.org/wiki/File:Harddisk_in_USB_external_box.jpg 4. Internet (Wide Area Network (WAN)) ● ARPANET as of Jun 30, 1982 - BBN map - DSC00123, BBN Technologies, Cambridge, Massachusetts, 2013 http://commons.wikimedia.org/wiki/File:ARPANET_as_of_Jun_30,_1982_-_BBN_map_-_DSC00123.JPG ● Old Phonebooks at Salton Sea - Gentle, 2010 http://commons.wikimedia.org/wiki/File:Old_Phonebooks_at_Salton_Sea.jpg
  86. 86. JJoooommllaaddaayy UUKK 22001144 Used Photos 3. Local Area Network (LAN) ● Wm2005-hackday-guerilla-networking, Andrew Lih, 2005 http://commons.wikimedia.org/wiki/File:Wm2005-hackday-guerilla-networking.JPG ● Floppy disk 2009 G1, George Chernilevsky, 2009 http://en.wikipedia.org/wiki/File:Floppy_disk_2009_G1.jpg ● SanDisk Cruzer Micro, Evan-Amos, 2011 http://en.wikipedia.org/wiki/File:SanDisk_Cruzer_Micro.png ● CD-R Front, Stefan Kühn, 2003 http://commons.wikimedia.org/wiki/File:CD-R_Front.jpg ● Harddisk in USB external box, Vojtěch Brzek, 2011 http://commons.wikimedia.org/wiki/File:Harddisk_in_USB_external_box.jpg 4. Internet (Wide Area Network (WAN)) ● ARPANET as of Jun 30, 1982 - BBN map - DSC00123, BBN Technologies, Cambridge, Massachusetts, 2013 http://commons.wikimedia.org/wiki/File:ARPANET_as_of_Jun_30,_1982_-_BBN_map_-_DSC001 23.JPG
  87. 87. JJoooommllaaddaayy UUKK 22001144 Used Photos 5. Server ● Waiter pouring Zardetto sparkling Prosecco, Jeff Kubina, 2009 http://commons.wikimedia.org/wiki/File:Waiter_pouring_Zardetto_sparkling_Prosecco.jpg ● Wikimedia Servers-0051 16, Helpameout, 2012 http://commons.wikimedia.org/wiki/File:Wikimedia_Servers-0051_16.jpg ● Server Linux, Michael Jastremski, 2005 http://commons.wikimedia.org/wiki/File:Server_Linux.jpg ● Wenskaart Buurman & Buurman Zo...nieuw huis? http://www.buurmanenbuurman.eu/zonieuw-huis.html ● Inside and Rear of Webserver, Rodzilla, 2005 http://en.wikipedia.org/wiki/File:Inside_and_Rear_of_Webserver.jpg 6. Email ● Pigeon Messengers (Harper's Engraving), Harper's New Monthly Magazine, No. 275, April, 1873. http://commons.wikimedia.org/wiki/File:Pigeon_Messengers_(Harper's_Engraving).png
  88. 88. JJoooommllaaddaayy UUKK 22001144 Used Photos 7. WWW & HTML/CSS/JavaScript ● HypertextEditingSystemConsoleBrownUniv1969, Greg Lloyd, 1969 http://commons.wikimedia.org/wiki/File:HypertextEditingSystemConsoleBrownUniv1969.jpg 8. Website & PHP/MySQL ● Fachada del Nacimiento - Templo de la Sagrada Família, Barcelona 3, Sal34, 2011 http://commons.wikimedia.org/wiki/File:Fachada_del_Nacimiento_-_Templo_de_la_Sagrada_Fa m%C3%ADlia,_Barcelona_3.jpg 9. Object Oriented Programming (OOP) ● Lego Color Bricks, Alan Chia, 2007 http://commons.wikimedia.org/wiki/File:Lego_Color_Bricks.jpg 10. Joomla ● tricorderunbox4, Bobbie Johnson, 2009 https://www.flickr.com/photos/bojo/4078685614/in/photostream/ Conclusion ● EquinoxeJuniorHighPac-Man - Equinoxe, 2012 http://www.c64-wiki.com/index.php/File:EquinoxeJuniorHighPac-Man.png

×