"," expects a list of products (actually a JavaScript array). But currently the type of products is a\n",[119,963,964],{},"java.util.List"," which doesn’t have the map method. Note the datatype of products in the image below.",[18,967,968],{},[216,969],{"alt":970,"src":971},"nashorn-debugging","https://media.synyx.de/uploads//2016/03/nashorn-debugging.png",[618,973,974],{},[18,975,976],{},"“Given a Java array or Collection, this function returns a JavaScript array with a shallow copy of its contents”",[18,978,979,980,982],{},"So our renderServer function defined in ",[119,981,132],{}," must be extended to:",[18,984,985],{},"Now we’re ready to go 🙂",[18,987,988,989,992,993,998],{},"Rebuild the frontend with ",[119,990,991],{},"npm run build",", restart the Spring Boot application, reload ",[362,994,995],{},[22,996,181],{"href":181,"rel":997},[26]," and\nadmire our awesome product list.",[18,1000,1001],{},[216,1002],{"alt":1003,"src":1004},"awesome-product-list-001","https://media.synyx.de/uploads//2016/03/awesome-product-list-001.png",[36,1006,387],{"id":386},[56,1008,1009,1012,1018,1026],{},[44,1010,1011],{},"using Nashorn is no rocket science",[44,1013,1014,1015,1017],{},"load js files via ",[119,1016,705],{}," to enable debugging (at least in IntelliJ)",[44,1019,1020,1022,1023],{},[362,1021,964],{}," must be converted to JavaScript array with ",[119,1024,1025],{},"Java.from",[44,1027,1028],{},"manually rebuilding and reloading the ReactJS app sucks (autoreload would be cool, right)",[18,1030,1031],{},[216,1032],{"alt":1033,"src":1034},"js-webpack-nashorn","https://media.synyx.de/uploads//2016/03/js-webpack-nashorn.png",[36,1036,421],{"id":420},[56,1038,1039,1042],{},[44,1040,1041],{},"using webpack to enhance developer experience",[44,1043,1044],{},"implementing the sorting feature",[18,1046,1047],{},[99,1048,433],{},[435,1050,437],{},{"title":189,"searchDepth":203,"depth":203,"links":1052},[1053,1054,1055,1056,1057],{"id":38,"depth":203,"text":39},{"id":582,"depth":203,"text":495},{"id":599,"depth":203,"text":501},{"id":386,"depth":203,"text":387},{"id":420,"depth":203,"text":421},[447],"2016-03-11T11:29:12","This is the first article of a series about server side rendering and progressive enhancement. We will implement a\\nproduct list that can be sorted by two parameters. Furthermore the app will be progressively enhanced, means the html\\ndocument is rendered on the server and javascript will just enhance the app on the client if possible.","https://synyx.de/blog/springboot-reactjs-server-side-rendering/",{},"/blog/springboot-reactjs-server-side-rendering",{"title":469,"description":478},"springboot-reactjs-server-side-rendering","blog/springboot-reactjs-server-side-rendering",[459,460,461,462,463,464],"This is the first article of a series about server side rendering and progressive enhancement. We will implement a product list that can be sorted by two parameters. Furthermore the…","NgbG5R1prPK9EUbjPI1FYf4uauo9uWfYO5zNB_kSUvk",[1071,1074,1077,1080,1083,1086,1089,1092,1095,1098,1101,1104,1107,1110,1113,1116,1119,1122,1125,1128,1131,1134,1136,1139,1142,1145,1148,1150,1153,1156,1159,1162,1165,1168,1171,1174,1177,1180,1183,1186,1189,1192,1195,1198,1201,1204,1207,1210,1213,1216,1219,1222,1225,1228,1231,1234,1237,1240,1243,1246,1249,1252,1255,1258,1261,1264,1267,1270,1273,1276,1279,1282,1285,1288,1291,1294,1297,1300,1303,1306,1309,1312,1315,1318,1321,1324,1327,1330,1333,1336,1339,1342,1345,1348,1351,1354,1357,1360,1363,1365,1368,1371,1374,1377,1379,1382,1385,1388,1391,1394,1397,1400,1402,1405,1408,1411,1414,1417,1420,1423,1426,1429,1432,1435,1438,1441,1444,1447,1450,1453,1455,1458,1461,1464,1467,1470,1473,1476,1479,1482,1485,1488],{"slug":1072,"name":1073},"abel","Jennifer Abel",{"slug":1075,"name":1076},"allmendinger","Otto Allmendinger",{"slug":1078,"name":1079},"antony","Ben Antony",{"slug":1081,"name":1082},"arrasz","Joachim Arrasz",{"slug":1084,"name":1085},"bauer","David Bauer",{"slug":1087,"name":1088},"bechtold","Janine Bechtold",{"slug":1090,"name":1091},"boersig","Jasmin Börsig",{"slug":1093,"name":1094},"buch","Fabian Buch",{"slug":1096,"name":1097},"buchloh","Aljona Buchloh",{"slug":1099,"name":1100},"burgard","Julia Burgard",{"slug":1102,"name":1103},"caspar-schwedes","Caspar Schwedes",{"slug":1105,"name":1106},"christina-schmitt","Christina Schmitt",{"slug":1108,"name":1109},"clausen","Michael Clausen",{"slug":1111,"name":1112},"contargo_poetzsch","Thomas Pötzsch",{"slug":1114,"name":1115},"damrath","Sebastian Damrath",{"slug":1117,"name":1118},"daniel","Markus Daniel",{"slug":1120,"name":1121},"dasch","Julia Dasch",{"slug":1123,"name":1124},"denman","Joffrey Denman",{"slug":1126,"name":1127},"dfuchs","Daniel Fuchs",{"slug":1129,"name":1130},"dobler","Max Dobler",{"slug":1132,"name":1133},"dobriakov","Vladimir Dobriakov",{"slug":1135,"name":1135},"dreiqbik",{"slug":1137,"name":1138},"dschaefer","Denise Schäfer",{"slug":1140,"name":1141},"dschneider","Dominik Schneider",{"slug":1143,"name":1144},"duerlich","Isabell Duerlich",{"slug":1146,"name":1147},"dutkowski","Bernd Dutkowski",{"slug":1149,"name":1149},"eifler",{"slug":1151,"name":1152},"essig","Tim Essig",{"slug":1154,"name":1155},"ferstl","Maximilian Ferstl",{"slug":1157,"name":1158},"fey","Prisca Fey",{"slug":1160,"name":1161},"frank","Leonard Frank",{"slug":1163,"name":1164},"franke","Arnold Franke",{"slug":1166,"name":1167},"frischer","Nicolette Rudmann",{"slug":1169,"name":1170},"fuchs","Petra Fuchs",{"slug":1172,"name":1173},"gari","Sarah Gari",{"slug":1175,"name":1176},"gast","Gast",{"slug":1178,"name":1179},"graf","Johannes Graf",{"slug":1181,"name":1182},"grammlich","Daniela Grammlich",{"slug":1184,"name":1185},"guthardt","Sabrina Guthardt",{"slug":1187,"name":1188},"haeussler","Johannes Häussler",{"slug":1190,"name":1191},"hammann","Daniel Hammann",{"slug":1193,"name":1194},"heetel","Julian Heetel",{"slug":1196,"name":1197},"heft","Florian Heft",{"slug":1199,"name":1200},"heib","Sebastian Heib",{"slug":1202,"name":1203},"heisler","Ida Heisler",{"slug":1205,"name":1206},"helm","Patrick Helm",{"slug":1208,"name":1209},"herbold","Michael Herbold",{"slug":1211,"name":1212},"hofmann","Peter Hofmann",{"slug":1214,"name":1215},"hopf","Florian Hopf",{"slug":1217,"name":1218},"jaud","Alina Jaud",{"slug":1220,"name":1221},"jayasinghe","Robin De Silva Jayasinghe",{"slug":1223,"name":1224},"jbuch","Jonathan Buch",{"slug":1226,"name":1227},"junghanss","Gitta Junghanß",{"slug":1229,"name":1230},"kadyietska","Khrystyna Kadyietska",{"slug":1232,"name":1233},"kannegiesser","Marc Kannegiesser",{"slug":1235,"name":1236},"karoly","Robert Károly",{"slug":1238,"name":1239},"karrasz","Katja Arrasz-Schepanski",{"slug":1241,"name":1242},"kaufmann","Florian Kaufmann",{"slug":1244,"name":1245},"kesler","Mike Kesler",{"slug":1247,"name":1248},"kirchgaessner","Bettina Kirchgäßner",{"slug":1250,"name":1251},"klem","Yannic Klem",{"slug":1253,"name":1254},"klenk","Timo Klenk",{"slug":1256,"name":1257},"knell","Tobias Knell",{"slug":1259,"name":1260},"knoll","Anna-Lena Knoll",{"slug":1262,"name":1263},"knorre","Matthias Knorre",{"slug":1265,"name":1266},"koenig","Melanie König",{"slug":1268,"name":1269},"kraft","Thomas Kraft",{"slug":1271,"name":1272},"krupicka","Florian Krupicka",{"slug":1274,"name":1275},"kuehn","Christian Kühn",{"slug":1277,"name":1278},"lange","Christian Lange",{"slug":1280,"name":1281},"larrasz","Luca Arrasz",{"slug":1283,"name":1284},"leist","Sascha Leist",{"slug":1286,"name":1287},"lihs","Michael Lihs",{"slug":1289,"name":1290},"linsin","David Linsin",{"slug":1292,"name":1293},"maniyar","Christian Maniyar",{"slug":1295,"name":1296},"martin","Björnie",{"slug":1298,"name":1299},"martin-koch","Martin Koch",{"slug":1301,"name":1302},"matt","Tobias Matt",{"slug":1304,"name":1305},"mennerich","Christian Mennerich",{"slug":1307,"name":1308},"menz","Alexander Menz",{"slug":1310,"name":1311},"meseck","Frederick Meseck",{"slug":1313,"name":1314},"messner","Oliver Messner",{"slug":1316,"name":1317},"michael-ploed","Michael Plöd",{"slug":1319,"name":1320},"mies","Marius Mies",{"slug":1322,"name":1323},"mihai","Alina Mihai",{"slug":1325,"name":1326},"moeller","Jörg Möller",{"slug":1328,"name":1329},"mohr","Rebecca Mohr",{"slug":1331,"name":1332},"moretti","David Moretti",{"slug":1334,"name":1335},"mueller","Sven Müller",{"slug":1337,"name":1338},"muessig","Alexander Müssig",{"slug":1340,"name":1341},"neupokoev","Grigory Neupokoev",{"slug":1343,"name":1344},"nussbaecher","Carmen Nussbächer",{"slug":1346,"name":1347},"ochs","Pascal Ochs",{"slug":1349,"name":1350},"oelhoff","Jan Oelhoff",{"slug":1352,"name":1353},"oengel","Yasin Öngel",{"slug":1355,"name":1356},"oezsoy","Enis Özsoy",{"slug":1358,"name":1359},"posch","Maya Posch",{"slug":1361,"name":1362},"ralfmueller","Ralf Müller",{"slug":1364,"name":1364},"redakteur",{"slug":1366,"name":1367},"reich","Michael Reich",{"slug":1369,"name":1370},"reinhard","Karl-Ludwig Reinhard",{"slug":1372,"name":1373},"rmueller","Rebecca Müller",{"slug":1375,"name":1376},"rosum","Jan Rosum",{"slug":1378,"name":1378},"rueckert",{"slug":1380,"name":1381},"ruessel","Sascha Rüssel",{"slug":1383,"name":1384},"sauter","Moritz Sauter",{"slug":1386,"name":1387},"schaefer","Julian Schäfer",{"slug":1389,"name":1390},"scherer","Petra Scherer",{"slug":1392,"name":1393},"schlicht","Anne Schlicht",{"slug":1395,"name":1396},"schmidt","Jürgen Schmidt",{"slug":1398,"name":1399},"schneider","Tobias Schneider",{"slug":9,"name":1401},"Benjamin Seber",{"slug":1403,"name":1404},"sommer","Marc Sommer",{"slug":1406,"name":1407},"speaker-fels","Jakob Fels",{"slug":1409,"name":1410},"speaker-gierke","Oliver Gierke",{"slug":1412,"name":1413},"speaker-krupa","Malte Krupa",{"slug":1415,"name":1416},"speaker-mader","Jochen Mader",{"slug":1418,"name":1419},"speaker-meusel","Tim Meusel",{"slug":1421,"name":1422},"speaker-milke","Oliver Milke",{"slug":1424,"name":1425},"speaker-paluch","Mark Paluch",{"slug":1427,"name":1428},"speaker-schad","Jörg Schad",{"slug":1430,"name":1431},"speaker-schalanda","Jochen Schalanda",{"slug":1433,"name":1434},"speaker-schauder","Jens Schauder",{"slug":1436,"name":1437},"speaker-unterstein","Johannes Unterstein",{"slug":1439,"name":1440},"speaker-wolff","Eberhard Wolff",{"slug":1442,"name":1443},"speaker-zoerner","Stefan Zörner",{"slug":1445,"name":1446},"stefan-belger","Stefan Belger",{"slug":1448,"name":1449},"steinegger","Roland Steinegger",{"slug":1451,"name":1452},"stern","sternchen synyx",{"slug":1454,"name":1454},"synyx",{"slug":1456,"name":1457},"szulc","Mateusz Szulc",{"slug":1459,"name":1460},"tamara","Tamara Tunczinger",{"slug":1462,"name":1463},"theuer","Tobias Theuer",{"slug":1465,"name":1466},"thieme","Sandra Thieme",{"slug":1468,"name":1469},"thies-clasen","Marudor",{"slug":1471,"name":1472},"toernstroem","Olle Törnström",{"slug":1474,"name":1475},"ullinger","Max Ullinger",{"slug":1477,"name":1478},"ulrich","Stephan Ulrich",{"slug":1480,"name":1481},"wagner","Stefan Wagner",{"slug":1483,"name":1484},"weigel","Andreas Weigel",{"slug":1486,"name":1487},"werner","Fabian Werner",{"slug":1489,"name":1490},"wolke","Sören Wolke",["Reactive",1492],{"$scookieConsent":1493,"$ssite-config":1495},{"functional":1494,"analytics":1494},false,{"_priority":1496,"env":1500,"name":1501,"url":1502},{"name":1497,"env":1498,"url":1499},-10,-15,0,"production","nuxt-app","https://synyx.de",["Set"],["ShallowReactive",1505],{"category-springboot":-1,"authors":-1},"/blog/tags/springboot"]