Curs: | Aplicacions web LOE |
Fitxers: | No hi ha |
Repositori SVN: | https://[email protected]/svn/iceupc/AplicacionsWeb |
Usuari: | anonymous |
Paraula de pas: | sense paraula de pas |
Autors: | Sergi Tur Badenas |
En informàtica quan parlem d'una wiki ens referim a un programa (aka motor wiki o aplicació wiki) que normalment sol ser una aplicació web que permet als usuaris crear i editar pàgines web d'una forma col·laborativa i ràpida.
La primera aplicació wiki va ser creada el 1994 per Ward Cunningham .
L'origen del terme wiki prové de la paraula hawaiana "wiki" que vol dir ràpid. L'autor de la primera pàgina web wiki (WikiWikiWeb) li va posar aquest nom recordant el nom de l'autobús Wiki_Wiki_Shuttle, un autobús de l'aeroport de Honolulu (Haway).
Des de la primera aplicació wiki han sorgit múltiples aplicacions wiki (consulteu l'article "List Of Wiki Software"). De fet, actualment, hi ha moltes aplicacions que són hibrides, és a dir, no són només una wiki sinó que són molt més (per exemple un CMS) i entre les seves funcionalitats hi ha l'opció d'utilitzar una wiki (p. ex. Moodle o Trac).
IMPORTANT: És important no confondre les aplicacions wiki amb el concepte wiki en si. Per exemple, hi ha molta gent que quan parla de wiki es refereix a la wikipedia, quan realment la wikipedia és una wiki que utilitza mediawiki
És difícil de dir quines són les aplicacions wiki més utilitzades, però segons Google Trends les wikis més cercades a Internet són: MoinMoin, TikiWiki, DokuWiki i MediaWiki.
També podeu consultar aquí una llista de les wiki més importants que podeu trobar a Internet.
Si heu de fer un estudi per tal d'escollir un programari wiki us pot ser d'utilitat la web: http://www.wikimatrix.org/.
Les wiki és caracteritzen per:
Gran part de l'èxit de les wiki recau en l'ús de llenguatges de marques fàcils, ràpids i intuitius
La sintaxi wiki destaca per ser el menys redundant possible. El llenguatge de marques per excel·lència a Internet és HTML. De fet, és el llenguatge estàndard que suporten tots els navegadors web, i de fet, una wiki, el que fa és traduir la sintaxi wiki a format HTML per tal que les pàgines wiki puguin ser mostrades als navegadors web.
NOTA: La sintaxi wiki és interpretada en el servidor per l'aplicació web. En canvi el codi HTML és interpretat en el client pel navegador web
Un dels "problemes" de HTML és que és força redundant. Vegem un exemple de codi en sintaxi wiki i un exemple de codi en sintaxi HTML:
Mediawiki sintax:
'''Negreta''' ''Cursiva'' *Item de llista no numerada 1 *Item de llista no numerada 2 #Item de llista numerada 1 #Item de llista numerada 2 [[Enllaç intern|Text de l'enllaç intern]] [Enllaç extern Text de l'enllaç extern]
HTML sintax:
<strong>Negreta</strong> <em>Cursiva</em> <ul> <li>Item de llista no numerada 1</li> <li>Item de llista no numerada 2</li> </ul> <ol> <li>Ordered List Item 1</li> <li>Ordered List Item 2</li> </ol> <a href="">Item de llista numerada 1</a> <a href="">Item de llista numerada 2</a>
Com podeu observar és molt més curt en nombre de caràcters utilitzats a la sintaxi wiki (menys redundant) de forma que podem expressar molt més ràpid el que volem fer. No només això, sinó que les combinacions de caràcters estan pensades per ser escrites de la forma més ràpida possible, els caràcters major igual i menor igual de HTML no faciliten l'escriptura de codi, en canvi escriure tres cops les cometes per fer una negreta és fàcil i intuïtiu.
NOTA: Als llenguatges wiki s'enquadren dins dels llenguatges de marques lleugers lightweight markup language
Potser l'inconvenient més gran de la sintaxi wiki és que no existeix un estàndard que sigui compatible amb totes les aplicacions wiki. Tot i que totes les aplicacins wiki utilitzant una sintaxi fàcil i intuïtiva, hi ha diferències entre la sintaxi de les principals aplicacions wiki. Consulteu el següent quadre comparatiu.
En aquest curs utilitzarem com a aplicació wiki la Mediawiki. Mediawiki és programari lliure i possiblement és el programari wiki més utilitzat degut a que és la programa que utilitza l'enciclopèdia en línia wikipedia.
NOTA: De fet tingueu en compte que els propis apunts d'aquest curs estan fets en format wiki utilitzant una mediawiki instal·lada al domini acacha.org. Una de les coses bones dels formats wiki és que sempre podem consultar el codi font, és a dir, que si vegeu una pàgina wiki que us crida l'atenció, podeu veure com està feta i aprendre més sobre la sintaxi consultant el codi font.
Exercici: Un dels exercicis d'aquesta sessió és instal·lar-vos una mediawiki al vostre ordinador. Trobareu l'entrega de l'exercici al Moodle del curs.
Mediawiki és una aplicació web, i com tota aplicació web abans de poder ser instal·lada necessitem disposar d'un entorn de treball previ. Aquest entorn de treball (també anomenat sovint arquitectura) és LAMP que són les inicials de:
NOTA: LAMP és l'arquitectura web més utilitzada en entorns d'explotació a Internet però evidentment existeixen altres alternatives com per exemple WAMP (Apache Mysql i PHP sobre Windows) o XAMP (agnòstic de sistema operatiu) o utilitzar altres gestors de base de dades com PostgreSQL...
No fa gaire temps configurar tot aquest entorn no era pas un tasca fàcil. Actualment disposem d'eines com tasksel (o el propis instal·ladors de sistemes operatius Linux) que automatitzen tota la feina. Així per tal d'instal·lar LAMP en un sistema com Ubuntu, només heu de fer:
$ sudo tasksel
Us apareixerà quelcom similar al següent:
Escolliu LAMP server (us moveu pel menú amb les fletxes i seleccioneu amb espai), tabuleu per a col·locar-vos sobre el "botó" Aceptar. El sistema us instal·larà tot el necessari per disposar d'un entorn LAMP. Durant la instal·lació només haureu d'escollir la paraula de pas de root del servidor de MYSQL.
IMPORTANT: No us oblideu de la paraula de pas que poseu al servidor de MYSQL ja que costa bastant de Mysql#Canviar_el_password_de_root recuperar aquesta paraula de pas de root a MYSQL.
NOTA: Aquest apartat només el teniu com a referència. No se us demana cap exercici on l'instal·lació es faci des dels repositoris
Consulteu:
http://acacha.org/mediawiki/index.php/Instal%C2%B7laci%C3%B3_mediawiki
Consulteu:
Instal·lació_mediawiki#Instal.C2.B7laci.C3.B3_manual
Al Moodle del curs hi ha una tasca relacionada amb aquest apartat.
A Mediawiki a cada pàgina wiki se l'anomena article o "wiki page". Les pàgines s'identifiquen pel seu nom, el nom d'una pàgina es mostra a la part superior de la pàgina en negreta. Per exemple el nom d'aquesta pàgina és:
Aplicacions web LOE/Sessió mediawiki
Els noms de pàgina son case sensitive és a dir, es diferencia entra majúscules i minúscules, amb l'excepció de la primera lletra (de fet, Mediawiki sempre us posarà en majúscules la primera lletra.)
Quan es vol fer referència a una pàgina wiki, podeu utilitzar el que s'anomena un enllaç intern, amb el següent format
[[NOM_DE_L'ARTICLE]]
Per exemple_
[[Aplicacions web LOE/Sessió mediawiki]]
Una de les coses que més els hi costa als usuaris novell de mediawiki és acostumar-se al fet que no hi ha cap formulari ni ajuda per a crear una nova pàgina.
IMPORTANT: Un article de la mediawiki és crea en el moment que té com a mínim un enllaç intern des de alguna altre pàgina
Per tant per crear una nova pàgina només cal editar una pàgina existent com la pàgina principal o la pàgina d'usuari i posar:
[[Nom de la nova pàgina]]
Això us creara un enllaç no visitat (en vermell), com:
Nom de la nova pàgina
Ara només cal entrar a la nova pàgina i omplir-la de continguts.
Un altre forma de crear un article és utilitzar directament la seva URL. Escriviu:
http://acacha.org/mediawiki/index.php/Nom de la nova pàgina
El navegador us la transformarà a:
http://acacha.org/mediawiki/index.php/Nom_de_la_nova_p%C3%A0gina
I ja podeu començar a editar la pàgina.
Que les pàgines s'identifiquin pel seu nom té un clar problema: els possibles conflictes amb noms de pàgines repetides. Per exemple, suposeu que voleu que els vostres alumnes facin en format wiki els apunts del tema 1. Molt possiblement tots decidiran anomenar a la pàgina:
[[Tema 1]]
I entraran en conflicte al estar editant tots la mateixa pàgina i no cadascú la seva. Una solució es que cadascú d'ells sigui més original posant un nom.
Els noms de pàgina es poden classificar en pàgines i subpàgines de forma similar a una estructura de directoris. Així la pàgina
[[Crèdit 1/Unitat didàctica 1]]
Seria una pàgina anomenada:
Unitat didàctica 1
Filla de la pàgina:
Crèdit 1
Ja tenim doncs una solució per fer pàgines personals. Cada usuari disposa de la seva pàgina personal:
[[Usuari:NOM_USUARI]]
I per tant podeu crear una pàgina personal que no col·lisionarà amb cap altre pàgina amb:
[[Usuari:NOM_USUARI/Nom pàgina personal]]
Per exemple:
Usuari:Sergi/Exemple de pàgina personal
Fixeu-vos que les pàgines que són filles (o netes, o rebesnétes, etc...) a sota del títol de la pàgina us apareix un enllaç a les pàgines pare:
Un altre mecanisme que s'utilitza són els espais de noms. De forma similar al que succeïx amb els noms d'etiquetes a XML podeu posar un prefix anomenat espai de noms al nom de la pàgina. Per exemple imagineu-vos que volem documentar una sèrie de servidors de la nostra xarxa on cada servidor té un nom propi escollit segons el alfabet NATO. Podeu utilitzar com a nom:
Servidor:Alfa Servidor:Bravo Servidor:Charlie Servidor:Delta Servidor:Echo ...
Així és diferencien els articles Alfa, Bravo, Charlie... dels articles que fan referència als servidors del mateix nom.
De fet observeu que les pàgines d'usuari utilitzen l'espai de noms Usuari. Quan vegem les pàgines especials veureu que la mediawiki proporciona una sèrie d'espais de noms per defecte.
Un altre mecanisme utilitzat són les pàgines de desambiguació. Consulteu:
podeu veure un exemple de pàgina de desambiguació a:
Teniu diferents formes de navegar per una wiki. La primera śe utilitzar el menú de navegació que apareix a l'esquerre.
Aquest menú el pot modificar l'usuari Wikisysop accedint a la pàgina especial Mediawiki:Sidebar.
També us pot ajudar per navegar el menú Eines que apareix a l'esquerre. La veritat però, es que quan una wiki es fa gran la millor forma de navegar és utilitzar el cercador. Posant el nom exacte d'una wiki us anirà directament (botó "Ves-hi") i si feu clic a Cerca busca pàgines am bla paraula que heu posat
NOTA: El cercador només busca paraules senceres i no aplica cap mena d'intel·ligència per tal de buscar paraules similars com per exemple paraules amb accent o sense accent o majúscules i minúscules.
A
Resultats de la cerca
A baix de tot podeu fer una cerca avançada que us permet indicar en quins espais de noms voleu buscar. Podeu accedir directament a la cerca anant a la pagina especial:
Especial:Cerca
NOTA: També es possible integrar el cercador de qualsevol wiki a Firefox. Premeu al desplegable del cercador situat a la part superior dreta de Firefox i feu clic a <<Afegeix SergiTurWiki (ca)>>
Recursos:
Podeu trobar ajuda de com editar una pàgina wiki al bloc de l'esquerre anomenat Edició:
A:
Referència Ràpida
trobeu uns especie de "xuleta" amb les formes bàsiques de la sintaxi (negreta, apartats, llistes, etc).
La barra que apareix quan editeu una pàgina:
Us permet recordar les sintaxi més habituals. Per exemple si feu clic a al botó on apareixen una a i una b (Ab) us farà un enllaç intern:
[[Títol de l'enllaç]]
NOTA: La barra que apareix a aquesta wiki és una barra ampliada. Consulteu Mediawiki#Mediawiki_edit_toolbar
Recursos:
Creeu una nova pàgina wiki filla de la vostra pàgina d'usuari i l'anomeneu Exemples d'edició mediawiki. Per exemple:
Exemples d'edició mediawiki
En aquesta pàgina hi hauria d'haver-hi un exemple de cadascun dels botons que apareixen a la barra d'eines (negreta, cursiva, Enllaç intern, Enllaç extern, apartat, fitxer...)
Un dels grans avantatges de la wiki és que manté un historial de totes les modificacions que es fan d'una pàgina. Al capdamunt de cada pàgina podeu trobar la pestanya:
historial
Com podeu veure podeu consultar qualsevol de les versions del document (es guarda una versió cad cop que guardeu el document). També ens informa de quin ha estat l'usuari que ha fet cada modificació (en cas d'edicions anònimes mostra quin és la IP des de la que s'ha editat la pàgina),es poden comparar pàgines amb eines de l'estil de diff.
NOTA: Podeu guardar ràpidament un document amb la combinació de tecles Crtl+Alt+S i també podeu editar ràpidament amb Ctrl+Alt+E
A la wiki queda tot registrat i es molt difícil perdre alguna dada. Però tot i així us trobareu algun alumne que us dirà: "Profe he perdut els apunts que havia fet l'últim dia de classe" ;-). Diguin els que us diguin, és que han comés un dels següents errors:
L'últim és un dels errors més típics de la mediawiki. Com us hem comentat les pàgines es coneixen pel seu nom. Suposeu que teniu en enllaç a l'article:
[[Mediawiki]]
És a dir:
Mediawiki
Si canvieu l'enllac per:
La Mediawiki
Pot semblar que heu perdut la pàgina però en veritat la pàgina continua estan a [[Mediawiki]] (Mediawiki), l'únic que heu posat un enllaç incorrecta. En conclusió, si voleu canviar el nom a una pàgina no ho podeu fer canviant els seus enllaços, heu d'utilitzar la pestanya:
Reanomena
Cal tenir en compte, que per tal d'evitar enllaços trencats, l'acció reanomena per defecte crea una redirecció del nom antic al nom nou.
IMPORTANT: Ja sigui consulten la pestanya contribucions (a la part superior dreta), consultant l'historial d'un document i/o consultant la pàgina Especial:Canvis_recents oi/ utilitzant el buscador, pot ser més fàcil o menys però heu de poder trobar qualsevol document/edició que s'hagi fet a la wiki
Cal tenir en compte que fins i tot, encara que elimineu una pàgina amb la pestanya:
elimina (nota: Aquesta pestanya només li apareix a l'usuari Sysop o usuaris amb permisos equivalents)
Hi ha un registre per recuperar pàgines eliminades
NOTA: De fet algun cop us trobareu amb la necessitat de esborrar completament alguna pàgina, per exemple per que s'ha posat per error una paraula de pas. Consuteu Mediawiki#Com_esborrar_definitivament_una_p.C3.A0gina.2Farticle.3F
Recursos:
La wiki està pensada per facilitar el màxim el treball en equip. Anem a fer un exercici per demostrar-ho. Hem de crear entre tots la pàgina:
Aplicacions web LOE/Sintaxi de mediawiki
Una de les eines més útils per a modificar una pàgina de forma col·laborativa és que cada pàgina té la seva pròpia pàgina de discussió, a la pestanya:
discussió
Si consulteu la pàgina de discussió de la web que us proposo:
Discussió:Aplicacions_web_LOE/Sintaxi_de_mediawiki
Veureu com us indico el guió de treball per tal de poder crear la pàgina wiki de forma col·laborativa.
Les pàgines de discussió serveixen per "discutir" sobre el contingut d'una pàgina. De fet es reserva l'espai de noms Discussió (Talk en angles) per aquest tipus de pàgines.
Per exemple podeu veure un exemple de pàgina real de discussió a:
http://ca.wikipedia.org/wiki/Discussi%C3%B3:Barack_Hussein_Obama
Cal que tingueu en compte que gràcies a que hem organitzat la pàgina en seccions no ens trobem amb conflictes. La wiki, si detecta dos modificacions al mateix temps de un mateix document, però les modificacions són en línies o seccions diferents aleshores el que fa és una barreja (Merge) automàtica de les dos versions. Només en el cas que dos usuaris modifiquin el mateix, apareixerà la pàgina de conflicte i seran els usuaris els que hauran de decidir quina és la versió correcte del document.
Les pipes (|) s'utilitzen força per tal de passar més informació a elements de la mediawiki com plantilles. Per exemple, les imatges es poden fer força més elaborades amb pipes com la següent:
[[Fitxer:prova.png|thumb|Text de l'imatge|50px]]
Produeix la imatge de la dreta:
http://www.mediawiki.org/wiki/Help:Templates http://www.mediawiki.org/wiki/Help:Templates/es
Mediawiki disposa d'un mecanisme molt senzill per tal d'utilitzar plantilles. Les plantilles es poden utilitzar per tal de repetir text wiki que es repeteix en diferents llocs o fins i tot com a variable. Per definir una plantilla només cal posar-la entre dos claudàtors:
{{Nom Plantilla}}
Per exemple, es poden utilitzar plantilles per a valors que sabeu que poden canviar en el futur. Per exemple la plantilla
{{Enllaç al curs Moodle Aplicacions web}}
Ens pot donar l'enllaç al Moodle d'aquest curs (l'enllaç pot canviar en altres anys):
Enllaç al curs Moodle
Les plantilles es troben totes a l'espai de noms Plantilla: (o en anglès Template).
Els articles d'aquesta wiki que formen part d'un curs utilitzen la plantilla:
{{PlantillaCurs | curs = [[Aplicacions web LOE]] | fitxers = No hi ha | repositori = https://[email protected]/svn/iceupc/AplicacionsWeb | autors = [[Sergi Tur Badenas]] }}
Es pot incloure tot el contingut d'un altre pàgina wiki amb:
{{:NomPàgina}}
Podeu veure un exemple a la pàgina:
ProvaNMIL
Que inclou l'article Apache.
Podeu veure el resultat a la caixa flotant que apareix a la part dreta superior d'aquesta pàgina. El contingut de la plantilla el podeu trobar a:
Amb el següent contingut:
{| class="toccolours" style="float: right; background-color: #f1f1ff; margin: 0 0 1em 1em; border-right-width: 2px; border-bottom-width: 2px; width: 24em; font-size: 90%; clear: right;" cellspacing="5" |- ! colspan="2" style="text-align: center; font-size: larger;" | <div style="background:#DEE9FF; padding:8px">[[Imatge:Alert.png|25px]] '''Aquesta wiki forma part dels materials d'un curs'''</div> |- style="vertical-align: top;" | '''[[CursosICEUPC|Curs]]:''' | {{{curs|{{{curs|}}}}}} |- style="vertical-align: top;" | '''[https://[email protected]/svn/iceupc Fitxers]:''' | {{{fitxers|{{{fitxers|}}}}}} |- style="vertical-align: top;" | '''Repositori [[SVN]]:''' | {{{repositori|{{{repositori|}}}}}} |- style="vertical-align: top;" | '''Usuari:''' | anonymous |- style="vertical-align: top;" | '''Paraula de pas:''' | sense paraula de pas |- style="vertical-align: top;" | '''Autors:''' | {{{autors|{{{autors|}}}}}} |}
Fitxeu-vos com podeu utilitzar paràmetres amb tres claudàtors. Per exemple el paràmetre:
{{{autors}}}
Se substitueix per la variable autors al cridar a la plantilla:
{{PlantillaCurs ... | autors = [[Sergi Tur Badenas]] }}
La sintaxi mes complicada:
Només es per indicar que si no s'indica el paràmetre es mostrarà un text amb blanc (observeu que no s'indica res després de l'operador |).
Recursos:
Una de les propietats força interessants és que la wiki permet fer fàcilment enllaços entre wikis. Per exemple:
[[w:Open Source]]
Us generarà un enllaç a la wikipedia anglesa a l'article sobre Open Source:
w:Open Source
No només hi ha wikis, també es pot enllaçar a altres pàgines com IMDB:
imdb:Quantum of Solace
A:
Podeu trobar més detalls i una llista d'enllaços entre wikis. De fet podeu arribar a definir els vostres propis enllaços.
La potència de la wiki es veu augmentada per una sèrie de pàgines especials. Les pàgines especials estan dins de l'espai de noms Especial i de fet podeu consultar un resum de les pàgines especials a la pagina especial:
Especial:Pàgines_especials
Des de aquestes pàgines es poden gestionar els usuaris, permisos, fer el manteniment de la wiki, cercar pàgines, exportar pàgines, etc.
Algunes pàgines destacables són:
Encara és més potent però veure que hi ha pàgines especials a l'espai de noms 'Mediawiki que permet modificar en format wiki la pròpia wiki. Per exemple:
Això és només un petit exemple del que es pot fer. Consulteu:
http://en.wikipedia.org/wiki/Wikipedia:MediaWiki_namespace
Les podeu consultar totes fent una cerca del espai de noms Mediawiki:
http://acacha.org/mediawiki/index.php?title=Especial%3ACerca+per+prefix&from=&namespace=8
NOTA: Aquestes últimes pàgines només les pot modificar el Wikisysop de la wiki. Precisament es poden assignar permisos a altres usuaris des de la pàgina especial:
Podeu provar-ho a la vostra wiki entrant com a usuaris wikisysop.
Recursos:
Es pot ampliar la funcionalitat d'una mediawiki mitjançant extensions. Per exemple, a aquesta wiki està instal·lada la extensió Sintax Highlight que us permet mostra codi font acolorit:
echo "Hola mon!";
Podeu trobar exemples de com instal·lar algunes extensions a:
Mediawiki#Extensions
La llista completa d'extensions la podeu trobar a:
http://www.mediawiki.org/wiki/Extension_Matrix
Recursos:
Se us proposa crear una pàgina personal força elaborada similar a:
Usuari:ProfeExemple
És dir modifiqueu la vostra pàgina Usuari:nomUsuari
Cal que utilitzeu la plantilla:
Plantilla:FitxaProfessor
A la vostra pàgina ha d'haver-hi:
Si algú s'anima us recomano que proveu la plantilla que permet fer metacaixes a l'estil de les que trobareu a la portada de la http://ca.wikipedia.org/wiki/Portada o la portada d'aquesta wiki.