Fundamentals of Web Development For Non-Developers

  • 24,676 views
Uploaded on

This is the 2nd material of my technical training about "Fundamentals of Web Development" to non-developers, especially to business people and business analysts. This presentation covers some advanced …

This is the 2nd material of my technical training about "Fundamentals of Web Development" to non-developers, especially to business people and business analysts. This presentation covers some advanced topics that I did not cover in my previous "Fundamentals of Web" training. Even though most of the information I mention verbally in the training, the slides could help the ones who are not very familiar with web and web applications.

More in: Education , Technology , Design
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
No Downloads

Views

Total Views
24,676
On Slideshare
0
From Embeds
0
Number of Embeds
28

Actions

Shares
Downloads
305
Comments
0
Likes
34

Embeds 0

No embeds

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide

Transcript

  • 1. High level overview of conceptsLemİ Orhan ErgİnPrincipal software Engineer @ Sonyguide for non-developersFundamentals ofweb development
  • 2. The aim of this training is to let you•Know some advanced concepts of web and web development•Understand how people develop web based software•Understand the technical discussions better•And answer your questions...For introductory information about web concepts, please checkthe slides of “Fundamentals of Web for Non-Developers”.
  • 3. agenda•Web Development ConceptsWeb Applications, Web Services, Url Rewriting, Development/Deployment
  • 4. Web Applicationsand the evolution of web sites to web applications
  • 5. Static web pages ruled theworld. We loved them andlet DotCom bubble blow.Evolution of webStatic web pages
  • 6. Interactive web sites let theusers communicate withthe sites by entering contentEvolution of webInteractive web sites
  • 7. Reactive web applications both interactwith the user and adapt itself by theneeds of resolution and screen sizeReactive web sitesapplicationsEvolution of web
  • 8. Web APplicationsA web application is an application that is accessed by users over a network suchas the internet or an intranet. It could be web sites, messaging platforms, searchengines, web services, etc.•Presentation Oriented•Service Oriented•Client Side•Server SideThere exists similar but two types of defining web application types
  • 9. Controller Business Data AccessPresentationrequestResponsehttp://www.sony.co.ukFor web pages, content isvisualized by images,styles and scriptsData SourcesAccepts all the requestsand user inputsContent is prepared byrunning some business logic.All logic are coded byprogramming languages.Knows how to accessdata from data sourcesDatabases, files, remotedata services, othercomponents could beyour datasourceWeb APplicationsRequests contain a uri,headers and a message bodyResponses are the content to berendered by browsers
  • 10. Controller Business Data AccessPresentationrequestResponsehttp://www.sony.co.ukData SourcesWeb APplicationsDesigners, UX teams, Front-enddevelopers prepare thepresentation of web applicationsDevelopers code anddevelop softwareBusiness Analystsgather requirementsand define open pointsTesters check if the requirementsare developed as business requestsCustomers check ifwhat they requested isimplemented properly
  • 11. Web Servicesor simply saying, the web components serving data to the requestersWeb ServicesRESTful Web ServicesSimple Object Access Protocol (SOAP)Service Oriented Architecture (SOA)
  • 12. web servicesWeb services are services for doing specific functionalities that are made availablefrom a businesss Web server for Web users or other Web-connected programs.1. REST-Compliant Web services, in which the primary purpose of the service is to manipulateXML representations of Web resources using a uniform set of "stateless" operations2. Arbitrary Web services, in which the service may expose an arbitrary set of operations
  • 13. To design a website you need to know about HTTP, XHTML, and URIs.A uniform resource identifier (URI) is a string ofcharacters used to identify a name or a web resource,such as a web page or special set of data (like productdata or user information). “/product/45242366” is a URIidentifying a specific product.web servicesXHTML could be defined as HTML in valid XML structure.
  • 14. To design a web application you need to know about HTTP, XHTML, and URIs.web services
  • 15. To design a web service you need to know about XML, SOAP, WSDL, UDDI, WS-Policy, WS-Security, WS-Eventing, WS-Reliability, WS-Coordination, WS-Transaction, WS-Notification, WS-BaseNotification, WS-Topics, WS-Transfer...What?...web services
  • 16. WEBIt is most successful distributedplatform in the worldits simple enough for averagehumans to understandWhy not using HTTP and URIsfor web services?
  • 17. RESTRepresentational State Transfer (REST) is a styleof software architecture for distributed systemssuch as the World Wide WebClient-ServerStatelessCacheableLayered SystemUniform InterfaceServices and applications conformingthese constraints are “RESTful”
  • 18. Restful web servicesGET /product/12129437 6POST /product/4 with “data”dataCreatedatadPUT /product/3 with “data” UpdatedataDELETE /product/7DeleteRetrieveRESTful Web Services use HTTP methods explicitly, do not store any state, expose directory structure-likeURIs and transfer data in XML, XHTML, JSON format
  • 19. soapSimple Object Access Protocol (SOAP) is a protocol specification for exchangingstructured information in the implementation of Web Services in computernetworks. It relies on XML Information Set for its message format, and usuallyrelies on other Application Layer protocols, most notably Hypertext TransferProtocol (HTTP) or Simple Mail Transfer Protocol (SMTP), for messagenegotiation and transmission.
  • 20. Service oriented architectureSOA is a software design and architecture based on having independent modulescommunicating between each other through services to build monitorable,scalable, reusable, stateless, loosely coupled components and platforms.
  • 21. Jeff Bezos1. All teams will expose their data and functionality through service interfaces.2. Teams must communicate with each other through these interfaces.3. There will be no other form of interprocess communication allowed.4. It doesn’t matter what technology they use.5. All service interfaces, without exception, must be designed from theground up to be externalizable. No exceptions.6. Anyone who doesn’t do this will be fired.7. Thank you, have a nice day!Founder and CEO of AmazonJeff Bezos sent an email to his colleagues having these words:https://plus.google.com/112678702228711889851/posts/eVeouesvaVX
  • 22. URL RewritingWhat you call is not what you really call
  • 23. URL rewritingWith URL rewriting, the URL and the resource that it leads to can be completelyindependent of each other. In practice, they’re usually not wholly independent: theURL usually contains some code or number or name that enables the application tolook up the resource. But in theory, this is what URL rewriting provides: a completeseparation.URL rewriting basically tells the Web server that the called url should show the Webpage at an internal url without the customer or search engine knowing about it./products/miniflow-gutter-brown/11577676/diy/jsp/bq/nav.jsp?action=detail&fh_secondid=11577676
  • 24. URL rewritingUser Web Server Application Serveris called by the user. Web Server gets therequest, runs ReWrite Rules and convertthe url into a different one./products/miniflow-gutter-brown/11577676/diy/jsp/bq/nav.jsp?action=detail&fh_secondid=11577676is received by the application server.Request is processed and a response isgenerated and sent.is the url that the user sees the response.Even though URL has changed internally,the user is not aware of it./products/miniflow-gutter-brown/11577676
  • 25. How do developersdevelop software?* The way of development differs from company to company and team to team for sure. Buthere, we try to focus on enterprise level projects which are developed by teams. You mayencounter different styles in other companies as well.*
  • 26. Notification Services (email, messaging)Super UserDEV TEST & QA STAGING PRODVersionControlSystemDeveloper Developer DeveloperLOCALDeveloperContinousIntegrationRepository ManagerAt the very beginning, developersdevelop software by their own. Nocollaboration. That might be fine forsome circumstances but it isunacceptable in an enterprise.ContinuousDelivery
  • 27. Notification Services (email, messaging)Super UserDEV TEST & QA STAGING PRODVersionControlSystemDeveloper Developer DeveloperLOCALDeveloperContinousIntegrationRepository ManagerDevelopersWe build cross functional teamsthat the members collaborateand develop as teams.ContinuousDelivery
  • 28. Notification Services (email, messaging)Super UserDEV TEST & QA STAGING PRODVersionControlSystemDeveloper Developer DeveloperLOCALDeveloperContinousIntegrationRepository ManagerDevelopersDevelopers push code to acentral version system. Thathelps developers work on samecode at the same time.ContinuousDelivery
  • 29. Notification Services (email, messaging)Super UserDEV TEST & QA STAGING PRODVersionControlSystemContinuousDeliveryDeveloper Developer DeveloperLOCALDeveloperContinuousIntegrationRepository ManagerDevelopersAutomated tests are written bydevelopers. Continuous integrationserver builds all tests to getimmediate feedback. Whenever a testfails, developers get notified bynotification mails or messages.
  • 30. Notification Services (email, messaging)Super UserDEV TEST & QA STAGING PRODVersionControlSystemContinuousDeliveryDeveloper Developer DeveloperLOCALDeveloperContinuousIntegrationRepository ManagerDevelopersCI server deploys snapshots to acentralized repository manager if allthe tests pass. All packages including3rd party packages are managed by therepository manager.
  • 31. Notification Services (email, messaging)Super UserDEV TEST & QA STAGING PRODVersionControlSystemContinuousDeliveryDeveloper Developer DeveloperLOCALDeveloperContinuousIntegrationRepository ManagerDevelopersNow it’s time to deploy our code to serversand make it run. You could have severalenterprise environments to deploy and runsoftware for special purposesYour code is in repository manager as a package ifpackages are deployed as in Java based applications.Your code is in version control system and could bedeployed to servers in text form like in Ruby and PHP.
  • 32. Notification Services (email, messaging)Super UserDEV TEST & QA STAGING PRODVersionControlSystemContinuousDeliveryDeveloper Developer DeveloperLOCALDeveloperContinuousIntegrationRepository ManagerDevelopersDevelopers develop software, runand test in their local machines
  • 33. Notification Services (email, messaging)Super UserDEV TEST & QA STAGING PRODVersionControlSystemContinuousDeliveryDeveloper Developer DeveloperLOCALDeveloperContinuousIntegrationRepository ManagerDevelopersDevelopers test their software in aseparate environment beforesending to Quality Assurance team
  • 34. Notification Services (email, messaging)Super UserDEV TEST & QA STAGING PRODVersionControlSystemContinuousDeliveryDeveloper Developer DeveloperLOCALDeveloperContinuousIntegrationRepository ManagerDevelopersTest/QA machines should be similar toproduction machines in means of hardwareto make tests more reliable. There might bemore than one test environment for testingdifferent features.
  • 35. Notification Services (email, messaging)Super UserDEV TEST & QA STAGING PRODVersionControlSystemContinuousDeliveryDeveloper Developer DeveloperLOCALDeveloperContinuousIntegrationRepository ManagerDevelopersStaging is the place where customers do UAT,SIT and regression tests. The data ispreviewed before being delivered toproduction environment.
  • 36. Notification Services (email, messaging)Super UserDEV TEST & QA STAGING PRODVersionControlSystemContinuousDeliveryDeveloper Developer DeveloperLOCALDeveloperContinuousIntegrationRepository ManagerDevelopersOnly super users can deploy toproduction. Production environmentis monitored continuously.
  • 37. Notification Services (email, messaging)Super UserDEV TEST & QA STAGING PRODVersionControlSystemContinuousDeliveryDeveloper Developer DeveloperLOCALDeveloperContinuousIntegrationRepository ManagerDevelopersToo much manual effort fordeployment. That slows down thewhole testing and release process.Let’s automate deployments!
  • 38. Notification Services (email, messaging)Super UserDEV TEST & QA STAGING PRODVersionControlSystemContinuousDeliveryDeveloper Developer DeveloperLOCALDeveloperContinuousIntegrationRepository ManagerDevelopersPackages are deployed automatically bya continuous delivery system to servers.Most of the time, continuous integrationservers do the deployment.
  • 39. Notification Services (email, messaging)Super UserDEV TEST & QA STAGING PRODVersionControlSystemContinuousDeliveryDeveloper Developer DeveloperLOCALDeveloperContinuousIntegrationRepository ManagerDevelopersIt is also possible to deploy code directlyfrom version control system to servers.For instance, whenever developers push acode to version control system, the codecould be deployed to development servers.
  • 40. Notification Services (email, messaging)DevOpsVersionControlSystemContinuousDeliveryDevOps DevOps DevOpsLOCALDevOpsContinuousIntegrationRepository ManagerDevelopersYou dont need servers to maintain,you need just a cloud. DevOps are theones who manages both infrastructuraland development requirements.VersionControlSystemThis flow is the one we use for Heroku (i.e. cloudplatform as a service) for deploying and runningthe software. Please note that each cloud solutionhas its own way of deploying software.
  • 41. ReferencesRESTful Web Serviceshttp://www.crummy.com/writing/RESTful-Web-Services/http://www.ibm.com/developerworks/webservices/library/ws-restful/Web Serviceshttp://searchsoa.techtarget.com/definition/Web-servicesUrl ReWritinghttp://coding.smashingmagazine.com/2011/11/02/introduction-to-url-rewriting/
  • 42. Lemİ orhan ergİnlemiorhan@agilistanbul.com@lemiorhan@lemiorhanagilistanbul.com@lemiorhanLINKEDINTWITTERSLIDESHAREBLOGGERPrincipal Software Engineer @ SonyFounder & Author @ agilistanbul.comflyingtomoon.com