Nette a ExtJS – zkušenosti z praxe?

Honza Kuchař

Ahoj,
stavěl jste už někdo webovou aplikaci na ExtJS + Nette? Narazili jste na nějaký problém? Jak jste členili aplikaci? Jak jste řešili formuláře? (to je skoro dilema) Protože s ExtJS se vlastně celá aplikace nachází na jedné stránce. Je to opravdu RIA v pravém slova smyslu. Jak jsem tak zjistil, tak asi nejlešpí bude udělat na straně serveru jen modely, udělat na ně nějaký connector, který bude přes JSON tahat data do Ext.data a odtam už si budou komponenty u klienta tahat data a renderovat se do DOMu. Je to takové posunuté. Vlastně Nettí šablony téměř s ExtJS ztrácí smysl, protože ke klientovi se přenáší opravdu jen data. Ale jak třeba řešit oprávnění?

Jak spát ty zatracený formuláře, ExtJS je mají krásně vyřešený i s validací, ale jak zautomatizovat validaci na straně serveru? Validaci asi řešit v modelu na straně serveru, protože v ExtJS se všechny data ženou přes Ext.data, které bombardují server požadavky. A odtud by se nejspíš měly vracet chyby. Je můj tok myšlenek správný?

Doufám, že už někdo aplikaci na ExtJS s Nette stavěl a bude ochoten poskytnout svoje zkušnosti.

Díky,
Honza Kuchař

Honza Kuchař

Hmm, evidentně ne.
Takže se zeptám jinak. Stavěl už někdo aplikaci tak, že měl na straně serveru jen modely, které měly za úkol posílat data modelům u klienta? (to se vlastně týká i třeba nějakých služeb přes XML-RPC) Jde mi hlavně o to, jak řešíte oprávnění?

FOUS

To už jsem se chtěl zeptat i já, jestli se připravuje nějaká servisní vrstva pro komunikaci s externími systémy (webovými službami). Nebo přilinkovat Zendovské věci? Např. SOAP klient skrzva WSDL file.

Honza Kuchař

vrstvy nejsou.

Ondrej

honzakuchar napsal(a):

Hmm, evidentně ne.
Takže se zeptám jinak. Stavěl už někdo aplikaci tak, že měl na straně serveru jen modely, které měly za úkol posílat data modelům u klienta? (to se vlastně týká i třeba nějakých služeb přes XML-RPC) Jde mi hlavně o to, jak řešíte oprávnění?

Delal jsem RIA aplikaci ve Silverlight, kde backend byl v Nette. Z Nette jsem vyuzil pouze jeden presenter, ktery komunikoval s modelem. Cely pristup je pres webovou sluzbu protokolem SOAP. Autentizaci jsem resil metodou login() a uzivateli vratil nejake interni session, ktere posilal v kazdem dalsim pozadavku, takze lze pak resit autorizaci v modelu.
V ExtJs bych zvolil Netteovskou autentizaci, protoze pres AJAX se bude posilat klasicke session id v cookies.

FOUS

Myslel jsem spíš něco o čem mluví tady:
http://zdrojak.root.cz/…ne-poznamky/

Honza Kuchař

@Ondrej: Diky. Právě jsem si nebyl jistý s tím jedním presenterem. Pak sem napíšu, až na tom budu nějak víc dělat, na co přijdu.

Ola

Ahoj, mám v plánu taky vyzkoušet si psaní administrace v Ext JS – narazil jsem na http://www.extjs.com/…ner-preview/, což by se Ti možná mohlo hodit. Zkoušel už si v tom něco dělat?

Mimochodem, je vůbec třeba validace na serveru? Napadá mě jedině, že bych se přihlásil přes Ext JS interface a až pak odesílal POST požadavky na server, proč by to ale dělal někdo z administrátorů s nejvyšším oprávnením? Ext JS by to mělo ošetřit samo – bez JS se app nespustí, je jen potřeba řešit autorizaci.

Díky

Editoval Ola (29. 1. 2010 17:52)

Honza Kuchař

Ahoj.

narazil jsem na http://www.extjs.com/…ner-preview/, což by se Ti možná mohlo hodit. Zkoušel už si v tom něco dělat?

Alespoň zatím je to opravdu jen DESIGNER. Tzn. výstup z něho je obrázek. Ale mají v plánu z toho udělat i generátor kódu.

Začal jsem tím, že jsem si koupil knihu a to tuto: http://www.manning.com/garcia/ „Ext JS in Action“. Po přečtení (teda ještě není napasaná poslední kapitola), jsem dospěl k názoru, že ExtJS je to co jsem hledal. Používá komponentový model jako Nette. Není knihovna na pouhé oxichtování, ale řeší si i modely. Jediné mínus jsem našel v tom, že na něho zatím neexistují konektory na Nette. Ale do toho už jsem se pustil. Momentálně dělám na konektoru DibiDataSource → Ext.data.Store. Šlape to jako hodinky (alespoň zatím).

Mimochodem, je vůbec třeba validace na serveru?

To asi záleží co je to za data. Pokud potřebuji mít od každého člověka platný e-mail a on pošle prázdný, tak by se to nemělo uložit. Na tohle plánuji také něco udělat. Ale zatím nevím o nějaké přesně podobě. Něco na styl Nette/Forms, které vygenerují jednotlivé políčka + FormPanel do JS proměných. Poté si to v tom FormPanelu uspořádám pomocí fieldsetů a containerů podle libosti. Něco jako Nette\Template.

