luni, 12 ianuarie 2009

Enter Silverlight - partea a doua

Am spus mai devreme ca ma voi intoarce cu mai multe detalii legate de limbajul XAML folosit pentru definirea interfetei cu utilizatorul. Si iata ca m-am intors. Sa vedem...

Limbajul XAML (sau Extensible Application Markup Language) este un limbaj declarativ bazat pe regulile XML. Din punct de vedere al sintaxei, regulile sunt destul de putine si foarte clare. In primul rand, trebuie ca tot continutul fisierului XAML sa fie inclus intr-un nod radacina de tipul Canvas.

Dupa cum stim, standardele XML permit introducerea de date in noduri ca atribute, sau sub forma de continut. Un feature foarte util prezent in limbajul XAML este sintaxa elementelor proprietate, care permite acordarea de valori complexe proprietatilor. Cum ar fi, de exemplu, definirea unui fundal ca un gradient dat prin culorile in anumite puncte "ancora". Sintaxa de baza presupun adaugarea in interiorul nodului obiect, a unuia sau a mai multor noduri de forma NumeObiect.NumeProprietate, iar in interiorul acestora, a unor noduri ValoareProprietate.

Aceasta sintaxa are atat avantajul de a permite definirea unor proprietati practic oricat de complexe, cat si acela al faptului ca lasa loc pentru continutul propriu-zis al obiectului parinte. Astfel, definirea proprietatilor poate fi interpretata ca un header, dupa care se poate adauga continutul.

Un alt tip de proprietate implementat in XAML este cel al proprietatilor atasate, adica al unor proprietati pe care elementul respectiv nu le detine in mod nativ, dar daca ii sunt atasate le poate interpreta prin referire la proprietatile elementului parinte. Spre exemplu proprietatile Top si Left (distanta fata de marginea de sus, respectiv din stanga a containerului), sunt dependente de contextul in care se afla elementul respectiv.

O ultima nota asupra sintaxei XAML va face referire la tratarea evenimentelor. Acestea sunt definite in XAML in mod foarte asemanator cu HTML. Asocierea dintre lansarea unui eveniment si metoda ce il trateaza se face prin adaugarea la elementul vizat a unei proprietati de forma NumeEveniment="FunctieHandler()".

Acestea fiind zise, voi incheia aici partea a doua a seriei Silverlight, urmand sa revin data viitoare cu o serie de probleme cunoscute ale versiunii curente de Silverlight si cele mai uzuale solutii de work-around.

Catalina

Interfete web - Tutorial 4

In acest nou tutorial legat de interfete web vom aplica o tactica diferita.
Aveti acces la codul sursa a proiectului dand click aici .

La fel ca si tutorialul anterior este vorba de un "magazin online".
Trebuie sa aveti grija la instalarea bazei de date (procedurile folosite nu pot fi introduse direct asa cum sunt ele scrise in acele query), asa ca va trebui sa gasiti o modalitate de a le introduce direct in baza de date.

Cu acest tutorial 4, va doresc un an nou fericit si sa ne revedem cu bine!

Cu respect,
Valentin

Interfete web - Tutorial 3

Salut la tutorialul 3 legat de interfete web, mai exact legat de un magazin online.

Codul il gasiti la adresa:
Sursa

In stilul cunoscut vom analiza pe rand partile componente:

1. MySQL
Pentru a simplifica instalarea bazei de date am exportat eu datele folosite magazin.sql, dar pentru a putea sa le folositi va trebui sa creati, totusi, o baza de date numita magizin. In cazul in care nu sunteti familiari cu import si export din phpmyadmin, atunci puteti (dupa ce ati creat baza de date si ati setat si parametrii corecti de conectare - din conectare.php) pur si simplu sa rulati fisierul instalare.php.

2. Javascript (functii.js)
Contine 3 functii: primele doua doar deschid noi ferestre si le seteaza anumiti parametri. Functia "what" primeste 4 argumente: primele doua in principiu identifica id-ul produsului si id-ul utilizatorului, al treile argument identifica actiunea ce trebuie executat si cel de-al patrulea argument este numele div-ul unde se va scrie informatia.

