XML Path (XPath)

XML Path Language, pe scurt XPath, este un limbaj folosit pentru accesarea unor parti dintr-un document XML, extragerea si folosirea informatiilor sau datelor continute in nodurile unui document XML, dar si pentru a determina valori (numere, caractere, booleane) pe informatiilor din fisierul XML.

XPath a fost definit de World Wide Web Consortium. Versiunea 1.0 a fost lansata in 1999, iar in 2007 a fost lansata versiunea "upgrade" 2.0.

Datorita structurii de arbore a unui fisier XML, limbajul XPath ne ajuta sa ne plimbam cu mare placere(navigam) prin structura acestuia, cutreierand prin nodurile ce respecta conditiile cerute.

Un nod din cadrul fisierului XML este identificat pe baza relatiilor dintre el si celelalte noduri ale fisierului, pe baza tipului, cat si a numelui si/sau valori. Folosind o expresie XPath putem obtine urmatoarele :
- o serie de noduri ce corespund cerintelor
- o valoare de tip boolean
- o valoare de tip string
- o valoare de tip number(valoare numerica)

Versiunea 2.0 a limbajului se prezinta cu multe imbunatatiri, cu o documentatie mult mai mare si cu noi feature-uri. Principala diferenta intre aceasta varianta si cea dintai este ca trateaza fiecare valoare ca o secventa(daca avem de a face cu 1 singur nod, acesta este privit ca o secventa de lungime 1). Secventele spre deosebire de multimile de noduri, pot contine 2 sau mai multe elemente identice, sunt ordonate si nu avem parte de secvente imbricate.
De asemenea, versiunea 2.0 ofera un set de expresii si operatori mai extins.
XPath 2.0 prezinta si expresii conditionale, un mare avantaj pentru developer :
if(conditie)
then instructiune1
else instructiune2

In speranta ca v-am deschis apetitul pentru XPath(v2.0, ne plac avantajele), puteti afla mai multe de la adresele de mai jos :

http://www.w3schools.com/Xpath/
http://www.zvon.org/xxl/XPathTutorial/General/examples.html

The BOOK !

Cautand pe google una alta despre interfete web si diverse tehnologii am dat peste un site ale carui produse sunt foarte interesante si dragute si destul de folositoare zic eu. Asa ca m-am gandit sa le fac o referire pe blogul nostru.
Sper sa va fie de ajutor :)
Apreciez rabdarea, imaginatia si intiativa autorului.

Libraria jQuery

jQuery este o librarie de javascript ce rezolva multe din problemele legate de compatibilitatea intre browsere. Datorita dimensiunii mici(undeva in jur de 20kb) nu provoaca probleme din punct de vedere al spatiului de stocare.
In comparatie cu alte librarii/tehnologii, atu-ul librariei jQuery este legat de simplitatea cu care se poate folosi si mai ales de documentatia bine pusa la punct. Din acest motiv, grupul developerilor ce folosesc jQuery s-a extins, aparand in acest fel si multe plugin-uri : drag and drop, galerii de imagini, etc.
Folosind jQuery poti schimba sau sterge continutul unei pagini sau a unei portiuni de pagina, poti realiza animatii cu usurinta, efecte de gen FadeIn/FadeOut, poti folosi Ajax fara prea mari batai de cap si mai ales reduce folosirea JavaScript.
Pentru a folosi jQuery sunt necesare cunostinte de baza de CSS. Asta pentru ca elementele se selecteaza intr-un mod aprope identic:
-selector CSS : header{
width:200px
}
-selector jQuery : jQuery('#header').css(width,200)

Luati in considerare libraria jQuery in cazul in care nu sunteti zei ai JavaScript, in caz ca nu vreti sa va prindeti urechile inutil si chiar vreti sa fiti mai eleganti in ceea ce priveste developmentul paginilor web.
Pentru mai multe detalii puteti vizita : http://docs.jquery.com/Main_Page

De ce urasc inginerii experti in interfete web Managementul?

De ce urasc inginerii experti in interfete web departamentul de Quality Assurance?

De ce urasc inginerii experti in interfete web departamentul de Human Resources?

Restaurantul Interfete Web

Ieri seara am venit obosit dupa o zi plina de facultate, lucru, trafic si alte chestii de genul si m-am asezat la calculator sa mai fac una alta. Cum atmosfera era apasatoare, am luat 2 beri de pe balcon si in 5 minute s-au facut nevazute. Definitiv.
Peste putin Silvia mi-a zis sa pun si elemente title la meniul siteului de interfete web, i-am zis ca o sa pun, dar ea tot insista peste meniu, ca meniul este important, ca trebuie, ca asa ne evidentiem postarile, etc.

