Ndakanyora zvakawanda pamusoro   . Ndakanga ndine shungu zvokuti ndakanyora   pamusoro paro (kunze kweBhuku reVaadin),   yeVaadin 7, uye   . Zvakadaro, ndinoshamiswa kuti vanhu vazhinji vari munyika yeJVM havana kumbonzwa nezvazvo. paVaadin bhuku rekutanga shanduro yaro yakagadziridzwa webhusaiti inofambidzana nayo  Mune ino post, ndinoda kusuma Vaadin mumamiriro eAJAX uye SSR.  Sumo Ipfupi kuna Vaadin  Runako rweVaadin rwuri mukupfava kwayo -   . Unoverenga zvakanaka. Mugadziri weVaadin anongoda kuziva Java, kana chero mutauro weJVM, uye iyo Vaadin API. Panguva yekumhanya, Vaadin ichagadzira iyo mutengi-parutivi kodhi,   , HTML, JavaScript, uye CSS. Iyi nzira inopa simba vanogadzira kuti vatarise pane yakakosha kushanda kwechishandiso, zvichiita kuti hurongwa hwekuvandudza huwedzere kubereka. unongonyora backend code kureva  Vaadin inovaka pamusoro pezvikamu uye marongero, sezvakangoita desktop-yakavakirwa masisitimu anoita. Kana iwe uchiziva Swing kana JavaFX, iwe uchanzwa uri kumba chaiko.  Ndakataura CSS pamusoro: Vaadin inokubvumira kukudziridza CSS yako mune yakatsaurirwa reusable package inonzi   . Iyo icing pakike: kugadzira dingindira rinogona kuitwa nenzira yakafanana kune backend kusimudzira uye haina kutevedzera kune yekupedzisira; iyo kodhi haidi kushandisa chaiyo template kana kuwedzera chaiwo makirasi kuHTML. theme  Vaadin Setup  Kumisikidza Vaadin mumamiriro eSky Boot imhepo:   <project> <properties> <java.version>17</java.version> <kotlin.version>1.9.24</kotlin.version> <vaadin.version>24.4.9</vaadin.version>  </properties> <dependencyManagement> <dependencies> <dependency> <groupId>com.vaadin</groupId> <artifactId>vaadin-bom</artifactId>  <version>${vaadin.version}</version> <type>pom</type> <scope>import</scope> </dependency> </dependencies> </dependencyManagement> <dependencies> <dependency> <groupId>com.vaadin</groupId> <artifactId>vaadin-spring-boot-starter</artifactId>  </dependency> </project>  Seta iyo Vaadin vhezheni pamwe nezvimwe zvivakwa.  Chengetedza vhezheni yezvese zvinoenderana.  Wedzera iyo Vaadin Spring Boot yekubatanidza raibhurari.  Vaadin inovaka pane yakajairwa Java Servlet, iyo inomepu kumudzi nekukasira. Iyo Vaadin Spring Boot yekubatanidza inobvumira kudarika iyo default. Nekuti yedu codebase inosanganisa akawanda masisitimu, tinoimepu kune   kuburikidza neyakakodzera chivakwa: /vaadin   vaadin.url-mapping=/vaadin/*  Pachikumbiro chekutanga kubva kumutengi, Vaadin anodzosa kodhi yejini yeJavaScript. Injini ichaita zvikumbiro zvinotevera kuti idzore iyo UI yakagadziriswa uye scaffold iyo yekupedzisira mutengi wedivi. Kubva ipapo zvichienda mberi, injini inobata zvese zvemushandisi zvekushandisa uye inovandudza UI kana zvichidikanwa.  Matanho ekutanga naVaadin  Kana tangomisa purojekiti, tinofanira kugadzirisa chikamu chipi icho Vaadin chinoratidza kana inogamuchira chikumbiro.   @Route("/") //1 @PageTitle("Vaadin") //2 class TodoView(todos: ArrayList<Todo>) : VerticalLayout() { //3-4-5 init { //6 // ... //7 } }  Inobatanidza chikamu kune iyo Vaadin servlet   midzi. subcontext  Seta iyo static peji musoro. Kana iwe uchida zita rine simba, unogona kushandisa   . HasDynamicTitle  Tsanangura kirasi   . RootComponent    ikirasi iyo Vaadin inoshandura seHTML  VerticalLayout div  Iyo Vaadin Spring Boot starter inotarisira kupinza rondedzero.  Vaadin anoita iyo   basa pachikumbiro chekutanga chebrowser. init()  Iyo inotevera kodhi snippets ichaenda ikoko.  Kuwedzera Zvikamu  Mune snippet iri pamusoro, isu takagara nhaka kubva   ,   chakapihwa naVaadin. VerticalLayout chikamu  Iyo Vaadin Dhizaini System inosanganisira seti yezvikamu zvaunogona kushandisa kuvaka UI yako. Izvo zvikamu zvine server-side Java API kuwedzera kune TypeScript API yevatengi-parutivi kusimudzira.  Iwe unoshandisa chikamu nekutanga kuchigadzira uye wozochiwedzera kune chine marongero.  --  Kugadzira UI muVaadin Application  Zvimwe zvikamu zvinogona kuve nezvimwe, uye ivo vanoziva nzira yekuisa zvikamu zvavo kunze. Semuenzaniso,   inoisa zvikamu kubva kumusoro-kusvika-pasi mukoramu;   inovaisa kuruboshwe-ku-kurudyi mumutsara. VerticalLayout HorizontalLayout  Kuwedzera zvikamu kune dhizaini iri nyore:   add(Label("Hello")) //1 add(Label("world!"))    basa. init()  Kunyange izvi zvichishanda zvakakwana, tinogona kuvandudza mamiriro ezvinhu tichishandisa   sezvo isu tichishandisa Kotlin. Tinogona kunyora zvakare snippet iri pamusoro seinotevera: Karibu-DSL   label("Hello") //1 label("world!")    ndeye Karibu DSL yekuwedzera basa pane iyo   interface label() HasComponent  Karibu yakanaka, asi ine zvishoma pasi: haipe ekuwedzera mabasa eiyo API yese. Semuenzaniso, iwe unofanirwa kudonha kumashure kune yakajairwa API kuti uwedzere tsoka kune   chikamu: Grid   appendFooterRow().apply { getCell(completedProp).component = Button("Clean up") { todos.removeIf { it.completed } refresh() } }  Kudivi rekuwedzera, Karibu yakavhurika-sosi, uye iwe unogona kugara uchipa kana uine chimwe chinhu chekuwedzera.  Zvimwe zvinhu zvine chekuita neUI hazvina kukosha pakunzwisisa kwakawanda. Kana uchifarira, unogona kugara uchitarisa   . kunobva kodhi  Kudyidzana Kwemushandisi  Kana mainframes aive madzimambo ekombuta, waiwana kuburikidza nematerminals. Iyo UI yaive yakaganhurirwa, uye kupa kwakaitika pane "mbeveve" terminal. Makomputa ega ega akafambisa mashandiro ekupa kubva pasevha kuenda kumutengi. Panguva ino, vagadziri vakabatanidza maitiro kune chikamu kuburikidza ne trigger. Semuenzaniso, unogona kusunga kudhinda   kana mushandisi adzvanya bhatani. Hello world!  Mawebhusaiti akachinja paradigm iyi. Sezvakaratidzwa nezvinyorwa zvedu zvakapfuura, mepu yese yekudyidzana ikozvino kune yekukumbira-mhinduro kuyerera, inopindirana kana asynchronous. Vaadin inotidzosera kune yekutanga paradigm.   Checkbox(todo.completed).apply { //1 addValueChangeListener { todo.completed = it.value } //2 }  Tanga chinhu chitsva   chine kukosha. Checkbox  Kana kukosha kwebhokisi rekutarisa kuchichinja, ita lambda - isu tinoshandura kukosha kweiyo modhi.  Hapana chikonzero cheJavaScript kodhi; Vaadin anotarisira kupindirana akazvimiririra.  Mhedziso  Iyo posvo yaingove sumo pfupi kuna Vaadin mumamiriro eAJAX neSSR.  Vazhinji vanogadzira vanodzidza hurongwa pawebhu maapplication uye nekudaro vanoshandiswa kune yekukumbira-mhinduro modhi vanoita zvisina kunaka kana vakafumurwa kuVaadin. Nharo yavo huru ndeyekusavapo kweAPI. IMHO, ibhenefiti: mamwe maapplication, kunyanya bhizinesi maapplication, haashanduke kusvika padanho rauchazoda kuvandudza vakazvitsaurira nharembozha.  Vaadin inouya neiyo default CSS set, sezvakataurwa munhanganyaya. Iyi tema yakasarudzika inoita kuti Vaadin zvikumbiro zvinotaridzika zvakanaka kubva pakutanga, zvichipa vashandisi nzvimbo yakasununguka uye inotaridzika inoyevedza yebasa. Nekudaro, iwe unogona kugara uchibatanidza imwe kana kutogadzira yako.  Kubatsira chaiko, zvisinei, kunowanikwa zvakare pamwero wesangano. Muchikamu chekutanga, ndakataura kuti kupatsanura frontend uye backend kusimudzira kunogadzira nyaya panguva yekubatanidzwa kwavo. Nemhaka yokuti Vaadin haina kuparadzana kwakadaro, kuronga kweprojekti kunonyanya kufarirwa, sezvo pasina danho rekubatanidza pakati pekupedzisira uye kumashure. Saizvozvo, theming inogona kuitika mukufambirana nebudiriro.  Iyo yakazara sosi kodhi yeiyi positi inogona kuwanikwa paGitHub:   https://github.com/ajavageek/compare-frontends?embedable=true   Kuti uenderere mberi:   Vaadin   Chii chinonzi Flow?   More Vaadin   Yakatanga kuburitswa paA   musi waGumiguru 13, 2024 Java Geek

Read all my posts!

Read My Stories

Follow @nicolas_frankel on Twitter

Odhiyo iyi inogadzirwa mumutauro wekutanga wenyaya!

Zvaunoda Kuziva Nezve Vaadin - Iyo Bhatiri-Inosanganisirwa Server-Side AJAX Framework

About Author

MACOMMENTS

HONGA TAGS

NYAYA IYI YAKAPIWA MUNA

Related Stories

On the Position of Large Factories

Meet SNATIKA, Winner of HackerNoon's Startups of The Year 2024 in Training And Consulting

Forget Pepe and dogwifhat — Snek Is the Memecoin You've Been Waiting For

Snowdrop & Other Tales by Jacob Grimm and Wilhelm Grimm - Table of Links

On the Position of Large Factories

Meet SNATIKA, Winner of HackerNoon's Startups of The Year 2024 in Training And Consulting

Forget Pepe and dogwifhat — Snek Is the Memecoin You've Been Waiting For

Snowdrop & Other Tales by Jacob Grimm and Wilhelm Grimm - Table of Links

Light-Mode

Classic

Newspaper

Minty

Dark-Mode

Neon Noir

Minty

HN StartUps