DA354B - Introduktion till programmering - Webbprogrammering
0 likes222 views
DA354B - Introduktion till programmering - Webbprogrammering
![”[
{
’title': 'Star Wars',
'year': 1977,
'director': 'George Lucas'
},
{
'title': 'Fight club',
'year': 1999,
'director': 'David Fincher'
}
]”
[
{
"title": "Star Wars",
"year": 1977,
"director": "George Lucas"
},
{
"title": "Fight club",
"year": 1999,
"director": "David Fincher"
}
]
json.dumps
json.loads
Lista Sträng
Lista Sträng](https://image.slidesharecdn.com/episodex-2024-241216131130-cd20c492/85/DA354B-Introduktion-till-programmering-Webbprogrammering-81-320.jpg)
DA354B - Introduktion till programmering - Webbprogrammering
- 8. Episode X: The Python Way Of The Force May the web be with you
- 14. Build our web site, you will
- 17. Dagens agenda • Demo på vad vi ska bygga • Bygga webbsidor med Python • Hur fungerar en webbserver? • Webbserver med Python • Server => Python • Klient => HTML/CSS • Bottle som mikroramverk • Vad är ett mikroramverk? • Routes => Funktioner • Bygga vår webbplats
- 18. Vad vi ska bygga
- 20. “You can’t stop the change, any more than you can stop the suns from setting.” - Shmi Skywalker
- 22. En webbserver är antingen ett datorprogram som tillhandahåller webbsidor för en viss webbplats eller en serverdator på vilken sådan programvara körs.
- 25. Webbserver • Ett webbserverprogram har som uppgift att tillhandahålla webbsidor och andra filer via protokollet HTTP eller HTTPS, vanligen över Internet. • Det förekommer också att en enskild användare kör en webbserver för eget lokalt bruk på sin egen dator. Vanligen kommunicerar användaren med webbservern med hjälp av en webbläsare. • Användaren väljer webbsidor och webbläsaren ”beställer” webbsidorna från webbservern och visar dem på användarens datorskärm. Webbläsaren är klient till webbservern.
- 28. URL Uniform Resource Locator Exempel på URL https://mau.se https://student.mau.se/mina-studier/ https://mau.instructure.com/courses/6601/discussion_topics/128343
- 30. http://sv.wikipedia.org:80/w/index.php?title=Dator&action=edit#Historia Protokoll Domän / IP- adress Resurs Komplett URL Port Extra information (GET-parametrar) Ankare
- 31. Andra URI Uniform Resource Identifier ftp://ftp.is.co.za/rfc/rfc1808.txt http://www.ietf.org/rfc/rfc2396.txt mailto:John.Doe@example.com telnet://192.0.2.16:80/ news:comp.infosystems.www.servers.unix
- 32. No place like 127.0.0.1, there is.
- 33. python -m http.server 8000 Starta en webbserver från en specifik mapp
- 35. 127.0.0.1 = Den här datorn
- 37. Demo – Lokal webbserver
- 38. Men – hur mycket Python var detta egentligen? Feel the power of the server side!
- 42. Vad kan vi hittills? DA106A - Webbutveckling • Skapa webbsidor genom: • HTML • CSS • (JavaScript) Vad behöver vi lära oss? => Bygga en webbtjänst! DA354A - Programmering • Programmera i Python • Variabler • Datatyper • Funktioner • Filhantering • Felhantering • JSON • M.m.
- 43. “Oh, my dear friend. How I’ve missed you.” - C-3PO
- 45. Behöver vi bygga allt själva? A simpler way, there is.
- 46. To be efficent, a tool you need.
- 48. “I’m just a simple man trying to make my way in the universe.” - Jango Fett
- 51. Bottle - Routes •Vi vill kunna mappa URL till olika funktioner i Python • /home => def home() • /contact => def contact() • /about => def about() • 127.0.0.1/home => def home() • 127.0.0.1/contact => def contact() • 127.0.0.1/about => about()
- 52. Kom igång med routes
- 54. Hello <name>
- 55. 1. Första grunderna i koden
- 58. 2. Förstå routes och argument
- 62. 3. Förstå parametrar (& värde)
- 64. Ex. 1 Ex. 2
- 65. Namn på parameter till template
- 66. - En total översikt Riskerar att bli lite förvirrande´…
- 70. Att använda sig utav flera routes...
- 72. DEMO - Routes
- 74. Templates – Mallar i HTML Join the dark side, we have the prettiest web sites!
- 75. Bottle - Templates • Templates är mallar för hur vi ska presentera vår information • HTML • CSS • JavaScript • Vi kan skicka data (bearbetad utav python) till våra malla för att skapa dynamiska webbsidor
- 76. Bottle – Templates och statiska filer •Alla templates ska: • Ligga i mappen ”views” • Ha filändelsen *.tpl eller *.html •Statiska filer (bilder, css, js, etc.) ska: • Ligga i mappen ”static”
- 77. Hur ser detta ut i bottle?
- 78. Demo - Templates
- 80. JSON JavaScript Object Notation json.dumps() => omvandla datatyper till sträng json.loads() => omvändla stäng till datatyp
- 81. ”[ { ’title': 'Star Wars', 'year': 1977, 'director': 'George Lucas' }, { 'title': 'Fight club', 'year': 1999, 'director': 'David Fincher' } ]” [ { "title": "Star Wars", "year": 1977, "director": "George Lucas" }, { "title": "Fight club", "year": 1999, "director": "David Fincher" } ] json.dumps json.loads Lista Sträng Lista Sträng
- 82. Nu till vårt projekt “There’s always a bigger fish.” - Qui-Gon Jinn
- 84. Routes => Vilka behöver vi? Route Syfte Metod Template / Till vår startsida GET index /vote Rösta på en sida POST index /disqus Visa gästbok GET disqus /new-post Skriv ett inlägg POST disqus *error404* En sida som ej finns Alla error BONUS!
- 86. Testa så att allt fungerar Let the battle begin
- 87. 1. Fixa röstningen (2. Fixa gästboken)
- 88. Röstningen • Spara alla röster i filen ”votes.json” • Spara rösterna som JSON-format, enligt mallen: { "empire": 0, "rebels": 0 } • Vi kan omvandla lexikon i Python till JSON genom: • json_votes = json.dumps(votes) • Vi kan omvandla JSON till Python-datatyper genom: • votes = json.loads(json_votes)
- 90. Flödesschema Läs in textfilens innehåll Tolka JSON-data till ett lexikon { "empire": 0, "rebels": 0 } 1 2 3
- 91. Flödesschema Läs in textfilens innehåll Tolka JSON-data till ett lexikon Skriv ut imperiets röster Skriv ut Rebellers röster Skicka röster till template Webbsida på internet
- 92. Nu bygger vi! ;)
- 94. “Power! Unlimited power!” - Darth Sidious
- 95. Frågor?