Nici pana azi nu l-am pus (multumesc fetelor ca au facut asta deja), dar cand am auzit de meniu, pe fondul foamei extreme si repetitiei ideii de meniu mi-a venit urmatoarea idee de campanie de PR:

Restaurantul Interfete Web

Restaurantul Interfete Web, o subsidiara a grupului de investitii Interfete Web, vine pe piata cu o serie de inovatii gastronomico-tehnologice pentru cele mai exigente persoane. Chelenrii sunt in totalitate absolventi de informatica, bucatarul este team leader cu calificari pe CISCO, iar paznicul nu numai ca stie template-uri de C++, dar stapaneste la perfectie 3 framework-uri de javascript si 4 de php.

Bucatarul, acest maestru al artelor, impreuna cu echipa dinamica a pus la cale un meniu pe masura companiei. Meniul este urmatorul:

- ciorba de jquery
- tocanita de expresii regulare
- friptura de apache tomcat
- sote de xml
- frigarui de owl (bufnita)
- javascript cu morcovi
- ghiveci cu SEO

Va dorim pofta buna si il asteptam pe google sa se intrebe ce naiba cauta cuvinte fara sens unu langa altu.

>:D<

Cum faci un manager stresant sa nu te mai intrebe de sanatate

Comparatie intre jQuery si ExtJS

2 framework-uri de javascript.
Singurele 2 dupa parerea mea.

Totusi, ce difera, ce se aseamana, ce sa folosesc, etc?

Se pot gasi sute de astfel de review-uri pe net, dar voi incerca sa concretizez ca sa fie usor de digerat:

Cand e ideal jQuery:
- siteuri la care ai nevoie sa ascunzi/afisezi elemente
- efecte, fade-uri, ajax simplu
- explorare de dom simpla, manipulare de dom
- aplicatii web foarte simple
- siteuri/aplicatii unde amprenta de javascript trebuie sa fie mica: max 20 de kb

Cand e ideal ExtJS:
- cand ai nevoie de grid-uri, butoane, controale form, panel-uri, resize-uri, ferestre, ajax profesional, layering, observers, OOP, extindere
- cand vrei sa faci o aplicatie cu adevarat mare
- cand codul de javascript pe care il scrii singur depaseste 1 mb de cod sursa

Interfete Web

Interfetele web inseamna interfete care ruleaza pe web, web-ul fiind locul ideal de destinatie pentru ele. Printre elementele interfetelor web se numara widget-urile web, bazate pe javascript, flash, flex.

Ideea cu aceste interfete web este de a genera continut interactiv si usor de utilizat de catre useri.

Deci nu uitati cuvantul magic pe ziua de azi (interfete web)

