import Ġkotlin ext . js . js o Ċ import Ġreact . dom .* Ċ import Ġkotlinx . browser . document Ċ import Ġkotlinx . html . currentTimeMillis Ċ import Ġkotlinx . serialization . Serializable Ċ import Ġreact .* Ċ import Ġkotlin . js . Date Ċ Ċ @ Serializable Ċ data Ġclass ĠVideo ( ĊĠĠĠ Ġval Ġid : ĠInt , ĊĠĠĠ Ġval Ġtitle : ĠString , ĊĠĠĠ Ġval Ġspeaker : ĠString , ĊĠĠĠ Ġval Ġvideo Url : ĠString Ċ ) Ċ Ċ data Ġclass ĠWord Pair ( val Ġid : ĠInt , ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġval Ġword : ĠString , ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġval Ġmeaning : ĠString , ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġval Ġlevel : ĠInt Ġ= Ġ 0 , ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġval Ġtotal Reviews : ĠInt Ġ= Ġ 0 , ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġval Ġinsert Time : ĠDate Ġ= ĠDate ( currentTimeMillis ()), ĊĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġval Ġcategory Id : ĠInt Ġ= Ġ- 1 Ċ ) Ċ Ċ data Ġclass ĠCategory ( val Ġid : ĠInt , Ġval Ġtitle : ĠString ) Ċ Ċ fun Ġ< P Ġ: ĠProps > ĠR Builder . child ( type : ĠElementType < P >, Ġcss : ĠString Ġ= Ġ"", Ġprops : ĠP Ġ= Ġj so (), Ġhandler : ĠR Handler < P >? Ġ= Ġnull ) Ġ{ ĊĠĠĠ Ġ// ĠTODO Ġfind Ġthe Ġbetter Ġway Ġto Ġadd Ġcss Ġclasses Ġto Ġthe Ġroot Ġelement Ġof ĊĠĠĠ Ġ// Ġthe Ġchild Ġwithout Ġa Ġneed Ġfor Ġan Ġextra Ġwrapper ĊĠĠĠ Ġspan ( css ) Ġ{ ĊĠĠĠĠĠĠĠ Ġchild ( type , Ġprops , Ġhandler ) ĊĠĠĠ Ġ} Ċ } ĊĊĊ Ċ fun Ġmain () Ġ{ ĊĠĠĠ Ġkotlin ext . js . require ("./ app . css ") ĊĠĠĠ Ġdocument . bgColor Ġ= Ġ" light blue " Ċ Ċ // ĠĠĠ Ġkotlin ext . js . require ("@ fortawesome / free - solid - svg - icons / index . js ") ĊĊĠĠĠ Ġdocument . getElementById (" root ") ?. let Ġ{ Ġroot Element Ġ-> ĊĠĠĠĠĠĠĠ Ġrender ( root Element ) Ġ{ ĊĠĠĠĠĠĠĠĠĠĠĠ Ġchild ( mem or izer App ) ĊĊĊ Ċ // ĠĠĠĠĠĠĠ Ġdiv (" flex Ġitem - center ") Ġ{ Ċ // ĠĠĠĠĠĠĠĠĠĠĠ Ġ+" Hello Ġworld !" Ċ // ĠĠĠĠĠĠĠ Ġ} Ċ // ĠĠĠĠĠĠĠ ĠBox Ġ{ Ċ // ĠĠĠĠĠĠĠĠĠĠĠ Ġattrs . sx Ġ= Ġj so Ġ{ Ċ // ĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġflex Grow Ġ= ĠFlex Grow ( 1 . 0 ) Ċ // ĠĠĠĠĠĠĠĠĠĠĠ Ġ} Ċ // ĠĠĠĠĠĠĠĠĠĠĠ ĠApp Bar Ġ{ Ċ // ĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ ĠToolbar Ġ{ Ċ // ĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ ĠTypography Ġ{ Ċ // ĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġattrs Ġ{ Ċ // ĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġvariant Ġ= Ġ" h 6 " Ċ // ĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ} Ċ // ĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ+" Word ĠMem or izer " Ċ // ĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ} Ċ // ĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġdiv (" justify - self - end ") Ġ{ Ċ // ĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġchild ( login ) Ċ // ĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ} Ċ // ĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ} Ċ // ĠĠĠĠĠĠĠĠĠĠĠ Ġ} Ċ // ĠĠĠĠĠĠĠ Ġ} Ċ Ċ // ĠĠĠĠĠĠĠ ĠGrid Ġ{ Ċ // ĠĠĠĠĠĠĠĠĠĠĠ Ġattrs . container Ġ= Ġtrue Ċ // Ċ // ĠĠĠĠĠĠĠĠĠĠĠ ĠGrid Ġ{ Ċ // ĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġattrs Ġ{ Ċ // ĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġitem Ġ= Ġtrue Ċ // ĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġxs Ġ= Ġ 8 Ċ // ĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ} Ċ // ĠĠĠĠĠĠĠĠĠĠĠ Ġ} Ċ // ĠĠĠĠĠĠĠ Ġ} Ċ // Ċ // Ċ // Ċ // ĠĠĠĠĠĠĠ Ġchild ( toolbar ) Ċ // Ċ // Ċ // Ċ // Ċ // ĠĠĠĠĠĠĠ Ġchild ( AppBar ) Ġ{ Ċ // ĠĠĠĠĠĠĠĠĠĠĠ ĠToolbar Ġ{ Ċ // ĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġchild ( logo ) Ċ // ĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġchild ( word Counter ) Ċ // Ċ // ĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġdiv Ġ{ Ċ // ĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġchild ( login ) Ċ // ĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ} Ċ // ĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġdiv (" flex Ġ") Ġ{ Ċ // ĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġchild ( signup ) Ċ // ĠĠĠĠĠĠĠĠĠĠĠĠĠĠĠ Ġ} Ċ // ĠĠĠĠĠĠĠĠĠĠĠ Ġ} Ċ // ĠĠĠĠĠĠĠ Ġ} ĊĊ Ċ // ĠĠĠĠĠĠĠ Ġp (" text - lg Ġbg - blue - 5 0 0 ") Ġ{ Ċ // ĠĠĠĠĠĠĠĠĠĠĠ Ġ+" Hello Ġworld !" Ċ // ĠĠĠĠĠĠĠ Ġ} Ċ Ċ // ĠĠĠĠĠĠĠ Ġchild ( app ) Ġthis Ġbe log Ġto Ġthe Ġdemo Ġapp ĊĠĠĠ Ġ} ĊĠĠĠ Ġ} Ċ } Ċ