3. PHP
a) Login.php - permite unui utilizator sa se logheze
b) Register.php - permite inregistrarea unui nou utilizator
c) Admin.php - adauga un nou produs in baza de date
d) Functii.php
- este partea apelata de Ajax
- pune la dispozitie 3 actiuni posibile: 1 - adaugarea unui produs in cos, 2 - stergerea unui produs din cos, 3 - cumpararea produselor din cos
e) Index.php
- este pagina principala si in functie de un id cu care este chemata are un comportament diferit
- daca id-ul este 1 atunci se afiseaza toate produsele disponibile (se poate observa faptul ca se permite o navigare si o cumparare fara ca initial sa existe un login)
- pentru id 2 se permite cumpararea produselor din cos
- pentru id 3 se afiseaza un istoric al tuturor cumparaturilor
- pentru id 4 se face logout

4. CSS
- dupa cum se poate observa css-ul are aproximativ 9k, site-ul pornind de la un template free, aplicatia fiind construita pe acest template

Enter Silverlight...

Salutare din nou!

Voi face o mica pauza in seria articolelor ce au ca tema comparatia intre VB si C#, pentru a va prezenta o tehnologie relativ noua, si foarte promitatoare, in ciuda problemelor adesea evidente pe care inca le mai are - tehnologia Microsoft Silverlight.

Acestea fiind zise, sa trecem la treaba - deci ce este Silverlight?
Silverlight este o tehnologie web disponibila in cadrul framework-ului .NET, portabila din punct de vedere al browserului si al platformei, si creata cu scopul de a permite dezvoltarea a ceea ce a fost denumit ultima generatie de RIA (Rich Interactive Application), intr-un mod mai vizual si mai orientat pe design decat oricand. Pe partea clientului, functioneaza pe orice browser, incluzand Internet Explorer, Firefox, Safari, Opera, etc, fiind necesara doar instalarea unui mic plugin.

Ca sa punem problema in modul cel mai simplu, Silverlight este raspunsul Microsoft la Adobe Flash. Iar in ciuda problemelor inca nerezolvate in versiunea curenta (v2.0 - release candidate 0 la momentul scrierii articolului), isi atinge in general obiectivul prin faptul ca este mai versatil, mai puternic , si mai "comunicativ" cu alte tehnologii, daca putem spune astfel. Putin mai tarziu vom vedea in ce constau si problemele pe care le-am mentionat. Dar sa revenim.

De ce spun ca este mai versatil? Silverlight este, tehnic vorbind, o combinatie de mai multe tehnologii accesibile din acceasi platforma de dezvoltare, fapt ce permite developerului sa-si aleaga uneltele si limbajul de programare pe care doreste sa le foloseasca (lux inaccesibil developerului orientat pe Flash). Se integreaza fara probleme cu codul deja existent de Javascript si Ajax, pentru a completa functionalitatea deja existenta.

Urmatoarea intrebare - ce contine o aplicatie Silverlight? Raspuns - cel putin 3 elemente:
- un fisier html radacina, ce are ca singur scop lansarea apelului "Create Silverlight" ce porneste randarea aplicatiei propriu-zise,
- unul sau mai multe fisiere XAML, ce compun interfata aplicatiei (voi detalia putin mai tarziu structura unui fisier XAML, deocamdata voi mentiona doar ca limbajul folosit este foarte asemanator cu XHTML)
- un assembly DLL, referentiat din fisierele XAML, si care dupa incarcare, ruleaza client-side, asemanator cu javascript, dand astfel impresia de aplicatie desktop. In acesta assembly se incorporeaza toate celelalte module si biblioteci necesare.

In incheierea acestei prime parti a seriei Silverlight, voi mentiona motivele pentru care Microsoft sustine ca Silverlight va revolutiona dezvoltarea web. Daca au dreptate sau nu, vom vedea in continuare.