La naiba, nimeni nu mai citeste regulamentele in ziua de azi :((

optimizare interfete web

Minimizare, obfuscare, grupare elemente grafice...

Dupa cum ziceam mai sus, 1000 de reqeusturi nu fac bine nimanui. Nici serverului, nici clientului si nici traficului global de pe internet plin de ACK, SYN-uri CONNECT si CLOSE-uri (remember Protocoale de Comunicatii).

Ce abordare avem in acest caz?

Javascript:
http://dean.edwards.name/packer/
Aceasta unealta lucreaza in 3 moduri:
- usor eficient: inlatura comentarii, new line-uri, caractere albe extra, etc
- eficient: usor eficient + redenumire variabile cu nume scurte
- mega eficient: criptarea codului sursa, pentru ca rezultatul lui sa se genereze pe baza unei functii matematice.
Recomand mega-eficient pentru deployment, dar nu uitati sa faceti copii de backup inainte sa criptati originalul.
Dupa ce ati criptat pe rand fisierele, copiati rezultatul lor intr-un singur mare javascript si includeti-l pe acela.

CSS:
http://www.artofscaling.com/css-minifier/
Reduce spatiile albe, enter-urile, comentariile, etc.
In urma reducerii fiecarui CSS, nu uitati sa puneti pe toate intr-un singur mare css, in ordinea includerii normale.

Imagini:
Aici nu exista o reteta universala. Ideea este sa faceti un PNG mare in care sa puneti imaginile de care aveti nevoie si apoi sa controlati afisarea lor folosind parametrii background-position.

Request-uri AJAX:
Daca aveti multe date de preluat, nu le faceti folosind 300 de request-uri AJAX. Dati un singur request pentru toate daca aveti nevoie de toate datele deodata, si diferentiati-le in raspuns folosind JSON.

Asta ar fi cam toate sfaturile legate de optimizarea interfetelor web. Happy Web2.0 coding.

Re: 10 motive pentru care Javascript este cel mai prost inteles limbaj de programare

Am folosit Google Reader (stiti.. client RSS.. o sa devin obsedata) si am fost anuntata la fiecare postare noua pe blogul la care m-am abonat evideeeeent! Si uite asa am citit post-ul lui Vali la care indraznesc sa ii dau un mic "Re:". L-am citit si recitit de multe multe ori (postul lui Vali).. Ce mai, m-am simtit! Ar trebui sa ma las de programare? Oare? sau sa pun mana pe tastatura, ochiu' pe monitor si sa il intreb pe tata Google? ca sa aflu l-am intrebat intai pe Dynamic Implementation Consultan-ul nostru, dl. Valentin, ce vrea sa spuna de fapt ca m-am cam bagat in ceata (umila, imi recunosc in mod public-on request- numarul de neurouni):

Vali: sper ca nu te-ai suparat
vivi: not!
vivi: si oricum imi cam scoate peri albi js sscris de altii
vivi: deci
vivi: ure right
vivi: numai ca sunt eu novice
Vali: pai iti scoate
Vali: pt ca js e scris prost
Vali: in general
Vali: pana si eu il scriu prost
vivi: question
vivi: in loc de onclik si alte balarii
vivi: ca zici ca e naspa
vivi: ce altceva?
vivi:
vivi: mai bine te intreb pe blog
Vali: pai
Vali: onclick="test();"
vivi: asa
Vali: nu e bine din motivul in care nu respecti
Vali: ideea de "mvc"
Vali: adica in general trebuie sa separi interfata
Vali: de cod
Vali: ca sa atribui onclick
Vali: scrii
Vali: document.getElementById('test').onclick=function(e) {
Vali: }
Vali: si ai acces si la e
vivi: aahaaaaaaaaaaaaaaaaa
Vali: si poti oprii propagari, alte nebunii
vivi:
vivi: si eu chiar fol la maxim evenimetele de genul
Vali: plus ca
Vali: e bine sa folosesti jquery
Vali: unde ai obiectul de event
Vali: unificat cross-browser
Vali: ca in ie merge e.keyCode
Vali: in ff nu merge e.keyCode parca
Vali: iar jquery unifica calumea
vivi: trag un google si apoi un post
vivi: te-ar deranja ca postul sa contina si cate ceva din conversatie.. gen copy/paste
vivi: ?
Vali: a nu
Vali: normal ca nu

Si acum google...

MVC..
- in primul rand este un design pattern - "model view controller" - folosit in dezvoltare de soft in diverse limbaje de programare: Java, PHP, Ruby, .Net, Python etc.. si, daca e folosit corect, izoleaza logica bussines-ului din punct de vedere al interfetei astfel incat modificarile in partea vizuala a aplicatiei sau in logica de bussines, sa nu se afecteze reciproc.
- acest design pattern poate fi aplicat si in JavaScript, considerat de unii cel mai flexibil limbaj din lume.
- si asa s-a nascut (presupun :) ) JavascriptMVC care e un "open source" framework... http://javascriptmvc.com/wiki/index.php?title=Main_Page

Concluzie: bine a zis Lenin (sau Stalin) "invatati invatati invatati!!!"! Omul cat traieste invata.. mai ales despre interfete web :))

Ce nu inteleg multe siteuri Web2.0

Ce este un request? Este un efort al browserului din calculatorul tau sa acceseze o pagina din serverul pe care se afla un site.

Ce te faci daca, atunci cand intrii pe un site, Web2.0 bineinteles, acel site incepe sa faca:

5 request-uri pentru javascripturi:
jquery.js, jquery-ui.js, jquery-scrollto.js, mainapp.js, effects.js

3 request-uri pentru css:
jquery-ui.css, main.css, extra.css

195823569221 imagini de cate 1-2kb/fiecare.

In termeni de dimensiune nu ne deranjeaza, dar ne deranjeaza faptul ca fiecare request trebuie sa se conecteze la server, sa descarce continutul, sa fie interpretat, etc.

