Javascript l'assembleur du web ?

1,672 views

Published on

Invited talk at UMons University (28 April 2010 — http://www.umons.ac.be/).

This talk is in French.

Published in: Technology
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
1,672
On SlideShare
0
From Embeds
0
Number of Embeds
120
Actions
Shares
0
Downloads
14
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide



  • C’est quoi ?


    * HTML utilisé uniquement pour la présentation
    * Pas de comportement
    * Vu comme un arbre XML


  • OK pour des pages statiques


  • * Manipulation du HTML avec du Javascript => Interaction
    * e.g., cacher un DIV, afficher une lightbox.
  • JS Permet de faire des requêtes asynchrones
  • Ca fait quoi ?
  • * Bataille d’IDS
    * Comportement difficile à identifier / cerner ?
    * HTML + JS + réponse serveur + CSS -> Homogene ?
  • * Paradigme existant pour des applications Desktop
    * Pourquoi se faire chier à écrire du HTML/JS à la main ?
    * Utiliser HTML 5 de manière totalement transparente
  • * Delicious Library
    * hautement dynamique
    * intégration webcam, redimensionnement à la volée, actions instantanées
  • * Thunderbird
    * Client mail
  • * Où stocker les données ?
    * Web Services (JSON)
    * RPC (Google web toolkit)
    * Stockage local (HTML 5)




  • * Reste du JS
    * Plus comme un framework MVC
    * Assez proche du web.
    * Maintenant avec un Interface builder (GreenHouse)
  • * MobileMe -> Synchronisation Apple
  • * Google Wave
    * GMail
    * ...
  • * Code en java
    * Génère du JS
    * Debug entièrement en Java
    * RPC Java pour communication FrontEnd / Backend
  • * Plus d’URLs
    * Indexation google nickée
    * Uniquement pour des applications, pas des sites
  • * Objective-J
    * Cocoa
    * Démo du truc ou on peut dessiner son salon


  • Les trois noms ?


  • Javascript l'assembleur du web ?

    1. 1. Javascript, l’assembleur du web ? François Stephany
    2. 2. <div id="footercontainer"> <div class="footercolumn"> <h2>Contact us</h2> <p> If you have any questions, write us at: <span class="email"> <a href="mailto:info@agilitic.com">info@agilitic.com</a> </span> </p> <p> <img alt="Phone-icon" src="/images/phone-icon.png"/> +32 496 21 33 79 </p> </div> <div class="footercolumn footercolumn2"> <h2>Informations</h2> <p> <strong>agilitic SCRL</strong><br /> Rue Lecat 1 bte 4<br /> 7020 Nimy (Mons), Belgium<br /> TVA BE 817 331 995 </p> </div>
    3. 3. HTML
    4. 4. GET - POST Serveur HTML
    5. 5. Javascript
    6. 6. Ajax
    7. 7. $('#about_us'); $.get('/search/', params, function(data){ $('#search_results').replaceWith(data); $('img.search_spinner').hide(); });
    8. 8. Yeah !
    9. 9. Solutions
    10. 10. Web Services
    11. 11. GET - POST Serveur JSON XML
    12. 12. { "firstName": "John", JSON "lastName": "Smith", "age": 25, "address": { "streetAddress": "21 2nd Street", "city": "New York", "state": "NY", "postalCode": "10021" }, "phoneNumber": [ { "type": "home", "number": "212 5551234" }, { "type": "fax", "number": "646 555-4567" } ] }
    13. 13. SproutCore
    14. 14. Google Web Toolkit
    15. 15. Cappuccino
    16. 16. @implementation PhotoCell : CPView { CPImage image; CPImageView imageView; CPView highlightView; } - (void)setRepresentedObject:(JSObject)anObject { if(!imageView) { imageView = [[CPImageView alloc] initWithFrame:CGRectMakeCopy([self bounds])]; [imageView setAutoresizingMask:CPViewWidthSizable | CPViewHeightSizable]; [imageView setImageScaling:CPScaleProportionally]; [imageView setHasShadow:YES]; [self addSubview:imageView]; } [image setDelegate:nil]; image = [[CPImage alloc] initWithContentsOfFile:thumbForFlickrPhoto(anObject)]; [image setDelegate:self]; if([image loadStatus] == CPImageLoadStatusCompleted) [imageView setImage:image]; else [imageView setImage:nil]; }
    17. 17. http://agilitic.com francois.stephany@agilitic.com
    18. 18. Femme: http://www.flickr.com/photos/glouk/4523649809/ Bébé: http://www.flickr.com/photos/collin_key/2981543442 Relais: http://www.flickr.com/photos/corpmjo/3486656862/ Spaghetti: http://www.flickr.com/photos/hanan/2204357625/ Jump: http://www.flickr.com/photos/eole/2342256254/ Café: http://www.flickr.com/photos/57908537@N00/4494131909/ Choux: http://www.flickr.com/photos/bachaboulou/92698416/ Plage: http://www.flickr.com/photos/htjems/2956672568/

    ×