1. Cross-platform, cross-browser - permite dezvoltarea de aplicatii web ce vor functiona pe orice browser, sub orice sistem de operare.
2. Developerii si designerii grafici pot lucra acum independent (cu alte cuvinte, nu mai pot da vina unii pe altii cand nu iese bine :) ) - datorita gradului ceva mai mare de independenta dintre partea client-side (sursa XAML) si server-side (codul din spate), orice designer cu un minimum de cunostine HTML va prinde imediat "din zbor" limbajul XAML si va putea crea layout-ul cu mana lui, fara a-i explica developerului cum ar vrea sa arate aplicatia, lasand implementare layoutului tot in mainile acestuia din urma.
3. Costuri mai mici - Silverlight este cel mai ieftin mod de a realiza video streaming la cea mai buna calitate, licentierea este foarte simpla, iar ca requirements suplimentare, nu este necesar altceva decat IIS.
4. Suport pentru limbaje third-party - datorita noului DLR (Dynamic Language Runtime), developerii vor putea scrie codul server-side intr-o multime de alte limbaje, cum ar fi Ruby, Python, etc (pe langa evidentele VB si C#).
5. Viteza mai mare - din studiile Microsoft (ce raman, evident, a fi verificate), aplicatiile web bazate pe Silverlight sunt mult mai responsive si mai rapide decat cele bazate strict pe Ajax (evident, strict din punct de vedere al interfetei).

Aici se incheie introducerea in tehnologia numita Silverlight. Voi reveni in continuare cu mai multe detalii, si cu o scurta prezentare a partilor nu asa de promitatoare ale acesteia.

Catalina

duminică, 11 ianuarie 2009

de incheiere... (sau nu)

Hello friends,

Well well well, cred ca ma aflu in fata ultimului meu post pe acest blog dragut. Astfel inchei aceasta mica aventura in care trebuie sa recunosc ca am mai invat cateva tips & tricks despre ce inseamna a contribui cu o pagina web decenta la cele 43 de miliarde de pagini deja existente. Nu in ultimul rand am mai invatat si cum sa te faci observat (in afara de a pune link-ul la status la messenger cu textul 'NU DA CLICK!!') si placut de catre cititori/vizitatori.
Imi voi continua "activitatea online" pe un alt blog/site, cel mai probabil dupa sesiune, fiind instigat si de doi buni amici ai mei care si-au tras blog-uri recent.
Ii salut in primul rand pe colegii mei din echipa, Vali, Catalina si Billy, pe care din pacate nu am apucat sa-i vad in 2009. Va urez un 'La multi ani!' intarziat dar calduros, si mult succes in anul asta greu care ne asteapta. Cat despre restul care apuca sa citeasca acest post, tineti-mi va rog pumnii in aceasta sesiune :-D

Ne auzim cat de curand,
Vali

Spotify Rocks !!

Ati descoperit vreodata o carte, un film, sau poate o aplicatie care sa va placa asa de mult incat sa tineti neaparat sa povestiti la altii despre ea? Cam in postura asta ma aflu eu acum si vreau sa va fac o recomandare a unui serviciu descoperit in ultimele zile cu ajutorul unui foarte bun amic :


* Ce este Spotify?
Spotify este o aplicatie de streaming de melodii care va pune la dispozitie o baza de date (biblioteca, librarie) impresionanta de piese spre a fi ascultate. Aplicatia este dezvoltata de Ludvig Strigeus, software engineer-ul care a creat uTorrent, si de aceea este si foarte resource-friendly.

* De ce e Spotify asa misto?
Partea interesanta e ca streaming-ul propriu-zis al pieselor se face prin metoda clasica, de la un server de streaming, dar si peer-to-peer intre utilizatori. Exact ca la BitTorrent: odata cu log-area unui utilizator pe server melodiile aflate in cache-ul sau sunt indexate si trimise la hub-ul de stream Spotify. Acest index este folosit pentru a anunta alti utilizatori de posibilitatea de a se conecta direct pentru a accesa piesele respective. Si cu ce ne ajuta asta? Incarcarea si seek-ul prin melodii se face aproape instant si astfel poti beneficia de o auditie neintrerupta chiar si cu o conexiune de internet mai slaba.
Cele mai ascultate piese sunt in general stream-uite interutilizatori fara a mai aglomera serverul, care poate servi spre ascultarea pieselor mai putin populare.

* GUI & Usability
Interfata e o combinatie intre cea de la iTunes si cea a playerul-ui Last.fm. Playlisturile se pot crea si modifica foarte usor prin drag'n'drop, iar orice informatie a melodiei (Artist, Titlu, Album) reprezinta un link spre a naviga prin libraria de piese mai usor. Spotify prezinta si o parte sociala:
se pot crea playlisturi colaborative de catre mai multi useri simultan iar playlist-urile si melodiile se poate impartii cu alti utilizatori prin link-uri specifice Spotify. Linkurile se pot obtine din aplicatie sau direct prin drag'n'drop in browser, mail sau client de chat.
O alta facilitate o reprezinta optiunea ce permite integrarea cu Last.fm


What is Spotify? from Philip Harrison on Vimeo.

* What's the catch? E legal?
Exista doua pachete Spotify: unul free in care auditia este intrerupta in anumite momente de reclame, sau pachetul Premium (9.99€/luna) care nu include nici o reclama si confera utilizatorilor acces la preview-uri de piese si stiri.
Pentru a-si umple libraria audio cei de la Spotify au incheiat contracte cu EMI, Warner Music, Sony BMG si inca 3 mari case de discuri internationale care au fost foarte deschise la noul concept.
Spotify se vrea o alternativa la pirateria muzicala si a primit un feedback foarte pozitiv de la utilizatorii sai. Baza sa de date este updatata constant cu numeroase albume si piese (noi si vechi) iar viteza si usurinta sa de utilizare fac totul sa para ca si cum ar fi local si nu prin streaming.

Daca v-am convins sa incercati acest serviciu, care din punctul meu de vedere va avea un succes enorm, va anunt ca inregistrarea se face pe baza de invitatii pe care ulterior le primiti pe masura ce ascultati mai multa muzica :-) Dati un click pe profilul meu si imi dati un mail de request si o sa primiti o invitatie din partea mea. Odata facut contul mai urmeaza descarcarea clientului si... voila, muzica ta preferata la cateva click-uri distanta.
Ca un bonus va invit, dupa ce va inregistrati, sa ascultati un playlist facut de mine impreuna cu un amic de-al meu (acelasi amic care mi-a recomandat Spotify) ce contine o selectie de piese foarte relaxante, romantice si vioaie pe alocuri :) enjoy!
Vali