Napadá mě jedině, že bych se přihlásil přes Ext JS interface a až pak odesílal POST požadavky na server, proč by to ale dělal někdo z administrátorů s nejvyšším oprávnením?

To jsem si říkal taky. V té mé aplikaci se pohybují uživatelé s různými rolemi. Ale nejspíš si to taky komplikovat nebudu. Stejně jediné validační pravidlo tak mám, že projekt musí mít jméno.

Ext JS by to mělo ošetřit samo – bez JS se app nespustí, je jen potřeba řešit autorizaci.

To je věc další. Nějakým způsobem je potřeba, aby se ale informace o té autentizaci přenesly i ke klientovi. Protože potřebuji, aby se mi v jednom formuláři nezobrazovali některým lidem, některá políčka. Napadá tě něco? Mě akorát nějaký export oprávnění do pole a to pole potom přenést ke klientovi a napsat si tam nějakou fci, která bude v tom poli hledat a podle toho upravovat formulář.

Teďka bych se rád zeptal tebe, napsal sis už nějaký konektor Ext.Direct → Nette? (jen čistě teoreticky, abych to nepsal taky a ty už jsi to měl hotové)

P.S.: Omlouvám se za dlouhý příspěvek.

Ola

Ahoj, zatím jsem žádný konektor s Nette nepsal, zatím jsem ani s Ext JS nic nezkoušel – pouze se mi zalíbilo jako vhodný prostředek pro tvorbu administrace jednoho projektu. Díky za informace a za odkaz na tu knihu, kouknu na to.

Honza Kuchař

Pokud máš zájem, tak až si to nastuduješ, tak můžeme spojit síly na ty konektory.

Ola

Já sem hlavně furt na vážkách jestli to postavit na ExtJS nebo ne – původně jsem hledal design na administraci, pak sem si vzpomněl na ExtJS že o něm tady mluvilo .. Nejsem si úplně jistý, zda-li ho opravdu použít – ulehčí spoustu práce (obzvlášť komponenty jako EditableGrid, ty formuláře (mlask!), využil bych asi i grafy (původně jsem zvažoval tam dát grafy z analytics API) a další komponenty.

Na druhou stranu, psát tunu javascriptu (jenom na UI) se mi zrovna nechce, ten designer zatím opravdu umí jen export do obrázku, pokud by uměl generovat kód, ExtJS by asi bylo/a jasná volba – údajně ho ale chtějí zpoplatnit – asi se tedy rozhodnu podle jeho ceny.

Jak to vidíš Ty s tím množstvím kódu jen pro UI?

Mimochodem, hledal jsem pár projektů (CMS) postavených pod ExtJS:

http://85.17.135.135/…ects/extcms/
http://www.archipel-cms.com/ (Symfony & ExtJS CMS)
http://fengoffice.com/web/index.php
http://www.pagebakery.org/ (CakePHP, fuj)
http://extjs.net/…owthread.php?… (ČESKY!)

pokud najdu další doplním je

Editoval Ola (30. 1. 2010 10:52)

Honza Kuchař

Není to vůbec tak hrozné. Musíš si ten projekt vhodně dělit. (jako u Nette) Ja to mám přibližně takhle:

/app/ - zde je všechno od Nette
/documnent_root/
/documnent_root/js/
/documnent_root/js/ExtJS/
/documnent_root/js/app/ <-- Sem dávám jedntlivé části aplikace
/documnent_root/js/app/form/ <-- Adresářová struktura kopíruje namespace v ExtJS
/documnent_root/js/app/form/Zakazka.js
/documnent_root/js/app/form/Projkt.js
/documnent_root/js/app/grid/
/documnent_root/js/app/window/
/documnent_root/js/app/store/
libs/ - knihovny Nette

To vytváření vlastních objektů funguje na principut extendování. A potom když chceš nové okno, tak píšeš něco na styl:

vra mywin = new MyApp.Window.Projekt()
mywin.show();

Ty jednotlivé komponenty zasouváš všelijak do sebe – stejně jako v Nette.

No a o načítání těch JS komponnt se stará WebLoader do kterého se ty soubory přidávají automaticky. Tzn. na produkčním serveru se mi to sobory automaticky zminifikují.

Honza Kuchař

P.S.: V podstatě s ExtJS více méně akorát konfiguruješ komponenty. Skoro nic neprogramuješ.

Ola

Ok díky, ještě si zkusím pročíst dokumentaci.

Koukni na to český cms, vypadá překrásně (byť je placený :D), mají tam screencasty:
http://www.cloudia.cz/

Honza Kuchař

Ta cloudia vypadá opravdu úžasně!

Ola

Je to snad jedinej CMS co sem našel v češtině kterej používá ExtJS :) Ale o to je lepší :)

lactarius

Ahoj,

na vidinu přepychové administrace v Ext už jsem se nevydržel jenom koukat – zkouším to. Funguje to – dokonce tím způsobem, že skript linkuju do šablony, načež skript komunikuje s handlem v presenteru – ale v tu chvíli přestanou platit proměnný mimo ten handle – problém se jmennými prostory ?
Nějak takhle – skript postne příkaz ‚getlist‘ a handle ho přijme:

public function handleExtServer($task)
{
	switch ($task) {
		case 'getlist':
			$rowset = dibi::fetchAll("SELECT * FROM $this->table");
			$this->payload->total = count($rowset);
			$this->payload->results = $rowset;
			break;
		default:
			$this->payload->failure = TRUE;
			break;
	}
	$this->terminate(new JsonResponse($this->payload));
}

Ta proměnná $table je prázdná…