Chiar si daca vorbim de requesturi cached(js-urile si css-urile sunt cached), tot se vor cere, dar se va primi 304 Not modified

Bun. Ce se poate face in aceasta situatie?

Se incearca optimizarea. Cuvintele magice? minimizare, obfuscare, introducere de imagini care sunt afisate ca background-image intr-un singur fisier mare si incarcat. Alt cuvant magic? Testare si iar testare? Altul? VOINTA!

RSS again!

Nu ca as deveni pasionata de subiect dar e chiar interesant.Neavand o experinta prea vasta in domeniu (subiect) post-urile pe aceasta tema nu sunt decat un foarte scurt rezumat la ceea ce gasesc si eu pe net..

Spre rusinea mea, daca ma intreba cineva saptamana trecuta daca stiu ce e RSS ridicam fruntea mandra si tranteam un "normal!!" foarte ofensat dar dupa multe tab-uri cu diverse informatii plecate din Google recunosc cu mana pe inima si las capul in jos: "nici nu aveam idee!!".

Asdar sa va spun si voua cam ce am mai aflat..
In primul rand pentru a va abona la un RSS (adica sa sa iti fie semnalate ultimele modificari pe site-ul tau preferat) este necesar ca site-ul respectiv sa aiba o integrat serviciu RSS, sa ofere posibilitatea de a alege unul din feed-uri (care se pare ca sunt un fel de bookmarks sau favorites) si sa ai un RSS reader pentru ca serviciul RSS de bazeaza pe formatul XML, deci trebuie citit :). Exista o multitudine de RSS-readers gratuit (da.. moca) pe marele internet,iar daca nu sunt gratis.. gasim noi o metoda. RUSINE! :)) .. dar de ce sa ne chinuim cand exista o gramada de clienti RSS online care, din cate am citit eu, incep sa aiba fie din ce in ce mai apreciati.: Google Reader, My Yahoo, Bloglines, NewsGator etc.. Intr-un articol peste care am dat in cautarile mele, autorul claseaza Google Reader ca fiind cel mai bun clent RSS online deci vi-l recomand si eu (doar din auzite.. eu o sa le incerc pe toate si peste un timp va anunt daca mi-am facut o parere).

Astept pareri si noutati!!!!

Cine a tradus blogger in romana?

Un roman de la google, cu singuranta, dar nu stiu ce era in capu lui de a tradus “Sponsori” in loc de “Autori”. Ce urmeaza? Finantatori si investitori? Brokeri? Barosani?

Ce este RSS - ul ?

RSS este abrevierea de la Rich Site Summary, pentru versiunile RSS 0.91 si 1.0 si Really Simple Syndication, pentru RSS 2.0. Asa cum sugereaza si numele (v1.0) reprezinta sumarul noilor informatii adaugate pe site-ul respectiv,in cazul unui site cu o frecventa destul de mare din punct de vedere al schimbarilor efectuate. Asadar RSS este util pentru site-urile care isi schimba des informatiile cum ar fi site-urile de stiri, blog-uri sau podcasting.
Cand l-am intrebat pe tata Google la ce se foloseste RSS-ul (stiam ceva de niste stiri pe scurt.. dar cand un coleg a intrebat "ce este RSS-ul?" mi-am dat seama ca nu pot sa dezvolt pe tema asta :) ) am aflat si ceea ce este podcasting-ul, si anume transmitere de fisiere audio si video prin RSS. Nu am utilizat asa ceva suna de-a dreptul interesant.. se pare ca aceste fisiere care pot fi citite de dipozitive mobile ( am si eu RSS pe telefon dar ca un viitor inginer adevarat,sper, nu folosesc decat agenda :)) trist ) sau calculatoare daca accepta formatul in care sunt puse fisierele respective. Parea cea mai tare, mai ales pentru dispozitive mobile si cei pasionati de ele (nu eu), e ca fisierele pot fi descarcate offline (asadar economie!! tot e criza.. ) sau ascultate/vizualizate online.
Il mai intreb pe Google si cum se implementeaza ceva de genul.. si va tin la curent (nu pare foarte complex dar trebuie sa ma lamuresc si apoi sa imi dau cu parerea) sau daca aveti deja o parere bine conturata, nu ezitati sa ne suneti si noua.. so leave us a comment please!

Cum faci o idee sa para mai buna?

Cum poti face ca o idee sa para mai buna atunci cand o prezinti cuiva?

