Nilalaman
- 01. Mga Bar (.ui-bar-?)
- 02. Mga bloke ng nilalaman (.ui-body-?)
- 03. Mga pindutan at listview (.ui-btn-?)
- 04. Paghahalo at pagtutugma ng mga swatch
- 05. Ang aktibong estado ng buong site
- 06. Mga default na icon
- 07. Lumilikha at gumagamit ng isang pasadyang tema
- 08. Ano ang ThemeRoller?
- 09. Paggamit ng ThemeRoller
- 10. Pag-preview
- 11. Kulay
- 12. Inspektor
- 13. Mga kasangkapan
- 14. Lumilikha ng isang tema para sa Notekeeper
- 15. Pag-export ng iyong tema
- Kailangan ng kaalaman: HTML, ilang CSS at JavaScript
- Kinakailangan: Walang hihigit sa iyong paboritong HTML editor at isang browser
- Oras ng Proyekto: Dalawang oras
- Suporta ng file
Ito ay isang na-edit na sipi mula sa Kabanata 11 ng jQuery Mobile Web Development Essentials, na inilathala ng Packt Publishing.
Ang pag-arte sa jQuery Mobile ay prangka at simpleng gagamitin para sa developer, ngunit medyo detalyado sa likod ng mga eksena. Sa kabutihang palad ay bihirang magkakaroon ng isang oras kung kailan kailangan mong malaman ang lahat ng ginagawa para sa iyo. Gayunpaman, ito ay nagkakahalaga ng kaunting bahagi ng aming oras upang maunawaan kung paano ito gumagana.
Sa labas ng kahon ang jQuery Mobile ay mayroong isang hanay ng tema na binubuo ng limang mga swatch ng kulay, bawat isa ay naiugnay sa isang liham mula sa A-E. Naglalaman ang tema ng isang serye ng mga batayang klase ng CSS na maaaring mailapat sa kalooban sa halos anumang elemento at naglalaman ang mga ito ng pandaigdigang setting para sa lapad, taas, border radius, mga anino. Naglalaman ang mga indibidwal na swatch ng tukoy na impormasyon tungkol sa kulay, mga font, at iba pa.
Ang mga karagdagang swatch ay maaaring idagdag sa limang orihinal na swatch mula sa F-Z, o ang orihinal na swatch ay maaaring mapalitan o ma-override sa kalooban. Pinapayagan ng sistemang ito para sa isang kabuuang 26 magkakaibang mga swatch, na nagbibigay-daan para sa milyun-milyong mga posibleng kumbinasyon ng mga kulay ng tema, estilo, at pattern. Nag-apply ka ng isang jQuery Mobile na tema sa napiling elemento sa pamamagitan ng pagdaragdag ng isang katangian ng data-tema na may titik ng nais na tema:
Pangkalahatang pipiliin ng mga developer na gamitin ang pamamaraan ng pagpapatungkol sa tema ng data kapag naglalagay ng mga istilo, ngunit posible ring idikit nang direkta ang mga pangalan ng klase ng CSS sa mga elemento ng iyong pahina para sa higit na kontrol ng butil Mayroong isang dakot ng pangunahing mga unlapi na nagbibigay-daan para sa kakayahang umangkop na ito.
01. Mga Bar (.ui-bar-?)
Karaniwang inilalapat ang unlapi ng bar sa mga header, footer, at iba pang mga lugar na may mataas na kahalagahan:
02. Mga bloke ng nilalaman (.ui-body-?)
Ang mga bloke ng nilalaman ay karaniwang inilalapat sa mga lugar kung saan inaasahang magaganap ang teksto ng talata. Ang kulay nito ay tumutulong upang matiyak ang maximum na kakayahang mabasa sa kulay ng teksto na inilagay laban dito:
03. Mga pindutan at listview (.ui-btn-?)
Ang mga pindutan at listview ay dalawa sa pinakamahalagang elemento sa jQuery Mobile library at makakasiguro ka na ginugol ng koponan ang kanilang oras upang maayos ang mga ito. Kasama rin sa unlapi ng .ui-btn ang mga istilo para sa pataas, pababa, pag-hover, at mga aktibong estado:
04. Paghahalo at pagtutugma ng mga swatch
Ang isa sa magagandang bagay tungkol sa pag-tema sa jQuery Mobile ay ang mga elemento ng bata na nagmamana mula sa kanilang magulang maliban kung tinukoy. Nangangahulugan ito na kung maglalagay ka ng isang pindutan nang walang sarili nitong katangian ng data-tema sa loob ng isang header o footer bar, ang pindutang iyon ay gagamit ng parehong tema tulad ng magulang nito. Masama eh?
Perpektong katanggap-tanggap din ito, at hinihikayat din, na maglagay ng isang elemento na gumagamit ng isang swatch at ang bata ng isang elemento na gumagamit ng isa pang swatch. Matutulungan nito ang elemento na higit na matago, o tumugma sa ibang bahagi ng app, o anumang pangangatuwiran na pipiliin ng developer. Posible, at higit pa madali ito. Maglagay lamang ng isang pindutan (o iba pang elemento) sa loob ng isang header bar, at italaga ito sa sarili nitong katangian ng data-tema:
05. Ang aktibong estado ng buong site
Nalalapat din ang jQuery Mobile ng isang pandaigdigang aktibong estado para sa lahat ng mga elemento. Ginagamit ang aktibong estado na ito para sa mga pindutan, elemento ng form, nabigasyon, at saanman may pangangailangan na ipahiwatig na may isang bagay na kasalukuyang napili. Ang tanging paraan lamang upang baguhin ang halagang kulay na ito ay upang itakda (o i-override) ito sa pamamagitan ng CSS.Ang klase ng CSS para sa aktibong estado ay, naaangkop na pinangalanan, .ui-btn-active:
06. Mga default na icon
Kasama sa set ng jQuery Mobile ay 18 mga icon na sumasakop sa isang malawak na hanay ng mga pangangailangan para sa mga developer. Ang set ng icon ay puti sa transparent na aling jQuery Mobile ang overlay sa isang semi-transparent na itim na bilog upang magbigay ng kaibahan laban sa lahat ng mga swatch. Upang magdagdag ng isang icon, tukuyin ang katangian ng data-icon na may pangalan ng nais na icon:
Nagbibigay din ang jQuery Mobile ng kakayahang maglagay ng mga icon sa itaas, kanan, ibaba, o kaliwang bahagi ng isang pindutan gamit ang katangiang data-iconpos = "[itaas, kanan, ibaba, kaliwa]", na may kaliwang default na pagkakalagay. Nagagawa ring ipakita ng mga developer ang isang icon na nag-iisa, nang walang teksto, sa pamamagitan ng pagtukoy ng data-iconpos = "notext":
Ang pag-deploy ng mga pasadyang icon ay posible at saklaw din sa ibang pagkakataon sa kabanatang ito.
07. Lumilikha at gumagamit ng isang pasadyang tema
Napag-usapan na namin kung gaano kalakas ang tema sa jQuery Mobile. Ginagawa nitong walang halaga upang makabuo ng isang rich mobile website na may simple at matikas na istilo. Kahit na mas malakas ay ang kakayahang lumikha ng iyong sariling silid-aklatan ng mga swatch na maaaring magamit upang gawing tunay na natatangi ang iyong aplikasyon o website. Ang pagbuo ng iyong sariling tema ay maaaring lapitan sa isa sa mga sumusunod na dalawang paraan:
- I-download at buksan ang mayroon nang jQuery Mobile CSS file at i-edit sa nilalaman ng iyong puso.
- Ituro ang iyong web browser sa ThemeRoller para sa jQuery Mobile.
Magtutuon lamang kami sa pagpipilian dalawa sapagkat maging matapat tayo, bakit pinapasa ang lahat ng CSS na iyon kung maaari mong ituro, i-click, at i-drag ang iyong paraan sa isang bagong tema, na puno ng mga swatch sa loob ng 10 minuto? Alamin natin kung ano ang tungkol sa ThemeRoller.
08. Ano ang ThemeRoller?
Ang ThemeRoller para sa jQuery Mobile ay isang extension ng isang web-based na app na nakasulat para sa proyekto ng jQuery UI. Pinapayagan ang mga gumagamit na mabilis na magtipun-tipon ng isang tema na puno ng mga swatch sa ilang minuto gamit ang pamamahala ng kulay na drag-and-drop. Nagtatampok ito ng isang interactive na preview upang agad mong makita kung paano nakakaapekto ang iyong mga pagbabago sa iyong tema. Mayroon din itong built-in na tool ng inspektor na makakatulong sa iyong maghukay ng mga detalye ng minuto (kung nais mo sila). Nagsasama rin ito sa Adobe® Kuler®, isang tool sa pamamahala ng kulay. Maaari mong i-download ang iyong tema pagkatapos mong magawa, maaari mo itong ibahagi sa iba sa pamamagitan ng isang pasadyang URL, at maaari mong muling i-import ang mga nakaraang tema para sa huling pag-tweak. Ito ay isang malakas na tool at perpektong pandagdag sa jQuery Mobile.
Ang isa sa mga tanda ng limang default na swatch ay ang ginugol ng koponan ng jQuery Mobile ng kaunting oras sa pagtatrabaho sa kakayahang mabasa at magamit. Ang mga swatch ay mula sa pinakamataas na kaibahan (A), hanggang sa pinakamababang pagkakaiba (E). Sa loob ng iisang tema ang mga lugar na mayroong higit na kaibahan ay ang mga lugar na pinakatanyag sa pahina. Kasama rito ang header (at mga listview na header), at mga pindutan. Kapag lumilikha ng iyong sariling tema magandang ideya na isipin ito. Palagi naming nais na mag-focus sa kakayahang magamit sa loob ng aming app di ba? Ano ang buti ng isang makinis na app kung walang makakabasa nito dahil sa hindi magandang pagpili ng kulay?
09. Paggamit ng ThemeRoller
Ang unang bagay na makikita mo kapag na-load mo ang ThemeRoller ay isang makinis na hitsura ng splash screen, na sinusundan ng isang kapaki-pakinabang na pagsisimula ng screen:
Ang screen ng Pagsisimula ay may ilang mga kapaki-pakinabang na tip kaya tiyaking sulyapin ito bago i-click ang pindutang Get Rolling:
Matapos ang lahat ng mga splash screen ay wala sa paraan na maipakita sa iyo ang pangunahing interface:
Ang ThemeRoller ay pinaghiwa-hiwalay sa apat na pangunahing mga lugar: Preview, Kulay, Inspektor at Mga Tool. Ang bawat isa sa mga ito ay naglalaman ng mahalagang pagpapaandar na kailangan nating suriin. Magsisimula kami sa seksyong Preview.
10. Pag-preview
Maliban kung naglo-load ka ng isang mayroon nang tema, magpapakita ang lugar ng preview ng tatlong kumpleto, magkapareho at interactive na mga pahina ng Mobile na jQuery na naka-pack na may mga widget ng lahat ng uri:
Ilipat ang iyong mouse sa kanila at makikita mo na gumagana ang bawat pahina. Ang header sa bawat pahina ay naglalaman ng isang titik na nagpapahiwatig kung aling swatch ang kumokontrol sa hitsura nito.
11. Kulay
Sa tuktok ng pahina makikita mo ang isang serye ng mga color chip, kasama ang dalawang mga kontrol ng slider at isang pindutan ng toggle. Dagdag sa kanan, makakakita ka ng isa pang sampung mga chips ng kulay na dapat blangko. Ito ay nakatuon sa mga kamakailang nagamit na kulay at walang laman hanggang napili mo ang isang kulay:
Sa ibaba ng mga chips ng kulay ay may dalawang mga slider na may label na Lightness at saturation. Inaayos ng slider ng ilaw ang ilaw at madilim na mga tono ng serye ng mga swatch ng kulay, habang ang saturation ay gumagawa ng mga kulay nang higit pa, o mas kaunti, masigla. Pinagsama, dapat ma-approximate ng isang gumagamit ang halos anumang kulay na pipiliin nila. Upang magamit ang mga kulay mula sa Kuler, i-click ang link ng teksto na minarkahan ang mga swatch ng Adobe Kuler.
Ang bawat isa sa mga chips ng kulay ay maaaring ma-drag papunta sa anumang elemento sa loob ng lugar ng preview. Ginagawa nitong napakadali ng pagbuo ng isang swatch set. Tandaan na marami sa mga istilong jQuery Mobile ay nagsasapawan, halimbawa, ang header bar sa tuktok ng pahina ay tumatanggap ng parehong estilo tulad ng header ng listview. Ayusin ang mga kulay ayon sa ninanais pagkatapos ay i-drag ang bawat maliit na tilad sa isang elemento sa pahina. Tandaan na ang bawat indibidwal na pahina ay may sariling swatch kaya't mag-ingat tungkol sa kung paano mo pipiliin ang paghalo ng mga kulay.
12. Inspektor
Sa dulong kaliwa ng interface ay ang inspector panel, nahahati sa dalawang bahagi. Naglalaman ang nangungunang bahagi ng mga pindutan na pinapayagan ang mga developer na mag-download ng kanilang tema, mag-import ng isang mayroon nang tema, at magbahagi ng isang link sa kanilang tema. Mayroon ding isang link ng Tulong para sa mga taong hindi bumili ng librong ito:
Ang ilalim na seksyon ay naglalaman ng isang serye ng mga tab na may label na Global, A, B, C, at +. Ang bawat isa sa mga tab na ito ay nagtataglay ng isang panel ng akordyon na naglalaman ng lahat ng mga halaga para sa isang indibidwal na swatch, maliban sa tab na Global na nalalapat sa lahat ng mga swatch.
Piliin ang tab na Global, pagkatapos ay i-click ang Aktibong Estado, at ang akordyon na panel ay lalawak upang ipakita ang mga setting para sa aktibong estado para sa iyong buong tema. Kasama sa mga pagpipilian ang kulay ng teksto, anino ng teksto, background, at hangganan. Ang pagbabago ng isang halaga sa pandaigdigang sanhi ng bawat kasalukuyang (at hinaharap) swatch na sumasalamin sa bagong setting.
Ang mga karagdagang swatch ay maaaring idagdag sa iyong tema sa dalawang paraan. Ang pag-click sa tab na + sa tuktok ng inspektor ay nagdaragdag ng isang bagong swatch sa huling lugar sa iyong tema. Maaari ka ring magdagdag ng isang bagong swatch sa pamamagitan ng pag-click sa pindutang Idagdag ang Swatch na matatagpuan sa ilalim ng lugar ng preview. Maaaring tanggalin ang mga swatch sa pamamagitan ng pagpili sa tab na may swatch na nais mong alisin, pagkatapos ay i-click ang Tanggalin ang link na matatagpuan sa kanan ng swatch na pangalan. Tandaan na ang pagtanggal ng isang swatch mula sa tuktok ng stack ay magiging sanhi ng pagpapalit ng pangalan ng natitirang mga swatch.
13. Mga kasangkapan
Sa tuktok ng pahina ay may isang serye ng mga pindutan. Pinapayagan ka ng mga pindutan na ito na magsagawa ng iba't ibang mga gawain na sasakupin namin sa isang sandali, ngunit una, tingnan nang mabuti ang mga pindutan mismo:
Mapapansin mo ang mga sumusunod na pindutan: isang switch na nagpapahintulot sa iyo na magbago sa pagitan ng 1.1 (kasalukuyang) Bersyon at ang Bersyon ng 1.0.1, i-undo / gawing muli, at isang pindutan ng toggle para sa inspektor. Ang pagtatakda ng toggle na ito sa on ay nagbibigay-daan sa iyo upang siyasatin ang anumang widget sa lugar ng preview. Ang pag-hover sa isang widget ay nagha-highlight sa sangkap na iyon sa isang asul na kahon. Ang pag-click sa elemento ay magiging sanhi ng menu ng akordyon sa lugar ng Inspektor upang mapalawak upang ipakita ang mga setting na tukoy sa elementong iyon.
Mayroong apat na karagdagang mga pindutan na nagbibigay-daan sa iyo upang i-download ang iyong tema, mag-import o mag-upgrade ng dating nilikha na tema, ibahagi ang iyong tema sa iba, at isang pindutan ng tulong.
14. Lumilikha ng isang tema para sa Notekeeper
Ngayong pamilyar tayo sa interface ng ThemeRoller, paano pa rin tayo magpatuloy at lumikha ng aming unang tema? Sa halip na bumuo ng isa sa abstract, gumawa tayo ng isa na talagang gagamitin natin para sa Notekeeper app na itinayo namin kanina. Magsimula lamang tayo sa pamamagitan ng pagbabago ng isa sa mga mayroon nang mga tema na naipadala sa jQuery Mobile. Mabait ang koponan upang pahintulutan ang mga gumagamit na i-import ang mga default na tema bilang panimulang lugar para sa mga bagong tema, kaya doon muna kami magtutungo. I-click ang pindutang I-import sa kaliwang tuktok ng window at makakakuha ka ng isang kahon na nagbibigay-daan sa iyo upang i-paste ang mga nilalaman ng isang mayroon nang tema:
I-import ang default na tema sa pamamagitan ng pag-click sa link sa kanang sulok sa itaas, naaangkop na may pamagat na Na-import na Default na Tema. Matapos mapunan ang CSS ng textarea, i-click ang I-import. Ang lugar ng preview ay muling i-load at ipapakita ang mga swatch mula sa A hanggang E.
Ituon namin ang aming mga pagsisikap sa pagbabago ng puting swatch, D, dahil ito ang pinakamalapit sa kung ano ang aming layunin sa pagtatapos. Dahil mas gugustuhin naming gamitin ang swatch A bilang ang pangalan, tanggalin natin ang iba pang mga swatch upang ang D lamang ang natitira. Tandaan na pinalitan ng pangalan ng ThemeRoller ang mga swatch dahil ang iba ay tinanggal. Nangangahulugan iyon kapag tinanggal mo ang swatch A, ang B ay naging A, ang C ay naging D, at iba pa.
Patuloy na magpatuloy hanggang sa ang swatch na D ay nasa posisyon na A. Sa wakas, tanggalin ang swatch B (na dating swatch E) upang ang natitira lamang ay ang swatch A:
Ang swatch na ito ay maganda ang hitsura ngunit ito ay isang maliit na mura. Mag-iniksyon tayo ng isang maliit na kulay sa pamamagitan ng pagbabago ng header sa isang magandang berde. Ang pinakasimpleng paraan upang matukoy kung anong mga halaga ang dapat baguhin para sa anumang elemento ay ang paggamit ng inspektor. I-toggle ang inspektor sa Bukas sa tuktok, pagkatapos ay mag-click saanman sa header ng tema A. Malalaman mo kung nakuha mo ito nang tama kung ang tab na A ay napili sa kaliwa, at ang panel ng Header / Footer Bar ay lumalawak:
Maaari mong baguhin ang kulay sa isa sa ilang mga paraan. Maaari mong i-drag ang isang kulay na chip mula sa itaas nang direkta papunta sa background. Maaari mo ring i-drag ang isang color chip sa isang input field. Panghuli maaari mong manu-manong i-input ang halaga. Pansinin na kapag nag-click ka sa isang patlang na naglalaman ng isang halaga ng kulay bibigyan ka ng isang makinis na tagapili ng kulay. Sige at baguhin ang mga halaga sa mga patlang ng pag-input sa panel na ito sa mga halagang ipinakita sa nakaraang screenshot.
Maganda, ngunit ngayon ang asul mula sa aktibong estado ng tema ay nag-aaway sa aming berde. Gamit ang tool ng inspektor, mag-click nang isang beses sa seksyon na Bukas ng toggle bar na On / Off. Ito ay maaaring maging sanhi ng panel ng Aktibong Estado sa loob ng tab na Global upang mapalawak. Papalitan namin ang asul sa isang magandang maligamgam na kulay-abo. Ang panel ng Global ay dapat magmukhang katulad sa sumusunod na screenshot:
Mayroon lamang isang bagay na pinapanatili ang aming bagong tema mula sa pagtingin sa pinakamainit, ang asul na link ng teksto sa talata sa tuktok. Bumalik sa aming mapagkakatiwalaang inspektor, direktang mag-click sa link na magpapalawak sa panel ng Nilalaman ng nilalaman sa loob ng tab na A. Ngayon, para sa mga pamilyar na sa CSS alam mo na hindi mo mapapalitan nang simple ang kulay ng link nang hindi binabago din ang pag-hover, binisita: magpasadya, at mga aktibong estado. Ang problema ay walang mga pagpipilian upang magawa ang mga pagbabagong iyon, ngunit sakop ka ng ThemeRoller. I-click ang + sa kanan ng patlang ng pag-input ng Kulay ng Link upang ipakita ang natitirang mga pagpipilian, pagkatapos ay baguhin ang mga kulay, tulad ng ipinakita sa sumusunod na screenshot:
At iyon iyon. Huwag mag-atubiling gumawa ng mga karagdagang pagbabago sa iyong tema sa iyong paggalugad sa lugar ng inspektor. Baguhin ang anumang gusto mo, mga piraso at byte lang ito ngayon. Tandaan na kahit na walang pagpipilian sa pag-undo sa oras. Kung talagang may gusto ka, isaalang-alang ang pagsusulat ng mga halaga upang hindi mo mawala ang mga ito o mai-export ito tulad nito. Nagsasalita ng ...
15. Pag-export ng iyong tema
Bago namin talaga i-export ang aming tema mayroong isang bagay na dapat pansinin. Naaalala mo ang splash page na may impormasyon na "kapaki-pakinabang"? Lumalabas na mayroong isang piraso na hindi isang rekomendasyon, ngunit isang kinakailangan.
Inirerekumenda namin ang pagbuo ng mga tema na may hindi bababa sa 3 swatch (A-C).
Upang mailapat nang maayos ang aming tema sa aming Notekeeper app kakailanganin naming madoble ang aming solong swatch (titik A) sa swatch B at C. Sa kabutihang-palad ito ay isang madaling bagay na dapat gawin. Piliin ang tab na A sa tuktok ng inspektor, pagkatapos ay i-click ang tab na + ng dalawang beses. Ang dapat mong makita ay tatlong magkatulad na swatch, at ngayon tapos na kami.
Ngayong natapos na namin ang aming tema i-export namin ito para magamit sa aming application na Notekeeper. Ito ay isang prangka na proseso na nagsisimula sa pamamagitan ng pag-click sa pindutang I-download ang Tema na matatagpuan sa gitna ng pahina, sa tuktok ng interface. Bibigyan ka ng isang kahon na nagpapahintulot sa iyo na pangalanan ang iyong tema, ilang impormasyon tungkol sa kung paano ilapat ang iyong tema, at isang pindutan na may label na Download Zip. Matapos mapangalanan ang aming tema na Tagapag-alaga, i-click ang pindutang Mag-download Zip at makakatanggap ka ng isang masarap na maliit na piraso sa iyong folder ng mga pag-download.
I-extract ang mga nilalaman ng ZIP file at makikita mo ang sumusunod na istraktura ng direktoryo:
- index.html
- mga tema / Notekeeper.css (Ang hindi naka-compress na bersyon ng iyong tema) Notekeeper.min.css (Ang naka-compress na bersyon. Gamitin ito sa paggawa) mga imahe / ajax-loader.gif mga icon-18-black.png mga icon-18-puti.png mga icon -36-itim.png mga icon-36-puti.png
Ang HTML file sa tuktok ng puno ay naglalaman ng impormasyon tungkol sa kung paano ipatupad ang iyong tema, pati na rin ang ilang mga widget upang kumpirmahing gumagana ang tema. Ang lahat ng mga link ay kamag-anak sa halimbawang file, kaya dapat mong ma-drag ito sa anumang window ng browser at makita ang mga resulta.
Ilang tala tungkol sa pag-download at pagpapatupad ng mga tema:
1. Ang koponan ng jQuery ay nagbibigay ng mga icon para sa mga pindutan sa iyo sa ZIP file na ito para sa isang kadahilanan. Kinakailangan ng tema ang mga imaheng iyon na maging kamag-anak sa CSS file. Nangangahulugan ito na maliban kung gumagamit ka na ng mga default na tema kailangan mo ring isama ang folder ng mga imahe kapag na-upload mo ang iyong tema sa iyong website o hindi lalabas ang mga icon.
2. Mag-hang sa hindi naka-compress na bersyon ng iyong tema. Habang hindi mo nais na gamitin ito sa paggawa dahil sa laki, kakailanganin mo ito kung nais mong i-edit ito sa loob ng ThemeRoller. Hindi maaaring i-import ng ThemeRoller, sa oras ng pagsulat na ito, ang na-minimize na CSS file.
Si Andy Matthews ay naging isang developer ng aplikasyon nang higit sa 16 na taon at may mga kasanayan sa UI / UX, graphic design, at programa. Siya ay isang tagapagsalita, open source developer, at siya ay nakatira sa Nashville, TN kasama ang kanyang pamilya. Siya ay @commadelimited sa Twitter.
Si Raymond Camden ay isang senior ebanghelista ng developer para sa Adobe. Ang kanyang trabaho ay nakatuon sa mga pamantayan sa web, mobile development at ColdFusion. Siya ay isang nai-publish na may-akda at nagpapakita sa mga kumperensya at mga pangkat ng gumagamit sa iba't ibang mga paksa. Sundin siya sa @cfjedimaster.
