Javascript - 1 | WebMaster & WebDesigner
Upcoming SlideShare
Loading in...5
×

Like this? Share it with your network

Share

Javascript - 1 | WebMaster & WebDesigner

  • 414 views
Uploaded on

Prima lezione del modulo Javascript per il corso di WebMaster & WebDesigner

Prima lezione del modulo Javascript per il corso di WebMaster & WebDesigner

More in: Technology
  • 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
414
On Slideshare
411
From Embeds
3
Number of Embeds
1

Actions

Shares
Downloads
10
Comments
0
Likes
1

Embeds 3

http://cypher.informazione.me 3

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. Javascript [1]Matteo Magni
  • 2. JavaScript è un linguaggio di scriptingorientato agli oggetti comunemente usato nei siti web.
  • 3. ProgrammazionePer un sacco di gente, il termine "programmazione" evoca visioni disuper-intelligenti nerd concentrati su tastiere, che digitano parolesenza senso quasi incomprensibile per ore. Probabilmente un po diprogrammazione è così. La programmazione può sembrare magiacomplessa che è ben oltre la media mortale. Ma molti concetti diprogrammazione non sono difficili da afferrare, e come linguaggio diprogrammazione, JavaScript è relativamente amichevole per nonprogrammatori.
  • 4. Client - Server Il client effettua una Request al server che a sua volta risponderà con una Response. Javascript agisce a livello di Client
  • 5. Browser Il browser è un software che ha la capacità di interpretare lHTML e di visualizzarlo in forma di ipertesto. E sempre il browser che esegue gli script Javascript
  • 6. JavascriptJavaScript è un linguaggio lato client, che significa che funziona allinterno diun browser web. Laltro tipo di linguaggio di programmazione web è chiamatolinguaggio server-side, esempi di questi sono PHP,. NET, ASP, ColdFusion,Ruby on Rails, ecc.... I linguaggi di programmazione lato server, comesuggerisce il nome, sono eseguiti su un server web.Si occupano di accesso ai database, elaborazione carte di credito, e linvio die-mail in tutto il mondo, ecc.... Il problema con linguaggi lato server è cherichiedono che il browser web invii richieste al web server, costringendo ivisitatori ad aspettare fino a quando arriva una nuova pagina con le nuoveinformazioni. David Sawyer McFarland
  • 7. Javascript [2]Un linguaggio lato-client, invece, può reagire immediatamente ecambiare ciò che un visitatore vede nel suo browser senza lanecessità di scaricare una nuova pagina. I contenuti possono apparireo sparire, spostarsi sullo schermo, aggiornarsi automaticamente inbase a come un visitatore interagisce con la pagina. Questa reattivitàconsente di creare siti web che sembrano programmi desktop.JavaScript non è lunica tecnologia lato client in città. È possibileutilizzare i plug-in per aggiungere intelligenza di programmazione aduna pagina web. Applet Java, Flash, Silverlight sono un esempio. David Sawyer McFarland
  • 8. Javascript [3]In verità, JavaScript può anche essere unlinguaggio server-side di programmazione. Adesempio, il server web node.js (http://nodejs.org/)utilizza JavaScript come linguaggio server-side diprogrammazione per la connessione a undatabase, laccesso al file system del server web,ed eseguire molte altre attività su un server web . David Sawyer McFarland
  • 9. Tecnologie Client Side • HTML → contenuto • Css →visualizzazione • Javascript → interazione
  • 10. Happy hacking a tutti!Inutile parlare, lasciamo che sia il codice a farlo.
  • 11. The Codehttps://github.com/inFormazione/Cypher/tree/master/html
  • 12. Aggiungere uno script<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"><html><head><title>My Web Page</title><script type="text/javascript"></script></head>
  • 13. HTML 5<!doctype html><html><head><meta charset="UTF-8"><title>My Web Page</title><script></script></head>
  • 14. Alert<!doctype html><html><head><meta charset="UTF-8"><title>My Web Page</title><script>alert(hello world!);</script></head>
  • 15. File esterno<!doctype html> //hello.js<html><head> alert(hello<meta charset="UTF­ world!);8"><title>My Web Page</title><script src="hello.js"></script></head>
  • 16. Non sono modalità esclusive<script src="hello.js"></script><script >  alert(Hello world!);</script>
  • 17. Path file esterni Percorso assolutoUn percorso assoluto è come un indirizzopostale, che contiene tutte le informazioninecessarie al browser web per trovare il filein tutto il mondo.Un percorso assoluto include http://, il nomehost e la cartella e il nome del file.http://sosacroniro.net/js/hello.js
  • 18. Path file esterni [2] Percorso relativo alla radiceUn percorso root-relative indica dove il file si trova rispettoalla cartella principale del sito. Un percorso relativo noninclude http:// o il nome di dominio. Si inizia con una /(barra) che indica la cartella principale della home page.Un modo semplice per creare un percorso relativo allacartella è quello di prendere un percorso assoluto etogliere il http:// e il nome host. /js/hello.js
  • 19. Path file esterni [3] Percorso relativo al documentoUn percorso document-relative specifica ilpercorso dalla pagina web al file JavaScript.Se si dispone di più livelli di cartelle sul tuosito, è necessario utilizzare percorsi diversiper puntare allo stesso file JavaScript.Inizia senza la / js/hello.js
  • 20. Scrivere testo<script>document.write(<p>Hello world!</p>);</script>
  • 21. Troviamo gli errori• Firefox Firebug Console javascript
  • 22. Troviamo gli errori [2]• Chrome Strumenti per gli sviluppatori / Console
  • 23. E gli altri?• Internet Explorer 9• Safari• OperaAnche loro hannodei tool peranalizzare javascript
  • 24. Domande? Slide: http://cypher.informazione.me/ Code:https://github.com/inFormazione/Cypher/ mail: matteo@magni.me