sâmbătă, 10 ianuarie 2009

Interfete Web 101 - Moda blog-urilor

Salutare,

Astazi o sa vorbim cate putin despre blog-uri, aceste 'jurnale' ajunse asa de populare si complexe incat am putea umple sute de posturi pe tema lor :-) Initial nu aceasta era subiectul de care vroiam sa ma ating, dar am observat ca multi dintre prietenii mei si-au facut blog-uri recent (in ultima luna) si se pare ca blogging-ul a ajuns cu adevarat mainstream.

Pe scurt
Termenul de "blog" vine de la asocierea "web log" si reprezinta un site intretinut de regula de o singura persoana cu rolul de jurnal virtual si public. Autorul sau are postari regulate despre intamplari din viata sa, stiri, comentarii sau orice fel de continut audio sau video. Postarile sunt in general in scris, sub forma de text, combinate cu poze si link-uri catre alte referinte. De asemenea, aceste postari sunt deseori insotite de comentarii din partea cititorilor si interventii ulterioare ale autorului ca raspuns la comentarii. Exista si blog-uri specializate pe un anumit tip de continut : blog-uri photo(photoblog), video bloguri(vlog), blog-uri audio(MP3 blog), cartoon blogs, etc.

De ce le aduc in discutie cand noi vorbim de interfete web?
Pentru ca intr-un fel blog-urile pot fi privite ca o 'interfata' intre cititori si autorul blog-ului, o modalitate de cunoastere a acestuia si de intra in contact direct cu el. Si bineinteles suportul prin care se face aceasta interactiune este 'web-ul'. Un blog poate fi foarte usor pus pe picioare apeland la un CMS specializat. Cele mai des intalnite sunt Wordpress si cel oferit de Google prin www.blogger.com .

Si care e treaba cu moda asta pana la urma?
Conform unui studiu realizat de Technorati pe 2008, cand au fost intrebati de ce tin un blog majoritatea celor care detin un blog personal au raspuns ca din distractie. De asemenea tot din acelasi studiu reiese ca 20% din bloggeri obtin sume de bani de pe seama blog-ului iar 42% vor sa obtina in viitorul apropiat. Media de castiguri insa este de aproape 200$ din care 50$ sunt reinvestiti in blog.
Blogul poate fi si o sursa de notorietate, 37% dintre bloggeri din acelasi studiu fiind citati de mass-media pentru una din postarile lor.
Motivele de a porni un blog sunt foarte multe, fie ca e un blog corporate, o tema data la facultate sau pur si simplu un loc de refugiu cu gandurile in scris.
Numarul blog-urilor s-a tot dublat in ultimii ani, deci avem de a face cu o crestere exponentiala. In prezent nu stim concret numarul total al blog-urilor pe plan mondial, singura modalitate mai exacta de a le numara fiind prin intermediul motoarelor de indexare care le acopera. Astfel Technorati cauta in 133 de milioane de bloguri; acest numar nu include cele 72.82 de milioane de blog-uri chinezesti raportate de The China Internet Network Information Center, sau numeroasele blog-uri de SPAM.


Moda sau nu, in final se rezuma la faptul ca fiecare vrea sa isi lase amprenta undeva in Internet spre a fi descoperita de alti curiosi.
PS: Nu uitati sa recititi postul despre teme pentru site-uri/blog-uri daca vreti sa va apucati de treaba.

Vali

Articolele noastre