Ii zici ca primul care a avut-o a fost Benjamin Franklin.

Bineinteles, nu se poate aplica la programare, dar cand vorbesti de lucruri precum drumul optim intr-un graf, poti zice ca el a observat miscarea pendulara oscilatoare a maimutei din ramura in ramura pana si-a dat seama de pattern-ul eficientei naturale a ei.

PS: www.jquery.com

jQuery

Ce este jQuery? Vreo tehnologie monolitica obosita gen Java Struti? Nu. j ala vine de la javascript, q de la query.

Care este ideea?

Pai, cu el putem exploata toate elementele din pagina folosind XPath la nivel de CSS-3 compliance.

Tot cu el putem realiza aplicatii solide care sa mearga identic pe toate browserele

Tot cu el putem realiza cereri ajax in cel mai usor mod.

Acum sa va dau un exemplu de cod care ar lua 592 de linii de cod javascript pur pentru implementare:

$(‘div#wrap > td:has(div.myclass) div.inneritem a[href^=http://]’).hide();

Ce face asta? Pai, cauta un div cu id-ul wrap, vede daca are sub el un td care are la randul lui dub el un div cu clasa myclass, vede daca td-ul are un div cu o clasa inneritem, iar in acel div exista un link al carui href incepe cu http://, adica link extern si il ascunde.

In javascript, acest lucru s-ar fi realizat asa:

divwrap=getDocumentById(‘wrap’)
children_divwrap=divwrap.children();
if (td in children_divwrap) {
if (td.children(div) {
  if (div.className==’myclass’) return found_td;
}
}
if (found_td.children() in div) {
if (div.className==’inneritem’) return found_div_inneritem;
}
if (a in found_div_inneritem.children()) {
if (a.attr(‘href’).beginsWith(‘http://’)) return found_a_href_http;
}
found_a_href_http.hide();

Am scos de aici niste foreach-uri evidente, doar pentru a arata ideea de baza. Similar pentru Ajax, DOM manipulation, events, efecte, utilitare, etc.

JSON. Deci da!

Deci da! Asta a fost exprimarea cand am testat prima oara JSON-ul. E puternic, cross platform, nu are nevoie de instantieri complicate cum e XML-ul, redundanta pe langa date e mica. Pe scurt, JSON e formatul meu preferat pe care il folosc cu incredere.

Cum arata JSON-ul asta?

Adica asta inseamna ca urmatoarele json-uri sunt valide:

[1,2,3,4,5]
[1,2,”a”]
{“a”:5}
{“a”:5,”b”:[1,2,3,4]}
{“a”:5,”b”:[“a”,”b”,”c”],”d”:{“e”:9}}

Incepe deja sa arate complicat. Nu este!

Ideea este ca orice JSON este ori un array bazat pe indecsi ([]) ori un array bazat pe chei=>valori ({}). Cel bazat pe indecsi poate contine in interiorul lui array-uri bazate pe chei=>valori, si invers. Cum am face un JSON cu profilul unui candidat atunci?

[
{
“candidate_id”: 5,
”fname”: “Gigel”,
”lname”: “Georgel”,
”age”: 20,
”phones”: [“0722 222 222”,”0744 444 444”],
”jobs”: [
{“title”:”engineer”,”company”:”XYZ SRL”,”period”:”2002-2003”},
{“title”:”senior engineer”,”company”:”XYZ SRL”,”period:”2005-2008”}
]
}, {
“candidate_id”: 6,
… etc
}
]

Cat de verbose ar fi fost un XML echivalent? Va las sa ghiciti.

JSON-urile sunt de preferat cand vine vorba de comunicare client/server folosind ajax din mai multe motive:

- mici ca dimensiune, overhead date mic,

- interpretare nativa de catre javascript (eval),

- UTF8

- se genereaza usor pe server. In general se aplica o functie peste un Hashtable sau un Array si iese JSON.

JSON-ul se poate valida pe www.jsonlint.com

Limitari JSON?

 

Ne afecteaza cu ceva asta? Nu! Nu folosim JSON sa stocam date, ci sa le transportam.

PUBLICITATE [nu adsense]

www.freegsm.ro (al doilea link, cel cu vrei sa ai un logo al tau?). IE6+ only din cauza ca foloseste tehnici de filtare a imaginilor (proprietatile css filter: ).

AJAX simulat prin form-uri cu action-uri in iframe-uri

(free stuff)