{"tag":"symfony","articles":{"blog\/technology\/redesigning-a-website-naked-adventure":{"key":"blog\/technology\/redesigning-a-website-naked-adventure","type":"article","published":true,"meta":{"createdAt":"2020-05-23T22:45:46+02:00","publishedAt":"2020-05-23T22:45:46+02:00","group":"redesign","links":[{"icon":"globe-europe","colour":"primary","url":"https:\/\/naked-adventure.eu","displayUrl":null}],"category":"blog","subcategory":"technology","slug":"redesigning-a-website-naked-adventure"},"content":{"en":{"slug":"redesigning-a-website-naked-adventure","title":"Redesigning a website: Naked Adventure","intro":"\u003Cfigure\u003E\n                \u003Cnoscript\u003E\n                    \u003Cimg src=\u0022https:\/\/avris.it\/image\/naked-revamp_small.png\u0022 alt=\u0022\u0022 class=\u0022border-bottom\u0022 width=\u0022480\u0022 height=\u0022323.41488807913\u0022\u003E                \n                \u003C\/noscript\u003E\n                \u003Cspan class=\u0022hide-noscript\u0022\u003E\u003Cimg src=\u0022data:image\/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAYCAYAAACSuF9OAAAACXBIWXMAAA7EAAAOxAGVKw4bAAAHx0lEQVRIiaWWy48cVxnFf\/dRr65+THfPjD0zHj\/iJI5IFAnHJBHEioJAiCAkImUHiC0LFglISKxZwJ+AEiGxgA0SAgmxCAvEBhZBCQ85ColfsROPZzzueXV3dT3uvR+L9kxiQjbkbKpUdUvn3O+c77ulnvre7yUxiuVehtYah8EYTTuP0FqDUhSVwzshBEGUIo00mTRMVMysFuqm5trlEf1ejgTHeFzwQPdPRHrKv29qVpd63L57gFKKOI5JEnhoeAenh+RmG60bnAp02zn2hfWGTEM3DmSxJWl3aecxJ9f6LK\/1McYQghBCYFY0RGlMUQtRrHFBcVB4alfzzZ9ucTCpsKoheIfWnuVOwWihw82NEdpoEGGx3+LFL18Ev81b\/3qNPAZvLAZHXY2xiYZWZGillsgo2rail0bgS+5sbaAjTfAeazRLx1aIs4yWKKomUNZCP7aUpRBZTZxoZqVClGah1XBr3zJzFqUcwXlEhGJaMZ3cQIdAJ824vG1Z6lSs5AmJK7HPPnkGAgQfGB8UaF+jfAWNZlrOyAdtRAnGRKR5glcG8UISG6wVahfwQROphtnU0W1pGkru7jVcvgF1s4PWljhNcFXN8UGLWzc3ePv9PTA91lq7dIPgSkuoNXby3l\/oL51gcXWV9OQQBFCgECYzodaC7fbJshwdR2gJWB2Q4BEViJXHuBkqlCy0EopZgW9K9sISSbRNEkVEcYr3jrzT4sK6ZWD3OPeYZTytmLkeeewZFYrltePYevsm195\/j+23Y9bWThBFhlZnAZN1GAwHxMMhujtABPzuNlUjNEFRV55JUVFUnp29A8QVBO0wUlOWE37245fp9hZ4b3NKEOHJR\/pEBowxfBKUUtjW8mk6CJGG0sMsCAfS0DWgixLTqRBREAJeBKUEowJWO1qxYEQwHUtV7INL0MqDmwKBwSBGZQLATl0D9wxQIAJxZI\/EZMbQSyLs09\/6LlVVsbm5yfr6+rzVPwGm1fufz6uqQurf4aWiqEqapgQJJAi5r8mzjCRN+cUfb\/C3d3fwrqBtJhw\/cZrNvZpqb4Ozi56Xvv08FkBrTavVYjweA9DpdJh5zdZ+gUIxDjEdtpk0W+yFFbQfYXTFQpLwwOJZACazBt0o2mZGCCUi866K4xhjLd57lswGZ5vXWe8I7WOr\/Py1PzDZuc1J\/S7m\/JPA81ilQJmIie6jyymdyANQOMWbey1SDqiC4BtNphWTsqITrpC0YqYzODM8AyjGdy6D0qSLXaqiQEIghMBkPKGpa7rdLmsLUC136VrIO22+9NmEY9lpHlh9GpcM5xkSAQXksUbbBGsC3ntAIwLVdJM33tljtR+wMuWJczOKKiFKDJE1KKUQwNdjlNJUBYhvUAijSeDGSKNNQG7v8tDpR1hZPUOn1yXLMh5+fBejNL2FeRREZG6ZiOBcg7UxThqKsgYbgVL47AwPr7zBqeGEK9cnSK1pRwlJlDKMM6zSNAR8PUEpDT5iNp0ymYy5M9vizSt3CQEiHAfnVtmcBJSu6aYGWxZs71WU02ucOtbi4hNrWKUUu7PA9397wDDX1E4oauGFJww6i2nKESoIt\/aHdAddtkZjuoMVboc1VLjLksy7aPXzP0CZmGP9iOmkIO2uYPxfCfUrCOCA6p1naa5ewhpF1V3mN3++wgcf3CSKIr7w7HN85eJPsCJClo754jOvkpkcEGa+4NHlr7OefobgcqL4PE7FGAJN3RCbeQMrtYI1Md5V82kKFKVHmM+bB9e\/yHLvUbIkJUkTXn\/tV2SxIwRoRY5zJ4+zNIhZWBhiIosxZm5ZIi2+ln+Hfr9PnufIvV0rpRDpsLGxQZ7ndHo9iO7l5iNr5rY7CBqrYeYaQEjjnGFvlSzLUEox7C\/yfujTHyRESZ9HL5wh67SoixnLaycB5pYZY8jzHGMMInJEckio4pzSQVQ7Yq3QWn1s4gZXo3QgNAZXzxAJxHFMHMdHa85e+AanHv8q\/cEQrTWTyQSjIMvbR1xWRAgCe9OGSelYHiiiKLpPVKwcdV2zvzNDHVVOiKKI4XA4F9QUKG1pKoOSCpCjKh5iey9QNpqbox12Nt7iqc+dJ05beO9pmoYsy+aWKQV5q4XWCo8lvifmkHi\/STDeEqeBNI7QzHefpimHultqRukNo50KcRXB+\/uqLCJcvT3m+t2CNLUcXLnGr3\/5KosLbbwIKycf5KWXfzi37N5X+CD44FHq0I65fScX06M5cX\/15CjMYTYikOLrCvE1BP8x60c3\/sHW1esUtePO+29x8cFF9rc3cM5xqvvwh5YZrVnII6y19wX2kNRay0fx3+8B6mqG6BpflQRfHx0dH8Vzz5znwmOnSbMWcfQiabuLNZq83TniPWISZWkCOC9oBVqDD2DvXfX8DxQFBEADRivMvbNY3D6VA1fXiG+Q8HHL+oMhvYU+aTqvuHMOrfV9HWsvXbrEp0Vd17jpPsZGVGWBiONHr\/yT5eMjklhRlnORVVnQ1AWprimLA6rigLMnemxtbrKzcxfxDXZ3d\/dTC2qahtBMqGqFb+b5ufrBPptFG60E39SEpkLCjGKyTyQzivEOrtynHa\/z90vvMrq7jfgafViqQ\/y\/92VVIL4iuA8zFLxHiQfxKOWJjNBKFHVdg3hEPJev32Jvb8xhFv8DbBYDPiGD0eUAAAAASUVORK5CYII=\u0022 data-src=\u0022https:\/\/avris.it\/image\/naked-revamp_small.png\u0022 alt=\u0022\u0022 class=\u0022border-bottom\u0022 width=\u0022480\u0022 height=\u0022323.41488807913\u0022\u003E\u003C\/span\u003E\n                \n            \u003C\/figure\u003E\u003C\/p\u003E\n\u003Cp\u003EYet another one of my projects, \u003Ca href=\u0022\/projects\/naked-adventure-de\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-cogs\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E Naked Adventure\u003C\/a\u003E,\ngrew too outdated to support it. I had to rewrite it from scratch.\u003C\/p\u003E\n\u003Cp\u003EI took the opportunity to redesign it as well. (screenshots before \u0026amp; after at the bottom)\u003C\/p\u003E\u003Csvg xmlns=\u0022http:\/\/www.w3.org\/2000\/svg\u0022 style=\u0022display: none;\u0022\u003E\u003C\/svg\u003E","content":"\u003Cfigure\u003E\n                \u003Cnoscript\u003E\n                    \u003Cimg src=\u0022https:\/\/avris.it\/image\/naked-revamp_big.png\u0022 alt=\u0022\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u0022646.82977615825\u0022\u003E                \n                \u003C\/noscript\u003E\n                \u003Cspan class=\u0022hide-noscript\u0022\u003E\u003Cimg src=\u0022data:image\/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAYCAYAAACSuF9OAAAACXBIWXMAAA7EAAAOxAGVKw4bAAAHx0lEQVRIiaWWy48cVxnFf\/dRr65+THfPjD0zHj\/iJI5IFAnHJBHEioJAiCAkImUHiC0LFglISKxZwJ+AEiGxgA0SAgmxCAvEBhZBCQ85ColfsROPZzzueXV3dT3uvR+L9kxiQjbkbKpUdUvn3O+c77ulnvre7yUxiuVehtYah8EYTTuP0FqDUhSVwzshBEGUIo00mTRMVMysFuqm5trlEf1ejgTHeFzwQPdPRHrKv29qVpd63L57gFKKOI5JEnhoeAenh+RmG60bnAp02zn2hfWGTEM3DmSxJWl3aecxJ9f6LK\/1McYQghBCYFY0RGlMUQtRrHFBcVB4alfzzZ9ucTCpsKoheIfWnuVOwWihw82NEdpoEGGx3+LFL18Ev81b\/3qNPAZvLAZHXY2xiYZWZGillsgo2rail0bgS+5sbaAjTfAeazRLx1aIs4yWKKomUNZCP7aUpRBZTZxoZqVClGah1XBr3zJzFqUcwXlEhGJaMZ3cQIdAJ824vG1Z6lSs5AmJK7HPPnkGAgQfGB8UaF+jfAWNZlrOyAdtRAnGRKR5glcG8UISG6wVahfwQROphtnU0W1pGkru7jVcvgF1s4PWljhNcFXN8UGLWzc3ePv9PTA91lq7dIPgSkuoNXby3l\/oL51gcXWV9OQQBFCgECYzodaC7fbJshwdR2gJWB2Q4BEViJXHuBkqlCy0EopZgW9K9sISSbRNEkVEcYr3jrzT4sK6ZWD3OPeYZTytmLkeeewZFYrltePYevsm195\/j+23Y9bWThBFhlZnAZN1GAwHxMMhujtABPzuNlUjNEFRV55JUVFUnp29A8QVBO0wUlOWE37245fp9hZ4b3NKEOHJR\/pEBowxfBKUUtjW8mk6CJGG0sMsCAfS0DWgixLTqRBREAJeBKUEowJWO1qxYEQwHUtV7INL0MqDmwKBwSBGZQLATl0D9wxQIAJxZI\/EZMbQSyLs09\/6LlVVsbm5yfr6+rzVPwGm1fufz6uqQurf4aWiqEqapgQJJAi5r8mzjCRN+cUfb\/C3d3fwrqBtJhw\/cZrNvZpqb4Ozi56Xvv08FkBrTavVYjweA9DpdJh5zdZ+gUIxDjEdtpk0W+yFFbQfYXTFQpLwwOJZACazBt0o2mZGCCUi866K4xhjLd57lswGZ5vXWe8I7WOr\/Py1PzDZuc1J\/S7m\/JPA81ilQJmIie6jyymdyANQOMWbey1SDqiC4BtNphWTsqITrpC0YqYzODM8AyjGdy6D0qSLXaqiQEIghMBkPKGpa7rdLmsLUC136VrIO22+9NmEY9lpHlh9GpcM5xkSAQXksUbbBGsC3ntAIwLVdJM33tljtR+wMuWJczOKKiFKDJE1KKUQwNdjlNJUBYhvUAijSeDGSKNNQG7v8tDpR1hZPUOn1yXLMh5+fBejNL2FeRREZG6ZiOBcg7UxThqKsgYbgVL47AwPr7zBqeGEK9cnSK1pRwlJlDKMM6zSNAR8PUEpDT5iNp0ymYy5M9vizSt3CQEiHAfnVtmcBJSu6aYGWxZs71WU02ucOtbi4hNrWKUUu7PA9397wDDX1E4oauGFJww6i2nKESoIt\/aHdAddtkZjuoMVboc1VLjLksy7aPXzP0CZmGP9iOmkIO2uYPxfCfUrCOCA6p1naa5ewhpF1V3mN3++wgcf3CSKIr7w7HN85eJPsCJClo754jOvkpkcEGa+4NHlr7OefobgcqL4PE7FGAJN3RCbeQMrtYI1Md5V82kKFKVHmM+bB9e\/yHLvUbIkJUkTXn\/tV2SxIwRoRY5zJ4+zNIhZWBhiIosxZm5ZIi2+ln+Hfr9PnufIvV0rpRDpsLGxQZ7ndHo9iO7l5iNr5rY7CBqrYeYaQEjjnGFvlSzLUEox7C\/yfujTHyRESZ9HL5wh67SoixnLaycB5pYZY8jzHGMMInJEckio4pzSQVQ7Yq3QWn1s4gZXo3QgNAZXzxAJxHFMHMdHa85e+AanHv8q\/cEQrTWTyQSjIMvbR1xWRAgCe9OGSelYHiiiKLpPVKwcdV2zvzNDHVVOiKKI4XA4F9QUKG1pKoOSCpCjKh5iey9QNpqbox12Nt7iqc+dJ05beO9pmoYsy+aWKQV5q4XWCo8lvifmkHi\/STDeEqeBNI7QzHefpimHultqRukNo50KcRXB+\/uqLCJcvT3m+t2CNLUcXLnGr3\/5KosLbbwIKycf5KWXfzi37N5X+CD44FHq0I65fScX06M5cX\/15CjMYTYikOLrCvE1BP8x60c3\/sHW1esUtePO+29x8cFF9rc3cM5xqvvwh5YZrVnII6y19wX2kNRay0fx3+8B6mqG6BpflQRfHx0dH8Vzz5znwmOnSbMWcfQiabuLNZq83TniPWISZWkCOC9oBVqDD2DvXfX8DxQFBEADRivMvbNY3D6VA1fXiG+Q8HHL+oMhvYU+aTqvuHMOrfV9HWsvXbrEp0Vd17jpPsZGVGWBiONHr\/yT5eMjklhRlnORVVnQ1AWprimLA6rigLMnemxtbrKzcxfxDXZ3d\/dTC2qahtBMqGqFb+b5ufrBPptFG60E39SEpkLCjGKyTyQzivEOrtynHa\/z90vvMrq7jfgafViqQ\/y\/92VVIL4iuA8zFLxHiQfxKOWJjNBKFHVdg3hEPJev32Jvb8xhFv8DbBYDPiGD0eUAAAAASUVORK5CYII=\u0022 data-src=\u0022https:\/\/avris.it\/image\/naked-revamp_big.png\u0022 alt=\u0022\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u0022646.82977615825\u0022\u003E\u003C\/span\u003E\n                \n            \u003C\/figure\u003E\u003C\/p\u003E\n\u003Cp\u003EYet another one of my projects, \u003Ca href=\u0022\/projects\/naked-adventure-de\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-cogs\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E Naked Adventure\u003C\/a\u003E,\ngrew too outdated to support it. I had to rewrite it from scratch.\u003C\/p\u003E\n\u003Cp\u003EI took the opportunity to redesign it as well. (screenshots before \u0026amp; after at the bottom)\u003C\/p\u003E\n\u003Cp\u003EHere\u0027s an overview of what I did:\u003C\/p\u003E\n\u003Cul\u003E\n\u003Cli\u003Ereplaced my abandoned framework \u003Ca href=\u0022\/projects\/micrus-v4\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-cogs\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E Micrus v4 \u2022 Beauty of simplicity\u003C\/a\u003E with \u003Ca href=\u0022https:\/\/symfony.com\/\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-link\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E Symfony 5\u003C\/a\u003E,\u003C\/li\u003E\n\u003Cli\u003Ebased the project on \u003Ca href=\u0022\/projects\/avris-booster-quick-start-of-new-projects\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-cogs\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E Avris Booster: Quick start of new projects\u003C\/a\u003E, to take advantage of built-in features:\nuser management (including a passwordless approach to authentication \u2013 \u003Ca href=\u0022\/blog\/passwords-are-pass%C3%A9\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-computer-speaker\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E Passwords are pass\u00e9\u003C\/a\u003E), push notifications, etc.\u003C\/li\u003E\n\u003Cli\u003Ereplaced \u003Ca href=\u0022https:\/\/gitlab.com\/Avris\/Micrus-Assetic\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-link\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E custom Assetic setup\u003C\/a\u003E\nwith \u003Ca href=\u0022https:\/\/symfony.com\/doc\/current\/frontend\/encore\/installation.html\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-link\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E Webpack Encore\u003C\/a\u003E,\u003C\/li\u003E\n\u003Cli\u003Eupdated \u003Ca href=\u0022https:\/\/getbootstrap.com\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-link\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E Bootstrap\u003C\/a\u003E from 3.0 to 4.4,\u003C\/li\u003E\n\u003Cli\u003Eadded more contrast to the design, filled the excess of white spaces with content, making filters and maps more prominent,\u003C\/li\u003E\n\u003Cli\u003Ereplaced Google Maps with Apple Maps, because of privacy concerns (see: \u003Ca href=\u0022\/blog\/ungoogling\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-computer-speaker\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E Ungoogling\u003C\/a\u003E, \u003Ca href=\u0022\/blog\/log-out-for-privacy\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-computer-speaker\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E Log out for privacy\u003C\/a\u003E) \u2013 the website is now officially Google-free,\u003C\/li\u003E\n\u003Cli\u003Eremoved a couple of unnecessary and unused features:\n\u003Cul\u003E\n\u003Cli\u003Ethe homepage (now the user is shown the map right away \u2013 after all, the map is the whole point of the project),\u003C\/li\u003E\n\u003Cli\u003Ethe \u201dgeographic\u201d links (there\u0027s no separate map of e.g. German nude beaches anymore, it got integrated into the main map),\u003C\/li\u003E\n\u003Cli\u003Eseparate events section (now they show up together with places on the same map),\u003C\/li\u003E\n\u003Cli\u003Eforum (it wasn\u0027t used at all),\u003C\/li\u003E\n\u003Cli\u003Eadmin panel (now the buttons for admins are just integrated across the website),\u003C\/li\u003E\n\u003C\/ul\u003E\u003C\/li\u003E\n\u003Cli\u003Eimproved filters (for instance added filtering by name and location),\u003C\/li\u003E\n\u003Cli\u003Ethe process of submission of new steps isn\u0027t split into steps anymore: place info, review and description are finally just one single form,\u003C\/li\u003E\n\u003Cli\u003Eincluded some more \u003Ca href=\u0022\/blog\/reducing-website-size-by-a-half-by-optimising-bootstrap-and-fontawesome\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-computer-speaker\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E optimisations\u003C\/a\u003E.\u003C\/li\u003E\n\u003C\/ul\u003E\n\u003Ch3\u003EBefore:\u003C\/h3\u003E\n\u003Cfigure\u003E\n                \u003Cnoscript\u003E\n                    \u003Cimg src=\u0022https:\/\/avris.it\/image\/naked-before-home_big.png\u0022 alt=\u0022\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u00221147.3333333333\u0022\u003E                \n                \u003C\/noscript\u003E\n                \u003Cspan class=\u0022hide-noscript\u0022\u003E\u003Cimg src=\u0022data:image\/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAkCAYAAACe0YppAAAACXBIWXMAAA7EAAAOxAGVKw4bAAAHV0lEQVRYhc2XS48dVxWFv30e9bhV97offsUPHJLYMpFQeCTioUiIARIC8Q9QxvwAxvyijBig8AMACSkSgQFECbZjE8duu93dt\/s+quqcvRlcu7svcRIYEFjDe+4+66y99llVJaO33jGe4tr5BlQBmPcZL8L+fGBSB6aLxJlRYNZl2jKwNxvokvJZEOBbX6nYvfuYT8KEunDsz9PxevjljSMcUAoUYUFdlBQxEooCQkGMYzYnkbObNXVTYghlFXDOkfpEVmXoMvN5QoJHRMgIQzYyjhheQg2cd8w7YzFAXTpCHR1RhNIZUYTK9ZRO8SKE4CkjxKyEFDk3aambipSUsozo0+44JxxN5yQVmrbicJ4YFGJ0eC+YCcmMo4WBgHMQNCXMe0wcMQZidIAS6aljoCodo5GnKozoFeeUGAQfBDGH5Yw4aNqI4YlVpBqXmK36rQqH88x8kYnFitQ7CG0ViSLUwVEXEINDEGJwBAacCYGI08TdO\/eQwmFOQQTnhGG+wATOn7\/I+YuXwDnEOfpB6QYjqeG8Y9IKApgZ3WCEN75+FTEFNQQYktL1inYLggePYqlHkzCuW3Zne5RtBCekviMGY9SM2dyY4KOQbNVaNaGMwsgLqsaQjT4pGXBBCOOREIoWyxnvQFXoFksWc8NpxovhJCPWYcNALYnaFdSbEwgR74Sh7wltg68qyEZWoxRBBLIaiBH8ahbMwDDCw7+\/y9a5S9R1RdOOGZ1pkLMtpg3Oe8Q5ADQNdMsF3d4MrOfwcErRjjEXERfJGGaKE0PciswwnBjmDGy1bqqYGaF99Ece38087iqIFW+8dp1z117FO4\/zHmTlmQuB5kxke\/sqyUcO+wFXNEy2zhG8QE6Qe7IqlpWcVwSalKxKSpmUMzkrqkbYyRcgwAvjEi\/Cw7u7HDz4A2V0mCnjjS2qUYvFiqKuaTY38KOW7XELVYE4sOUUm89Iy4F+gCyOrELKRt9nll3PvOvpE3TLnsNlTxhXBajiyThTvBna9XQDmDjSkz047Gm3ztKIEKf7jJxCXUBKoAnSQF7MyUNGTPDicQCaUVUKG5hs1PSDktqASUM4\/43vIRgOwTtwrIZiFXqQcYgviUWBRM8QPV1dEXyDxBFQQLUFocWp4syOffSqFKrkIdMte4wBCSsrRFWPs\/rLRJCVPADefvttbt68yfXr1ynL8lN\/7jOcHPNpNAE6zBHAR49SgHZoVnz0wCoJRYTCF8d7rSm+ffs2dV0jIgzDAEDbtmxsbABw50mHLQ9XbRfHnUXF+VoZ2RP6dMTt6S325fs09meyFSABZ\/s0Qfjqxktc2b56ovi0oo0L11ADzYlJvUREGI\/Hx+sfLUp25iXMYOQWdCbcXxa0aZ+MUriGIQl\/u1dy44UnhCIjElgk5db+h2vE7jTx7kyZLpXpbMHuYccwDMxms+d6FPNDdHGfnJR7R5dx6nl0UBBD4JXxfbz1CIZ0iWBGGYq1+jWPt5vVOaweYwZeF6SUGIaBolgVikAxPODegwfcvn+EazMXNpVFPOCv7z\/mR9\/5C\/WlMft7M6oYkRK8c5TBcZprrdVPZkpSw1uHt4EmQhnXmrI6WKzZvnyDOzt\/osqf0C4esHso\/PT1CVsjZaCkn2SqGDEyRSjYCqPTO5wmNrYat3pbkBFJofCrKV4sjo4VYzBwhpQXbG5O+OaVGU29wXsfHPHBrUNeeTFjAUo8osJ43FBJyUROa5TTxMKv330EcbTWkhUcL59bQlk9u0GEWLPZjrn1jx0uTHo+uJu5erGmCRX7yxnjdsK8uMbjTrk62sMV59Y9NjvJj99+6HgwnfG1C5Gdo0xwwnIwDpbKj1+t+e7NiFPl\/Y8e8YOXdykvZX7zu4ILL77Om9\/eQXzLO+99yJs3PHv5LI9mm4Dj4HDJa9sLxpMTLrFTzL\/4\/U94tPyEcdzA4UBglg5JOvDDiz\/j5y\/+ij4r89khk1IpYmDGGMQjopSy4PHU2K4zmKx8AcQ5vBPa5uRq\/s8ic21kP\/74Y7quY7lc\/lvFBwcHHB0d0XXdf0y8do+HYWBnZ4e6rqnr+guLp9Mp3ntUlStXrjxnKJ\/hJNePiU8PV1VViAgigqp+zkYrLKyin\/d4J9zf3WVjvIUnYZoJIRDC6Su07uh6gMyNIWWcDCy7h1y+dPFziTdroQ+CqZEWC\/aW9wEQEcwMM8M5h6oyGo3Y2to6IV6pWrXi8nZDCP64uO97gOc+IgE6qVEfMWcIhi8AdQTJ5LSKWe89ZVlSVdXzFK9a2kvFfIDgQJzHJ2Gr8Z+h12gKIQ1GcI6UFdWBUVkBDovhWECM8bjmGdeaxz4dUYZAzhlLRtO2mH06q59hUFgmqMUwgxDcsULv1w98wvP0bp8OkHuPjhBxGEJwSigqthuH+4Ih+2J8eqrXAmS5XGJmx978N\/H\/kVxfJsK\/\/vBkrtRRGDKoGe7px9coCtOl4p1QxdVTy8yoC0c3GKNS2JspmyPHwUKZ1I7pQinC6n29juse\/xPzaJzjyI4XIAAAAABJRU5ErkJggg==\u0022 data-src=\u0022https:\/\/avris.it\/image\/naked-before-home_big.png\u0022 alt=\u0022\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u00221147.3333333333\u0022\u003E\u003C\/span\u003E\n                \n            \u003C\/figure\u003E\n\u003Cfigure\u003E\n                \u003Cnoscript\u003E\n                    \u003Cimg src=\u0022https:\/\/avris.it\/image\/naked-before-map_big.png\u0022 alt=\u0022\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u0022911.20234604106\u0022\u003E                \n                \u003C\/noscript\u003E\n                \u003Cspan class=\u0022hide-noscript\u0022\u003E\u003Cimg src=\u0022data:image\/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAiCAYAAAA3WXuFAAAACXBIWXMAAA7EAAAOxAGVKw4bAAAKPElEQVRYhcWYSYwk2VnHf++9eLFkZORamZWV1bX1NnTPdGMPHgwDshjbhznYt\/FyQliIAyfEhSPiAAIhS3O1sBC++MAiGYQBGazB7WHG46Vtpj0zraarl6qacm1dWVlZWZEZ6+OQldGT08NIRkh8Uii2F+998f\/+3\/\/7IgQv\/a0Bw5ULbZw8IUoyhBDkxrB9OGJ5rsR\/7ZzQbXiEUUZuDFpJjsOElVaJQZhwdJowijLAAIKJffDxfM1hoWZj0ojSuzv8QDV5rh3xw32HLAPxlX9dN\/x\/mTEgxOM9IIwxBmA4HOL7PkKID53jw+c3xfP\/22M5PXn55Ze5ceMGN2\/enFng5zn+vzCR57nJsow3dr5HmqcfOGipvEwq19jZvMfqyipHR0cIKdgTdc7pEVprtNaQDrl753t0a13ssuZOVGKQ12hmrzEOU3K3hZQ5ILFMD0FO2Qk4FyzRrrYJ3ABr+pZ\/9tYfE+cxLbdFmIZIIUnzlH58xJcu\/g7X5lYR1QV2x4JUV5BCMBjB3dRFjMBgUFlC4Odsm0OssQVpzJjn6ZnzGFfi8TNMHqGJSI0EkzKKQx4ND2hVW5OwGWNMkiREUfQ\/wygEr\/dcHg7PzpnkjStSmnKXvaxNho00EaV8i0w6+OYeg2yRYb7Mj974N168muDWNRN8IBMuIg8RgFKSFy59Gt\/2JxwC2NjYYGdn58Pji0Fg4GwfG4Gb3scyIWmSEaWKhz2Na0mS1JDKOSr2kJeeFWhlMCafzDE2OFGMpTSOtmm6ZdRZLskpKR3HodlsEkURxhiiKCJJEvI8Lxwy082AIiPr3+L12xbf+s4PUJZgNBpRcSTZ6SP+6K92cU2fitpD2eBVHFxbo5VElxWlqoWjBLYlEdLFmIlHBUL1ep3BYEC\/38cYQ7\/f5\/j4GCEESqlZjwAr6TOvdjl\/ZYWdg33+5l\/e4Ctf+2vc01scHW\/zhV82LIv7tPM9atUyyTgnH+W4UuM5GqUknmvhWhpfKaRglkPD4ZDxeIwQAtu2CcOQRqOB53lEUcSrB5qN4XvDN8nIYX+Tk\/4jRonHx1sP2AsNJ72IjzxVxVEujZrHOIkZpGMkEqkhyzKUkATao6JrBOmIoP0Mti5NsmxK3CzLsCyrEKs8z98nlO\/RHyao7R0LWp7kWvNndNo1alHMK4cZcZhya3\/A+UYPO9DM1SqkYUoaCeo1HyuXeMrBNxkCiRLvC1mWZURRhOM4jEYj6vU6juPMsto8ua0tLXN\/O6TmCsJwzHd\/sk8y2OOffnzI85crLDWaqFzQ2xkgKVOpdRmk58hEAIBWkhE1onyCjcjz3KRpysHBwaSo5jmWZeH7\/uPwTNP+ZFahk3iE45Qop\/d45Y23+eQVh+MQYuGydeRyuXnIvKeplgV1v8Sd7CqJsTAI6vltOu6IxaCN5V1EapuqDdY0JH\/62pjVquTWXoLnOmgrA2AhUPzer5YRWY6XDEhlidSyGQ5POd78Dl98tkGcG15PEgb+b2DVJX7cZ7l2yK74GO88\/D5X5zOSxGJUrmCiI6Tlssd1dt7+ZwbthGqrwkp3ESHkY1J\/8819qrZhP8yRUpLnBstSNMouH19yGKSKcRSTIzFCEA+PMeNjmvUySkl6eY3+yKBFSmoUmghLwv5RyHxNU3ZsBichUkqyPAch0MJgpCJNM66sdbEt9ZjUr26MWQoEt3Zjrnc0n7vqUCq52LYNwPHOQ3q9XhGuKbL9Xg\/Lsrh1HPHNH+9jhCDJEvLoBOHXEHnM+NEGX\/rMr\/GNnzzC0RIJ5MZQVQlbWxscPPhP\/u7Lv8\/KuQWsqTB+YtWlahu6FYuWL3EcZ1Iw38vps7F7e3vEcczi4iJSTvKi4oxYqR5ja9i9\/X0qRw\/o2x7x0R6+yUj6Fxndf4vTLEXkCV60xfqdVxkNDoiiiDz9XYwxjxG6cX\/EUkXw5m7CRxZsfrHrPYHG1Hq9HmmaMjc3h+dNxtXSIy6YbdoqYd0N+ewXPsMIg9EOqRG8ud3j4fpbeK6DFQ+oRBt0Sy5edZGNvR7irKMsSP0rKx7zZYv5akonUBhjJgI2VemzbAO4dOkSxhi01sU1bcaINKR\/Injwztts1EvsnPSwGw1c10boJbz0Xdr4LLUdnj73NCtzDq5tEeY5jWoZIcRjhH60GbJYEdw+SLk2b3OxrKjVaoUztVrtiRBOTUpJHJTQIkIITbVkUav5NJ0rZLYiSVMuttZwP\/8p5so27WpApewjBQyjhDDKEGoyd8Gh55Y8WmWL+WpOJ1B4nij4AVAulwvE4jim3W4XwmmMIQxDglqTLMu4ePU6aZrieR7NZrO43+0u4LouxhhardYMHaZFvEDoh++OWPAN7xxkXJvXXCjbBT9gouTTRdrt9hMo5XlOkiS4rkur1SpCPH1hYwxpmhLHMfPz80VZen87XHDo2aUyLV\/SmZN0A0WjYc8sqJTC8zy01gyHQ9I0LUJqjEEpheu6SCkZDodkWUYQBAXK0+cBTk9PybIM3\/exrAIThBCPhfEP\/\/EBnZLhkCqC4quEli\/5rY\/6hGHIaDT6QA4JIdhJA27tnGKEnEws5NkmQMDHqiHrm7sYk2NMjq01JU6YC1xsrVi99AyeV3rMoafP1egEiodHCVKIIraBPalvh4eHM8I4dWT69jfHHf7+p4dIZSGUQkoLpSyEmjg2ctb5+j+8QtOOef7pJa4v19CBz96jEcKSLK09Ncuh25sH9APJ+mGKpRRpmgAwH2heWJmfQeTu3btEUcTly5cLYqe9bSr5GE8KcuEglY2yNEIKtF3iUkPx4gU4322zutql5JfZf7BFLAzKUU9y6MryHJ3AwgsSrPdoT8URuK4745DWeiYDARrhOvNv36BWdjkYhJzoKn1jc5rZ7MceL33+Os\/9wjK+X0IoTZIktJfbJKfHnIwzzBnJC4TubPc5dFK2RzaVSsCFhsVnn5p1ZGpra2tPXOu2GlxcW8SSku6CwrY1CIlSkjg1CG3x0\/sndM9liHc3uXxhif7RAbpUI8oUytKzITu\/UKMbWLj9yU+Dsp6k8hSJTqdDo9EouFN8+kqJZVmMR8ucWz5PlmWUPBel7cknjpTkxuCVSgSrV0kqFc6Pe2RpzLKtSTKDcnzss9AXpL5mbREfxzyDodPpABCGPuVyGZg4NxgM8DyvaN7yPKdUKmHbNlJKBidDyn5AEARUq9UZBE9PT+noISoe4gX1gjP+mVRIqWY59Ac323x0weLfH8RIAc8v2fzJp2e7xiRJqNfrSClJkoRGo1F0mVk2+Y0z5Ve\/36dSqRS1cCqMWmuUmizu+35RjqZCWejQ5uYmxpiz5mzSxsZxjOu6NJvNGdV+v31QR\/DzjhFnUlOE7De\/ZfFLC5pv34+QwuLXl22+\/OJc8cBXv\/rnfPc\/buBosC2P2qVPcO76JxGlOr4n6ZRavHYvha0bqEqHNFjBCA+T5QgSfvuFEre3HvDtb3ydrfV7jEchUTjGKwckccTX\/uIvac81+W9xS9XYCGf+5QAAAABJRU5ErkJggg==\u0022 data-src=\u0022https:\/\/avris.it\/image\/naked-before-map_big.png\u0022 alt=\u0022\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u0022911.20234604106\u0022\u003E\u003C\/span\u003E\n                \n            \u003C\/figure\u003E\n\u003Cfigure\u003E\n                \u003Cnoscript\u003E\n                    \u003Cimg src=\u0022https:\/\/avris.it\/image\/naked-before-place_big.png\u0022 alt=\u0022\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u0022892.66666666667\u0022\u003E                \n                \u003C\/noscript\u003E\n                \u003Cspan class=\u0022hide-noscript\u0022\u003E\u003Cimg src=\u0022data:image\/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAhCAYAAACxzQkrAAAACXBIWXMAAA7EAAAOxAGVKw4bAAAGuklEQVRYhcWXzW8kRxnGf1XVXf1p99je9Ud2vcN6DVlyixBhySESUoT4CBJCyoED\/wo3rvwDHEGIC0TLJUIILkEkaCOtILkgJ2SD7azxLuuZnfH09EdVcZiZ9jjucRaB4D1VV1XX+9TzPu\/7dovdH7zpaLEk1axEHtY5nHMUpaWsLUoJitISh4q8MCwnPr1BSVHZtmMmZ4WKG1d8Tg6fMNY+pdOMyla3iNqY9pX\/olljGY1GVFVJUTmi0CPLsta9npKydeHjBx+xt7dHkiQURYH2NcudDkrA8198AYQABwgQwNPBAFOXaM9DCEFtDNY6lJIIAcI5JJY08oiiiInf6QHQjL35h3nbe\/8+P\/7RDxkWOVIofOWRRjFOSEqh+e7r3+eVV19j47nnCLXkT+\/eZyVboixzYl\/ymzd+SlFbfKWQwmFqg\/A0X33lVbq7L7Bz6\/Of8jkZe87NInY+cuOiREu4spxhgaUwZDQuKKucyuT8+mc\/4fd3f8Gdr32br3\/rO\/z8l3f53R\/eJohDvvnSLrc3M\/LeECUdRWVJN9cYHPe5+8aveO17ATd3dttD1joLZEshuzvXkELhjGVYOE5sQGd1iTs765wOTxn0h\/z5j78lFAXWGKhrqrLi4aM+z69nDCufK8seSegQIsQGI059i7fQ6yWAkjihsDWJtJgqZyWKSdZ3SLRio6Ppax9fB4SRJE1KcGBqi6hqnvRH5EXJSf8xV9MrBErhjU8Zjka8\/JUX2dq6vhBQu6IBgcUXCs8T5E6TO82gd4xWlqN\/jjh8eMTYWPxklRfvfAPPd1hjMWXFRwdPeOeDQ97+8CF\/fzKgso7KwGhccv+vn1CP68UMCSFaF\/KixJiCcCnmS7du44TEBhm3dm\/R6XTwg4CydtTG4emYauxwtaVyDmMK3vnLAb7WlKWll9dspQFxGPDll15meXWFRX6Fc861ZdnB3nscfvAea+tbJNkatTFo7VNVNUJIrIOyqhkXJWGc8ta773P4yUNGozEIiZAChKDTieleXSZbSgBBECXs3PoC2zc+R5vfKaCL9vjxY5xzKKXwPA9rLVEUIaWc1Jm65ujoqJl3zhHHMWma4s2p9q2jN7EYpFFcL28DsLq6urgwnn88Q5ymKXU9ifXMqVKKoiio6xrf9wnDEKUUWmuqqsL3ffI8RwhBmqYAXI22AJBOkerJnNa6lR0AYa1tZchaS7\/fxxiDlJIkSZBS8qR4RGgm4ziOUUoBcHp6inMOL0gwduJOSXAOYt2ulzZbmGXNBimx1jIYDAAYuJNmrqoqZhE3xgAQ+oIkEKSBIPLFvwUGLskyACEEQgjkfL+bMu15Ht60bwkBWbY8WWjpT89ubnFhBHDOYa3FOYcQAmstsxajtcb3\/eagBw8+JooijDHEcUyn02nAWGu5d+9ec8lut8vGxkYbBZ+tIa01URQ1bB33\/kEgQqSUaK0JggCAp8cnJOMR1fpas9c516znp0OsF5MEsrlgm13KkBACYwz9fp8syxBCEKmYsiwJgoC6rhuHhYLBwQG1qxswzjnW1tammnOIasSwosnAVkAToLPYn1EHMB6PEULgeV5Tf4IgmKbtJGyzmwa+wux0UVN2tdasrKw0WSjEJONmYCfvXdSYdzZxkcIwDBtNjEYjlFKUZdmwNwMGE70ZYxqAVVVxfHzcaG0+RGmaTp8v+vQWFGqcc5RlSV3XaK3RWiOlbKryvE4ATkePuOoC5MZW876UsmGo1ztBxxmxlk0422yhhpxz5HlOp9PBGENRFE0Lmd8ThiG+7zP2LId7H0JVN2zMhJ+mKVoHmOKUSoRz2XnRLs2yXq83Qe15TV+DibaiKCJJkmZ\/nufU9RmYWUJIKRs2hBBNC1pkCxmaAVJKUdc1Ukq63S482Ce8ce1cA53tn\/W+5rZTULPQzreahYAW1QMpJWtra01hXF1dRQjB39bHXG+pI0EQNM7m68xsPM\/wDOyCLLucoZWVFZxz9Ho94jimexxib1w8bH9\/nziOEUKQZRlhGM6d5tjfP+Dw8BDnHDdv3mRzc5O2FjP3G8Q5B1JKOp1Ow1CWZSilGoY+fbNy9JT0yg1qCxWS8NyqYHt7m+3tRd\/Sc37PJi6Gbpa61lqGwyEA3Yd6ju4zu7bd5eqSYnNZkQaLGmq7nzmPi+vQTAOzNJ\/VH5ScguUcqHS5M33v7DKXW\/v6Z34PwSR8RVE8y9b\/2BbWof+XPRND\/0u79PMjryY\/eIEnOC0tnhRIAZEvGBQWKQShLyhrh3WT+XHl0B4UNWgPajNRS+gJhoUliyTyEl3\/C8C8KrFX1sBMAAAAAElFTkSuQmCC\u0022 data-src=\u0022https:\/\/avris.it\/image\/naked-before-place_big.png\u0022 alt=\u0022\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u0022892.66666666667\u0022\u003E\u003C\/span\u003E\n                \n            \u003C\/figure\u003E\n\u003Cfigure\u003E\n                \u003Cnoscript\u003E\n                    \u003Cimg src=\u0022https:\/\/avris.it\/image\/naked-before-submit_big.png\u0022 alt=\u0022\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u0022811.96261682243\u0022\u003E                \n                \u003C\/noscript\u003E\n                \u003Cspan class=\u0022hide-noscript\u0022\u003E\u003Cimg src=\u0022data:image\/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAeCAYAAABE4bxTAAAACXBIWXMAAA7EAAAOxAGVKw4bAAAEl0lEQVRYhcWX328bRRDHP7M\/7nx3dpxcQvqLEl6QSiMEVXkAiWfUf4A\/EvVv4AkhJFSJhyIkhITatClJXSexfbbPd7e3PASntnFcpyrqV1p5bzw7Ozvfnbk54buH3lrFnY9SfFFQOo8SOO7l7LRCXg0KtAKjFN2s4MZmg9NhwXYroKhqTrOSUeGYhwdk5hcaVmG14sF+ix9+7bDtctgwdKqYs3F9sVIe\/nzgeR+Y7irzYqnr2jvnOD4+Znd3FxFBRFBKISKUZYkxBhHB+3Mrq+YA3vsL+axsHR3x3vt+v8\/jx48JggCtNVEUMR6PMcaQZRmtVov9\/f3\/JVDTAMxFyHvP4eEhVVURRRFlWRLHMcPhkCRJGI1GaK1pt9vv3CFrLdbaeYdmw77ovfeePM8ZDAZ47\/HeX1A7qzOdwzug7E2ncG4xi9aH9x5jzFL5okMAZg1\/KMuSsixJkuTKDi1Gfxkbs8\/mMqVZ+WKWXQXT9aucmqXMzN6Fy05YFAX9fp80TZeGfxXeZH9RV+q6XusOVVV1EamrQil1qQOLUb+41KsoexuqpvDeo7VeO8su4r+KslfZhIPjE7bSlDAIAMjzHmQnNBoBYRIwqps4L4S+R1kUTJQiDmJiq0njzbUpWyvLJhLQsjW2HOKKjMlkQl8cTZkwqmvq0iOq5slZQlIXDL3leNzl\/o7DO8tWtLqgzmXZYuFa9Nh7T+WFH0fXaeZjsjrEo9B1Rlr+yUhtEelD+u4GIzZo5keEdGhEjt9f1uylH3M7vbWUstl9pjI1K1wcs8oAafUHsXRxVU3uIvrRfVS4g\/I9arPNhj0hsROsTNDiESVQzNtfBRFBTS\/tqiFAgy5no4ry4De0UVirUcUAycf0zTcYFdCoTkhcDxtqtAhaBDHLbS5SNh1qMQqLHgP4umJ7\/Igiuc3eJ5pE9zDDF7R5zlb0lNNnv\/Dh5CeuhR3Cdkg5dIRiCbShEdn5t\/mSSM3K1iqMohSv4q8wUjKaJARVlw15QkhB3in47FZCGiXYQJMVOVUaE2jDtjY0g9ZK+4t7rZVlHsXYt7FMCM0uH8gzbKwpS0vrZszZUUZnXFBUjrAdsBlH9E9yTDMkEPPGOnbld9kUzgc0VI4ucora8fywwzAbEkURn+7toYAXgxMaI02zfQMTJTiSS1uU2X2mMjVL2aosU97hvSerUhqJxaCJWze5e\/ceJv2S7qjPcDwhDZsk7TaPizsQ3qSWZM7+KqxNGa7i1vgR14Ix1gYcv3Q8j77GJY7h4JQNNaBnvsBMfmd8NuKk3MaGBd2zLhvt6\/jm+pSt1TFmwyFHR0e0Wglawbi2OAxWHKVXqDpnp91+\/eEjCiXn9pTWBDZ4tx3j4mlEhIPsKQ\/\/+h7va2rvEYHP03t8e\/vBpd3gMjtv1TEug1WWzWAT4fVda9rmym5w1SGnWIuyq8ynG7xtk79WYVzm4Ox\/6xa9dXTEOfd+PqUvgZnWB+89z3oVkRE2I30x1+o8cwItJFbRGTqUAi2wHWs6Q4f3oBXsJJq\/B46df+WRFWIrnI5rNhvna3cSTTap0UrYSfR\/KPsHj\/b+fF+Z7QQAAAAASUVORK5CYII=\u0022 data-src=\u0022https:\/\/avris.it\/image\/naked-before-submit_big.png\u0022 alt=\u0022\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u0022811.96261682243\u0022\u003E\u003C\/span\u003E\n                \n            \u003C\/figure\u003E\u003C\/p\u003E\n\u003Ch3\u003EAfter:\u003C\/h3\u003E\n\u003Cfigure\u003E\n                \u003Cnoscript\u003E\n                    \u003Cimg src=\u0022https:\/\/avris.it\/image\/naked-after-home_big.png\u0022 alt=\u0022\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u0022784.8\u0022\u003E                \n                \u003C\/noscript\u003E\n                \u003Cspan class=\u0022hide-noscript\u0022\u003E\u003Cimg src=\u0022data:image\/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAdCAYAAADCdc79AAAACXBIWXMAAA7EAAAOxAGVKw4bAAAJQElEQVRYha2Wy49l11XGf2vvfc499123ul7u6lbb3XI3dkIejgMTgnhaiaIQQbCiCGWUDBghZkiREEiI\/4ARAgYMQEIMkFAiGGBkWRkgO2AIsR0nbne7u+3uqlv3UfdxHvuxGNzqcrdRhBSxdAZ7n3O0z3e+9a1vLWn\/9t8pqoCCAiRQBY2QEmhk397iqa332GtX\/MedNtF7fufzn+Erv\/prfPNP\/ozxdI51GVtdYdBpc++kJgSPiFAUlk\/uTMAI9yvDblHhWi0yo6AJ5xzedti9eIX56QQnKAg8eTiiTaRuAs4K3nsW65rj2YphZ8214YJX7wzRGIi+4R9ffp2qVsbT+eYHUmIyT0xOPc7luFYLEbg8LBHTcNy0SepY+xyThH4WSOJZRk8mJfdujRERbPbMi3887GREH1hVntpHah+pmoBBiTGS6Zhr28cUboHQZr6KrMuGH9y8i6pirCVpAiDLC1JKXBx6yuhwLiOII0bhuU\/8Am3\/HmIrcmtQEYwRYowYqxiTcKDYas1xNDgDAvgQ+NSe560TR+MjzghlA9084\/KoZrLOWSwqNCWMsagqKUbEGGLwtAvDi1\/6MkV7lw\/GE0adivsnU+7813eASNFzGHUk8WTiiE5pq9JIwqDKSbQAhKj4mADh9QeWyicSgjEBZx0xKiGW9Npxw0RMRO8J3qO6Wfu6whjDm7fucbi\/x9XhKVcPD2lOvk+rSNhcyFWx0lAYQ4dEF8GqYhCMAnlmORh16HdaIBbrHPvbA3ZGfbAtILGqT5nVgbcmu7QLg8tzsrxFigmNCRFBUyKGwHy24u77U6bjN\/n+f79EUWxxYWtISpFQJaZVi7XmOIRZpRhVMpORNw7Xy5VRzxBCQ9cp\/YEwXVQ8ODo9q7RIliuFgdurAbGpuDWJ2Ayacg0iiDUgBjEGDYHnnn0G\/APqxlCap3n5tVcY9D\/G1tZ9fnRvyY+P2uz2a65fqLi72Od6f0lAqE2Ja2fCfFlR1QE9E\/HhdhvtGtDIeLpENXL7aIej44ayqkAVMQZUADDGYI0hpoSqsjUc8OvP\/wyv3Zzw7e++SbsNl\/ZGtLOczMFn9sfU6shKpVqvGc8ajE2oBmTrt\/5KU1IEQBOQGLQd3geMJDQE+rzLevwOMQRENlUuAiIGm2eIMaQQid5jncMYw8\/d6LFjS3ot5T\/vW945AWMEa2C3Ay9cKqmSUpJRWEg+sPaKG3Uc2\/0Ws2VFWXvWVaST57giI4XA8XTNaRUxMYAoqgZQVIWiPwBjaVYLNEUg8Zuff4HV9DaHzdvknRaaAi88mbh5wTGyJe+vLJmxWISOE07WijhlZ9CniAZXVRUzDRS5RSMEo7Ss4owiRsiMnmlEIJ05OputXy8JIbKJhDGGV777Er\/xNAwKyyoGrAjWWA6yipZEyBsehC4zU+DXS5rQ5v2Z5yi0ODwY4aJvsIXQySy+DmhoGE88aCSEQIqeJ7fbPPvsx\/ngeEIV5FxDm1SFDR4BYy0fP2zT7dVkuWXfghHwCYq+YjUwSMpll\/PGvMUzFxtIysky8tZyxFHdwrUzxWggeDBEMpPo5BYUFo2H5Pnln3+eb33jC3w0jBE6rY0x\/n+EiOCqssRqxla7w8lqjW8aeoMegkGiYblKzBYVv\/cXrwMw7OaEmFhVgSt7Xf7wxRs03m8oQum02z81IAWck0AKidUKRD1WA6enC1KKrNcVKQaGHcOf\/u6nN9\/8SMyTgnXn+7LxPzWgljG40FR4VUZdy3KxxIhSdLtoAlMYUjCoJm5O5\/gQEBFiilhrP5xYHkmZiJyn8OHaGIOqoijDbvcnAtrKM1xhFWcNViP9QmiaAKnBCczXK5qmQVLgswc7\/+cfNj79xGdiBGsEHxJyxvSj0hMBZwTXVGskd5RlwtclwQeMbowxxRojkRga5qenlOs11lqquuZgf588z89ZePXNI\/7gz39AAhQlycbIRQQRuHGpxwvP7\/E3r9yhyCwPlhFBsShOI5My8MVP7eJSqOh0e3RzocmFWVVzukikFCkywfuEFaVotdCUQITMGVLaNNSHkbUMB9d6iLEElPjev5MOblCvZizff4vyXqDzua8zGGbkzjEYJIyALj7gzg9fg7tvs86exNUR7i88ad6AKskHdgYtVMGIoi4jes\/p6QIfPP1+H+My2h+ppkxLLsXb7AwLbCz58d2XeKJ4hxAhf6LF\/sETnNy5yxsv\/yuSArEp2Qs3WYzfpmxKyqpmdW0H52mxNdglRsUYmN5fIxrQGDg6mZFSBI0Mh4PHAFRV9dg+J7LLKd35McuTu1w\/PODLX\/gVfnjrFq7doTPY5o0HM6bjm\/SKHCPKMsBTl6+y2\/ZUIfHU4QFOZ+8ynb3Lw0HfoJTFkBQjvbYjJcFZOROhfqjARyrJOYclUKQJmC7Tkzk6G\/PqP\/0z826HLM\/Z3a\/IucCuO+Fip8fVnYIbh1c4GOVYa2mScnD9WZzE5qw76dmltJyQdwqOxxPquiF4z3K1YjabgYLERDRQtApGoy1arRaaPC5NyFNFO4s8qNa4VkZLoaxr5qcz9i4dcGV\/RWFKyLfYGh7QarfxCW7fm3CruoXT9NDIzk0FTYGm8gy6LY7WS1IKeO9RVfb39lCEQb\/3WMouX7nGV77++8SUzntdjJFBv0+\/3yfGiKrys5\/4NHmWoygXtrdx7kNTjTHiSP6MfT0Htjidb9JnhCJ3ZNawv7fH3u7ueZk\/2r8erjudDnVdk7kMKWvsVp9Op\/NYNfZ7PVJSkhqq2Sn5oLdh+OwMRwrnQOQsZVv9NqqK957JckntA3\/9L+88xog+BKJgRfjaL11hOp1RliU7uzt0RwOKouCjMR6foKrs7Fygs7W1cfxH4hFAGzCbLyVC2Ogmc4Z11fD33ztCkE0\/eyhq3dBsUb76i5fZ29t97PBHK\/FhCzk8vHh+r2max94XEZxqfNzDgePxCTFFjAgxJpwVruzmHAwsV0cZP5p42haGLYOTRGGFO9OGv\/y3B9TKZuA\/G\/pFDCLCpYHjs9vCd177gLqJlHWkqRp81RB8QEPgc588wKH\/u\/9cGA0Q4PhkCii5hS9ezzBmM2IcHDoysxm8Fqs13\/6Hv+X603\/E9+4uMMYg1iHGYq3FiEWsIybhuUHEhzV1UlYxsPaesvb4OpBqz3xd8z8wvSjf7jlH7gAAAABJRU5ErkJggg==\u0022 data-src=\u0022https:\/\/avris.it\/image\/naked-after-home_big.png\u0022 alt=\u0022\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u0022784.8\u0022\u003E\u003C\/span\u003E\n                \n            \u003C\/figure\u003E\n\u003Cfigure\u003E\n                \u003Cnoscript\u003E\n                    \u003Cimg src=\u0022https:\/\/avris.it\/image\/naked-after-place_big.png\u0022 alt=\u0022\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u0022647.34864300626\u0022\u003E                \n                \u003C\/noscript\u003E\n                \u003Cspan class=\u0022hide-noscript\u0022\u003E\u003Cimg src=\u0022data:image\/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAYCAYAAACSuF9OAAAACXBIWXMAAA7EAAAOxAGVKw4bAAAHIklEQVRIibWVS6slVxXHf\/tRj3Oq6jzu+9Hv0OkkEgQHcSLJwDgWjAMRR4ofQZwKfgU\/giMdiBMRHCQoSETQxkQx706nO7dvbvc9fZ51qmrvvRzUubfP7VbBgYsqqgr247f\/\/7VWqeyNX4jWgUhrRAIKIXiPdw3BN1w6\/iXF9APyvIcKnk5\/k29994fcvPUCj47usnf5CtdvvkCUpGiliCMwRvGDH\/2YD+58xMsDTe0atjeG5HmXuiyJjebeaMpB0cFYzZ2jE3pbhxSRwoLQTVN2+gkqOIwWvPPMyiUnpw2DtEOfnNFsjNLQPGr4+c9+ShwnmChiXjvy3oDvfO\/7vPLq62zv7GANhCBEcYpkXTpNydbGJgbPZDRC5z2aZck0tgzijMP9fe4fHzM82MHEL377J10aRouayaLi8bSirhuWVUPjHN3xOwz8iGEvx3lF0Y3Z7PUIwVPXFbVrCN7x\/u0\/8dZvfsXDk4fsHVzhzbffZr6sGFVQGcP9k4ccFinLquKL0YSmqrlxuEPlBI8i0bCzv4uFwKQRggRY3U0dkOAgeHaGBVt6A\/GO\/d0dHo0mNKLwcUYUZzy\/NWD8eISRVpU\/v\/lbbv\/+dzyI+tTGkhYFC2cIIaKfdZnMpmgFl3c36eYF09MxD05G9LsWaRqsUcKXrgyoGk9sQSOUVYN3DZPpnH6Vcn2wQXCB4Dwqs3QGO3wyaVDAlY0u2y89x7JqmC8qptMpWRy4e69CaUM5m5FkGcZGPJ4tyPOctL9DXE84GU+ZLxY8OD6md+0AgmC997zz8UMEIbEKhVBXNcE3qODwiecvH91lK0vxixIksLu9xV6\/y8H2JptJjdLCu+9\/TF3XPHz4iBuXcrzvUTmwkcXNF+giZyGaUVnz4ecf8fXnD8iTgn98eJe8mxAnKSeLJZbg6FNS2i4EjyJgcMRWqCpHbBX7O5t0Y808SWmIuD+aU+mKqkj5+4Mx20WCtYqr125yeOkSr772Gp\/9+i2q08cgEIJHe89fT2rGszmxaGzc4XQ6pmlqOpHm+q1bzMZzbJEotM25HC35dCTUroEQcOJQwXE6mdJP5yTGcuv5F6nKOdN5DdmAW7dusre7Q5bnRFFK5QM+CD6Adw0iggJiG1EvK1xTowR0mrKsK7I0YjDo0ywXOOdxErBagbWG+zNLExwoizIBjSZ4jenso7eucu16H5sUPHewh0I4On3MYH+fxkZ8djxiUh6RCgwPrvDJxx\/gfEBCwDtHU5XYJEUrCwowKbenUDdLbuzt4RdT3GxKPryMHdeGIskYbPWRWcOy9mSpZauXcOd4xvZVw+begEfjd9lMFfc+f4B3jjyJee+9f\/LJ3SNevrHL7e41Xpp\/xod\/vEOnN+Tq4QFJZ9xWrxJAE6cJadYl6XSpmoqujTjVMZv729xvBLvwWHzDYlFisXQ0JIlgVMODhyU4xzdf\/ypvfOMrANR1TRRFKKX4f4VFPHGkUUoxmteICIMsIo00ywqUAmMMSik+PzqiLEu00gw3hmxubNA4x3QyJU0TtNakaYpIO+9\/CaUUIoJVk09ZTmApAhJQEhiLbysuOJCb55OybpfIRtjIopUG4HE1YTQfsRH65HkOgABNveR4dMLOxiFpbBCRCxsDlGWJ9\/58XquQW6KgHbQCkhUQ4truvQpjLGnagnS73XYBaymKgsSm1HWrcJp2cMryt7Hjy+4IozUiIAi9ogAUgqCVxlr7lGVu2b6JAE9+H4iH4NrnU9IqpZjPF8RxTBBBRNBKkff7iAgikBrN1\/Y2UbTeaa0IIawUFLqdzjMwLZBfImtAsgKS4FHiLyg0mU6IrCXtdIiidrGmrjk+\/gIzVIQgFEXeQobA6ekpaZIQgqB0iya0lT+ZTDBas729fQHMiqtWAgqIrCwLLUwIF4BaudtoGkdVVfRsxtR0sJEFBO89WhtEa\/q9Pskq2VnlzdnZtW5z6emKtfglSOtqa1ULxfq9iulsRpZlbAyH54m5XC7Z399HJGCMwRizqjJFr1esQTy7+VkKXABSrnqCfQaFrFQKK5HbKIoC1zSMRiOyLCOKIhJV4l1JMAXeX8w37wNRHKH\/Qw9wzq0U1WuW+ercW0RQhPOKewLYxmQywXtPr+ixWJTAgiTpUAlEa2OKokfpHH+4c49Xdjex1qDgPMfOVBGR80Rfs6xe+5Q1pQQhXPBeKYVC4b3DmLZk47IC50mHw\/MeIwKxUjyXWhbz+QWA2XxGka+glCLPsqeAgluzRVb7rynEkxNkWYZ3Dq01\/X4fgJGd0NSK9Ck7lFKktu3wZz1HRCjynM6q5Neb5BpQs5YlsrpWXZWLg402YCFaK1OR8MyiZ3EGISKIDmitmc8XTKdTjLVk3S7GGDqdzhrQqvGdLalk\/UsuWDadTgEhiFAul3TSlN54yXxZQm\/rfFwQwRjDwcH+vwX9b\/EvDlDrxomykUsAAAAASUVORK5CYII=\u0022 data-src=\u0022https:\/\/avris.it\/image\/naked-after-place_big.png\u0022 alt=\u0022\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u0022647.34864300626\u0022\u003E\u003C\/span\u003E\n                \n            \u003C\/figure\u003E\n\u003Cfigure\u003E\n                \u003Cnoscript\u003E\n                    \u003Cimg src=\u0022https:\/\/avris.it\/image\/naked-after-submit_big.png\u0022 alt=\u0022\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u00221381.6666666667\u0022\u003E                \n                \u003C\/noscript\u003E\n                \u003Cspan class=\u0022hide-noscript\u0022\u003E\u003Cimg src=\u0022data:image\/png;base64,iVBORw0KGgoAAAANSUhEUgAAABkAAAAkCAYAAAB8DZEQAAAACXBIWXMAAA7EAAAOxAGVKw4bAAAGMklEQVRIiZWXu49cSRXGf6eq7qMf0z0z3Z6xkb32yAgk2AC0EhEkCBGw\/wABCcEGkBOQEbMBfwQiQUggLQsRiIAACRAIFrRazzK2sfFjPJ5H337ce6vqENx+zcyOMSepUt17zrnnq\/N9p1s+861f6UYnIbNKCIHJZMbebsIvfvgNyqqiKAo0KoPBNiKCiKCqrNviTEQA5ntQBRFwViB6z6RWhIAzisYIgDGGfq+PtWbpfDHB4vz4+ARjhH6\/T1EUdLvdeXJwiXjKWhAUiTVWK4QmqAAxRpyzlwJfMgHvAzFGQojLqgCcSywmRkBRIHoQVpWohv+dAGi3WlhrMcaQt\/LzSYpJTTt3TGYRK2DFEeeVTEPk4en4nMNFmID5c8UYQ+qS5mE14Va3hRVwvhxzVipooI4BjTVxuwvAg8dnvPf7fW7fuMbL0wlv3k7YaJv5ZTpSB6mrELHMakdiA8YqQYXEWujcRIzDqZ80X6QBjR6NFbFu7uD54WMOPvo1b7\/1TX7w3s\/46ckRuVMePpuSZhlfuDlCsjHEFCFhO59QmJq2zem2+nzvO+\/S29jExfUkwaOhIvp8Dkfkb\/uH\/OT93\/DhwSOsdRgR8laLYbfCaMHpKGW7HXH2jDOvRKNM4xSrngZlxYRqTKzGhHJMqMaEaoL6GQCJE06KKT\/\/3R8B8L4mKux0J8xCyle\/9m3yGGhnNc4anDGk4omxZBqUoAoILpbFGlyBGGuC7wCQOc9g0\/H8cEYdakARhCSDT7ee848\/\/5hrmzNMsKSpgEYSSRipYEOFzCnlfFUAETSiMaChRn0PgHFpGY0FjQ2DEWE2meBnQm09D54KW1nk3umQuzsFRje4lo\/p+AoFrGmUwMVqBKqoxlU1dQNXXdWcHR8jxpHmGaH2ILDbU6azHg9OHZndYG9zwo4oxz4gXogTyxtv3GLR+C5W43m\/xyZRDGgoAdgdbvH1L38JbIr3FaGu6bQzvnKnJksto1IoS0+Ihp1O4OUMNnLD2Fe0sj7GOkQEF+tJw3XVBjINaKgA+Nzd2\/zo+9+l1WqtCBgj\/zq4T97KGQ4GZFkGwLNnzwDo9Xrn31fFRT9dsVcjqBKjBxpZsdadE8Woig8eYwxFMSbPm3ZvVsE5d0kh3Bc\/v9dUwUK94LN3by2TpKk5J+HGGIaDIS5xpGm6lPiiGtHL+1R1TVVVdDqdpeRIjPGydl+wJocspf7Rw306GwNarRZJkpIkjuLFEbbTJkkSRARr7fID3PrAWQ0e5fzYaM4W1tvcxVpDlmUY04jpSTmD2QxjDVma0ev1liNCVNcrOY\/lvZP7\/PLBbxvoxBA18tbwTW5OuvS2dhAxdLod8ixlNGrUOkkT0iRZQgWs4HrVWL1oDw4f0U+65K0WeZYhIhzs\/5PBzs0lTKrQ7Tb34haOV43VT7Jtn2C72bJuVWWwewuNSpZlWHt+krpVuy0CfvKAWliMkSfFIV0NdLvN3MnznNOjJ+zcuINz7pLPa3XXRTs5ekl\/e+scH46LUxIsnU7nMk8W7fl61mD9+OlTRtMJ\/X6fVp6TpgnxbER27fqy2xpkmrgGVtg36\/r+\/L0stu12m1ae4+Y\/HECYpUJZlRRFQVVVLHgF4BaOq6C8MhHAcDhARBqJ8R5rLZvkuKRp3\/WuVFXMspeX6\/p+ta7jfG\/\/Yw5fvMCYhpAiwlFxRF3VhBAu+ZqLBwt2rydd2OLs+u4u21tbhBCo6xqArcGnCDFgjLn8kf8vGa86+\/f9j9i5cYc0TS69t2iF1ybjVWfZ1jZlWVLX\/tJ7ay28arl159dlkStK0mEf69zSx8j8jl9Fxo\/\/M+b9Pzy5MnDqDJWPVz5\/5+09WplFdFnXqpIPDk55590\/kTqhkxtCCIzGJVYCiXhORwXqZyTGkxnPyckxdVnQyZTMRE5OXjKbFkRfoRobgVz9aWm6ygfl5agidXA2aeZ6DJ6qLHHimU1n1PUUG0sIU6bFGcGPub43pN+xOKn56+PHRF+CRtx5Eq6xXiOqQuoMMQhRBPWQpRYnjnJmKacRa+b3qYqzhjRx\/P3Dg1VA9KrJCGgkeBhPAmigqio0VFRljdGKuq6pqppYT5tfOBr4ywf7RD8jxsD6JP0v8DmijnnKJUoAAAAASUVORK5CYII=\u0022 data-src=\u0022https:\/\/avris.it\/image\/naked-after-submit_big.png\u0022 alt=\u0022\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u00221381.6666666667\u0022\u003E\u003C\/span\u003E\n                \n            \u003C\/figure\u003E\u003C\/p\u003E\u003Csvg xmlns=\u0022http:\/\/www.w3.org\/2000\/svg\u0022 style=\u0022display: none;\u0022\u003E\u003C\/svg\u003E","tags":["bootstrap","colour","design","redesign","refactoring","naked","naked adventure","naturism","webdevelopment","website","font","symfony","javascript","booster"],"hasMore":true,"image":"https:\/\/avris.it\/image\/naked-revamp_small.png","introLite":"\u003Cfigure\u003E\u003Ca href=\u0022https:\/\/avris.it\/image\/naked-revamp_big.png\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Cimg src=\u0022https:\/\/avris.it\/image\/naked-revamp_mini.png\u0022 alt=\u0022\u0022 width=\u0022240\u0022 height=\u0022161.70744403956\u0022 loading=\u0022lazy\u0022\u003E\u003C\/a\u003E\u003C\/figure\u003E\u003C\/p\u003E\n\u003Cp\u003EYet another one of my projects, \u003Ca href=\u0022\/projects\/naked-adventure-de.lite\u0022\u003E Naked Adventure\u003C\/a\u003E,\ngrew too outdated to support it. I had to rewrite it from scratch.\u003C\/p\u003E\n\u003Cp\u003EI took the opportunity to redesign it as well. (screenshots before \u0026amp; after at the bottom)\u003C\/p\u003E","contentLite":"\u003Cfigure\u003E\u003Ca href=\u0022https:\/\/avris.it\/image\/naked-revamp_big.png\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Cimg src=\u0022https:\/\/avris.it\/image\/naked-revamp_mini.png\u0022 alt=\u0022\u0022 width=\u0022240\u0022 height=\u0022161.70744403956\u0022 loading=\u0022lazy\u0022\u003E\u003C\/a\u003E\u003C\/figure\u003E\u003C\/p\u003E\n\u003Cp\u003EYet another one of my projects, \u003Ca href=\u0022\/projects\/naked-adventure-de.lite\u0022\u003E Naked Adventure\u003C\/a\u003E,\ngrew too outdated to support it. I had to rewrite it from scratch.\u003C\/p\u003E\n\u003Cp\u003EI took the opportunity to redesign it as well. (screenshots before \u0026amp; after at the bottom)\u003C\/p\u003E\n\u003Cp\u003EHere\u0027s an overview of what I did:\u003C\/p\u003E\n\u003Cul\u003E\n\u003Cli\u003Ereplaced my abandoned framework \u003Ca href=\u0022\/projects\/micrus-v4.lite\u0022\u003E Micrus v4 \u2022 Beauty of simplicity\u003C\/a\u003E with \u003Ca href=\u0022https:\/\/symfony.com\/\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E Symfony 5\u003C\/a\u003E,\u003C\/li\u003E\n\u003Cli\u003Ebased the project on \u003Ca href=\u0022\/projects\/avris-booster-quick-start-of-new-projects.lite\u0022\u003E Avris Booster: Quick start of new projects\u003C\/a\u003E, to take advantage of built-in features:\nuser management (including a passwordless approach to authentication \u2013 \u003Ca href=\u0022\/blog\/passwords-are-pass%C3%A9.lite\u0022\u003E Passwords are pass\u00e9\u003C\/a\u003E), push notifications, etc.\u003C\/li\u003E\n\u003Cli\u003Ereplaced \u003Ca href=\u0022https:\/\/gitlab.com\/Avris\/Micrus-Assetic\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E custom Assetic setup\u003C\/a\u003E\nwith \u003Ca href=\u0022https:\/\/symfony.com\/doc\/current\/frontend\/encore\/installation.html\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E Webpack Encore\u003C\/a\u003E,\u003C\/li\u003E\n\u003Cli\u003Eupdated \u003Ca href=\u0022https:\/\/getbootstrap.com\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E Bootstrap\u003C\/a\u003E from 3.0 to 4.4,\u003C\/li\u003E\n\u003Cli\u003Eadded more contrast to the design, filled the excess of white spaces with content, making filters and maps more prominent,\u003C\/li\u003E\n\u003Cli\u003Ereplaced Google Maps with Apple Maps, because of privacy concerns (see: \u003Ca href=\u0022\/blog\/ungoogling.lite\u0022\u003E Ungoogling\u003C\/a\u003E, \u003Ca href=\u0022\/blog\/log-out-for-privacy.lite\u0022\u003E Log out for privacy\u003C\/a\u003E) \u2013 the website is now officially Google-free,\u003C\/li\u003E\n\u003Cli\u003Eremoved a couple of unnecessary and unused features:\n\u003Cul\u003E\n\u003Cli\u003Ethe homepage (now the user is shown the map right away \u2013 after all, the map is the whole point of the project),\u003C\/li\u003E\n\u003Cli\u003Ethe \u201dgeographic\u201d links (there\u0027s no separate map of e.g. German nude beaches anymore, it got integrated into the main map),\u003C\/li\u003E\n\u003Cli\u003Eseparate events section (now they show up together with places on the same map),\u003C\/li\u003E\n\u003Cli\u003Eforum (it wasn\u0027t used at all),\u003C\/li\u003E\n\u003Cli\u003Eadmin panel (now the buttons for admins are just integrated across the website),\u003C\/li\u003E\n\u003C\/ul\u003E\u003C\/li\u003E\n\u003Cli\u003Eimproved filters (for instance added filtering by name and location),\u003C\/li\u003E\n\u003Cli\u003Ethe process of submission of new steps isn\u0027t split into steps anymore: place info, review and description are finally just one single form,\u003C\/li\u003E\n\u003Cli\u003Eincluded some more \u003Ca href=\u0022\/blog\/reducing-website-size-by-a-half-by-optimising-bootstrap-and-fontawesome.lite\u0022\u003E optimisations\u003C\/a\u003E.\u003C\/li\u003E\n\u003C\/ul\u003E\n\u003Ch3\u003EBefore:\u003C\/h3\u003E\n\u003Cfigure\u003E\u003Ca href=\u0022https:\/\/avris.it\/image\/naked-before-home_big.png\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Cimg src=\u0022https:\/\/avris.it\/image\/naked-before-home_mini.png\u0022 alt=\u0022\u0022 width=\u0022240\u0022 height=\u0022286.83333333333\u0022 loading=\u0022lazy\u0022\u003E\u003C\/a\u003E\u003C\/figure\u003E\n\u003Cfigure\u003E\u003Ca href=\u0022https:\/\/avris.it\/image\/naked-before-map_big.png\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Cimg src=\u0022https:\/\/avris.it\/image\/naked-before-map_mini.png\u0022 alt=\u0022\u0022 width=\u0022240\u0022 height=\u0022227.80058651026\u0022 loading=\u0022lazy\u0022\u003E\u003C\/a\u003E\u003C\/figure\u003E\n\u003Cfigure\u003E\u003Ca href=\u0022https:\/\/avris.it\/image\/naked-before-place_big.png\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Cimg src=\u0022https:\/\/avris.it\/image\/naked-before-place_mini.png\u0022 alt=\u0022\u0022 width=\u0022240\u0022 height=\u0022223.16666666667\u0022 loading=\u0022lazy\u0022\u003E\u003C\/a\u003E\u003C\/figure\u003E\n\u003Cfigure\u003E\u003Ca href=\u0022https:\/\/avris.it\/image\/naked-before-submit_big.png\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Cimg src=\u0022https:\/\/avris.it\/image\/naked-before-submit_mini.png\u0022 alt=\u0022\u0022 width=\u0022240\u0022 height=\u0022202.99065420561\u0022 loading=\u0022lazy\u0022\u003E\u003C\/a\u003E\u003C\/figure\u003E\u003C\/p\u003E\n\u003Ch3\u003EAfter:\u003C\/h3\u003E\n\u003Cfigure\u003E\u003Ca href=\u0022https:\/\/avris.it\/image\/naked-after-home_big.png\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Cimg src=\u0022https:\/\/avris.it\/image\/naked-after-home_mini.png\u0022 alt=\u0022\u0022 width=\u0022240\u0022 height=\u0022196.2\u0022 loading=\u0022lazy\u0022\u003E\u003C\/a\u003E\u003C\/figure\u003E\n\u003Cfigure\u003E\u003Ca href=\u0022https:\/\/avris.it\/image\/naked-after-place_big.png\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Cimg src=\u0022https:\/\/avris.it\/image\/naked-after-place_mini.png\u0022 alt=\u0022\u0022 width=\u0022240\u0022 height=\u0022161.83716075157\u0022 loading=\u0022lazy\u0022\u003E\u003C\/a\u003E\u003C\/figure\u003E\n\u003Cfigure\u003E\u003Ca href=\u0022https:\/\/avris.it\/image\/naked-after-submit_big.png\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Cimg src=\u0022https:\/\/avris.it\/image\/naked-after-submit_mini.png\u0022 alt=\u0022\u0022 width=\u0022240\u0022 height=\u0022345.41666666667\u0022 loading=\u0022lazy\u0022\u003E\u003C\/a\u003E\u003C\/figure\u003E\u003C\/p\u003E","words":262,"readTime":2,"lang":"en"}}},"projects\/avris-booster-quick-start-of-new-projects":{"key":"projects\/avris-booster-quick-start-of-new-projects","type":"article","published":true,"meta":{"createdAt":"2020-04-13T11:56:14+02:00","publishedAt":"2020-04-13T11:56:14+02:00","group":null,"links":[{"icon":"brands gitlab","colour":"primary","url":"https:\/\/gitlab.com\/Avris\/Booster","displayUrl":null}],"category":"projects","subcategory":null,"slug":"avris-booster-quick-start-of-new-projects"},"content":{"en":{"slug":"avris-booster-quick-start-of-new-projects","title":"Avris Booster: Quick start of new projects","intro":"\u003Cfigure\u003E\n                \u003Cnoscript\u003E\n                    \u003Cimg src=\u0022https:\/\/avris.it\/image\/booster_small.png\u0022 alt=\u0022\u0022 class=\u0022border-bottom\u0022 width=\u0022480\u0022 height=\u0022329.18322295806\u0022\u003E                \n                \u003C\/noscript\u003E\n                \u003Cspan class=\u0022hide-noscript\u0022\u003E\u003Cimg src=\u0022data:image\/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAYCAYAAACSuF9OAAAACXBIWXMAAA7EAAAOxAGVKw4bAAADQUlEQVRIib2WS3IjVRBFT75PValUalltdxA0joABMzbQO2MXLIGFsA5mDBgYogMCW2pZn\/pmMijZVskf2jbqO3tV73Pz3nyZT84+\/GjscDYbM52MABCBi49z8lFKVTUoRlU1mAmvgQicpo7SR9LoWa5Kmlbv\/v\/08y\/2xPpX4f1XM9IkPjmnrGo+\/r24I6Sqt4QuLi6o6hrvPJvtFucEJ47z828Yj8fPJlTVLWkS+PW3j\/zw\/dd0qvz+xyXfvn\/Ln38t+O78lHo35wZhf4M8z4lJQvCe0ShDzXh39o4Yw73DPgcicLlYcTIZcblYY2ZkaaBuWoJ3\/HO1YjrJhmvM7Fah9WpF23VMp9MXETiEasenT0tEBBFH13WIgHMOU6OYTHoXnLtdMwg9zTKsalksN2AK9FydGKqKSUQwTBtEBCSCtYiAqhJjpKkbvPcYRpam1G3H7GT2gHwQgkdVh5\/3c6jrOjbbhs56Am+nY8x66W9wOO6\/WU\/wAOuypaxaVA3DwNjNM5pOSHzHmyIj2UuJgWVlWXK1LNmWNUn0JF5Isgwzw4lgXcVs9kC0j0BV2Yv3vkK+V2hg2R4fAJLgaWNABNq2YnttZGmkGCVk+RsO5z8FEcH7x+vWjbL7ew5yyHtPEhpUHeI8qp7MC1WjbKs+b\/JR8tmEXoJ7ls3nc5qmoSgK\/E5Skf4mqGpv305iMzBTnI90JjgUrLuLNgSKongWoYFlznmyLCeElqrzBBzgOTt5flG8wXMshgPLzBQ1o25aRnkkTZIHb88xEfYPNDNMW9qm5HpRIidTkpggcty82ce9OtS2HWZ9sUrT9MsrtD9YLq9Zr1eI8wgwnU7J8\/yoBA7jHViWJJG6yTBTzOB6tcKHgHPHU8mJGzTvwS0zoOtafAhkSSTEBCfutt\/ckD9sFcIrCAuPF0ZVpW1a6rphs17vlBImxRhxDhGH7DZQVUKIjEYZzvmXEzpAOExaw26T2oknphFxDuc8zjnG49ED27zm0SkDtQeWCeyqshBCwtnZ6X07\/u8H71OWhRDJ8xwRoSgmRzn\/vzDoZavVirZt6bq+f81mJ1+GxGOWmRlX8zkC5OMx680GVDHxOOeP1un3OfwL1QqaGbIjT+wAAAAASUVORK5CYII=\u0022 data-src=\u0022https:\/\/avris.it\/image\/booster_small.png\u0022 alt=\u0022\u0022 class=\u0022border-bottom\u0022 width=\u0022480\u0022 height=\u0022329.18322295806\u0022\u003E\u003C\/span\u003E\n                \n            \u003C\/figure\u003E\u003C\/p\u003E\n\u003Cp\u003EI got super annoyed having to set up all the dependencies for each project every time I started one,\nand especially implementing user management... Log in, register, confirm email, forgot password,\nMFA, change email, impersonate, manage avatars, over and over again, booooooring!\u003C\/p\u003E\n\u003Cp\u003ESo here it is: a template for quickstarting new projects,\nwith all of the above (and more!) included out of the box!\u003C\/p\u003E\u003Csvg xmlns=\u0022http:\/\/www.w3.org\/2000\/svg\u0022 style=\u0022display: none;\u0022\u003E\u003C\/svg\u003E","content":"\u003Cfigure\u003E\n                \u003Cnoscript\u003E\n                    \u003Cimg src=\u0022https:\/\/avris.it\/image\/booster_big.png\u0022 alt=\u0022\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u0022658.36644591611\u0022\u003E                \n                \u003C\/noscript\u003E\n                \u003Cspan class=\u0022hide-noscript\u0022\u003E\u003Cimg src=\u0022data:image\/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAYCAYAAACSuF9OAAAACXBIWXMAAA7EAAAOxAGVKw4bAAADQUlEQVRIib2WS3IjVRBFT75PValUalltdxA0joABMzbQO2MXLIGFsA5mDBgYogMCW2pZn\/pmMijZVskf2jbqO3tV73Pz3nyZT84+\/GjscDYbM52MABCBi49z8lFKVTUoRlU1mAmvgQicpo7SR9LoWa5Kmlbv\/v\/08y\/2xPpX4f1XM9IkPjmnrGo+\/r24I6Sqt4QuLi6o6hrvPJvtFucEJ47z828Yj8fPJlTVLWkS+PW3j\/zw\/dd0qvz+xyXfvn\/Ln38t+O78lHo35wZhf4M8z4lJQvCe0ShDzXh39o4Yw73DPgcicLlYcTIZcblYY2ZkaaBuWoJ3\/HO1YjrJhmvM7Fah9WpF23VMp9MXETiEasenT0tEBBFH13WIgHMOU6OYTHoXnLtdMwg9zTKsalksN2AK9FydGKqKSUQwTBtEBCSCtYiAqhJjpKkbvPcYRpam1G3H7GT2gHwQgkdVh5\/3c6jrOjbbhs56Am+nY8x66W9wOO6\/WU\/wAOuypaxaVA3DwNjNM5pOSHzHmyIj2UuJgWVlWXK1LNmWNUn0JF5Isgwzw4lgXcVs9kC0j0BV2Yv3vkK+V2hg2R4fAJLgaWNABNq2YnttZGmkGCVk+RsO5z8FEcH7x+vWjbL7ew5yyHtPEhpUHeI8qp7MC1WjbKs+b\/JR8tmEXoJ7ls3nc5qmoSgK\/E5Skf4mqGpv305iMzBTnI90JjgUrLuLNgSKongWoYFlznmyLCeElqrzBBzgOTt5flG8wXMshgPLzBQ1o25aRnkkTZIHb88xEfYPNDNMW9qm5HpRIidTkpggcty82ce9OtS2HWZ9sUrT9MsrtD9YLq9Zr1eI8wgwnU7J8\/yoBA7jHViWJJG6yTBTzOB6tcKHgHPHU8mJGzTvwS0zoOtafAhkSSTEBCfutt\/ckD9sFcIrCAuPF0ZVpW1a6rphs17vlBImxRhxDhGH7DZQVUKIjEYZzvmXEzpAOExaw26T2oknphFxDuc8zjnG49ED27zm0SkDtQeWCeyqshBCwtnZ6X07\/u8H71OWhRDJ8xwRoSgmRzn\/vzDoZavVirZt6bq+f81mJ1+GxGOWmRlX8zkC5OMx680GVDHxOOeP1un3OfwL1QqaGbIjT+wAAAAASUVORK5CYII=\u0022 data-src=\u0022https:\/\/avris.it\/image\/booster_big.png\u0022 alt=\u0022\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u0022658.36644591611\u0022\u003E\u003C\/span\u003E\n                \n            \u003C\/figure\u003E\u003C\/p\u003E\n\u003Cp\u003EI got super annoyed having to set up all the dependencies for each project every time I started one,\nand especially implementing user management... Log in, register, confirm email, forgot password,\nMFA, change email, impersonate, manage avatars, over and over again, booooooring!\u003C\/p\u003E\n\u003Cp\u003ESo here it is: a template for quickstarting new projects,\nwith all of the above (and more!) included out of the box!\u003C\/p\u003E\u003Csvg xmlns=\u0022http:\/\/www.w3.org\/2000\/svg\u0022 style=\u0022display: none;\u0022\u003E\u003C\/svg\u003E","tags":["booster","quickstart","symfony","php","webpack","bootstrap","javascript","css","user management","template"],"hasMore":false,"image":"https:\/\/avris.it\/image\/booster_small.png","introLite":"\u003Cfigure\u003E\u003Ca href=\u0022https:\/\/avris.it\/image\/booster_big.png\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Cimg src=\u0022https:\/\/avris.it\/image\/booster_mini.png\u0022 alt=\u0022\u0022 width=\u0022240\u0022 height=\u0022164.59161147903\u0022 loading=\u0022lazy\u0022\u003E\u003C\/a\u003E\u003C\/figure\u003E\u003C\/p\u003E\n\u003Cp\u003EI got super annoyed having to set up all the dependencies for each project every time I started one,\nand especially implementing user management... Log in, register, confirm email, forgot password,\nMFA, change email, impersonate, manage avatars, over and over again, booooooring!\u003C\/p\u003E\n\u003Cp\u003ESo here it is: a template for quickstarting new projects,\nwith all of the above (and more!) included out of the box!\u003C\/p\u003E","contentLite":"\u003Cfigure\u003E\u003Ca href=\u0022https:\/\/avris.it\/image\/booster_big.png\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Cimg src=\u0022https:\/\/avris.it\/image\/booster_mini.png\u0022 alt=\u0022\u0022 width=\u0022240\u0022 height=\u0022164.59161147903\u0022 loading=\u0022lazy\u0022\u003E\u003C\/a\u003E\u003C\/figure\u003E\u003C\/p\u003E\n\u003Cp\u003EI got super annoyed having to set up all the dependencies for each project every time I started one,\nand especially implementing user management... Log in, register, confirm email, forgot password,\nMFA, change email, impersonate, manage avatars, over and over again, booooooring!\u003C\/p\u003E\n\u003Cp\u003ESo here it is: a template for quickstarting new projects,\nwith all of the above (and more!) included out of the box!\u003C\/p\u003E","words":64,"readTime":null,"lang":"en"}}},"blog\/technology\/redesigning-a-website-avi":{"key":"blog\/technology\/redesigning-a-website-avi","type":"article","published":true,"meta":{"createdAt":"2020-04-10T19:33:59+02:00","publishedAt":"2020-04-10T19:33:59+02:00","group":"redesign","links":[{"icon":"globe-europe","colour":"primary","url":"https:\/\/avi.avris.it","displayUrl":null},{"icon":"brands gitlab","colour":"secondary","url":"https:\/\/gitlab.com\/Avris\/Avi","displayUrl":null}],"category":"blog","subcategory":"technology","slug":"redesigning-a-website-avi"},"content":{"en":{"slug":"redesigning-a-website-avi","title":"Redesigning a website: Avi","intro":"\u003Cfigure\u003E\n                \u003Cnoscript\u003E\n                    \u003Cimg src=\u0022https:\/\/avris.it\/image\/avi-comparison_small.png\u0022 alt=\u0022\u0022 class=\u0022border-bottom\u0022 width=\u0022480\u0022 height=\u0022403.61904761905\u0022\u003E                \n                \u003C\/noscript\u003E\n                \u003Cspan class=\u0022hide-noscript\u0022\u003E\u003Cimg src=\u0022data:image\/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAeCAYAAABE4bxTAAAACXBIWXMAAA7EAAAOxAGVKw4bAAAF+ElEQVRYhbWXy48cVxXGf\/dVVd093Z6ezKPHYw\/jJNhjj+PEsRWwMxEKCFYIBSWLwIIFiCURfwQrlrCBDQKiyAobXlFYBITA4BBDHE8snPBMzMSKHz3TM+6Z7urqqntZVPdtT+ZhGw+f1OqS6tx7T33nO9+pEkmSOOccUkruFc45AJ59\/is0m2sYY2i1WzgHQgicc6Rpis2yu95TO+cQQnD+\/HmMMTz22HG0Vj4gSRJWV1awzoFzaKNJuylSKarVqk+qHcdYa1FKAQLnLEJIlJI460AIwIGDzFqSpLt1Qv2Lw4cPo7XGZimJTQFQSqO1Yqhc9guiKPLXWe\/JR0aqABitEVIA+eHW5sz3kxYCnANrLUmSbJmQSJLEAbTX1nHOMjRUpsf54L8HafSGxWmaehaNMcRxjDEBYRhsU5A7w5esEIbgQChJmmXE7VZPB6CUxBiD6MXCQD\/5+lx\/aZaRZXHvXn5fKYUxpsdQvnbx2lVe\/cNrzD00y\/zxTw7YEQLdD8I6XJpBIUQIEAiscxip0Nr0tt8McRuDpVKJoHf4TrGLt5a5uHqdlUXFU4+f2vCAg5K1214T9JiwvSCtNcYYrwchhP8BdLspQWBwzvVEvTWszfdbaq9x4dr7TO8Z5dBILU9ESpQUiE6n44QQxHFMlmVIIUAKPCXO4chlSq+VlVIEQXBba2dEUchO9pFllub6em\/PPmUgpcRogzYBRjFIKE3TPKk0RWntD+vDOYfW2h8oZa4r5xytuEM3SUjTlCiKKBaL27J0J\/iSOedyhqTcoIsdF\/fi1lsxURjgkmyD33g2BL5rRaB7dG+546DLlFI71n8rWGsHLFqHW+sgymF+KNBsNr0uwzDM9+8mBMF2tuAGXVav1ymVSpRKpY0hzuVGlib8+Nff44HKGF88\/aVNLCEFohgg1EBDQRAgLCBAK7XJxz4KIcTAqSuVMlJIkqRD\/6GDIMA5h3OOThrzD3eZ6+1hnnHP+24DUEoglUQMheSGkUP\/D1ryJUuShHK5sjlroNvtotB8\/uRzVMwwQggW6x+yf3Qy7zqpsFlGo9HAWkutVrvn8vvz+qJOkoRCobBlkLUWYIPgrzVuMlrOZ1i3m6KUJI5jnAgQLvFdqZTybEop83lpLVLKLZP2JTt7+S\/caq+hZS7uTjcffk8cfJSPTUxtWlirjvlZBnhLSJIWUiqkFGRZ5jXYF7eUkiiKkFKSpqlP3DPU96G1uEWapZsOHiqUCPTW46DfZb87e27g8vcJPbiQCJQ3xEqlckc\/6pfypTM\/YWm5gTEayIetdQ5Bzoi1lrjTAbfdRBzAa+i7535BfX2VRnuNzwYzvPjyGZIk4Wtf\/jrf+fZZqtUiT3\/mGG\/86QxxHBNFET986UdArqFicWv93Stk39iWKxFTDx\/i6kiBbpYx\/+STnDhxgrjt+GDBMP3AIRofKFauLPPCN16g8f4SwIbxsisJ9csyceAhupNjHDx2klqtRitNMcUi46MTfGLuNHK1Rq26n6MzR3jxWz\/g6MwRgLseM3cLr6HH\/3aTG\/UbzABjD5d4cGIBKRXDI3Oog79hWQiCqScwS2X2DGuCbSzifuFLViwVeWTuGFNTU2T2KtPTYwyVl2g2b1Aw+wnlFH+92ODKuUXmT85z5Y\/\/ATa+Oe7GzzO0d2qSTrfDRHEcI95Dhx8yNrGH1nKZhddXCSPD6U\/tZbY8y60LTWYrh\/8vDPnh+stfvcK7\/3wXgK8+\/QX+\/PPchR99rsqnv\/kmAKeO7mVhr+Wt+luMfm4U2H0N+ZK9dulnzD91ipff+D4rly5TaXbovHmJG\/\/6O8P7asweeYS3l\/7Nqwuvs2\/u47xy8Ryw+13mGaocEPz+2k+ZOB4xqjS3Llxk\/OZNhgtF3tEN6iJget9+wpkav118h8KBSWDA0G4x5Y1xuX2duNsCYFKN011aBkCNj1KX+VdmSYesr7dJbYaWionyMLC7xuhnWX\/y9r8qpZRw27s+gBSCzFqiIATwwzNNs11LSPdnV38uATu8YpK\/+9wW+9EPx\/vFfwEsBAWgUvaJSgAAAABJRU5ErkJggg==\u0022 data-src=\u0022https:\/\/avris.it\/image\/avi-comparison_small.png\u0022 alt=\u0022\u0022 class=\u0022border-bottom\u0022 width=\u0022480\u0022 height=\u0022403.61904761905\u0022\u003E\u003C\/span\u003E\n                \n            \u003C\/figure\u003E\u003C\/p\u003E\n\u003Cp\u003EYet another one of my projects, \u003Ca href=\u0022\/projects\/avi-simple-placeholder-avatars\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-cogs\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E Avi \u2022 Simple placeholder avatars\u003C\/a\u003E,\ngrew too outdated to support it. I had to rewrite it from scratch.\u003C\/p\u003E\n\u003Cp\u003EI took the opportunity to redesign it as well.\u003C\/p\u003E\u003Csvg xmlns=\u0022http:\/\/www.w3.org\/2000\/svg\u0022 style=\u0022display: none;\u0022\u003E\u003C\/svg\u003E","content":"\u003Cfigure\u003E\n                \u003Cnoscript\u003E\n                    \u003Cimg src=\u0022https:\/\/avris.it\/image\/avi-comparison_big.png\u0022 alt=\u0022\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u0022807.2380952381\u0022\u003E                \n                \u003C\/noscript\u003E\n                \u003Cspan class=\u0022hide-noscript\u0022\u003E\u003Cimg src=\u0022data:image\/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAeCAYAAABE4bxTAAAACXBIWXMAAA7EAAAOxAGVKw4bAAAF+ElEQVRYhbWXy48cVxXGf\/dVVd093Z6ezKPHYw\/jJNhjj+PEsRWwMxEKCFYIBSWLwIIFiCURfwQrlrCBDQKiyAobXlFYBITA4BBDHE8snPBMzMSKHz3TM+6Z7urqqntZVPdtT+ZhGw+f1OqS6tx7T33nO9+pEkmSOOccUkruFc45AJ59\/is0m2sYY2i1WzgHQgicc6Rpis2yu95TO+cQQnD+\/HmMMTz22HG0Vj4gSRJWV1awzoFzaKNJuylSKarVqk+qHcdYa1FKAQLnLEJIlJI460AIwIGDzFqSpLt1Qv2Lw4cPo7XGZimJTQFQSqO1Yqhc9guiKPLXWe\/JR0aqABitEVIA+eHW5sz3kxYCnANrLUmSbJmQSJLEAbTX1nHOMjRUpsf54L8HafSGxWmaehaNMcRxjDEBYRhsU5A7w5esEIbgQChJmmXE7VZPB6CUxBiD6MXCQD\/5+lx\/aZaRZXHvXn5fKYUxpsdQvnbx2lVe\/cNrzD00y\/zxTw7YEQLdD8I6XJpBIUQIEAiscxip0Nr0tt8McRuDpVKJoHf4TrGLt5a5uHqdlUXFU4+f2vCAg5K1214T9JiwvSCtNcYYrwchhP8BdLspQWBwzvVEvTWszfdbaq9x4dr7TO8Z5dBILU9ESpQUiE6n44QQxHFMlmVIIUAKPCXO4chlSq+VlVIEQXBba2dEUchO9pFllub6em\/PPmUgpcRogzYBRjFIKE3TPKk0RWntD+vDOYfW2h8oZa4r5xytuEM3SUjTlCiKKBaL27J0J\/iSOedyhqTcoIsdF\/fi1lsxURjgkmyD33g2BL5rRaB7dG+546DLlFI71n8rWGsHLFqHW+sgymF+KNBsNr0uwzDM9+8mBMF2tuAGXVav1ymVSpRKpY0hzuVGlib8+Nff44HKGF88\/aVNLCEFohgg1EBDQRAgLCBAK7XJxz4KIcTAqSuVMlJIkqRD\/6GDIMA5h3OOThrzD3eZ6+1hnnHP+24DUEoglUQMheSGkUP\/D1ryJUuShHK5sjlroNvtotB8\/uRzVMwwQggW6x+yf3Qy7zqpsFlGo9HAWkutVrvn8vvz+qJOkoRCobBlkLUWYIPgrzVuMlrOZ1i3m6KUJI5jnAgQLvFdqZTybEop83lpLVLKLZP2JTt7+S\/caq+hZS7uTjcffk8cfJSPTUxtWlirjvlZBnhLSJIWUiqkFGRZ5jXYF7eUkiiKkFKSpqlP3DPU96G1uEWapZsOHiqUCPTW46DfZb87e27g8vcJPbiQCJQ3xEqlckc\/6pfypTM\/YWm5gTEayIetdQ5Bzoi1lrjTAbfdRBzAa+i7535BfX2VRnuNzwYzvPjyGZIk4Wtf\/jrf+fZZqtUiT3\/mGG\/86QxxHBNFET986UdArqFicWv93Stk39iWKxFTDx\/i6kiBbpYx\/+STnDhxgrjt+GDBMP3AIRofKFauLPPCN16g8f4SwIbxsisJ9csyceAhupNjHDx2klqtRitNMcUi46MTfGLuNHK1Rq26n6MzR3jxWz\/g6MwRgLseM3cLr6HH\/3aTG\/UbzABjD5d4cGIBKRXDI3Oog79hWQiCqScwS2X2DGuCbSzifuFLViwVeWTuGFNTU2T2KtPTYwyVl2g2b1Aw+wnlFH+92ODKuUXmT85z5Y\/\/ATa+Oe7GzzO0d2qSTrfDRHEcI95Dhx8yNrGH1nKZhddXCSPD6U\/tZbY8y60LTWYrh\/8vDPnh+stfvcK7\/3wXgK8+\/QX+\/PPchR99rsqnv\/kmAKeO7mVhr+Wt+luMfm4U2H0N+ZK9dulnzD91ipff+D4rly5TaXbovHmJG\/\/6O8P7asweeYS3l\/7Nqwuvs2\/u47xy8Ryw+13mGaocEPz+2k+ZOB4xqjS3Llxk\/OZNhgtF3tEN6iJget9+wpkav118h8KBSWDA0G4x5Y1xuX2duNsCYFKN011aBkCNj1KX+VdmSYesr7dJbYaWionyMLC7xuhnWX\/y9r8qpZRw27s+gBSCzFqiIATwwzNNs11LSPdnV38uATu8YpK\/+9wW+9EPx\/vFfwEsBAWgUvaJSgAAAABJRU5ErkJggg==\u0022 data-src=\u0022https:\/\/avris.it\/image\/avi-comparison_big.png\u0022 alt=\u0022\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u0022807.2380952381\u0022\u003E\u003C\/span\u003E\n                \n            \u003C\/figure\u003E\u003C\/p\u003E\n\u003Cp\u003EYet another one of my projects, \u003Ca href=\u0022\/projects\/avi-simple-placeholder-avatars\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-cogs\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E Avi \u2022 Simple placeholder avatars\u003C\/a\u003E,\ngrew too outdated to support it. I had to rewrite it from scratch.\u003C\/p\u003E\n\u003Cp\u003EI took the opportunity to redesign it as well.\u003C\/p\u003E\n\u003Cp\u003EIt\u0027s quite a simple project, so it only took me a couple of hours. Here\u0027s what I did:\u003C\/p\u003E\n\u003Cul\u003E\n\u003Cli\u003Ereplaced my abandoned framework \u003Ca href=\u0022\/projects\/micrus-v4\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-cogs\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E Micrus v4 \u2022 Beauty of simplicity\u003C\/a\u003E with \u003Ca href=\u0022https:\/\/symfony.com\/\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-link\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E Symfony 5\u003C\/a\u003E,\u003C\/li\u003E\n\u003Cli\u003Ereplaced \u003Ca href=\u0022https:\/\/gitlab.com\/Avris\/Micrus-Assetic\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-link\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E custom Assetic setup\u003C\/a\u003E\nwith \u003Ca href=\u0022https:\/\/symfony.com\/doc\/current\/frontend\/encore\/installation.html\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-link\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E Webpack Encore\u003C\/a\u003E,\u003C\/li\u003E\n\u003Cli\u003Eupdated \u003Ca href=\u0022https:\/\/getbootstrap.com\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-link\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E Bootstrap\u003C\/a\u003E from 3.0 to 4.4,\u003C\/li\u003E\n\u003Cli\u003Eadded more contrast to the design, while keeping it simple,\u003C\/li\u003E\n\u003Cli\u003Eremoved the ugly logo,\u003C\/li\u003E\n\u003Cli\u003Ereplaced the font that I used to overuse, \u003Ca href=\u0022https:\/\/design.ubuntu.com\/font\/\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-link\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E Ubuntu\u003C\/a\u003E,\nwith the beautiful \u003Ca href=\u0022https:\/\/fonts.google.com\/specimen\/Baloo+Thambi+2\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-link\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E Baloo Thambi 2\u003C\/a\u003E\nand \u003Ca href=\u0022https:\/\/www.jetbrains.com\/lp\/mono\/\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-link\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E JetBrains Mono\u003C\/a\u003E,\u003C\/li\u003E\n\u003Cli\u003Emoved the generation of links from backend to frontend \u2013\u00a0now it gives you an immediate feedback\nto changes in the form, without having to reload the website,\u003C\/li\u003E\n\u003Cli\u003Eremoved the \u201cLatest generated avatars\u201d section \u2013 I never liked it, but I needed some showcase\nof what this project does\u2026 with the immediate feedback in the \u201cTry it!\u201d section, it\u0027s not needed anymore,\u003C\/li\u003E\n\u003Cli\u003Eincluded some more \u003Ca href=\u0022\/blog\/reducing-website-size-by-a-half-by-optimising-bootstrap-and-fontawesome\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-computer-speaker\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E optimisations\u003C\/a\u003E.\u003C\/li\u003E\n\u003C\/ul\u003E\n\u003Ch3\u003EBefore:\u003C\/h3\u003E\n\u003Cfigure\u003E\n                \u003Cnoscript\u003E\n                    \u003Cimg src=\u0022https:\/\/avris.it\/image\/avi-old_big.png\u0022 alt=\u0022\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u00221695.2\u0022\u003E                \n                \u003C\/noscript\u003E\n                \u003Cspan class=\u0022hide-noscript\u0022\u003E\u003Cimg src=\u0022data:image\/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAkCAYAAACJ8xqgAAAACXBIWXMAAA7EAAAOxAGVKw4bAAAFCklEQVRIia2W229UVRjFf3vvc84MnTkzhU5LOy3QYQqUQAKUIAoGFNFETEgw+mTiizFi4pN\/hNEXH4gxMSaGmKiJBpWgCeqDYPVBEeQqlGulF2m1tMN0hjlzLtuH6TntOAVF\/B73\/vaab+219pojHMfRAEII7qe01gAY4YIQgv7+fjb29WGnUg0HyqUSgQ7QGnzfxzAMgiBAAFYshpSyHnB4eJhSqYTnezhOBbRGCIkQAtOyKJfLuJ4HaKRUEWAIFA0WUgYIggDDMFBK3TNdz\/NqE4Z353sebrmCNk2wTNAahIBg5vekBB2AEKiY1QAY4kSUDakQUmHEYwhD4bou5XIZKSU6CBBSYlkWSkqk1typZi9Aa3TVJXDdOZuCwPeRCAwhUTPgd6toQl+A22ThaZ9gehoAZRqIGSUDoRFSoaSILHJXwMD3qVartQmEACUQ7qy\/tNZUKg5SCISU0XoymaxT2gg3pFKYpokQoR7zG11rjZQSKWuWCoKgrjdSOWysVqu1DcNAiBq9+SgGQYDWGqVUdBZAVKvVqFtrPa9Z\/6nqJowoz9C4V1PPHQTmUHYch9u3b2PbNrFYrOFQeOC2U+b6+DUMZZLPrmyYsi4cEokEpmlGh+eW7\/sAnB0+yb7Dr1EoT\/HZq0cb+iLKge\/jem5Dg2ma0TVorbFsi+Z1C8nQGokVigd\/EwW4oyDVanUmADRNTYloffTmOLdKRVZ25uoBPc9DCIFlWfMC3smXnu\/jBz5KyHrK47ducmnkGkopDGXMNNciKd1ks6FnzbyAhlIoKRvjS0mFZVoRbcHsvfwbK4U4UcCGT+m\/VJ0Pw8VCqcjQ+O8IKTGEJKYlgQYlJYlEArRJaboCwMJFSaanp6Jn2tbWRjwer6d8YnyQN3\/4nA3tOa4Vxukbs9j\/0Qek7BRrenupjq3i4IFjrF6bZfeeBzh44HXsdIqTx3\/hnf3vsnvP7voJLdvmqS1P8M2NAdoXLWeRX2HvCy9iJ5NcGRxkaiJLe3wVjz+8gaRKkom38NIrL\/P1wcPE1ezLkmGamLbNmWaDnX3bSOVytGQy3Jia5PLIEO2dWZrNTrZv3sqFfknCyJC12\/nwjfcpDhZYIGNRKkWUcxXBM0MeMMbG+AIy+TSWrKne3pbhtwUOA+evA7DywQ6M5h3c\/PMmANkVSxrf8nRhElku4zgV\/vBc\/PQlpqZ+QkqNUznNJx8vJWnHOH9uCNcPOP7Fl2zYup5vDx2lt3c1+VX5GmDoNdtOkevupimeYGJqAskw6XQfvu9R9SYwRZYdj6zn+qUjGKKFXCJHT1sParPCNuzZT5FwVNu2EWbtHhYvbgM\/y2TxEKaRxjLyLOtawf63LyJlF4tbu8j2rsO56GAXU2QWtjRSPnX2FG+9tw+Azo5Onl79ED9+6gDj9GzO0bn9Css6TgDQui7NkZEzjIyOQitsiveRZ3m9yjcKQ3T0tNC2PM33l79iemCAFs9nxZKlFI79zPnJIbZt3smWTY8yWBznuwuneWzXk1wpTjA6OdGosmkLvHSBZDyFXRRklMnkrwOIWyWyHe20LO2mlLAoOiVSiRbsXCcnRq8yZrpYqUQj5XzXCs5NtgLw7LLnWOJsIlGs\/eEn167B6VnF1eIYC+LNrMvkCXYJJooF9nY\/T35Jd2TsunC4n2oIh7lp43kerusihEAatejyfA\/LsHB9FykkgQ6ImTHkTPyHgOL\/\/iT+C3VfUNvDPRWOAAAAAElFTkSuQmCC\u0022 data-src=\u0022https:\/\/avris.it\/image\/avi-old_big.png\u0022 alt=\u0022\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u00221695.2\u0022\u003E\u003C\/span\u003E\n                \n            \u003C\/figure\u003E\u003C\/p\u003E\n\u003Ch3\u003EAfter:\u003C\/h3\u003E\n\u003Cfigure\u003E\n                \u003Cnoscript\u003E\n                    \u003Cimg src=\u0022https:\/\/avris.it\/image\/avi-new_big.png\u0022 alt=\u0022\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u0022632\u0022\u003E                \n                \u003C\/noscript\u003E\n                \u003Cspan class=\u0022hide-noscript\u0022\u003E\u003Cimg src=\u0022data:image\/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAXCAYAAABj7u2bAAAACXBIWXMAAA7EAAAOxAGVKw4bAAACzElEQVRIib2Wu3IjVRCGvz6XmfHu4hvrMhkpkSNT1FJFsC9BxhtQvAAxAQHPCMHmrHGNR3NuTXBGkrXWSLLA+1epdGZa6v77fuT23XtlBt1JizGWh\/4BUEAmydz5v8OpzPLBWsvZ6SnOWUTM6r2qIsCwWJBzRkSQidqSYEzxOEJoVSUioKAoTAZiTAzDgDEGQRAjaCnVpBjevH6FKogIqmX6rrQ+3v1DKfPOzhJ6993tUZ68FKTscCPGyGKxIKXMxcX5ZyHkVswehXuJUgoPDwPGGj7e3eG9B11XSts0eO+3lvWfH\/4ipMjl6QVXl283ZCL116r65Lw3QilnTrru2Z7+8MuPfPnFOd9+c8OvP\/188P\/cLqG1FrZEbhuWni5xdXPD12+\/4s3F1cFkYE8NpZQopdA0zV5FOZfaoRM+3P9NLIWztuOye700hzEGa45MmaqScsa7nYGkqNL3A2MYgToCVMGYddS67gTF0rUeb+d1SQhxllCIAWtsTd1ngsulzAr7fmAYBkC5vr7+\/6zu2ECyGMN8ynJBhwhG6gdAp0rJkyPWAIqoVIWd389n2QBbCLmZ92vjY0S8Q175yTiEcaQf+2m\/Kd55mrahlAJjoWvbvaQAJh82zg42h9qnA06cnSK0Xq5ihNbXzrMIiOD2FP6hqCmbCdEh8+cooztStrPth8WCMI7kXDDGcH5+9iIEH8N9OmE3hNYQRTBGsNY8mcYvQmiXsKZMMNaDCPf396s0LmeTqmKMoZSC9w3WmjpQU6Lrumc7YdaGH5OoWN4DVetqiDFSSiGl9GRYigjjuCCEelPspoWsqrP6t51F91RuSom+7+sOshYRUBVEapRyzqtrbL09VnLee8zUmSEE2rZdPe+C++33P2aF63vy+vnQ7X8s5Pb797pt6wI452iaBkHJueC8I6WMMUIpSts0hBgJIZBz3kz3I+LPOf8L0k9\/atxDHsEAAAAASUVORK5CYII=\u0022 data-src=\u0022https:\/\/avris.it\/image\/avi-new_big.png\u0022 alt=\u0022\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u0022632\u0022\u003E\u003C\/span\u003E\n                \n            \u003C\/figure\u003E\u003C\/p\u003E\u003Csvg xmlns=\u0022http:\/\/www.w3.org\/2000\/svg\u0022 style=\u0022display: none;\u0022\u003E\u003C\/svg\u003E","tags":["bootstrap","colour","design","redesign","refactoring","avi","avatar","webdevelopment","website","font","symfony","javascript"],"hasMore":true,"image":"https:\/\/avris.it\/image\/avi-comparison_small.png","introLite":"\u003Cfigure\u003E\u003Ca href=\u0022https:\/\/avris.it\/image\/avi-comparison_big.png\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Cimg src=\u0022https:\/\/avris.it\/image\/avi-comparison_mini.png\u0022 alt=\u0022\u0022 width=\u0022240\u0022 height=\u0022201.80952380952\u0022 loading=\u0022lazy\u0022\u003E\u003C\/a\u003E\u003C\/figure\u003E\u003C\/p\u003E\n\u003Cp\u003EYet another one of my projects, \u003Ca href=\u0022\/projects\/avi-simple-placeholder-avatars.lite\u0022\u003E Avi \u2022 Simple placeholder avatars\u003C\/a\u003E,\ngrew too outdated to support it. I had to rewrite it from scratch.\u003C\/p\u003E\n\u003Cp\u003EI took the opportunity to redesign it as well.\u003C\/p\u003E","contentLite":"\u003Cfigure\u003E\u003Ca href=\u0022https:\/\/avris.it\/image\/avi-comparison_big.png\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Cimg src=\u0022https:\/\/avris.it\/image\/avi-comparison_mini.png\u0022 alt=\u0022\u0022 width=\u0022240\u0022 height=\u0022201.80952380952\u0022 loading=\u0022lazy\u0022\u003E\u003C\/a\u003E\u003C\/figure\u003E\u003C\/p\u003E\n\u003Cp\u003EYet another one of my projects, \u003Ca href=\u0022\/projects\/avi-simple-placeholder-avatars.lite\u0022\u003E Avi \u2022 Simple placeholder avatars\u003C\/a\u003E,\ngrew too outdated to support it. I had to rewrite it from scratch.\u003C\/p\u003E\n\u003Cp\u003EI took the opportunity to redesign it as well.\u003C\/p\u003E\n\u003Cp\u003EIt\u0027s quite a simple project, so it only took me a couple of hours. Here\u0027s what I did:\u003C\/p\u003E\n\u003Cul\u003E\n\u003Cli\u003Ereplaced my abandoned framework \u003Ca href=\u0022\/projects\/micrus-v4.lite\u0022\u003E Micrus v4 \u2022 Beauty of simplicity\u003C\/a\u003E with \u003Ca href=\u0022https:\/\/symfony.com\/\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E Symfony 5\u003C\/a\u003E,\u003C\/li\u003E\n\u003Cli\u003Ereplaced \u003Ca href=\u0022https:\/\/gitlab.com\/Avris\/Micrus-Assetic\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E custom Assetic setup\u003C\/a\u003E\nwith \u003Ca href=\u0022https:\/\/symfony.com\/doc\/current\/frontend\/encore\/installation.html\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E Webpack Encore\u003C\/a\u003E,\u003C\/li\u003E\n\u003Cli\u003Eupdated \u003Ca href=\u0022https:\/\/getbootstrap.com\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E Bootstrap\u003C\/a\u003E from 3.0 to 4.4,\u003C\/li\u003E\n\u003Cli\u003Eadded more contrast to the design, while keeping it simple,\u003C\/li\u003E\n\u003Cli\u003Eremoved the ugly logo,\u003C\/li\u003E\n\u003Cli\u003Ereplaced the font that I used to overuse, \u003Ca href=\u0022https:\/\/design.ubuntu.com\/font\/\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E Ubuntu\u003C\/a\u003E,\nwith the beautiful \u003Ca href=\u0022https:\/\/fonts.google.com\/specimen\/Baloo+Thambi+2\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E Baloo Thambi 2\u003C\/a\u003E\nand \u003Ca href=\u0022https:\/\/www.jetbrains.com\/lp\/mono\/\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E JetBrains Mono\u003C\/a\u003E,\u003C\/li\u003E\n\u003Cli\u003Emoved the generation of links from backend to frontend \u2013\u00a0now it gives you an immediate feedback\nto changes in the form, without having to reload the website,\u003C\/li\u003E\n\u003Cli\u003Eremoved the \u201cLatest generated avatars\u201d section \u2013 I never liked it, but I needed some showcase\nof what this project does\u2026 with the immediate feedback in the \u201cTry it!\u201d section, it\u0027s not needed anymore,\u003C\/li\u003E\n\u003Cli\u003Eincluded some more \u003Ca href=\u0022\/blog\/reducing-website-size-by-a-half-by-optimising-bootstrap-and-fontawesome.lite\u0022\u003E optimisations\u003C\/a\u003E.\u003C\/li\u003E\n\u003C\/ul\u003E\n\u003Ch3\u003EBefore:\u003C\/h3\u003E\n\u003Cfigure\u003E\u003Ca href=\u0022https:\/\/avris.it\/image\/avi-old_big.png\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Cimg src=\u0022https:\/\/avris.it\/image\/avi-old_mini.png\u0022 alt=\u0022\u0022 width=\u0022240\u0022 height=\u0022423.8\u0022 loading=\u0022lazy\u0022\u003E\u003C\/a\u003E\u003C\/figure\u003E\u003C\/p\u003E\n\u003Ch3\u003EAfter:\u003C\/h3\u003E\n\u003Cfigure\u003E\u003Ca href=\u0022https:\/\/avris.it\/image\/avi-new_big.png\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Cimg src=\u0022https:\/\/avris.it\/image\/avi-new_mini.png\u0022 alt=\u0022\u0022 width=\u0022240\u0022 height=\u0022158\u0022 loading=\u0022lazy\u0022\u003E\u003C\/a\u003E\u003C\/figure\u003E\u003C\/p\u003E","words":169,"readTime":null,"lang":"en"}}},"projects\/avris-twemoji-backend-generated-twitter-emoji":{"key":"projects\/avris-twemoji-backend-generated-twitter-emoji","type":"article","published":true,"meta":{"createdAt":"2020-02-08T22:49:48+01:00","publishedAt":"2020-02-08T22:49:48+01:00","group":null,"links":[{"icon":"globe-europe","colour":"primary","url":"https:\/\/packagist.org\/packages\/avris\/twemoji","displayUrl":"avris\/twemoji"},{"icon":"brands gitlab","colour":"secondary","url":"https:\/\/gitlab.com\/Avris\/Twemoji","displayUrl":null}],"category":"projects","subcategory":null,"slug":"avris-twemoji-backend-generated-twitter-emoji"},"content":{"en":{"slug":"avris-twemoji-backend-generated-twitter-emoji","title":"Avris Twemoji \u2013 Backend-generated Twitter Emoji","intro":"\u003Cfigure\u003E\n                \u003Cnoscript\u003E\n                    \u003Cimg src=\u0022https:\/\/avris.it\/image\/twemoji_small.png\u0022 alt=\u0022\u0022 class=\u0022border-bottom\u0022 width=\u0022480\u0022 height=\u0022320\u0022\u003E                \n                \u003C\/noscript\u003E\n                \u003Cspan class=\u0022hide-noscript\u0022\u003E\u003Cimg src=\u0022data:image\/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAYCAYAAACSuF9OAAAACXBIWXMAAA7EAAAOxAGVKw4bAAAHlUlEQVRIiX2Xya8dRxXGf2eo6r73vfsmPz87ozMRCAEsAhEREUqIlEkooIAYAlIEC1iAWPAnsGfHAoFYwwqxCUECgUgiJRIEBCETEQlxJsfYsd9w33S7qw6LvnYQIEpd3S11DV99X506X8vV19wcUSpCELVCVMydWgpBoCK4GqZKcmc2O6TWChEQgQAigjAUEUFEgOBiiYh5rZeeREUEVARzx0RomhEeIUQEpRYkQIBSCsIwsKoOQEWhVpIq\/XwCRObtuNReBEBQlXcnl4vvQtSCqBHxbj9DSGpoLfjFDoISVCJAQxAdJiMEVQeEvlQMQRFCFFOdszEsBBm+za\/5zXA3ZrMOEYgYFiii6LyvqeJmJFU8RKGWOcEDI0QgIagaboqJYKK4KRKVWiu1lmEA92H1taJql6RSEaJWgmB5ZYXN8xeACiGIQ9SCqkCAmZLMSH4RkAAqUOdsCYjoXAZDUcyMbIlx00D07O3v07jTJCd7otZKKT19KSAM+6VWAC47tsHhzhSoA2kRqOY5KMV0kDib4qKJiA4JA6nopU0qqNlArSVUFBVDxVloFlgdLXNhuoWGEiVoPKGeIQohQt93A0MCJ66+mrdffQ2RQAJMBSGAhEjMJVOSKa4p0wfziLGLsQKqAztqmBrZnWwJxRBJNDlx7dFFdvemHHYdx45vMNvfY7q9g4mQXalRuf2eO3j5+RdZyg1BDJEFqA6iqIIIJFOyGx6akDSXC6EGmCiqhori5rga2TMuQjInSSJpw9raMp\/96udZW13hdz\/7Ja+feh1rFkk+RNNkeZHb77qD5x57kpV2BBQiYgCjggqYCaYDa+6Ckxukd2qNub4Aiqih5ogYbo5qws3mNXHn\/Z\/goW99kZeefoFHvv9TEoUbL7ucqJWd3Smeja989zs8\/fNHuXJpiVnpqNETUQbpdB5dadhDOSmm4NIuULuC1DqcQwGIIeKoJZI5qkYyp02ZsTtf++bnuPfBO5le2OHRHz5C1hGr45brb7ic3a1zbO0dcNe3v0xSoZ56g\/ddtsF0f4+DfkapPaV2oJXkhpngriQXUjJcxkvIrIdSCRj2CIpIQsUQT2R12pQYp8RDD9\/NvQ\/eCcAzTzxLomGyOGFx3LBzfp8TH\/0Q9zxwO942PPW9H7OxvoxGx9Z20PeJEgOgkIpqkLLjLqSkeBZcRhPIPRSQUAhFUBAHTZg6yZycEidPXsunv\/DJSylh+8yUI8eOcsWJDU7cfBVX3XIdC+tLRASv\/+pxFkaZUhdpm57cVJBKjY6+nxG1Qw1UA3MjN44nwZksQ1+IkAFMDNFlOK4JxZH5AfjwN+6\/dDID3Pf1u\/nPEhG8+fgfmZ09x9FrjnC4lel2N1nSDrGKWFBrR+0PEXrUBHMl5Yw3Da6TCakw5BkUDyVhZHFyGFmNjHLLyau54oq1\/wLw76WWwsu\/\/gM7L71Mu6C0y2OO3nQl\/dYC26cFlRlCB5KJkhCpQ4Qlx3LGmhE+WZlQCjBnyBA8nFaMFqXFaKpw28du+L9gpme3eP4XTzJ75yyjBlDo9vfYe6fDZcZ4uaF2ZTh7DFQSMpdL3bHcos0IP742ou+DWqCGoqEoRgohYbShNEW48br1\/wlkf3uPvz3xLG\/+6UWydIzaOqSOCtFBPTRolDxSIikmMZcpoaZYymhukNRAHuEf2GjYO+iYHRZmfaWUSqkVCUGiYkUwEdZXx5dA7E73OfXSm7z6l1d487l\/0ETH2AuRCk4layU0wAJmQ66UFCQP3AQzQVNCcgvJIGfIDXiLP7D6FrsHlem0Y3u3Mu2DnUPYm8FBB7NeKD386Ac\/YX93n81z2+ye3yaXQqKQqLRaGVnPQgqW2spsXGESpBBaG2yGlA71wLJhNeg6w5jQHRraJrYujOlokTtvXo+lNnFwMFglt0yIU3FCEgWnaqavEKKgzvHjl1H7ws729jzHGdmERmEhw7HVMesLsJK32Vg3FhaE105vMt3fp+SOlcuv4LHf\/J5XTx+y1FY2NiYcdsFTz+8iiytroSkjalhKeNMianhu8JSx1KBq5KbFPJE88\/FbP0LX9WTg2PoRullhbXmZ82fOsTYZIwf7NKWjbJ3jyKKyugBJe5L1rCz03HhyzObpKWdPbzMZgUvP0dvuZu+vv8Vv+syXaBaX6Cu0CxM8Nag6Yk7yhIghDHlHQpBSKUtjPODK9WX+eXaTYh0aLfvtKiwvMzma2Dpzjpi17CYlJ6NNlWqVg6bS2Qpr74XN6SukkdB4T39hj8X334sXjOnePlhitrODyC6ggxeKwYAPXgikVCiVc6cr9eCAZ2ohmyElkAisFl7AcCqtJSbJmbiz3CTGSXAtjDNMDzpu\/eASb1xQ6vmepRFMNt\/iPfd9GL9w6u\/Mug71TC0Vb0bw7j8EAnhKqCoSQdRAYwCgtSJ9f8ng1+4QF2PzzGu0ucVFWF5c4sjSCh6Vvb1tVpcm\/PlF5+1TI85sHfDqOweMctDojE\/1byDr198UtRT62YzaHZIWJkgIZXaApmZIB7XHcwsweG5Aa6AIEhc99ODFNQKhYiK4Ci6gVLIZqkHfdwiFjYmz3Brn9web2zjcdgL+Bf4aPDyLSPA9AAAAAElFTkSuQmCC\u0022 data-src=\u0022https:\/\/avris.it\/image\/twemoji_small.png\u0022 alt=\u0022\u0022 class=\u0022border-bottom\u0022 width=\u0022480\u0022 height=\u0022320\u0022\u003E\u003C\/span\u003E\n                \n            \u003C\/figure\u003E\u003C\/p\u003E\n\u003Cp\u003E\u003Ca href=\u0022https:\/\/github.com\/twitter\/twemoji\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-link\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E Twemoji\u003C\/a\u003E is a great way to make emoji\u0027s on your website independent of system and browser.\nBut alas, it requires JavaScript...\u003C\/p\u003E\n\u003Cp\u003EUnless you just use this library to replace emojis with \u003Ccode\u003E\u0026lt;img\u0026gt;\u003C\/code\u003E tags in your backend.\u003C\/p\u003E\u003Csvg xmlns=\u0022http:\/\/www.w3.org\/2000\/svg\u0022 style=\u0022display: none;\u0022\u003E\u003C\/svg\u003E","content":"\u003Cfigure\u003E\n                \u003Cnoscript\u003E\n                    \u003Cimg src=\u0022https:\/\/avris.it\/image\/twemoji_big.png\u0022 alt=\u0022\u0022 class=\u0022border\u0022 width=\u0022900\u0022 height=\u0022600\u0022\u003E                \n                \u003C\/noscript\u003E\n                \u003Cspan class=\u0022hide-noscript\u0022\u003E\u003Cimg src=\u0022data:image\/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAYCAYAAACSuF9OAAAACXBIWXMAAA7EAAAOxAGVKw4bAAAHlUlEQVRIiX2Xya8dRxXGf2eo6r73vfsmPz87ozMRCAEsAhEREUqIlEkooIAYAlIEC1iAWPAnsGfHAoFYwwqxCUECgUgiJRIEBCETEQlxJsfYsd9w33S7qw6LvnYQIEpd3S11DV99X506X8vV19wcUSpCELVCVMydWgpBoCK4GqZKcmc2O6TWChEQgQAigjAUEUFEgOBiiYh5rZeeREUEVARzx0RomhEeIUQEpRYkQIBSCsIwsKoOQEWhVpIq\/XwCRObtuNReBEBQlXcnl4vvQtSCqBHxbj9DSGpoLfjFDoISVCJAQxAdJiMEVQeEvlQMQRFCFFOdszEsBBm+za\/5zXA3ZrMOEYgYFiii6LyvqeJmJFU8RKGWOcEDI0QgIagaboqJYKK4KRKVWiu1lmEA92H1taJql6RSEaJWgmB5ZYXN8xeACiGIQ9SCqkCAmZLMSH4RkAAqUOdsCYjoXAZDUcyMbIlx00D07O3v07jTJCd7otZKKT19KSAM+6VWAC47tsHhzhSoA2kRqOY5KMV0kDib4qKJiA4JA6nopU0qqNlArSVUFBVDxVloFlgdLXNhuoWGEiVoPKGeIQohQt93A0MCJ66+mrdffQ2RQAJMBSGAhEjMJVOSKa4p0wfziLGLsQKqAztqmBrZnWwJxRBJNDlx7dFFdvemHHYdx45vMNvfY7q9g4mQXalRuf2eO3j5+RdZyg1BDJEFqA6iqIIIJFOyGx6akDSXC6EGmCiqhori5rga2TMuQjInSSJpw9raMp\/96udZW13hdz\/7Ja+feh1rFkk+RNNkeZHb77qD5x57kpV2BBQiYgCjggqYCaYDa+6Ckxukd2qNub4Aiqih5ogYbo5qws3mNXHn\/Z\/goW99kZeefoFHvv9TEoUbL7ucqJWd3Smeja989zs8\/fNHuXJpiVnpqNETUQbpdB5dadhDOSmm4NIuULuC1DqcQwGIIeKoJZI5qkYyp02ZsTtf++bnuPfBO5le2OHRHz5C1hGr45brb7ic3a1zbO0dcNe3v0xSoZ56g\/ddtsF0f4+DfkapPaV2oJXkhpngriQXUjJcxkvIrIdSCRj2CIpIQsUQT2R12pQYp8RDD9\/NvQ\/eCcAzTzxLomGyOGFx3LBzfp8TH\/0Q9zxwO942PPW9H7OxvoxGx9Z20PeJEgOgkIpqkLLjLqSkeBZcRhPIPRSQUAhFUBAHTZg6yZycEidPXsunv\/DJSylh+8yUI8eOcsWJDU7cfBVX3XIdC+tLRASv\/+pxFkaZUhdpm57cVJBKjY6+nxG1Qw1UA3MjN44nwZksQ1+IkAFMDNFlOK4JxZH5AfjwN+6\/dDID3Pf1u\/nPEhG8+fgfmZ09x9FrjnC4lel2N1nSDrGKWFBrR+0PEXrUBHMl5Yw3Da6TCakw5BkUDyVhZHFyGFmNjHLLyau54oq1\/wLw76WWwsu\/\/gM7L71Mu6C0y2OO3nQl\/dYC26cFlRlCB5KJkhCpQ4Qlx3LGmhE+WZlQCjBnyBA8nFaMFqXFaKpw28du+L9gpme3eP4XTzJ75yyjBlDo9vfYe6fDZcZ4uaF2ZTh7DFQSMpdL3bHcos0IP742ou+DWqCGoqEoRgohYbShNEW48br1\/wlkf3uPvz3xLG\/+6UWydIzaOqSOCtFBPTRolDxSIikmMZcpoaZYymhukNRAHuEf2GjYO+iYHRZmfaWUSqkVCUGiYkUwEdZXx5dA7E73OfXSm7z6l1d487l\/0ETH2AuRCk4layU0wAJmQ66UFCQP3AQzQVNCcgvJIGfIDXiLP7D6FrsHlem0Y3u3Mu2DnUPYm8FBB7NeKD386Ac\/YX93n81z2+ye3yaXQqKQqLRaGVnPQgqW2spsXGESpBBaG2yGlA71wLJhNeg6w5jQHRraJrYujOlokTtvXo+lNnFwMFglt0yIU3FCEgWnaqavEKKgzvHjl1H7ws729jzHGdmERmEhw7HVMesLsJK32Vg3FhaE105vMt3fp+SOlcuv4LHf\/J5XTx+y1FY2NiYcdsFTz+8iiytroSkjalhKeNMianhu8JSx1KBq5KbFPJE88\/FbP0LX9WTg2PoRullhbXmZ82fOsTYZIwf7NKWjbJ3jyKKyugBJe5L1rCz03HhyzObpKWdPbzMZgUvP0dvuZu+vv8Vv+syXaBaX6Cu0CxM8Nag6Yk7yhIghDHlHQpBSKUtjPODK9WX+eXaTYh0aLfvtKiwvMzma2Dpzjpi17CYlJ6NNlWqVg6bS2Qpr74XN6SukkdB4T39hj8X334sXjOnePlhitrODyC6ggxeKwYAPXgikVCiVc6cr9eCAZ2ohmyElkAisFl7AcCqtJSbJmbiz3CTGSXAtjDNMDzpu\/eASb1xQ6vmepRFMNt\/iPfd9GL9w6u\/Mug71TC0Vb0bw7j8EAnhKqCoSQdRAYwCgtSJ9f8ng1+4QF2PzzGu0ucVFWF5c4sjSCh6Vvb1tVpcm\/PlF5+1TI85sHfDqOweMctDojE\/1byDr198UtRT62YzaHZIWJkgIZXaApmZIB7XHcwsweG5Aa6AIEhc99ODFNQKhYiK4Ci6gVLIZqkHfdwiFjYmz3Brn9web2zjcdgL+Bf4aPDyLSPA9AAAAAElFTkSuQmCC\u0022 data-src=\u0022https:\/\/avris.it\/image\/twemoji_big.png\u0022 alt=\u0022\u0022 class=\u0022border\u0022 width=\u0022900\u0022 height=\u0022600\u0022\u003E\u003C\/span\u003E\n                \n            \u003C\/figure\u003E\u003C\/p\u003E\n\u003Cp\u003E\u003Ca href=\u0022https:\/\/github.com\/twitter\/twemoji\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-link\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E Twemoji\u003C\/a\u003E is a great way to make emoji\u0027s on your website independent of system and browser.\nBut alas, it requires JavaScript...\u003C\/p\u003E\n\u003Cp\u003EUnless you just use this library to replace emojis with \u003Ccode\u003E\u0026lt;img\u0026gt;\u003C\/code\u003E tags in your backend.\u003C\/p\u003E\u003Csvg xmlns=\u0022http:\/\/www.w3.org\/2000\/svg\u0022 style=\u0022display: none;\u0022\u003E\u003C\/svg\u003E","tags":["php","javascript","twitter","emoji","twemoji","backend","symfony","twig"],"hasMore":false,"image":"https:\/\/avris.it\/image\/twemoji_small.png","introLite":"\u003Cfigure\u003E\u003Ca href=\u0022https:\/\/avris.it\/image\/twemoji_big.png\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Cimg src=\u0022https:\/\/avris.it\/image\/twemoji_mini.png\u0022 alt=\u0022\u0022 width=\u0022240\u0022 height=\u0022160\u0022 loading=\u0022lazy\u0022\u003E\u003C\/a\u003E\u003C\/figure\u003E\u003C\/p\u003E\n\u003Cp\u003E\u003Ca href=\u0022https:\/\/github.com\/twitter\/twemoji\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E Twemoji\u003C\/a\u003E is a great way to make emoji\u0027s on your website independent of system and browser.\nBut alas, it requires JavaScript...\u003C\/p\u003E\n\u003Cp\u003EUnless you just use this library to replace emojis with \u003Ccode\u003E\u0026lt;img\u0026gt;\u003C\/code\u003E tags in your backend.\u003C\/p\u003E","contentLite":"\u003Cfigure\u003E\u003Ca href=\u0022https:\/\/avris.it\/image\/twemoji_big.png\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Cimg src=\u0022https:\/\/avris.it\/image\/twemoji_mini.png\u0022 alt=\u0022\u0022 width=\u0022240\u0022 height=\u0022160\u0022 loading=\u0022lazy\u0022\u003E\u003C\/a\u003E\u003C\/figure\u003E\u003C\/p\u003E\n\u003Cp\u003E\u003Ca href=\u0022https:\/\/github.com\/twitter\/twemoji\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E Twemoji\u003C\/a\u003E is a great way to make emoji\u0027s on your website independent of system and browser.\nBut alas, it requires JavaScript...\u003C\/p\u003E\n\u003Cp\u003EUnless you just use this library to replace emojis with \u003Ccode\u003E\u0026lt;img\u0026gt;\u003C\/code\u003E tags in your backend.\u003C\/p\u003E","words":38,"readTime":null,"lang":"en"}}},"projects\/avris-fontawesomeoptimiser":{"key":"projects\/avris-fontawesomeoptimiser","type":"article","published":true,"meta":{"createdAt":"2020-01-09T23:04:10+01:00","publishedAt":"2020-01-09T23:04:10+01:00","group":null,"links":[{"icon":"globe-europe","colour":"primary","url":"https:\/\/packagist.org\/packages\/avris\/fontawesome-optimiser","displayUrl":"avris\/fontawesome-optimiser"},{"icon":"brands gitlab","colour":"secondary","url":"https:\/\/gitlab.com\/Avris\/FontAwesomeOptimiser","displayUrl":null}],"category":"projects","subcategory":null,"slug":"avris-fontawesomeoptimiser"},"content":{"en":{"slug":"avris-fontawesomeoptimiser","title":"Avris FontAwesomeOptimiser","intro":"\u003Cfigure\u003E\n                \u003Cnoscript\u003E\n                    \u003Cimg src=\u0022https:\/\/avris.it\/image\/fontawesomeoptimiser_small.png\u0022 alt=\u0022\u0022 class=\u0022border-bottom\u0022 width=\u0022480\u0022 height=\u0022320\u0022\u003E                \n                \u003C\/noscript\u003E\n                \u003Cspan class=\u0022hide-noscript\u0022\u003E\u003Cimg src=\u0022data:image\/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAYCAYAAACSuF9OAAAACXBIWXMAAA7EAAAOxAGVKw4bAAAHvElEQVRIiX2X249lx1XGf+tStfc53eecnpnunhmPPZM4IRDZxEqUCEsWionkXARGuSiJAlKAB3gIykP+BN554wGBeIaniJdcpKBEJJESCQIi4DjOKA4ztmdsy\/b07fTpPnvvqsXDPjNGEKW0b9Ku2vXV99Va69ty\/R2PRZSKEEStEBVzp5ZCEKgIroapktzpujW1VoiACAQQEYSxiQgiAgT3W0RszvrgTlREQEUwd0yEppngEUJEUGpBAgQopSCMH1bVEago1EpSZdhMgMimHw\/6iwAIqvL25HL\/WYhaEDUi3h5nCEkNrQW\/P0BQgkoEaAii42SEoOqAMJSKIShCiGKqGzbGhSDju82xuRjuRtf1iEDEuEARRTdjTRU3I6niIQq1bAgeGSECCUHVcFNMBBPFTZGo1FqptYwfcB9XXyuq9kAqFSFqJQgWOzsc3jsAKoQgDlELqgIBZkoyI\/l9QAKoQN2wJSCiGxkMRTEzsiWmTQMxsDo7o3GnSU72RK2VUgaGUkAY90utAFy9vM\/6ZAnUkbQIVPMGlGI6SpxNcdFERI+EgVT0wSYV1Gyk1hIqioqh4mw1W1yYLDhYHqGhRAkaT6hniEKIMAz9yJDAjevXee3WS4gEEmAqCAEkRGIjmZJMcU2ZIdhEjN2PFVAd2VHD1MjuZEsohkiiyYl37m1zulqy7nsuX9mnO1uxPD7BRMiu1Kg89dEP8+LzLzDPDUGMkQWojqKogggkU7IbHpqQtJELoQaYKKqGiuLmuBrZMy5CMidJImnDxYsLPv3Hn+XihR3++avf5OXbL2PNNsnHaJottnnqIx\/mJ9\/9ATvtBChExAhGBRUwE0xH1twFJzfI4NQaG30BFFFDzREx3BzVhJttzsTTn\/htvvDnn+fmj37K1\/7qH0gU3nP1IaJWTk6XeDb+8C++wo\/+8Rs8PJ\/TlZ4aAxFllE430ZXGPZSTYgou7Ra1L0itYx4KQAwRRy2RzFE1kjltykzd+ZMvfYaPfepplgcnfONvvkbWCRemLe9690OcHr3J0eqcj3z5D0gq1Nuv8BtX91merTgfOkodKLUHrSQ3zAR3JbmQkuEynSPdAKUSMO4RFJGEiiGeyOq0KTFNiS988Rk+9qmnAfjP7z9HomG2PWN72nBy74wbH3wfH332Kbxt+OFf\/h37uws0eo6Og2FIlBgBhVRUg5QddyElxbPgMplBHqCAhEIogoI4aMLUSebklHjiiXfy+5\/7nQcl4fj1JZcu73Htxj43HnuERz7wKFu7cyKCl7\/1PbYmmVK3aZuB3FSQSo2eYeiI2qMGqoG5kRvHk+DMFjAUImQEE2N0GY5rQnFkkwC\/+GefeJCZAT7+p8\/wf1tEcOd7\/0b3xpvsveMS66NMf3rIXHvEKmJBrT11WCMMqAnmSsoZbxpcZzNSYawzKB5Kwsji5DCyGhnlA09c59q1i\/8PwP9utRRe\/Kd\/5eTmi7RbSruYsvfehxmOtjh+VVDpEHqQTJSESB0jLDmWM9ZM8NnOjFKADUOG4OG0YrQoLUZThSd\/692\/EszyjSOe\/\/oP6N56g0kDKPRnK1Zv9bh0TBcNtS9j7jFQSchGLnXHcos2E\/zKxQnDENQCNRQNRTFSCAmjDaUpwnse3f2lQM6OV\/zs+89x599fIEvPpK1j6agQPdS1QaPkiRJJMYmNTAk1xVJGc4OkBvIEf3y\/YXXe060L3VAppVJqRUKQqFgRTITdC9MHIE6XZ9y+eYdbP\/4Fd37y3zTRM\/VCpIJTyVoJDbCAbqyVkoLkgZtgJmhKSG4hGeQMuQFv8Wcv3OX0vLJc9hyfVpZDcLKGVQfnPXSDUAb427\/+e85Ozzh885jTe8fkUkgUEpVWKxMb2ErBvK100wqzIIXQ2mgzpPSoB5YNq0HfG8aMfm1omzg6mNLTIk8\/thvzNnF+Plql3Uv71FAOjleEJPCWviqeW87WHagjoriOWXuscUY2oVHYynB1d5tJOeHqhcKV\/cSF3Sk3f36HLoJOV8z2r\/Ddb\/8Lt15dM28r+\/sz1n3ww+dPke2di6EpI2pYSnzy2d\/j3r0DtGnZ2p6xf+kSP\/vFLd73+OPcvfMKbs6VvV3WXeVkeU6TWy4t5rSeSVJZbE1YvnbA9Ucu0h2+xbVrl2i1RxkwGdhuKw8\/Ehy+2XF6tMQOb+IysPfkM6z+6zvIh\/7oS9FszxkqtFszbly9wlBhb2fB6XrgoYs7rLseN6OUSpSKRXB0suLKYpvV8ozSD0xTgmGgW51zeb7F3nxKPVkyb53FvKWeHrI1nzC1jkd\/fY\/EAS\/99FUmwwGND0wuXybPF3jBWK7OwBLdyQnPLU8B5aYZEsJz7hsvBFIqlIrUSj0\/58e1kM2QEkgEVguJ0Rtv54YtN2buLJrENAmuhWmGN+7e5UO\/OefWS4fUKMwnMDu8y699\/P34we2f0\/U96plaKt5M4O1\/CATwlFBVJIKogcYIQGtFhuGBwa\/9Ghfj8PWXaHOLi7DYnnNpvoNHZbU65sJ8xn+84Lx2e8LrR+fceuucSQ4a7fjd4RVk913vjVoKQ9dR+zVpa4aEULpzNDVjOagDnluA0XMDWgNFkLjvoUcvrhEIFRPBVXABpZLNUA2GoUco7M+cRWvcOxttbuPw5A34HwP7VySOoz7KAAAAAElFTkSuQmCC\u0022 data-src=\u0022https:\/\/avris.it\/image\/fontawesomeoptimiser_small.png\u0022 alt=\u0022\u0022 class=\u0022border-bottom\u0022 width=\u0022480\u0022 height=\u0022320\u0022\u003E\u003C\/span\u003E\n                \n            \u003C\/figure\u003E\u003C\/p\u003E\n\u003Cp\u003EFontAwesome provides thousands of icons, but you probably only use a few dozen on your website. Instead of loading all of them as a webfont, you could use SVG sprites.\u003C\/p\u003E\n\u003Cp\u003EThis library is a simple helper that:\u003C\/p\u003E\n\u003Cul\u003E\n\u003Cli\u003Eregisters the icons you use in the place you use it,\u003C\/li\u003E\n\u003Cli\u003Edumps a refined set of SVG symbols at the end of your page.\u003C\/li\u003E\n\u003C\/ul\u003E\n\u003Cp\u003EYou can check out \u003Ca href=\u0022\/blog\/reducing-website-size-by-a-half-by-optimising-bootstrap-and-fontawesome\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-computer-speaker\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E a blog post\u003C\/a\u003E about possible gains.\u003C\/p\u003E\u003Csvg xmlns=\u0022http:\/\/www.w3.org\/2000\/svg\u0022 style=\u0022display: none;\u0022\u003E\u003C\/svg\u003E","content":"\u003Cfigure\u003E\n                \u003Cnoscript\u003E\n                    \u003Cimg src=\u0022https:\/\/avris.it\/image\/fontawesomeoptimiser_big.png\u0022 alt=\u0022\u0022 class=\u0022border\u0022 width=\u0022900\u0022 height=\u0022600\u0022\u003E                \n                \u003C\/noscript\u003E\n                \u003Cspan class=\u0022hide-noscript\u0022\u003E\u003Cimg src=\u0022data:image\/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAYCAYAAACSuF9OAAAACXBIWXMAAA7EAAAOxAGVKw4bAAAHvElEQVRIiX2X249lx1XGf+tStfc53eecnpnunhmPPZM4IRDZxEqUCEsWionkXARGuSiJAlKAB3gIykP+BN554wGBeIaniJdcpKBEJJESCQIi4DjOKA4ztmdsy\/b07fTpPnvvqsXDPjNGEKW0b9Ku2vXV99Va69ty\/R2PRZSKEEStEBVzp5ZCEKgIroapktzpujW1VoiACAQQEYSxiQgiAgT3W0RszvrgTlREQEUwd0yEppngEUJEUGpBAgQopSCMH1bVEago1EpSZdhMgMimHw\/6iwAIqvL25HL\/WYhaEDUi3h5nCEkNrQW\/P0BQgkoEaAii42SEoOqAMJSKIShCiGKqGzbGhSDju82xuRjuRtf1iEDEuEARRTdjTRU3I6niIQq1bAgeGSECCUHVcFNMBBPFTZGo1FqptYwfcB9XXyuq9kAqFSFqJQgWOzsc3jsAKoQgDlELqgIBZkoyI\/l9QAKoQN2wJSCiGxkMRTEzsiWmTQMxsDo7o3GnSU72RK2VUgaGUkAY90utAFy9vM\/6ZAnUkbQIVPMGlGI6SpxNcdFERI+EgVT0wSYV1Gyk1hIqioqh4mw1W1yYLDhYHqGhRAkaT6hniEKIMAz9yJDAjevXee3WS4gEEmAqCAEkRGIjmZJMcU2ZIdhEjN2PFVAd2VHD1MjuZEsohkiiyYl37m1zulqy7nsuX9mnO1uxPD7BRMiu1Kg89dEP8+LzLzDPDUGMkQWojqKogggkU7IbHpqQtJELoQaYKKqGiuLmuBrZMy5CMidJImnDxYsLPv3Hn+XihR3++avf5OXbL2PNNsnHaJottnnqIx\/mJ9\/9ATvtBChExAhGBRUwE0xH1twFJzfI4NQaG30BFFFDzREx3BzVhJttzsTTn\/htvvDnn+fmj37K1\/7qH0gU3nP1IaJWTk6XeDb+8C++wo\/+8Rs8PJ\/TlZ4aAxFllE430ZXGPZSTYgou7Ra1L0itYx4KQAwRRy2RzFE1kjltykzd+ZMvfYaPfepplgcnfONvvkbWCRemLe9690OcHr3J0eqcj3z5D0gq1Nuv8BtX91merTgfOkodKLUHrSQ3zAR3JbmQkuEynSPdAKUSMO4RFJGEiiGeyOq0KTFNiS988Rk+9qmnAfjP7z9HomG2PWN72nBy74wbH3wfH332Kbxt+OFf\/h37uws0eo6Og2FIlBgBhVRUg5QddyElxbPgMplBHqCAhEIogoI4aMLUSebklHjiiXfy+5\/7nQcl4fj1JZcu73Htxj43HnuERz7wKFu7cyKCl7\/1PbYmmVK3aZuB3FSQSo2eYeiI2qMGqoG5kRvHk+DMFjAUImQEE2N0GY5rQnFkkwC\/+GefeJCZAT7+p8\/wf1tEcOd7\/0b3xpvsveMS66NMf3rIXHvEKmJBrT11WCMMqAnmSsoZbxpcZzNSYawzKB5Kwsji5DCyGhnlA09c59q1i\/8PwP9utRRe\/Kd\/5eTmi7RbSruYsvfehxmOtjh+VVDpEHqQTJSESB0jLDmWM9ZM8NnOjFKADUOG4OG0YrQoLUZThSd\/692\/EszyjSOe\/\/oP6N56g0kDKPRnK1Zv9bh0TBcNtS9j7jFQSchGLnXHcos2E\/zKxQnDENQCNRQNRTFSCAmjDaUpwnse3f2lQM6OV\/zs+89x599fIEvPpK1j6agQPdS1QaPkiRJJMYmNTAk1xVJGc4OkBvIEf3y\/YXXe060L3VAppVJqRUKQqFgRTITdC9MHIE6XZ9y+eYdbP\/4Fd37y3zTRM\/VCpIJTyVoJDbCAbqyVkoLkgZtgJmhKSG4hGeQMuQFv8Wcv3OX0vLJc9hyfVpZDcLKGVQfnPXSDUAb427\/+e85Ozzh885jTe8fkUkgUEpVWKxMb2ErBvK100wqzIIXQ2mgzpPSoB5YNq0HfG8aMfm1omzg6mNLTIk8\/thvzNnF+Plql3Uv71FAOjleEJPCWviqeW87WHagjoriOWXuscUY2oVHYynB1d5tJOeHqhcKV\/cSF3Sk3f36HLoJOV8z2r\/Ddb\/8Lt15dM28r+\/sz1n3ww+dPke2di6EpI2pYSnzy2d\/j3r0DtGnZ2p6xf+kSP\/vFLd73+OPcvfMKbs6VvV3WXeVkeU6TWy4t5rSeSVJZbE1YvnbA9Ucu0h2+xbVrl2i1RxkwGdhuKw8\/Ehy+2XF6tMQOb+IysPfkM6z+6zvIh\/7oS9FszxkqtFszbly9wlBhb2fB6XrgoYs7rLseN6OUSpSKRXB0suLKYpvV8ozSD0xTgmGgW51zeb7F3nxKPVkyb53FvKWeHrI1nzC1jkd\/fY\/EAS\/99FUmwwGND0wuXybPF3jBWK7OwBLdyQnPLU8B5aYZEsJz7hsvBFIqlIrUSj0\/58e1kM2QEkgEVguJ0Rtv54YtN2buLJrENAmuhWmGN+7e5UO\/OefWS4fUKMwnMDu8y699\/P34we2f0\/U96plaKt5M4O1\/CATwlFBVJIKogcYIQGtFhuGBwa\/9Ghfj8PWXaHOLi7DYnnNpvoNHZbU65sJ8xn+84Lx2e8LrR+fceuucSQ4a7fjd4RVk913vjVoKQ9dR+zVpa4aEULpzNDVjOagDnluA0XMDWgNFkLjvoUcvrhEIFRPBVXABpZLNUA2GoUco7M+cRWvcOxttbuPw5A34HwP7VySOoz7KAAAAAElFTkSuQmCC\u0022 data-src=\u0022https:\/\/avris.it\/image\/fontawesomeoptimiser_big.png\u0022 alt=\u0022\u0022 class=\u0022border\u0022 width=\u0022900\u0022 height=\u0022600\u0022\u003E\u003C\/span\u003E\n                \n            \u003C\/figure\u003E\u003C\/p\u003E\n\u003Cp\u003EFontAwesome provides thousands of icons, but you probably only use a few dozen on your website. Instead of loading all of them as a webfont, you could use SVG sprites.\u003C\/p\u003E\n\u003Cp\u003EThis library is a simple helper that:\u003C\/p\u003E\n\u003Cul\u003E\n\u003Cli\u003Eregisters the icons you use in the place you use it,\u003C\/li\u003E\n\u003Cli\u003Edumps a refined set of SVG symbols at the end of your page.\u003C\/li\u003E\n\u003C\/ul\u003E\n\u003Cp\u003EYou can check out \u003Ca href=\u0022\/blog\/reducing-website-size-by-a-half-by-optimising-bootstrap-and-fontawesome\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-computer-speaker\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E a blog post\u003C\/a\u003E about possible gains.\u003C\/p\u003E\u003Csvg xmlns=\u0022http:\/\/www.w3.org\/2000\/svg\u0022 style=\u0022display: none;\u0022\u003E\u003C\/svg\u003E","tags":["fontawesome","optimise","font","webfont","icons","symfony","twig","php","js"],"hasMore":false,"image":"https:\/\/avris.it\/image\/fontawesomeoptimiser_small.png","introLite":"\u003Cfigure\u003E\u003Ca href=\u0022https:\/\/avris.it\/image\/fontawesomeoptimiser_big.png\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Cimg src=\u0022https:\/\/avris.it\/image\/fontawesomeoptimiser_mini.png\u0022 alt=\u0022\u0022 width=\u0022240\u0022 height=\u0022160\u0022 loading=\u0022lazy\u0022\u003E\u003C\/a\u003E\u003C\/figure\u003E\u003C\/p\u003E\n\u003Cp\u003EFontAwesome provides thousands of icons, but you probably only use a few dozen on your website. Instead of loading all of them as a webfont, you could use SVG sprites.\u003C\/p\u003E\n\u003Cp\u003EThis library is a simple helper that:\u003C\/p\u003E\n\u003Cul\u003E\n\u003Cli\u003Eregisters the icons you use in the place you use it,\u003C\/li\u003E\n\u003Cli\u003Edumps a refined set of SVG symbols at the end of your page.\u003C\/li\u003E\n\u003C\/ul\u003E\n\u003Cp\u003EYou can check out \u003Ca href=\u0022\/blog\/reducing-website-size-by-a-half-by-optimising-bootstrap-and-fontawesome.lite\u0022\u003E a blog post\u003C\/a\u003E about possible gains.\u003C\/p\u003E","contentLite":"\u003Cfigure\u003E\u003Ca href=\u0022https:\/\/avris.it\/image\/fontawesomeoptimiser_big.png\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Cimg src=\u0022https:\/\/avris.it\/image\/fontawesomeoptimiser_mini.png\u0022 alt=\u0022\u0022 width=\u0022240\u0022 height=\u0022160\u0022 loading=\u0022lazy\u0022\u003E\u003C\/a\u003E\u003C\/figure\u003E\u003C\/p\u003E\n\u003Cp\u003EFontAwesome provides thousands of icons, but you probably only use a few dozen on your website. Instead of loading all of them as a webfont, you could use SVG sprites.\u003C\/p\u003E\n\u003Cp\u003EThis library is a simple helper that:\u003C\/p\u003E\n\u003Cul\u003E\n\u003Cli\u003Eregisters the icons you use in the place you use it,\u003C\/li\u003E\n\u003Cli\u003Edumps a refined set of SVG symbols at the end of your page.\u003C\/li\u003E\n\u003C\/ul\u003E\n\u003Cp\u003EYou can check out \u003Ca href=\u0022\/blog\/reducing-website-size-by-a-half-by-optimising-bootstrap-and-fontawesome.lite\u0022\u003E a blog post\u003C\/a\u003E about possible gains.\u003C\/p\u003E","words":71,"readTime":null,"lang":"en"}}},"blog\/technology\/new-year-new-digital-me":{"key":"blog\/technology\/new-year-new-digital-me","type":"article","published":true,"meta":{"createdAt":"2019-12-31T11:22:05+01:00","publishedAt":"2019-12-31T11:22:05+01:00","group":"redesign","category":"blog","subcategory":"technology","slug":"new-year-new-digital-me"},"content":{"en":{"slug":"new-year-new-digital-me","title":"New year \u2013 new (digital) me","intro":"\u003Cfigure\u003E\n                \u003Cnoscript\u003E\n                    \u003Cimg src=\u0022https:\/\/avris.it\/image\/avris4_small.png\u0022 alt=\u0022Screenshot of the new version of the blog\u0022 class=\u0022border-bottom\u0022 width=\u0022480\u0022 height=\u0022234.07874015748\u0022\u003E                \n                \u003C\/noscript\u003E\n                \u003Cspan class=\u0022hide-noscript\u0022\u003E\u003Cimg src=\u0022data:image\/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAARCAYAAAC1tw6GAAAACXBIWXMAAA7EAAAOxAGVKw4bAAADFklEQVRIiaWWz24cRRDGf9XTf2aXJSvHYCLlgEDiyCkQiRtXrhw4IfEaSBx4AA55hQiJIxIvwM0kAiQgcoQcEsmAZGJsrx2CPd6dnunisJ71zu7au0BJo\/7UXfVNTdVXvSu33nlXRUAVAGZxlhlEDAAxVgt9GoyMl+AcYgyqabIpIqgqMUZSE6Dnx1PxVuSCuLEG3377FiLCzs6vpKQcDgZzPrPYWkvIA945rHWE4HHO4pwnBE+WZTjrCN7hg8d7T\/DjNc9z5ONPPlXnHN57fLg4DC0cJoEhzOxN\/ALeO7IsQ0QufZpqTa\/TJiklndtdwfb3D8hDhjCiSjlVVeODZzQckeeBfr+Pnremadcq+F8lVMbI3tM9nHPEKqIITs4oa09KiTzkxBhRFJtZjDFsbLyMtXblDxVV\/U8VAkgpTVqhqgtbsKqpKqqKbYiavFSVlNLEYfppzqfXacL\/YyKCMQZbFEWLzBjTEqExZhKwTJRlWTIYHOH9eOyvr61N\/FbW0LKWNdW5qhvNPVXXNSenp+O4pIgRyjJyWnte7HVZfyFbWilzVSIXuAaUqiq589kdPr\/7BVUsAaWuUyvGiCCMK21EcJml37VYja12X4bNIq1cppPtBz+wu3WfJ99+zeDwoJXItBZbHChnwxLnw9LqANhlk9HSVyrpWUGrClMWk\/1pjmKkdLyQZYaTYU0sayrJKIaRrvdz\/rP40pYtsnRSIJpwGjk5Opw7FxHWruXk+fgWv36tg+t26PdyrHOtj2xL4qIjdrYt08pv7NHWPeKzP\/hrlBgmJZ4VxKOHbG0e8Mprb7Jx8\/UpclBN5z+4Sj8Y6lgRCQvvqtl3zV2hi4bu9+\/uUR7\/yYPdZ\/S6yvrNde5+uUmv2+HDj16C84RUlbIcTSpgTEZVFtS+T27m+RfhlTS0F2u+2nzM91s73Fjr8NYbN9jefc6j3QHvvf8Br55zjBMBRDAy\/l9hvcebEomKBH\/lu4DxlF2QzWOAnx4\/5f6P2wg1x0XJN7\/sc3xW0nHCz7\/tt6cMRWguUeHvYaIoCorh85XG\/h9McAJLnmVpFQAAAABJRU5ErkJggg==\u0022 data-src=\u0022https:\/\/avris.it\/image\/avris4_small.png\u0022 alt=\u0022Screenshot of the new version of the blog\u0022 class=\u0022border-bottom\u0022 width=\u0022480\u0022 height=\u0022234.07874015748\u0022\u003E\u003C\/span\u003E\n                \n            \u003C\/figure\u003E\u003C\/p\u003E\n\u003Cp\u003EIt wasn\u2019t really supposed for the New Year, but I\u2019ve had plenty of free time on my hands\nduring the holiday break, so here it is already: a brand new version of my blog \ud83e\udd73\u003C\/p\u003E\u003Csvg xmlns=\u0022http:\/\/www.w3.org\/2000\/svg\u0022 style=\u0022display: none;\u0022\u003E\u003C\/svg\u003E","content":"\u003Cfigure\u003E\n                \u003Cnoscript\u003E\n                    \u003Cimg src=\u0022https:\/\/avris.it\/image\/avris4_big.png\u0022 alt=\u0022Screenshot of the new version of the blog\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u0022468.15748031496\u0022\u003E                \n                \u003C\/noscript\u003E\n                \u003Cspan class=\u0022hide-noscript\u0022\u003E\u003Cimg src=\u0022data:image\/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAARCAYAAAC1tw6GAAAACXBIWXMAAA7EAAAOxAGVKw4bAAADFklEQVRIiaWWz24cRRDGf9XTf2aXJSvHYCLlgEDiyCkQiRtXrhw4IfEaSBx4AA55hQiJIxIvwM0kAiQgcoQcEsmAZGJsrx2CPd6dnunisJ71zu7au0BJo\/7UXfVNTdVXvSu33nlXRUAVAGZxlhlEDAAxVgt9GoyMl+AcYgyqabIpIqgqMUZSE6Dnx1PxVuSCuLEG3377FiLCzs6vpKQcDgZzPrPYWkvIA945rHWE4HHO4pwnBE+WZTjrCN7hg8d7T\/DjNc9z5ONPPlXnHN57fLg4DC0cJoEhzOxN\/ALeO7IsQ0QufZpqTa\/TJiklndtdwfb3D8hDhjCiSjlVVeODZzQckeeBfr+Pnremadcq+F8lVMbI3tM9nHPEKqIITs4oa09KiTzkxBhRFJtZjDFsbLyMtXblDxVV\/U8VAkgpTVqhqgtbsKqpKqqKbYiavFSVlNLEYfppzqfXacL\/YyKCMQZbFEWLzBjTEqExZhKwTJRlWTIYHOH9eOyvr61N\/FbW0LKWNdW5qhvNPVXXNSenp+O4pIgRyjJyWnte7HVZfyFbWilzVSIXuAaUqiq589kdPr\/7BVUsAaWuUyvGiCCMK21EcJml37VYja12X4bNIq1cppPtBz+wu3WfJ99+zeDwoJXItBZbHChnwxLnw9LqANhlk9HSVyrpWUGrClMWk\/1pjmKkdLyQZYaTYU0sayrJKIaRrvdz\/rP40pYtsnRSIJpwGjk5Opw7FxHWruXk+fgWv36tg+t26PdyrHOtj2xL4qIjdrYt08pv7NHWPeKzP\/hrlBgmJZ4VxKOHbG0e8Mprb7Jx8\/UpclBN5z+4Sj8Y6lgRCQvvqtl3zV2hi4bu9+\/uUR7\/yYPdZ\/S6yvrNde5+uUmv2+HDj16C84RUlbIcTSpgTEZVFtS+T27m+RfhlTS0F2u+2nzM91s73Fjr8NYbN9jefc6j3QHvvf8Br55zjBMBRDAy\/l9hvcebEomKBH\/lu4DxlF2QzWOAnx4\/5f6P2wg1x0XJN7\/sc3xW0nHCz7\/tt6cMRWguUeHvYaIoCorh85XG\/h9McAJLnmVpFQAAAABJRU5ErkJggg==\u0022 data-src=\u0022https:\/\/avris.it\/image\/avris4_big.png\u0022 alt=\u0022Screenshot of the new version of the blog\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u0022468.15748031496\u0022\u003E\u003C\/span\u003E\n                \n            \u003C\/figure\u003E\u003C\/p\u003E\n\u003Cp\u003EIt wasn\u2019t really supposed for the New Year, but I\u2019ve had plenty of free time on my hands\nduring the holiday break, so here it is already: a brand new version of my blog \ud83e\udd73\u003C\/p\u003E\n\u003Ch3\u003EWhy?\u003C\/h3\u003E\n\u003Cp\u003EWhere to start? I got increasingly annoyed by the old version.\nThe design started seeming boring and blunt.\nThe code started growing unstable.\nIt was using the \u003Ca href=\u0022\/projects\/micrus-v4\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-cogs\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E Micrus framework\u003C\/a\u003E,\nwhich I \u003Ca href=\u0022\/blog\/how-and-why-i-ve-built-and-killed-a-php-framework\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-computer-speaker\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E stopped supporting\u003C\/a\u003E a year ago.\nIt was using \u003Ca href=\u0022https:\/\/gitlab.com\/Avris\/Micrus-Assetic\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-link\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E Micrus Assetic\u003C\/a\u003E\n\u2013 an outdated method of asset management,\nwhich highly depended on the server configuration and binaries installed.\nThe deployments were \u201ciffy\u201d, to say the least.\nI was afraid of sending even small changes to the server, for fear something might blow up again.\nSome small things I didn\u2019t even notice were wrong: like still warning about Google Analytics tracking,\neven though I migrated to \u003Ca href=\u0022https:\/\/matomo.org\/\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-link\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E Matomo\u003C\/a\u003E ages ago.\u003C\/p\u003E\n\u003Ch3\u003EWhat changed?\u003C\/h3\u003E\n\u003Cp\u003EI decided to keep it simple. To go with a \u201cless is more\u201d approach.\nI\u2019ve removed soooo many features that just weren\u2019t useful enough.\u003C\/p\u003E\n\u003Cp\u003EI used to have an admin panel: except I didn\u2019t need any fancy editor,\nthe main content was written in an (enhanced) \u003Ca href=\u0022https:\/\/www.markdownguide.org\/\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-link\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E Markdown\u003C\/a\u003E anyway.\nSo for this version, I\u2019ve decided for a filesystem-based approach: I\u2019ve ditched the database completely,\nI don\u2019t need any ORM, I don\u2019t need an admin panel. I just have a bunch of \u003Ca href=\u0022https:\/\/gitlab.com\/Avris\/SUML\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-link\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E SUML\u003C\/a\u003E files\ntracked by GIT. Using \u003Ca href=\u0022https:\/\/gitlab.com\/Avris\/Esse\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-link\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E Esse CMS\u003C\/a\u003E.\u003C\/p\u003E\n\u003Cp\u003EI used to have three language versions of the UI \u2013 but why?\nI don\u2019t think anyone really cared about not seeing the names of the categories in Polish,\nwhen most of recent my posts were in English anyway.\nSo now the posts are still available in the language(s) they were written in,\nbut I\u2019m no longer maintaining the multiple versions of the UI, or the features to filter content by language.\nWhat a relief!\u003C\/p\u003E\n\u003Cp\u003EI used to have a \u201crandom post\u201d box. I used to have tag clouds. I used to have an embedded Twitter timeline.\nI used to have the latest posts on the \u201cabout me\u201d page (really?). I used to have a link shortening feature\n(\u201davris.it\/l\/\u0026lt;whatever\u0026gt;\u201d) that I\u2019ve never used, not a single time.\nI used to have a separate controller and database fields to support redirects for legacy URLs from the even earlier version.\nI used to have database fixtures. I used to have a console command to export legacy comments to \u003Ca href=\u0022https:\/\/disqus.com\/\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-link\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E Disqus\u003C\/a\u003E.\nI used to have tooltips and popovers.\nAll gone now! \ud83d\ude0d\u003C\/p\u003E\n\u003Cp\u003EI replaced the infinite scroll with... just loading the whole page at once \ud83e\udd37\u200d\nIt\u2019s not that big for today\u2019s standards anyway \u2013 the heaviest list of posts is 113 KB of compressed HTML.\nInstead, I now lazy load images using the \u003Ccode\u003EIntersectionObserver\u003C\/code\u003E API.\nWay simpler than infinite scroll or pagination \u2013 which aren\u2019t really necessary with this amount of data.\u003C\/p\u003E\n\u003Cp\u003EOh, and the website is now using a fast an sleek \u003Ca href=\u0022https:\/\/symfony.com\/\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-link\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E Symfony\u003C\/a\u003E setup with an HTTP cache \ud83e\udd70\u003C\/p\u003E\n\u003Cp\u003EDesign-wise, I use the default \u003Ca href=\u0022https:\/\/getbootstrap.com\/\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-link\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E Bootstrap\u003C\/a\u003E theme,\nwith only minor changes of variables and minimal additional styling.\nThe main feature, obviously, are the tilted elements. That\u2019s enough to add some personality to the website,\nwithout making it overcomplicated.\nCompared to the previous version, it\u2019s way more contrasting, better tailored for wider screens and clearer.\u003C\/p\u003E\n\u003Cp\u003EOverall, 41090 (!) lines of code were removed:\u003C\/p\u003E\n\u003Cfigure\u003E\n                \u003Cnoscript\u003E\n                    \u003Cimg src=\u0022https:\/\/avris.it\/image\/avris-3-4-diff_big.png\u0022 alt=\u0022424 files changed, 6711 insertions (+), 47801 deletions (-)\u0022 class=\u0022border\u0022 width=\u0022550\u0022 height=\u002289\u0022\u003E                \n                \u003C\/noscript\u003E\n                \u003Cspan class=\u0022hide-noscript\u0022\u003E\u003Cimg src=\u0022data:image\/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAFCAYAAAAt8E4LAAAACXBIWXMAAA7EAAAOxAGVKw4bAAABbUlEQVQokZ2RTY4TQQyFP7uqKwlh0skIISSExBHYchPEATgVaxaciQVigRAw+emku6q6K2UWCYPYDBJePVnPz7I\/ef3slT1\/+YLcnzBtsDJSypmbdcv3r9+YzWesNi2xjwz9QN91pJgB4+GS\/\/L438I5hzaeVEZEhGpGe7tBqRy2B1SVWg1V+RNm18wHF\/6r\/vZ4EGqZMDPCLHDqjghwPBxRjNX6BhMh9pH93Y4nT28J8wXd\/siqXWIohsH5jGsaSimMKSMinKvRrleE4Nn+3LF4vKSWQhMCOV88ghHjyHm6kPFv3r2l3bTUanx8\/4G+O+GcEofEYrkg55FHyzkpjXin5JQQ58EqoopvLkc0zuGcAp7iJkIIDENizBnMQARBqNWotQKgqqgqItP9t\/yXT58RFXyYcTx0dPsDZoYIpBgB4w6wK6JpGu\/Zb3\/sQEAwEtB1ghiYGLGPmBlTzleyRhoGDLlOX5TZtSOAGL8AA7fCc1N6DsoAAAAASUVORK5CYII=\u0022 data-src=\u0022https:\/\/avris.it\/image\/avris-3-4-diff_big.png\u0022 alt=\u0022424 files changed, 6711 insertions (+), 47801 deletions (-)\u0022 class=\u0022border\u0022 width=\u0022550\u0022 height=\u002289\u0022\u003E\u003C\/span\u003E\n                \n            \u003C\/figure\u003E\u003C\/p\u003E\n\u003Cp\u003EThere\u2019s nothing else in the (programming) world I love more than removing useless code!\u003C\/p\u003E\n\u003Cp\u003EDeployments are now stable, simple, reproducible and revertible, thanks to\n\u003Ca href=\u0022https:\/\/symfony.com\/\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-link\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E Symfony\u003C\/a\u003E, \u003Ca href=\u0022https:\/\/webpack.js.org\/\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-link\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E Webpack\u003C\/a\u003E,\nlack of database (no db = no migrations),\nand most importantly my recent child: \u003Ca href=\u0022\/projects\/avris-deployer\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-cogs\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E Avris Deployer\u003C\/a\u003E.\u003C\/p\u003E\n\u003Cfigure\u003E\n                \u003Cnoscript\u003E\n                    \u003Cimg src=\u0022https:\/\/avris.it\/image\/avris4-deployer_big.png\u0022 alt=\u0022Console output of deployment\u0022 class=\u0022border\u0022 width=\u0022848\u0022 height=\u0022237\u0022\u003E                \n                \u003C\/noscript\u003E\n                \u003Cspan class=\u0022hide-noscript\u0022\u003E\u003Cimg src=\u0022data:image\/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAKCAYAAADcpvzeAAAACXBIWXMAAA7EAAAOxAGVKw4bAAAB1klEQVQ4ja2TMXPUMBCFvyfJdw6JyUDLpKOloOf\/\/w9mAqkokkDu7LP0KNZOLpmbpAAVlvbN0+767ZO+fflsgG4QhzujBK6F\/a8Luov3uE3U8UDfiYvznjbPgLi5\/olbA8T\/XPp6dWUJ1Jt6l0l9Q9tGe0jQhDZG2bgRcTFuggo2tD8JED5Am9JTYsBvFT\/BKZ4S6hv1NpPeNTwJbYSryGeGYtpDQimutjFFliVOvVFp1F2iG2bwUsSE2g2wAjRoYzyDSsSe9Yh5FsUN2iQ8iZaFxwSKZPU+BbnC\/Lvgw9OviVAIgouhGqQjfJmmX8FfrpL6aF1DDeKmQjbeJdSZep\/wlB6llXwk9nFncY7iEdtGKwcj6VE9a4kXjgXCJM+Qtku5tEiYQ1oyKJs8VMpQF\/uuJhZaax19n8UL4SUnsNOc4lm0fYIGrjG+NmaUQJ1Rt8y+b6RZeI7xvmpY\/4Op1S1QMVSFWsl4TNTbDDlwxnXwoG2LZNNrT1680fZJTgFI2xaj6mO3IQ+VdN5QZw43Ja6XMPj6ek6Z8mm91cxpTvnYf+KwHxk+XLJ\/2LEfd5wN53Ql8+P7dTxZwDZb9UzjiI9NvZh15YS3FlNj5GU\/4qzmjtvPOX8BswgOy6gNMP4AAAAASUVORK5CYII=\u0022 data-src=\u0022https:\/\/avris.it\/image\/avris4-deployer_big.png\u0022 alt=\u0022Console output of deployment\u0022 class=\u0022border\u0022 width=\u0022848\u0022 height=\u0022237\u0022\u003E\u003C\/span\u003E\n                \n            \u003C\/figure\u003E\u003C\/p\u003E\n\u003Ch3\u003EVersion 1 (\u201dSilva Idearum\u201d)\u003C\/h3\u003E\n\u003Cp\u003ESo, to finish this post, let me just quickly show you the four versions I\u2019ve been through so far:\u003C\/p\u003E\n\u003Cp\u003EMy first blog was called \u201cSilva Idearum\u201d (Latin for \u201cForest of ideas\u201d).\nIt was anonymous, spirituality-oriented, Polish-speaking, Joomla-running and with a \u201ctoo much\u201d design.\u003C\/p\u003E\n\u003Cfigure\u003E\n                \u003Cnoscript\u003E\n                    \u003Cimg src=\u0022https:\/\/avris.it\/image\/avris1-post_big.png\u0022 alt=\u0022Screenshot of the post page in version 1\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u0022464.5\u0022\u003E                \n                \u003C\/noscript\u003E\n                \u003Cspan class=\u0022hide-noscript\u0022\u003E\u003Cimg src=\u0022data:image\/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAARCAYAAAC1tw6GAAAACXBIWXMAAA7EAAAOxAGVKw4bAAAGJUlEQVRIiS2UO49kZxGGn6rvdk736Z6+THt21pfF69sagYUsIECIhAjxL5BICIiQSEj4AyT8AmIiiEgXgQRItgAhC3vB9trMzM7Ozuz09O2cPt+FYLaSkkqvKqnnKfntL94uH58rg8mCz06\/yvok4k1h0AsLvmButxzdW3B4UOMOLMtux\/V6SW+Fq5j4bLOiDApfvz9jVNWYYnHF4kV4\/p8nKHtSdNjgmR7NSD5wcn1FbwzWWUosbG5a+rMnzCeLP9hHV4bZ6xOwR4yvN4zqPSmCN5F5UN585x7TqcebPV3j0Ww4S2fssDx8fMqTYpn3M\/78xy\/55Y++zzDMCOWIkjbE6hFSOtqLFcE4SjXAjGbMAxwMeh4cj3i+CqyWW\/J0zTx32LsP7jGZLoi9MkxbWhcZhinLizWz114nv3zElQ0Ym3FW8P2a98YLOHiF33zwa0LcIvWQeVjx17895N6rb+HNOSVH7h2\/RUlbar\/ExEgYvcR+d4M4gx8M6UOg7QY0s5cIuwva6y+xd195wG67IZcObYYIzwiaGNrAQTTsB4fYwYBQO3wVsKagqtgq8Kuf\/pzPv\/gUlxJvvPMyk4MRRg2npyfEPtGMDlAZIeMZOe4RqdCqQWPDrn3OZX+HVhJ+GJDhAp9W2O0msu96sjqaxUuM2sBhGPOstITNjnmj9NM5zXiM9w5VJZ99gvQbHsxG3K\/fwFWBv4vnal94LRjuD6fknHHZ0G5ajBRkdki2DTrosWkKN4Hd3pCMZ31zQx4echAcNkWDCyPscI7aEfZORTWsubM\/wZoJ86MxebHAhwYVQUTRyTcpWGK+hbeQ+bYqlELJGX0FcopYa2jUUdc1z59+QteuwVZIqqgpdJstlydnbDEU3bHwE6xBMDqAEnDWoIcv0w7HVPWI5maJEbDe4JxirENEEPEg4LktEUMpCTUBck+KHdlEVAXRQru5RNQhpsI5g0k91lasnn2MNY63H7zLo0cf8rTbYW0xEA1pF0kFqmmgV0+ZvYUZr6jiBicGNSBqoPTk0rO6WSMCIpBTRo2iLiBaiCnSOAMUIKNGKDlS8h41FSKC8TXNZErpr5Cy53ix4Pz0c+yiarjedCA99aTC1iNULNYUejth78Z4tXRtAjaIAESC91g\/wBpFbocgt2eDctsFKIJaj+hznHOU0kFZEsKUWf1f\/MKSVp8xn46ZTO9jTTVi3CvPrzqa+yPw1YvlmVDVZCJ9KpScUDUgDqGQU6HsVkQKooailpvLc549PWc2n7DbtjRNw9PHn7Ludrz3rW9DycS4J8anVBKZ3xlgdsLy4gLvGtquxYbaENOIsAewWBswKmQMJHDekzO07R4o5FzwzoMYJAREQVXo+45HH\/6Jf3\/wF8Jkwj8+PueH3\/saD3\/\/O4Z37\/L+d74LuaeoY992RHuCHnjCZol51uCzwWmDbUum626DOfZovyIJmDCh9IloE5VTmqa55SVnhAxiKCUjovT7Fms9fbfhfAOr88d88NEZunnCbHbM9OgQeWEjoohVri8umZgRuhuS1h2pGPZhjd13heRHCBGjYIwi6lABDYILFWgg5oxKIaf4gpmCtZa+7yg5UxB20TCcHfPuN95nefOQeLHk83+dQAkIGTUWRGhGr7KJheVKafwRaXzG5fUl5WyLPaoMZ9s9W23Q0QIzGCEFVBU1FuuHWDVQCsYqwgChEGNGVagHAyADhni9ptlfc\/lFZHB6SXA13DvAHhySzz8ipRYd3cG6Q+qmZfnsKdglySZyUxGGAVsVy2vn\/+Offo6++RWcH76wJWKMR42j37fc3KyBggDeO3JOGDWkXFAVVA0\/+PFPbuE3BvOzFhtb8voU2W+R5RkKZPGUcYPzd3B+w\/X1GjdsyO0TZDDCeh\/guuP+fIujoMYiqlDAqGKN4OsKZz0FEFEgUXKhlIJznhg7VC0xRiRHpF0S+x0xC+wVkRHN4BK1hl1vsH5IFRyD9oqzx2ckZ9l2icPjI6yaAcbXHBvYdlsiHU4NKSdEFZFISYbdboMYf2tgTrcvBqHv15RcEN0jYjBqiAxRGyj9mqI1g7omhxa9OWUwuUvrK0K6IXrP6NW7ZFdDUmLX8X\/09s8geltpKwAAAABJRU5ErkJggg==\u0022 data-src=\u0022https:\/\/avris.it\/image\/avris1-post_big.png\u0022 alt=\u0022Screenshot of the post page in version 1\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u0022464.5\u0022\u003E\u003C\/span\u003E\n                \n            \u003C\/figure\u003E\u003C\/p\u003E\n\u003Ch3\u003EVersion 2\u003C\/h3\u003E\n\u003Cp\u003EAfter coming out and becoming independent from my parents,\nI was finally able to put my name on my posts. New domain and a redesign was also in place.\u003C\/p\u003E\n\u003Cfigure\u003E\n                \u003Cnoscript\u003E\n                    \u003Cimg src=\u0022https:\/\/avris.it\/image\/avris2-home_big.png\u0022 alt=\u0022Screenshot of the homepage in version 2\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u0022464.5\u0022\u003E                \n                \u003C\/noscript\u003E\n                \u003Cspan class=\u0022hide-noscript\u0022\u003E\u003Cimg src=\u0022data:image\/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAARCAYAAAC1tw6GAAAACXBIWXMAAA7EAAAOxAGVKw4bAAAEQklEQVRIiZWWO2xcRRSGv3nd1+56d+21DY6xnYctIkAIRxGCCAGK6Hg1FFSICgloEAiJBikUFCkCDQUNLVJ6RKjpKJEQUhwLYYKVxHYSdm3f3bk7MxR3d+MkDlmmOpq5959zzv+f\/16xuroaqrUaIgQ6u7t8deEClWoVYyKiyJDnOQDGGJxzHD9xAiUlhy2lFMaYQ8\/GXJe0tZZOu02kBNZaGs0G9XoD7z2tVuuuC7z3dO0ecZSxc\/MGWhuKwqKkwjnPRK2OEBKtNZubm6ysrPzvjHS73WZxaoKF6QY\/\/7ZNllVozUwjEQghCCEghEBKydbNv\/nsm9d485W3WL\/6O9f+uk3e73D5yp\/YQvP5+19zcvE08\/PzLC8vjy4ZYowT6zPPnGR+QhFHGp1UiSODUZper0cABOC8J00SBIpqd4rrv3Y4Ov0Up559nnZ7h4n+T1z9Y41+J2CMptNu07UWrTVKStI0JYqi8To0u3CEONVIZWjEt9jZ2WF3bx9rLVmWkec5cZKQ7+8T6YhHry2RTR\/n1vU6353\/GELOS2fPcpNjFD1D+5823W6POI7Z292lUqkQxzEhhLs69qBYr6+vcWR+njipUTiNMYYkTZmamgKgXq+X1DUatG\/cYLMvqedbSK84c\/oNxETO3NIM3\/\/wLWdefhFtDEIKiqJPCIGiKJBSjk\/ZnkpY21gnMRUiAvn+HkJqCtvD2hKsKCxRFCMkzC1M0r29TdZMmHriSfTeL0w3Fec+eYflpx9Ha4W1Bc45jDFYa+n3++NTNp0ErDAECppxgzhOmJxsAiClJISADx6tNFprPv3iy3sgXh1FSik2NzeZm5tDaw1QVq31+JTVqkdRyR6ul2OdwBaO7e1tpJR474miaORBSkoQAu\/94DwAgRACUsqS3riGcw7vPVBaRbVaRQ6866GULZ1YZmvrOtb2SLUmTROiOB6MPGitEEKglCJ4TxCQRAnGGJSShHCnyiiKyFyOlALv79iFc26U0MOWWF1dDQc3Ll68yPTsDLE2MPCh0cNAGFA5rGy4vPcIIdjY2KBSqZSUC0Gj2RxbP8AlfS+wlJJKmrF2+TJiVFVASjWYGAGIUdXDylutFrVaDSkyarXagEZBYYvSj5QaKyP9oAMfAniP0XqkhyzLRiItEymtM4RAFMUANCdTNtavQAg0WjMkSUKlWhnhPlRDBykBcM7R7XZZWlq6L8mDAIcBOudoNpuc\/+hDlo\/MsfTcCxxZPE5zanKs7hzaoU6ngxCgtSHLspE2hokPrWC4N5wwhCBNEkIITCweI9QibrfbRDvbrPDfo34wvk9Dttej14vpdnvs75efkNJHPEKUehGD0VdK4ZwbdWl29hGq1Sqvv\/sB17Z2qJGzsPDY6J3DunofZYdRAZCm6ej\/RimFNqYc+wDeO6A0QiEE\/X5\/oKsS49yP62w7jcs7vH2qynszM2NT9i\/Q3AYk6KDr5QAAAABJRU5ErkJggg==\u0022 data-src=\u0022https:\/\/avris.it\/image\/avris2-home_big.png\u0022 alt=\u0022Screenshot of the homepage in version 2\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u0022464.5\u0022\u003E\u003C\/span\u003E\n                \n            \u003C\/figure\u003E\u003C\/p\u003E\n\u003Ch3\u003EVersion 3\u003C\/h3\u003E\n\u003Cp\u003EAs announced in \u003Ca href=\u0022\/blog\/brand-new-blog\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-computer-speaker\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E Brand new blog\u003C\/a\u003E\u2026\u003C\/p\u003E\n\u003Cfigure\u003E\n                \u003Cnoscript\u003E\n                    \u003Cimg src=\u0022https:\/\/avris.it\/image\/avris3-home_big.png\u0022 alt=\u0022Screenshot of the homepage in version 3\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u00221603.5\u0022\u003E                \n                \u003C\/noscript\u003E\n                \u003Cspan class=\u0022hide-noscript\u0022\u003E\u003Cimg src=\u0022data:image\/png;base64,iVBORw0KGgoAAAANSUhEUgAAABUAAAAkCAYAAABmMXGeAAAACXBIWXMAAA7EAAAOxAGVKw4bAAAFE0lEQVRIia2Wy48cVxXGf+feenRVd0+P7Ywn47ESk4kTiEE8LEACsUECCQHZIRZs2CL+EZD4A9iyjmADUjYIgSJhQmyEIjBCKLKxsScT2zPdPT1Vdd8seqY1j3Y0SHybUl3V+e79zvnOqSt\/uPXnJEqBCKIUSmlaY8mLnKKsECVY4xCBhAAgMWBcoq5ylAgheJJ3xOAhRmT46udTMbpIUqCUJqsHqKIk74\/Iqj55URG9IwGZaBKgQ4QErmuwzmAOptj9Xdxsim8aMm8thfegFSEkwkGDdgGScOOlDWwUHh8U6GpEqTLq1FBoxdNH92mmewRriaYhNDOSDxAiKkWhmU7o9me4zqFUge6tcOO11\/jx975DayM2CNZYunaGFsHZjpgE0zZY0xF8IgaIzhFDQIorbySV5UiezyX3R+i8ABKfePllDlxkajwAKYR57qwlmJZoGnzXEJ0jeEM0Hcl2yDu33jsslELpjHklZF44USAgIoBASiQSpAQxklIixTB\/T4mUIqSEWGsTh0gpISKMx2OUUvT7fZRSADRNQwiBuq7RWh+FICKLuCOoI7LjKMsS7z2TyYQQAj\/76Y\/Ii4KpLdFZASLcfXCw2PA40vNPus9k\/ARFxmBlSDObsHH1JRKCEogxYnyilyuUUidO+lzSGOMJOUeYNJGVfk6KgZ2xY+NCMW+K88h3zuG9X3woInRdR6kszrQIifWRnhdmifzsKOg4fvm7P\/H+Bw8ZDGpsSGTlgO9++VO88sIQ0Zper7cgWIZs2eJf\/vEBv7\/9PvVwxJNpy3C4ws2tdTYv5uiQY42hqmtCCGeIRWS5\/GgNdZbTI3F11MPOxiTnSQeWzphDD5\/N+Qn5p+GN4fHjbRBFVVfM2pboLVlviODpug5IZFm+lHxpTp0x+K7BeU8vS2hvicFTDWu0koU\/T1f9Y3MavUNFj+86ullGWRSYtiN4RxRhMBgsSJdhKen33\/wmNz\/zOvPGn6994cbrdI1hY\/NFnm0\/ZOWFFxfGP42l5j+O4w3RHjSMLqwy29uhHFxckJ6OE2ttOlo8\/TxOehR8GsvadGmhmqbBWkuWZdR1jek66n6fe9v77E92WS0dXSzw2So3ro3Ol1M1GRP2JlRbW4QYefTMMNxP1FnFxitXmZnEWi+nypdFH5KezoleW6d34TIojVbwk7dm8M+\/8uFkk7d+8Vl8SEwPLMUoJzuvT4N3eGPIej3QBV+\/HpleGvF0\/AwRUAIJEJZ31VL5P\/\/NA+78a4x1kW\/cXOPbXxpQ1jfp5TmZVlwc5ljnIUUOB90CIrJcfq+5y9qzv3Otang1fZHB8FsE59FKePu3j7i7k4j+31zpwQ9\/8LUTpM+tfnvvNtu33+ajAtavXUZI9PsVdVVy7+EOt+48ZnfvXb56\/QpwkhSeY\/73bt\/h3v0HiGje+OQW6+uXsS4xGFQ4B+N9S1koRoOS4bBe\/js5bfq2bTFdh840\/f6A8XiKKCjzHKUVs\/0ZohSrq6torc9nfqXmIy8laI3n1+8+oSo1Lio2LxX856MZCWFrM\/KVT6+dT\/4f\/\/aE7d0O7yNbV\/p87volYoKqzGhaQ0QhApmCTKv\/vffj4U1EKYWIYIwhBI9SOb1eceIwHyv\/xK4iJ0bcfuvZHTdUVY+BS1wYlmdiz14xODt8rYv86p1HWBfZmwWezuD+TsuHu92y8JM5\/X9B0hynLNUQk8ZH0EoQSaR09AREKDMhy7IztQD4L+DGHxjr8QA8AAAAAElFTkSuQmCC\u0022 data-src=\u0022https:\/\/avris.it\/image\/avris3-home_big.png\u0022 alt=\u0022Screenshot of the homepage in version 3\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u00221603.5\u0022\u003E\u003C\/span\u003E\n                \n            \u003C\/figure\u003E\u003C\/p\u003E\n\u003Cfigure\u003E\n                \u003Cnoscript\u003E\n                    \u003Cimg src=\u0022https:\/\/avris.it\/image\/avris3-posts_big.png\u0022 alt=\u0022Screenshot of the list of posts in version 3\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u0022464.5\u0022\u003E                \n                \u003C\/noscript\u003E\n                \u003Cspan class=\u0022hide-noscript\u0022\u003E\u003Cimg src=\u0022data:image\/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAARCAYAAAC1tw6GAAAACXBIWXMAAA7EAAAOxAGVKw4bAAADMElEQVRIib2WzW4cRRSFv1vV1T09f5AZx5EiJAiKWCDxIzZIkYxX7PCCBQs\/BO\/AM\/gV2PEEXrJha4UNwgpKVg6yzHg89sz0X1VdFh0bO1EyvaI2t\/vWUZ1T957WbYkxKhvW2dkZxhim0+kbe+fn54xGI4qixBjBOUdRFDjn8CGQuozZZcWDSY5zbhPVodR1vVHQ\/7gOE9XNek5mJQj0pGJ5tWCQ91gvL0mc4+EHH76BV1VCCAA0PhC852wtPNruv5NHRJCqqjYqqr3iIzhr6KUGAO89Ozs7nJyc3MHu7+9zdHTE8fHxnfze3h4HBwebqA6TTQgAX5c0vsFkGfPSMBmmiAinp6f8\/fLlHexiseCrjx\/z6P4nvDc2JLPf+fnXp8zn8y5UJCLyToCqkqYO5xJ6ec7YtBWirnkyGNO8P+VFYshDZOgjH7mM33qP+Wt7zmS6Yvb0CV989y02PGcTF0AnD5VlyeXlJaPRiMFgQJZlAGzvfsPsnxlfDvsISihLHnz+GT\/ee4F7\/gdJYbnYNfz5cAddf08Xrk4eqqqKEAJZlmFeVSjGSFk1BBVcYqgb2LrXx3vPxapmWSrjfkKIyrifYiV2EXTYqWViU3xUxll6k2+aBmugXC1Ra0mc4+oqkOc5qXimfUG1wpiUzBm8j91athEB+LoA76mqAS5CMsgREYL3eO9pmgYtCvr9Pnmeo6osLhaIEVSVusiYTCZdqLp5yDlH0zSEEIgilMslaZpiE9tG28brdgIYa1BVrDUoEFXZXJ+OX5mIMBwO7+RDCMQQKcsCaxPW6zXOJSRuiqq2LbUW7yMxKqgitwS\/VVAH0dgkJSI4KyS2PbSua9raCjFGjAjD4QgjgjEGY8yNZ4y1ncRAx5bF0KCqqDhiCIh7dQ9jSbMcRBABxdAWIyIIIq2HNEZQpcvQ7FSh69mUZdmdm\/70yzMu1p7pKOWq8BR1YPfTKT98vUXUiKgQNZKYTjQAbJz2twdlkrQHt97wRIWo\/3mwl7b5uq6p65per9e205guvx7wtll2beTX3733ADexbbdgrMFJ65lr3HK5ZLVaEVVJrGFr6\/7N\/usct5\/\/BSOPoERFJpF9AAAAAElFTkSuQmCC\u0022 data-src=\u0022https:\/\/avris.it\/image\/avris3-posts_big.png\u0022 alt=\u0022Screenshot of the list of posts in version 3\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u0022464.5\u0022\u003E\u003C\/span\u003E\n                \n            \u003C\/figure\u003E\u003C\/p\u003E\n\u003Cfigure\u003E\n                \u003Cnoscript\u003E\n                    \u003Cimg src=\u0022https:\/\/avris.it\/image\/avris3-post_big.png\u0022 alt=\u0022Screenshot of the top of the post page in version 3\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u0022464.5\u0022\u003E                \n                \u003C\/noscript\u003E\n                \u003Cspan class=\u0022hide-noscript\u0022\u003E\u003Cimg src=\u0022data:image\/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAARCAYAAAC1tw6GAAAACXBIWXMAAA7EAAAOxAGVKw4bAAACrElEQVRIib2VTW7cRhBGX1V3s0nOUGNLTrIIggTeBYJhJSfwVQzoBr6FDpO1LxB4lUXuIMABpAiSrJnhX3d5IWlkw3ZIB0E+gADRLLJedX2slpyzMaGzszNUlYODg0+eXVxc0DQN222LqhBCYLvdEkJgTIkiRP6+7vhuvyKEMJXqtfR9Pwn0P+q1N5vm+evtWxChiJFmuZxT6b+SiODnBPoQcM6hqqzXa0SElBJFUdC27S2gGUMSDOXJ\/vKLCf9JZjYP6PDwkMvLyzmhHB8fc3JyQtu2mBl1veCPN7\/x8y8veLL\/\/eT7fg7112pz0zGMLWUsyTlTL35C\/WpyhwBmeehrZWJsc2bpHNkyz49+xcVyVnGzWnZfmbu7DDBVyIZgGJAAUUVEMBv4drVCnaMsy1tIs3k7NKdlT0MklzV7zlOpIgJ\/eqEaRp6iDNm4TCPv0shKlNXqEaqKquJDQICc8zygyQjgWb3EkiFApY7TsSfuNXRdy6M+sRChy5kuZX6MJaYFF9uEU3DdSB0dpZ+GgZkeerO+YnN9hRMhmTEWBU04IBQFv5+e4oeBDJjBD92WMRvdkInBURZCWTjIaZ6H5rTs5atXtG27W0t3CUWgKtxH8UdHR6gIhVdU4Go9MCZjVSlOp3dp1tFxfn7OOI6ICKq6q1REdt64H5Z1vaCoFqw7Y9snCicY8E3j0WmgeUeHmaHOoSKYGTFGvH+w3z1QzgnnPGZGPyaiV\/ox87gpUJ0302aZOqWEc+4WTJW265CuRZ2\/NQ6gqvR9T13XlHVkr1YEIQwj19fvKB8v\/pvf\/j5ZSpnlcgFAJUL+oG1mRlVVO+jNZkOMEYBYCk1Z74qZBPrc4odDzMxY1DXGg2fuUBB5mC+bzYamaQC4ubmh6zq8D7hYgUEd3Sff\/dz9e6J1Rd1KBbTbAAAAAElFTkSuQmCC\u0022 data-src=\u0022https:\/\/avris.it\/image\/avris3-post_big.png\u0022 alt=\u0022Screenshot of the top of the post page in version 3\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u0022464.5\u0022\u003E\u003C\/span\u003E\n                \n            \u003C\/figure\u003E\u003C\/p\u003E\n\u003Cfigure\u003E\n                \u003Cnoscript\u003E\n                    \u003Cimg src=\u0022https:\/\/avris.it\/image\/avris3-post-end_big.png\u0022 alt=\u0022Screenshot of the bottom of the post page in version 3\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u0022464.5\u0022\u003E                \n                \u003C\/noscript\u003E\n                \u003Cspan class=\u0022hide-noscript\u0022\u003E\u003Cimg src=\u0022data:image\/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAARCAYAAAC1tw6GAAAACXBIWXMAAA7EAAAOxAGVKw4bAAACD0lEQVRIia2VTW7bMBBG3wxJmaptpE4CFGgO0C56id46y+56ha56gaABEieWLIkzXeTPRZuatTsrShp8fPpmhhQzc\/bE1dUVqsrZ2dlv366vr1kul3Rdj6qQUqLrOlJKTKXQpBk\/bre8O21JKe3b6lKGYdgLtF6vCaqYP6S6OyKCu6Oq5JwREVR1n9ReoOi+l4ebmxsEMHdCCLg77k5QZSrl+R1A27asVquDaESEWJMYYwAEsYJqADfMQVSIO06JCCqHu+TudUA5t5gZzWxGk9IvJRORZzGAEKskX434JPi36PseM2MYBkopAKgq0zjyZj4nPUKaGTlnYtseDlTTQ22bEdHnTZ+ad9cpMyfGiJlRo\/kqUE1SKUaMSlvx58dOWlXJuq5jsVgwjuOjK9A0s5pz5d+BapJ6z+gotDExmqPANEB\/39M2gaCCilDcWeQjm7qm3jO2tCkxn0VUX6Zq0UYE2DX5mP6BypLN354TgjIWYxqcnAJNOvpU\/jNQTdLl12\/ENCPEwMnJyV9zL04zHy+WhwPVWPzlu7PZ3j8+3bKaJxAQhHU3MpYXjc+fzvnwfnEwkGy32+OK\/n\/jMtaM7t3dHapK0zTc9kZOAXi4XIsZQYVhclJ4mLSkSj8WFvllCGpDn5paRHhtrapIaOgnyCmgPoI7UzHERqxMqBheBnCnTFuiOv04sdls9urvrn8CnvD1+u2+X7sAAAAASUVORK5CYII=\u0022 data-src=\u0022https:\/\/avris.it\/image\/avris3-post-end_big.png\u0022 alt=\u0022Screenshot of the bottom of the post page in version 3\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u0022464.5\u0022\u003E\u003C\/span\u003E\n                \n            \u003C\/figure\u003E\u003C\/p\u003E\n\u003Ch3\u003EVersion 4 (current)\u003C\/h3\u003E\n\u003Cfigure\u003E\n                \u003Cnoscript\u003E\n                    \u003Cimg src=\u0022https:\/\/avris.it\/image\/avris4-home_big.png\u0022 alt=\u0022Screenshot of the homepage in version 4\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u00221666\u0022\u003E                \n                \u003C\/noscript\u003E\n                \u003Cspan class=\u0022hide-noscript\u0022\u003E\u003Cimg src=\u0022data:image\/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAkCAYAAACJ8xqgAAAACXBIWXMAAA7EAAAOxAGVKw4bAAAEA0lEQVRIiY2Wz4scRRTHP1VdP3pmd2fdDSIkm7\/CeDC5aPAvEEHwIngSD168ePLi3T9CEFFEzFmQEBFFNqd48WwiyLgTd3p3pqu6uspDd+9sT3eyeXTxul\/xXr336lvfLnHr9huJS3Lz6IhlUbBcFqQUL08hhEQrhRCCBMRYE2NCa43RGmMN6t133sYYg7UGay2zvT2Ai+9mGKyxl2ytNhatFVJKhBDNiDH2MuzEOcf5asV6tSRGSGSkFNmf7TOdTjDGjLkhUkqDgCml0dHNPU+Uc258pa4EIdqSYD4\/wVpLnluUUmRZNvCTmz41wxiDUhn\/zv\/hwf2fkbILLJnN9jBG41zg6XnsLXqx+FhZAH8e\/8IfP90DNrYQamKMhDpis\/G2yLFyV2cLVmcF5X8nlMv5BXxi5ygg1OO9lNspA\/z2w5c8evgrk92MLz7\/DHd2CoDRikwpJloyndjRktXYKt88eMSP94955XCPxVnJh58GJkBZOqQUhDqiQkFuZgPf0YCHL1\/nrbt3yCc5mczoOpPntnXSSDFa8RDYY40OIeCc43RZ4JxrQe\/QSl58O+dx3iM++viTVLZG7zwpJVbrNWXp8JWnqirqOnIFnjcl\/378sGeYTqdYY1gWS25cv8GTv59gbVOqc47Dg0MWTxfcPDrir8ePx3rYb8ZqtW7xKFgWS0BQ1x3rCNblGhCcLBYIIQdHcQDslBJ5npNSajYkpQtIpJQ4ODggpUSMkRjjiwG7qioAsqyZViojb8v2zgMQY0TKobu4dfvNF2z3RrTWGKMx2mCMxlqDaflSfPX1t6khWNsj1bx9v0y+1liM0Ugpe6QKbPQ2H87nC8pyRWZ2uHY4I3sGgAESCa36Z0Nt71Ke1xi7jwDqUMEI53XSbVQvYJdqJ4Vz5FJRx0imRk\/mJsMWAc\/NcL+SrHRNSs1OXiVXZrhEotLV\/4423CDDAZAOMoWQkkxK6rq+IuBwxwZsMy8cJnlijL0TorVGaz0IYHS\/zwPYrFxAxEBq\/yVCCLTaBEokmqfRUoqLY+i9R333\/T3Ky5zWvXvft3mP77T3OOfxvsJXjQ4hNAm8+nr\/bvPS\/j46y1icnlLXAaU0QkCsGoekJLJOkJoatrs8AFpVlgghmWYRpSQxZQgBfmIb3BnI1hVG1\/g6UrhBwC0+9J61EIBAAImq7WVoV2zUeQlKaXZ2+iShPnj\/va2b1dYty2zZWrIw1pKNkcT2LhdFgQ9w7WCP5ToxmwhKn0BArgU+JIwSnJeJnXyIwwGwpzu7ZGYXgHXDpfgaQtv9zuZCc5PopGNsUZZlqqoK5xzl82DjPM432rffpe\/DzXuPeO3O3V7V0zxHZBJoACuAqsVYJyGEZ571\/wHlDJySzIsFTgAAAABJRU5ErkJggg==\u0022 data-src=\u0022https:\/\/avris.it\/image\/avris4-home_big.png\u0022 alt=\u0022Screenshot of the homepage in version 4\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u00221666\u0022\u003E\u003C\/span\u003E\n                \n            \u003C\/figure\u003E\u003C\/p\u003E\n\u003Cfigure\u003E\n                \u003Cnoscript\u003E\n                    \u003Cimg src=\u0022https:\/\/avris.it\/image\/avris4-posts_big.png\u0022 alt=\u0022Screenshot of the list of posts in version 4\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u0022464.5\u0022\u003E                \n                \u003C\/noscript\u003E\n                \u003Cspan class=\u0022hide-noscript\u0022\u003E\u003Cimg src=\u0022data:image\/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAARCAYAAAC1tw6GAAAACXBIWXMAAA7EAAAOxAGVKw4bAAADcklEQVRIiaWWz08kVRDHP+9n\/5gZdkFEgrBZ4wE18Wb8EcOiiRf\/BC\/GswlXjx688U9w5GSMx71hPJLswURijAc3JBrWhGGEZqaZ6ffKQ08PAzuQgJV06tv1rVevurpedav3PvpEBFAKRLgUBQhYa1BKATCqqtosNT8TA2nqiVHQWiMxAmCspaoqqqoixtpxek+lIITwk22CNcZpefLkY3q9HkdH\/xBi4Pi4+5LfNNYarHWkSYq1Bu893nuctSRpgrUWZy3OObz3JGPeJzUGtP3s081Lh8RfOiaexCeXtvF9s7i2JVO+tU1rjVJqopurTn62bqQoClRs6ndP6fcHFOcFxhheWViYbCIid8ZFUfxs\/08yABhLkj+gioLUkSeU3BED2Otlu6u0Uj\/T3mwUY0REJrqxX8cAIYTKlmVJHJ+E2zK\/jzT9M91P07jxaSTP86F1zl0hph365ZBuH6JAogJpcUK6tADjgH+dgtPgZUjOENduTda+KBRW1\/gigNUwn0UybzHG3PgQ9lZSQ8cMsNaSZRk8XJ5wu7u7bG9vz1y3s7PD\/sEhTgtp\/4R8cX7CbWxssLxcx5nV4PYmosFleYFSFxhj6qTG9m63y8HBwcyE9vf32dra4uFchyjC6Vkx4fb29iYJzSzC9caaxiLCoBwAijzPKc7PaeU5AKnSrDpPRxt6RuFDxETh3xhZWVrmmy++opetsTg34tHFb\/y4\/wtPnz2\/ca8G33rKtPWsrj0mSn2atYYqQhRhwVreSVvkRvN7p4UfjXh9UFJUgZFpsztcw6xn5B1D8ewt1tff5+3e98DLA\/FKhW5kgKqqCGFIiNAfgTOQWhDgzQ8\/4PPvvgVgUynGQwilFKuP4OvHP7By1KX994jDNzJ+Xdnkj3e\/vBJ\/VqvcOqkH5ZAXBXgdmQ\/n6Ln2ZfW04s\/nhxhjEIloXetOu8ODTouzkxOiqHFlK7TVmKxF5nPSNL0poae3Vsho8KNjFIpRK4eLISKRLM8BIUkSjNaEEHDO0Wq18N6hreVsOEJE0KrmkzSh7TXOufv3ENqy9NrKlV8MqHuIOCTPMgRhrjM3eV3OOUIItNtttNKIRASwxuL91Zl352NfVRUhDgkBiiF4C5mrGzz3htOzM4wxDAYlEiPaaF5dXMRaS1mWKBQxBrSxiBd8MvszMy3\/AclyutTtBlE0AAAAAElFTkSuQmCC\u0022 data-src=\u0022https:\/\/avris.it\/image\/avris4-posts_big.png\u0022 alt=\u0022Screenshot of the list of posts in version 4\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u0022464.5\u0022\u003E\u003C\/span\u003E\n                \n            \u003C\/figure\u003E\u003C\/p\u003E\n\u003Cfigure\u003E\n                \u003Cnoscript\u003E\n                    \u003Cimg src=\u0022https:\/\/avris.it\/image\/avris4-post_big.png\u0022 alt=\u0022Screenshot of the top of the post page in version 4\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u0022464.5\u0022\u003E                \n                \u003C\/noscript\u003E\n                \u003Cspan class=\u0022hide-noscript\u0022\u003E\u003Cimg src=\u0022data:image\/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAARCAYAAAC1tw6GAAAACXBIWXMAAA7EAAAOxAGVKw4bAAACVUlEQVRIib2Wz04bMRDGf+P1er2ABKrUC2ovPXLupapEi1SpT0DfgqfgoXqteu1DVOqhQfwvCoRge6aHJGSBQKIU9ZMsfzv+Zjy2x7srb999NANEwIwpBDDwvkJEAEg5j8w2Gp\/JgRgDqoZzDlMFoPKenDM5Z1RHwu6cIlBK+eYnwSbGLra333N+fs7BwSFFCycnpw90Xe4ceF8Tm4j3FSEEQgjU3tPEBu89tffUdU0IgWY8HpoRB5z\/tPNhKmjCVNgEmtBMbePnifPI1nS0I5tzDhG57SdtlPzsfoJ+v4\/oZP+WxOHREVqUto3EOGoAZnY74aK83+9\/98skMRgmcDUAzeoGognNiZwzV1dXOBG8QdXGWx\/rFOhjHMDf37ZFsBLDlIcAhAeap3YCQFUxszutlKK+lDJzsOv81IqWwaSuunXmnGNtbe3ap5QeFU3s+\/v79Hq9bsgHN3IePu7s8GV3d77QFsDW1pYB\/9T29vbMzExVb+PO4F\/dOKlugjP5\/4KfVyfPmdQicy11y5bFInO55wp0R3\/Pt3tJ5p2EX+RIvAhRHI1AFEcUoRZH5YSkymkM2E3i5ThUUuXajKEZGUgC1YKLWuhN\/cYHYtPSVhWtq6hFECA4x680ZLDaUkJic1hYdx7FuFFlqMpFyQxU2RD3fDX0OkbadoW28lyXzIsQGKoSXcUPTayvb6Cq\/Pzd43NcxczIalyWzCvXcpZu2AwNIjL3u+YfG+jyZMafUtAxv8iZG1MuS+EkZ8LxGSLClcFxSmxUFQNVFOiXQjbjevxfNA9\/AVXov5JBOanJAAAAAElFTkSuQmCC\u0022 data-src=\u0022https:\/\/avris.it\/image\/avris4-post_big.png\u0022 alt=\u0022Screenshot of the top of the post page in version 4\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u0022464.5\u0022\u003E\u003C\/span\u003E\n                \n            \u003C\/figure\u003E\u003C\/p\u003E\n\u003Cfigure\u003E\n                \u003Cnoscript\u003E\n                    \u003Cimg src=\u0022https:\/\/avris.it\/image\/avris4-post-end_big.png\u0022 alt=\u0022Screenshot of the bottom of the post page in version 4\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u0022464.5\u0022\u003E                \n                \u003C\/noscript\u003E\n                \u003Cspan class=\u0022hide-noscript\u0022\u003E\u003Cimg src=\u0022data:image\/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAARCAYAAAC1tw6GAAAACXBIWXMAAA7EAAAOxAGVKw4bAAACx0lEQVRIiZ2Wy44cNRSGv2Mfu6qnJ5NZgMSKp2CDkAJIvBALFrwZy4gFQnkMFihCBLVGM9NdrrIPC1dXVV8nyS+V\/Nv++9x8a\/nm2x\/MABEwY4YABqoeEQGgH4Y6bHX+LAfaNlKK4ZzDSgHAqzIMA8MwUEoVLn2KQM75re6N7QeXePPmOzabDe\/f\/0MumQ8f\/jvRLblzgqrSNi2qSoyBGCNBlaZtUFWCKiHU8SbG2ja1VdVBf\/rx+ypojgUNzchTSoQQaJuG2ERUlVW7IgQlhkC7amnbFvUe7z3OecQJVgoiDucdr+\/upkoftwsMUvb1u4KHhwdKKYgIZrUSIJgVEMHMcAsntlh7o67lzc0NMUbMbArkDP9NXwoGYLfrKFawYtXFIjPvHEPOeO9ZtSuKGewdyVglIIQwBXoQ8BHXM2U7watXt+ScAZliKcWIMeC9n4zGGA+MX6nERa57Y8elXvZDCDjncM6RcwEBRQhB60kadaWUgyqc+5aaY5iZ0+fn54uCl5DzcNBfbtZj7r2f+KVVeXp6anW9Xl90mFLCjyfnU\/E5S2Zm6DXRcyr8u3nkqy\/vEXGkDI2Hbmz7Ak7AOxgyIIY6IQ2gHroBVlpPWp8heLgJ1xO5euy3A6QM6xeMfAq8my\/iYzw+Pv5+9ZR5mYMZCvz9AHdtzfyLdZ3fz6mbf\/fXBm4bKFbH79t5LpdaqUu4eg+5Razq4Ov7U81mV9+jbNCqcRtl1I2PHIdcZObHWwWYj\/05nDy4Z7DMfnZ+ym3kQr0e9thzMyPnXAM6vkHP3RulFFJKdCmRutp2XTeNdV0ipW5sa79L3aRNk2buz19PSoldt0N\/\/uXXyfB+IvU9KfX1zuh7tjmTS67ZjBU3myt4uA3H\/y0GeUziY5HzgP7x57uLghgCIYbJqXee1Pd47\/De0fcDpRRUFRFhu91+tPNzEJHyP7\/y5So+jfmBAAAAAElFTkSuQmCC\u0022 data-src=\u0022https:\/\/avris.it\/image\/avris4-post-end_big.png\u0022 alt=\u0022Screenshot of the bottom of the post page in version 4\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u0022464.5\u0022\u003E\u003C\/span\u003E\n                \n            \u003C\/figure\u003E\u003C\/p\u003E\u003Csvg xmlns=\u0022http:\/\/www.w3.org\/2000\/svg\u0022 style=\u0022display: none;\u0022\u003E\u003C\/svg\u003E","tags":["programming","php","javascript","webpack","symfony","symfony encore","doctrine","orm","cms","esse","columnist","version","new year","blog","design","redesign"],"hasMore":true,"image":"https:\/\/avris.it\/image\/avris4_small.png","introLite":"\u003Cfigure\u003E\u003Ca href=\u0022https:\/\/avris.it\/image\/avris4_big.png\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Cimg src=\u0022https:\/\/avris.it\/image\/avris4_mini.png\u0022 alt=\u0022Screenshot of the new version of the blog\u0022 width=\u0022240\u0022 height=\u0022117.03937007874\u0022 loading=\u0022lazy\u0022\u003E\u003C\/a\u003E\u003C\/figure\u003E\u003C\/p\u003E\n\u003Cp\u003EIt wasn\u2019t really supposed for the New Year, but I\u2019ve had plenty of free time on my hands\nduring the holiday break, so here it is already: a brand new version of my blog \ud83e\udd73\u003C\/p\u003E","contentLite":"\u003Cfigure\u003E\u003Ca href=\u0022https:\/\/avris.it\/image\/avris4_big.png\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Cimg src=\u0022https:\/\/avris.it\/image\/avris4_mini.png\u0022 alt=\u0022Screenshot of the new version of the blog\u0022 width=\u0022240\u0022 height=\u0022117.03937007874\u0022 loading=\u0022lazy\u0022\u003E\u003C\/a\u003E\u003C\/figure\u003E\u003C\/p\u003E\n\u003Cp\u003EIt wasn\u2019t really supposed for the New Year, but I\u2019ve had plenty of free time on my hands\nduring the holiday break, so here it is already: a brand new version of my blog \ud83e\udd73\u003C\/p\u003E\n\u003Ch3\u003EWhy?\u003C\/h3\u003E\n\u003Cp\u003EWhere to start? I got increasingly annoyed by the old version.\nThe design started seeming boring and blunt.\nThe code started growing unstable.\nIt was using the \u003Ca href=\u0022\/projects\/micrus-v4.lite\u0022\u003E Micrus framework\u003C\/a\u003E,\nwhich I \u003Ca href=\u0022\/blog\/how-and-why-i-ve-built-and-killed-a-php-framework.lite\u0022\u003E stopped supporting\u003C\/a\u003E a year ago.\nIt was using \u003Ca href=\u0022https:\/\/gitlab.com\/Avris\/Micrus-Assetic\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E Micrus Assetic\u003C\/a\u003E\n\u2013 an outdated method of asset management,\nwhich highly depended on the server configuration and binaries installed.\nThe deployments were \u201ciffy\u201d, to say the least.\nI was afraid of sending even small changes to the server, for fear something might blow up again.\nSome small things I didn\u2019t even notice were wrong: like still warning about Google Analytics tracking,\neven though I migrated to \u003Ca href=\u0022https:\/\/matomo.org\/\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E Matomo\u003C\/a\u003E ages ago.\u003C\/p\u003E\n\u003Ch3\u003EWhat changed?\u003C\/h3\u003E\n\u003Cp\u003EI decided to keep it simple. To go with a \u201cless is more\u201d approach.\nI\u2019ve removed soooo many features that just weren\u2019t useful enough.\u003C\/p\u003E\n\u003Cp\u003EI used to have an admin panel: except I didn\u2019t need any fancy editor,\nthe main content was written in an (enhanced) \u003Ca href=\u0022https:\/\/www.markdownguide.org\/\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E Markdown\u003C\/a\u003E anyway.\nSo for this version, I\u2019ve decided for a filesystem-based approach: I\u2019ve ditched the database completely,\nI don\u2019t need any ORM, I don\u2019t need an admin panel. I just have a bunch of \u003Ca href=\u0022https:\/\/gitlab.com\/Avris\/SUML\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E SUML\u003C\/a\u003E files\ntracked by GIT. Using \u003Ca href=\u0022https:\/\/gitlab.com\/Avris\/Esse\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E Esse CMS\u003C\/a\u003E.\u003C\/p\u003E\n\u003Cp\u003EI used to have three language versions of the UI \u2013 but why?\nI don\u2019t think anyone really cared about not seeing the names of the categories in Polish,\nwhen most of recent my posts were in English anyway.\nSo now the posts are still available in the language(s) they were written in,\nbut I\u2019m no longer maintaining the multiple versions of the UI, or the features to filter content by language.\nWhat a relief!\u003C\/p\u003E\n\u003Cp\u003EI used to have a \u201crandom post\u201d box. I used to have tag clouds. I used to have an embedded Twitter timeline.\nI used to have the latest posts on the \u201cabout me\u201d page (really?). I used to have a link shortening feature\n(\u201davris.it\/l\/\u0026lt;whatever\u0026gt;\u201d) that I\u2019ve never used, not a single time.\nI used to have a separate controller and database fields to support redirects for legacy URLs from the even earlier version.\nI used to have database fixtures. I used to have a console command to export legacy comments to \u003Ca href=\u0022https:\/\/disqus.com\/\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E Disqus\u003C\/a\u003E.\nI used to have tooltips and popovers.\nAll gone now! \ud83d\ude0d\u003C\/p\u003E\n\u003Cp\u003EI replaced the infinite scroll with... just loading the whole page at once \ud83e\udd37\u200d\nIt\u2019s not that big for today\u2019s standards anyway \u2013 the heaviest list of posts is 113 KB of compressed HTML.\nInstead, I now lazy load images using the \u003Ccode\u003EIntersectionObserver\u003C\/code\u003E API.\nWay simpler than infinite scroll or pagination \u2013 which aren\u2019t really necessary with this amount of data.\u003C\/p\u003E\n\u003Cp\u003EOh, and the website is now using a fast an sleek \u003Ca href=\u0022https:\/\/symfony.com\/\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E Symfony\u003C\/a\u003E setup with an HTTP cache \ud83e\udd70\u003C\/p\u003E\n\u003Cp\u003EDesign-wise, I use the default \u003Ca href=\u0022https:\/\/getbootstrap.com\/\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E Bootstrap\u003C\/a\u003E theme,\nwith only minor changes of variables and minimal additional styling.\nThe main feature, obviously, are the tilted elements. That\u2019s enough to add some personality to the website,\nwithout making it overcomplicated.\nCompared to the previous version, it\u2019s way more contrasting, better tailored for wider screens and clearer.\u003C\/p\u003E\n\u003Cp\u003EOverall, 41090 (!) lines of code were removed:\u003C\/p\u003E\n\u003Cfigure\u003E\u003Ca href=\u0022https:\/\/avris.it\/image\/avris-3-4-diff_big.png\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Cimg src=\u0022https:\/\/avris.it\/image\/avris-3-4-diff_mini.png\u0022 alt=\u0022424 files changed, 6711 insertions (+), 47801 deletions (-)\u0022 width=\u0022240\u0022 height=\u002238.836363636364\u0022 loading=\u0022lazy\u0022\u003E\u003C\/a\u003E\u003C\/figure\u003E\u003C\/p\u003E\n\u003Cp\u003EThere\u2019s nothing else in the (programming) world I love more than removing useless code!\u003C\/p\u003E\n\u003Cp\u003EDeployments are now stable, simple, reproducible and revertible, thanks to\n\u003Ca href=\u0022https:\/\/symfony.com\/\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E Symfony\u003C\/a\u003E, \u003Ca href=\u0022https:\/\/webpack.js.org\/\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E Webpack\u003C\/a\u003E,\nlack of database (no db = no migrations),\nand most importantly my recent child: \u003Ca href=\u0022\/projects\/avris-deployer.lite\u0022\u003E Avris Deployer\u003C\/a\u003E.\u003C\/p\u003E\n\u003Cfigure\u003E\u003Ca href=\u0022https:\/\/avris.it\/image\/avris4-deployer_big.png\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Cimg src=\u0022https:\/\/avris.it\/image\/avris4-deployer_mini.png\u0022 alt=\u0022Console output of deployment\u0022 width=\u0022240\u0022 height=\u002267.075471698113\u0022 loading=\u0022lazy\u0022\u003E\u003C\/a\u003E\u003C\/figure\u003E\u003C\/p\u003E\n\u003Ch3\u003EVersion 1 (\u201dSilva Idearum\u201d)\u003C\/h3\u003E\n\u003Cp\u003ESo, to finish this post, let me just quickly show you the four versions I\u2019ve been through so far:\u003C\/p\u003E\n\u003Cp\u003EMy first blog was called \u201cSilva Idearum\u201d (Latin for \u201cForest of ideas\u201d).\nIt was anonymous, spirituality-oriented, Polish-speaking, Joomla-running and with a \u201ctoo much\u201d design.\u003C\/p\u003E\n\u003Cfigure\u003E\u003Ca href=\u0022https:\/\/avris.it\/image\/avris1-post_big.png\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Cimg src=\u0022https:\/\/avris.it\/image\/avris1-post_mini.png\u0022 alt=\u0022Screenshot of the post page in version 1\u0022 width=\u0022240\u0022 height=\u0022116.125\u0022 loading=\u0022lazy\u0022\u003E\u003C\/a\u003E\u003C\/figure\u003E\u003C\/p\u003E\n\u003Ch3\u003EVersion 2\u003C\/h3\u003E\n\u003Cp\u003EAfter coming out and becoming independent from my parents,\nI was finally able to put my name on my posts. New domain and a redesign was also in place.\u003C\/p\u003E\n\u003Cfigure\u003E\u003Ca href=\u0022https:\/\/avris.it\/image\/avris2-home_big.png\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Cimg src=\u0022https:\/\/avris.it\/image\/avris2-home_mini.png\u0022 alt=\u0022Screenshot of the homepage in version 2\u0022 width=\u0022240\u0022 height=\u0022116.125\u0022 loading=\u0022lazy\u0022\u003E\u003C\/a\u003E\u003C\/figure\u003E\u003C\/p\u003E\n\u003Ch3\u003EVersion 3\u003C\/h3\u003E\n\u003Cp\u003EAs announced in \u003Ca href=\u0022\/blog\/brand-new-blog.lite\u0022\u003E Brand new blog\u003C\/a\u003E\u2026\u003C\/p\u003E\n\u003Cfigure\u003E\u003Ca href=\u0022https:\/\/avris.it\/image\/avris3-home_big.png\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Cimg src=\u0022https:\/\/avris.it\/image\/avris3-home_mini.png\u0022 alt=\u0022Screenshot of the homepage in version 3\u0022 width=\u0022240\u0022 height=\u0022400.875\u0022 loading=\u0022lazy\u0022\u003E\u003C\/a\u003E\u003C\/figure\u003E\u003C\/p\u003E\n\u003Cfigure\u003E\u003Ca href=\u0022https:\/\/avris.it\/image\/avris3-posts_big.png\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Cimg src=\u0022https:\/\/avris.it\/image\/avris3-posts_mini.png\u0022 alt=\u0022Screenshot of the list of posts in version 3\u0022 width=\u0022240\u0022 height=\u0022116.125\u0022 loading=\u0022lazy\u0022\u003E\u003C\/a\u003E\u003C\/figure\u003E\u003C\/p\u003E\n\u003Cfigure\u003E\u003Ca href=\u0022https:\/\/avris.it\/image\/avris3-post_big.png\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Cimg src=\u0022https:\/\/avris.it\/image\/avris3-post_mini.png\u0022 alt=\u0022Screenshot of the top of the post page in version 3\u0022 width=\u0022240\u0022 height=\u0022116.125\u0022 loading=\u0022lazy\u0022\u003E\u003C\/a\u003E\u003C\/figure\u003E\u003C\/p\u003E\n\u003Cfigure\u003E\u003Ca href=\u0022https:\/\/avris.it\/image\/avris3-post-end_big.png\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Cimg src=\u0022https:\/\/avris.it\/image\/avris3-post-end_mini.png\u0022 alt=\u0022Screenshot of the bottom of the post page in version 3\u0022 width=\u0022240\u0022 height=\u0022116.125\u0022 loading=\u0022lazy\u0022\u003E\u003C\/a\u003E\u003C\/figure\u003E\u003C\/p\u003E\n\u003Ch3\u003EVersion 4 (current)\u003C\/h3\u003E\n\u003Cfigure\u003E\u003Ca href=\u0022https:\/\/avris.it\/image\/avris4-home_big.png\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Cimg src=\u0022https:\/\/avris.it\/image\/avris4-home_mini.png\u0022 alt=\u0022Screenshot of the homepage in version 4\u0022 width=\u0022240\u0022 height=\u0022416.5\u0022 loading=\u0022lazy\u0022\u003E\u003C\/a\u003E\u003C\/figure\u003E\u003C\/p\u003E\n\u003Cfigure\u003E\u003Ca href=\u0022https:\/\/avris.it\/image\/avris4-posts_big.png\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Cimg src=\u0022https:\/\/avris.it\/image\/avris4-posts_mini.png\u0022 alt=\u0022Screenshot of the list of posts in version 4\u0022 width=\u0022240\u0022 height=\u0022116.125\u0022 loading=\u0022lazy\u0022\u003E\u003C\/a\u003E\u003C\/figure\u003E\u003C\/p\u003E\n\u003Cfigure\u003E\u003Ca href=\u0022https:\/\/avris.it\/image\/avris4-post_big.png\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Cimg src=\u0022https:\/\/avris.it\/image\/avris4-post_mini.png\u0022 alt=\u0022Screenshot of the top of the post page in version 4\u0022 width=\u0022240\u0022 height=\u0022116.125\u0022 loading=\u0022lazy\u0022\u003E\u003C\/a\u003E\u003C\/figure\u003E\u003C\/p\u003E\n\u003Cfigure\u003E\u003Ca href=\u0022https:\/\/avris.it\/image\/avris4-post-end_big.png\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Cimg src=\u0022https:\/\/avris.it\/image\/avris4-post-end_mini.png\u0022 alt=\u0022Screenshot of the bottom of the post page in version 4\u0022 width=\u0022240\u0022 height=\u0022116.125\u0022 loading=\u0022lazy\u0022\u003E\u003C\/a\u003E\u003C\/figure\u003E\u003C\/p\u003E","words":694,"readTime":3,"lang":"en"}}},"projects\/showr":{"key":"projects\/showr","type":"article","published":true,"meta":{"createdAt":"2019-04-30T19:58:22+02:00","publishedAt":"2019-04-30T19:56:00+02:00","group":null,"links":[{"icon":"globe-europe","colour":"primary","url":"https:\/\/showr.link","displayUrl":null}],"category":"projects","subcategory":null,"slug":"showr"},"content":{"en":{"slug":"showr","title":"showr","intro":"\u003Cfigure\u003E\n                \u003Cnoscript\u003E\n                    \u003Cimg src=\u0022https:\/\/avris.it\/image\/showr_small.png\u0022 alt=\u0022\u0022 class=\u0022border-bottom\u0022 width=\u0022480\u0022 height=\u0022474\u0022\u003E                \n                \u003C\/noscript\u003E\n                \u003Cspan class=\u0022hide-noscript\u0022\u003E\u003Cimg src=\u0022data:image\/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAjCAYAAAD8BaggAAAACXBIWXMAAA7EAAAOxAGVKw4bAAADqElEQVRYhdWYzW7jNhDHf0NSlu04yXqB7qEP0D5Ae+leupee9r37Du0DFEgLpHb8JVEkpwfZihJLsrMrFO0fEDASRzNDcjgflB8\/flIUEM7Q\/qwKIsP0GHDQbQzANM+ZzWbc3t7ivefh4aFmb\/GPaQyA04HBoiwpypK\/V6txtQ4ZNDQ4n8+ZTaeklHDWUnrPZJKx3x+w1jKdTlFNqIKqslqtUAXrLO\/u70kp1u\/WoqqURcF2vx80yKDQ\/ygiBuscYgx5nhNjqoWX\/rhfgio451i+f89icYOq4pzDGIexFjnu6+zmBiMyoO\/CCqWUSCmSjgpSjIjUhu33ezQpKSUQIcQIqmy3W6y1hBCIMVKWJQAigqpijCGl2KtTfvjp05AbPTNKfaK+dPxaOOHV8W7R+WxK5lyj0BhDqALb3f6c\/5Ux0vr0FtqdJHdOThVnDYigSVmvn57\/vgD9QrrxIelgKsqy8YGe2PkCY4Qk8d737nyMEWvtCGquh8uyDFVtjmab3mw2rJ825JOM2WwGwHK57BXWJ+cttGiNTqYYIzGlxrHHwpBBrs3wmg4hIMY0sWbIR3a7HcaYZiW70KzCQAIcnHqIiT8f\/kIQFos5RoT5bIZzDmtNSxGIGHwVMNYjCIoiCAhkWYY5Bk9BMMb06hTV\/nAWQmC73XJ3dzc4qxcCjxG5i66Nv8KH+oQfysi2iEydMmkFCEVBT0pOAUHJJpM6V30F3IA9WGvIMoMKJIFpdlngkLxrICmlETLQeOj3rg6s10\/dKWZE\/L9X6GvQjj9DtDsdza6j+Nsfyq+\/t4uEc2QWJhnEBDFCFbsKmef\/P34H33\/bb\/hZpG5j4uB+DkN53BjFmpojpvoZwuRCFhqMQ2\/FGMl1VB+6NpoP4V9z6msx6paNAfn5l8\/\/KYPcbrfrH3SOxWKBL0uMNWTOEWKkLH1ditzMOewPdQOZEpoSVQh1QScQQmSSZSh1v3bNXrhLuaDa7UnWQFJKX9c61hpUoSgKkLoZsMbU9Y4IVagoCw9AcSjeskDDlw0pJQ4kNNRcqtrMsjZKm+zenr1I3d+nlM7+u2jQ0GCe5yyX71AFY4TD4QAIm80G5xz393cYY\/De432FMYaqqvDe8+HDN1RVwDnXfBMR1qsVQ9nzYvVelr5ph06lZ57nRyP88WYDMucoygLVujk4HApEhBgjIQRCqAghvvSQjtbVnXryrhux\/f5wXJVunsdHf\/b9hMfHx+a93fe\/uOw6t4d\/AEsqQIGxhlTjAAAAAElFTkSuQmCC\u0022 data-src=\u0022https:\/\/avris.it\/image\/showr_small.png\u0022 alt=\u0022\u0022 class=\u0022border-bottom\u0022 width=\u0022480\u0022 height=\u0022474\u0022\u003E\u003C\/span\u003E\n                \n            \u003C\/figure\u003E\u003C\/p\u003E\n\u003Ch3\u003EEasily share content...\u003C\/h3\u003E\n\u003Cp\u003ENeed to send someone a nicely formatted text accessible via a simple link? Look no further. Simply add text, headers, images, tables, videos, quotes, code, etc. \u2013 and publish it with one click.\u003C\/p\u003E\n\u003Ch3\u003EAnonymously...\u003C\/h3\u003E\n\u003Cp\u003ENo need to run a blog or have a social media account \u2013 using showr you can put content on the Internet without registering, and just post the link wherever and however you want.\u003C\/p\u003E\n\u003Ch3\u003EWith a self-destruct...\u003C\/h3\u003E\n\u003Cp\u003ESometimes you want things to be more volatile. Showr lets you set a time limit and limit of unique visitors \u2013 after either of them is reached, your content will just self-destruct.\u003C\/p\u003E\u003Csvg xmlns=\u0022http:\/\/www.w3.org\/2000\/svg\u0022 style=\u0022display: none;\u0022\u003E\u003C\/svg\u003E","content":"\u003Cfigure\u003E\n                \u003Cnoscript\u003E\n                    \u003Cimg src=\u0022https:\/\/avris.it\/image\/showr_big.png\u0022 alt=\u0022\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u0022948\u0022\u003E                \n                \u003C\/noscript\u003E\n                \u003Cspan class=\u0022hide-noscript\u0022\u003E\u003Cimg src=\u0022data:image\/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAjCAYAAAD8BaggAAAACXBIWXMAAA7EAAAOxAGVKw4bAAADqElEQVRYhdWYzW7jNhDHf0NSlu04yXqB7qEP0D5Ae+leupee9r37Du0DFEgLpHb8JVEkpwfZihJLsrMrFO0fEDASRzNDcjgflB8\/flIUEM7Q\/qwKIsP0GHDQbQzANM+ZzWbc3t7ivefh4aFmb\/GPaQyA04HBoiwpypK\/V6txtQ4ZNDQ4n8+ZTaeklHDWUnrPZJKx3x+w1jKdTlFNqIKqslqtUAXrLO\/u70kp1u\/WoqqURcF2vx80yKDQ\/ygiBuscYgx5nhNjqoWX\/rhfgio451i+f89icYOq4pzDGIexFjnu6+zmBiMyoO\/CCqWUSCmSjgpSjIjUhu33ezQpKSUQIcQIqmy3W6y1hBCIMVKWJQAigqpijCGl2KtTfvjp05AbPTNKfaK+dPxaOOHV8W7R+WxK5lyj0BhDqALb3f6c\/5Ux0vr0FtqdJHdOThVnDYigSVmvn57\/vgD9QrrxIelgKsqy8YGe2PkCY4Qk8d737nyMEWvtCGquh8uyDFVtjmab3mw2rJ825JOM2WwGwHK57BXWJ+cttGiNTqYYIzGlxrHHwpBBrs3wmg4hIMY0sWbIR3a7HcaYZiW70KzCQAIcnHqIiT8f\/kIQFos5RoT5bIZzDmtNSxGIGHwVMNYjCIoiCAhkWYY5Bk9BMMb06hTV\/nAWQmC73XJ3dzc4qxcCjxG5i66Nv8KH+oQfysi2iEydMmkFCEVBT0pOAUHJJpM6V30F3IA9WGvIMoMKJIFpdlngkLxrICmlETLQeOj3rg6s10\/dKWZE\/L9X6GvQjj9DtDsdza6j+Nsfyq+\/t4uEc2QWJhnEBDFCFbsKmef\/P34H33\/bb\/hZpG5j4uB+DkN53BjFmpojpvoZwuRCFhqMQ2\/FGMl1VB+6NpoP4V9z6msx6paNAfn5l8\/\/KYPcbrfrH3SOxWKBL0uMNWTOEWKkLH1ditzMOewPdQOZEpoSVQh1QScQQmSSZSh1v3bNXrhLuaDa7UnWQFJKX9c61hpUoSgKkLoZsMbU9Y4IVagoCw9AcSjeskDDlw0pJQ4kNNRcqtrMsjZKm+zenr1I3d+nlM7+u2jQ0GCe5yyX71AFY4TD4QAIm80G5xz393cYY\/De432FMYaqqvDe8+HDN1RVwDnXfBMR1qsVQ9nzYvVelr5ph06lZ57nRyP88WYDMucoygLVujk4HApEhBgjIQRCqAghvvSQjtbVnXryrhux\/f5wXJVunsdHf\/b9hMfHx+a93fe\/uOw6t4d\/AEsqQIGxhlTjAAAAAElFTkSuQmCC\u0022 data-src=\u0022https:\/\/avris.it\/image\/showr_big.png\u0022 alt=\u0022\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u0022948\u0022\u003E\u003C\/span\u003E\n                \n            \u003C\/figure\u003E\u003C\/p\u003E\n\u003Ch3\u003EEasily share content...\u003C\/h3\u003E\n\u003Cp\u003ENeed to send someone a nicely formatted text accessible via a simple link? Look no further. Simply add text, headers, images, tables, videos, quotes, code, etc. \u2013 and publish it with one click.\u003C\/p\u003E\n\u003Ch3\u003EAnonymously...\u003C\/h3\u003E\n\u003Cp\u003ENo need to run a blog or have a social media account \u2013 using showr you can put content on the Internet without registering, and just post the link wherever and however you want.\u003C\/p\u003E\n\u003Ch3\u003EWith a self-destruct...\u003C\/h3\u003E\n\u003Cp\u003ESometimes you want things to be more volatile. Showr lets you set a time limit and limit of unique visitors \u2013 after either of them is reached, your content will just self-destruct.\u003C\/p\u003E\u003Csvg xmlns=\u0022http:\/\/www.w3.org\/2000\/svg\u0022 style=\u0022display: none;\u0022\u003E\u003C\/svg\u003E","tags":["clean code","content","formatted","images","link","php","self-destruct","share","symfony","text","volatile"],"hasMore":false,"image":"https:\/\/avris.it\/image\/showr_small.png","introLite":"\u003Cfigure\u003E\u003Ca href=\u0022https:\/\/avris.it\/image\/showr_big.png\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Cimg src=\u0022https:\/\/avris.it\/image\/showr_mini.png\u0022 alt=\u0022\u0022 width=\u0022240\u0022 height=\u0022237\u0022 loading=\u0022lazy\u0022\u003E\u003C\/a\u003E\u003C\/figure\u003E\u003C\/p\u003E\n\u003Ch3\u003EEasily share content...\u003C\/h3\u003E\n\u003Cp\u003ENeed to send someone a nicely formatted text accessible via a simple link? Look no further. Simply add text, headers, images, tables, videos, quotes, code, etc. \u2013 and publish it with one click.\u003C\/p\u003E\n\u003Ch3\u003EAnonymously...\u003C\/h3\u003E\n\u003Cp\u003ENo need to run a blog or have a social media account \u2013 using showr you can put content on the Internet without registering, and just post the link wherever and however you want.\u003C\/p\u003E\n\u003Ch3\u003EWith a self-destruct...\u003C\/h3\u003E\n\u003Cp\u003ESometimes you want things to be more volatile. Showr lets you set a time limit and limit of unique visitors \u2013 after either of them is reached, your content will just self-destruct.\u003C\/p\u003E","contentLite":"\u003Cfigure\u003E\u003Ca href=\u0022https:\/\/avris.it\/image\/showr_big.png\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Cimg src=\u0022https:\/\/avris.it\/image\/showr_mini.png\u0022 alt=\u0022\u0022 width=\u0022240\u0022 height=\u0022237\u0022 loading=\u0022lazy\u0022\u003E\u003C\/a\u003E\u003C\/figure\u003E\u003C\/p\u003E\n\u003Ch3\u003EEasily share content...\u003C\/h3\u003E\n\u003Cp\u003ENeed to send someone a nicely formatted text accessible via a simple link? Look no further. Simply add text, headers, images, tables, videos, quotes, code, etc. \u2013 and publish it with one click.\u003C\/p\u003E\n\u003Ch3\u003EAnonymously...\u003C\/h3\u003E\n\u003Cp\u003ENo need to run a blog or have a social media account \u2013 using showr you can put content on the Internet without registering, and just post the link wherever and however you want.\u003C\/p\u003E\n\u003Ch3\u003EWith a self-destruct...\u003C\/h3\u003E\n\u003Cp\u003ESometimes you want things to be more volatile. Showr lets you set a time limit and limit of unique visitors \u2013 after either of them is reached, your content will just self-destruct.\u003C\/p\u003E","words":103,"readTime":null,"lang":"en"}}},"projects\/avris-graphqlbundle":{"key":"projects\/avris-graphqlbundle","type":"article","published":true,"meta":{"createdAt":"2018-09-27T23:32:04+02:00","publishedAt":"2018-09-27T23:30:00+02:00","group":null,"links":[{"icon":"brands gitlab","colour":"primary","url":"https:\/\/gitlab.com\/Avris\/GraphqlBundle","displayUrl":null}],"category":"projects","subcategory":null,"slug":"avris-graphqlbundle"},"content":{"en":{"slug":"avris-graphqlbundle","title":"Avris GraphqlBundle","intro":"\u003Cfigure\u003E\n                \u003Cnoscript\u003E\n                    \u003Cimg src=\u0022https:\/\/avris.it\/image\/avris-graphql-bundle_small.png\u0022 alt=\u0022Avris GraphqlBundle\u0022 class=\u0022border-bottom\u0022 width=\u0022480\u0022 height=\u0022320\u0022\u003E                \n                \u003C\/noscript\u003E\n                \u003Cspan class=\u0022hide-noscript\u0022\u003E\u003Cimg src=\u0022data:image\/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAYCAYAAACSuF9OAAAACXBIWXMAAA7EAAAOxAGVKw4bAAAHsklEQVRIiX2X268lRRXGf+tS1fty9j4XZs4AwzCIipJBiUQiCTEgCSoxmKBRoyZeHvRB44N\/gu+++WA0PuuT8QUx0Wi8JJooeEFAJIIzwDhOBmbmnLPP3mfv7qrlQ+8ZjBorXd2ddF2++r5atb6WW287E1EqQhC1QlTMnVoKQaAiuBqmSnJntVpSa4UIiEAAEUHoi4ggIkBwrUTEutbrT6IiAiqCuWMiNM0QjxAiglILEiBAKQWhH1hVe6CiUCtJlW49ASLrdlxvLwIgqMobk8u1dyFqQdSIeKOfISQ1tBb8WgdBCSoRoCGI9pMRgqoDQlcqhqAIIYqprtnoF4L039bX+ma4G6tViwhE9AsUUXTd11RxM5IqHqJQy5rgnhEikBBUDTfFRDBR3BSJSq2VWks\/gHu\/+lpRtetSqQhRK0GwubXF1ctXgAohiEPUgqpAgJmSzEh+DZAAKlDXbAmI6FoGQ1HMjGyJUdNAdMwXCxp3muRkT9RaKaWjKwWEfr\/UCsBNJ3ZZHsyA2pMWgWpeg1JMe4mzKS6aiGiRMJCKXt+kgpr11FpCRVExVJxxM2Z7uMmV2R4aSpSg8YR6hiiECF3X9gwJnL71Vv559mVEAgkwFYQAEiKxlkxJprimTBesI8auxQqo9uyoYWpkd7IlFEMk0eTEm45vcDifsWxbTty4y2oxZ7Z\/gImQXalRuf\/9D\/Dic88zzQ1B9JEFqPaiqIIIJFOyGx6akLSWC6EGmCiqhori5rga2TMuQjInSSJpw87OJh\/53MfY2d7i59\/\/Ea+cewVrNkjeR9Nkc4P7H3qAZ3\/xa7YGQ6AQET0YFVTATDDtWXMXnNwgnVNrrPUFUEQNNUfEcHNUE262rokHH3kvn\/zyJ3jhyb\/w+De+R6Jwx003E7VycDjDs\/Hpr32VJ3\/wBLdMp6xKS42OiNJLp+voSv0eykkxBZfBmNoWpNb+HApADBFHLZHMUTWSOYOUGbnz+S99lA889iCzKwc88a3HyTpkezTgzW+5mcO919ibH\/HQVz5FUqGee5W337TLbDHnqFtRakepLWgluWEmuCvJhZQMl9EUWXVQKgH9HkERSagY4omsziAlRinxyc88zAceexCAp3\/1DImGycaEjVHDweUFp9\/9Tt7\/6P34oOE3X\/8Ou8c20WjZ2w+6LlGiBxRSUQ1SdtyFlBTPgstwArmDAhIKoQgK4qAJUyeZk1Pi7rvfxIc\/\/r7rKWH\/4owbThzn5OldTp85xal7bmd8bEpE8MqPf8l4mCl1g0HTkZsKUqnR0nUroraogWpgbuTG8SQ4k03oChHSg4k+ugzHNaE4sj4AP\/PFR66fzAAf\/MLD\/GeJCM7\/8ilWl17j+G03sNzLtIdXmWqLWEUsqLWldkuEDjXBXEk5402D62RCKvR5BsVDSRhZnBxGViOj3HP3rZw8ufNfAP691FJ48Se\/4+CFFxmMlcHmiON33kK3N2b\/gqCyQmhBMlESIrWPsORYzlgzxCdbE0oB1gwZgoczEGOAMsBoqnDfe97yf8HMLu3x3A9\/zer1SwwbQKFdzJm\/3uKyYrTZUNvSnz0GKglZy6XuWB6gzRC\/cWdI1wW1QA1FQ1GMFELCGITSFOGO24\/9TyCL\/Tl\/\/dUznP\/982RpGQ5qnzoqRAt1adAoeahEUkxiLVNCTbGU0dwgqYE8xO\/abZgftayWhVVXKaVSakVCkKhYEUyEY9uj6yAOZwvOvXCes396ifPP\/p0mWkZeiFRwKlkroQEWsOpzpaQgeeAmmAmaEpIHkAxyhtyAD\/BHt\/\/B4VFlNmvZP6zMuuBgCfMVHLWw6oTSwbe\/+V0WhwuuvrbP4eV9cikkConKQCtD6xinYDqorEYVJkEKYWC9zZDSoh5YNqwGbWsYE9qloYPE3pURLQPkwTPHYjpIHB31VsktE+JUnJBEwamamW7vcPnKHiF9wnU1jt2ww3x2SDZj99g2SSplvs8kw\/FxcNN24a53nuJw7wIvX7jKbLGg5Jatm0\/yi5\/+lrMXlkwHld3dCcs2+M1zh8jG1k5oyogalhLeDBA1PDd4ylhquO2Wk5w8dRopLYFyfGvCfBXcuLvL4mBOVLjj9tvYHA95+rd\/4MadKdvjhlSXvO2ut7K4eBYtC5aXzrE17rjj7hFXL8y4dGGfyRBcOo7f9zDzP\/8MufezX4pmY0pXYTCe4KlB1RFzkidEjGFOnDl1gvlRS+kKt5\/Y5vzFK+zvH3Jic8w4ZxbzJYlgeXjE9qgh5kdsD5ydyYBGO+rhHtLO2RxV7jyzRTOGl556iclQaLxjeOIEebqJF4zZfAGWWB0cIHIIaO+FojfgKsqFC+eRUqFUnoqgWyygFrIZFhClYrWQ6L3xKGUmyZm4s9kkRklwLYwyzI5a7n3HlFevKPVyx3QIk6v\/4K0ffBd+5dzfWLUt6plaKt4M4Y1\/CATwlFBVJIKogUYgEWitSNddN\/i1XeJiXL34MoM8wEXY3Jhyw3QLj8p8vs\/2dMIfn3f+eW7Ixb0jzr5+xDAHja74UPcqcuzNd0YthW61orZL0niChFBWR2hq+nRQOzwPAHrPDWgNFEHimofuvbhGIFRMBFfBBZRKNkM16LoWobA7cTYHxuVFb3Mbh\/tOw78Ak6pNn\/7nMikAAAAASUVORK5CYII=\u0022 data-src=\u0022https:\/\/avris.it\/image\/avris-graphql-bundle_small.png\u0022 alt=\u0022Avris GraphqlBundle\u0022 class=\u0022border-bottom\u0022 width=\u0022480\u0022 height=\u0022320\u0022\u003E\u003C\/span\u003E\n                \n            \u003C\/figure\u003E\u003C\/p\u003E\n\u003Cp\u003ESimplify Graphql configuration using plain methods with typehints and annotations.\u003C\/p\u003E\n\u003Cp\u003EThis bundle is a wrapper on \u003Ccode\u003Ewebonyx\/graphql-php\u003C\/code\u003E.\u003C\/p\u003E\u003Csvg xmlns=\u0022http:\/\/www.w3.org\/2000\/svg\u0022 style=\u0022display: none;\u0022\u003E\u003C\/svg\u003E","content":"\u003Cfigure\u003E\n                \u003Cnoscript\u003E\n                    \u003Cimg src=\u0022https:\/\/avris.it\/image\/avris-graphql-bundle_big.png\u0022 alt=\u0022Avris GraphqlBundle\u0022 class=\u0022border\u0022 width=\u0022900\u0022 height=\u0022600\u0022\u003E                \n                \u003C\/noscript\u003E\n                \u003Cspan class=\u0022hide-noscript\u0022\u003E\u003Cimg src=\u0022data:image\/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAYCAYAAACSuF9OAAAACXBIWXMAAA7EAAAOxAGVKw4bAAAHsklEQVRIiX2X268lRRXGf+tS1fty9j4XZs4AwzCIipJBiUQiCTEgCSoxmKBRoyZeHvRB44N\/gu+++WA0PuuT8QUx0Wi8JJooeEFAJIIzwDhOBmbmnLPP3mfv7qrlQ+8ZjBorXd2ddF2++r5atb6WW287E1EqQhC1QlTMnVoKQaAiuBqmSnJntVpSa4UIiEAAEUHoi4ggIkBwrUTEutbrT6IiAiqCuWMiNM0QjxAiglILEiBAKQWhH1hVe6CiUCtJlW49ASLrdlxvLwIgqMobk8u1dyFqQdSIeKOfISQ1tBb8WgdBCSoRoCGI9pMRgqoDQlcqhqAIIYqprtnoF4L039bX+ma4G6tViwhE9AsUUXTd11RxM5IqHqJQy5rgnhEikBBUDTfFRDBR3BSJSq2VWks\/gHu\/+lpRtetSqQhRK0GwubXF1ctXgAohiEPUgqpAgJmSzEh+DZAAKlDXbAmI6FoGQ1HMjGyJUdNAdMwXCxp3muRkT9RaKaWjKwWEfr\/UCsBNJ3ZZHsyA2pMWgWpeg1JMe4mzKS6aiGiRMJCKXt+kgpr11FpCRVExVJxxM2Z7uMmV2R4aSpSg8YR6hiiECF3X9gwJnL71Vv559mVEAgkwFYQAEiKxlkxJprimTBesI8auxQqo9uyoYWpkd7IlFEMk0eTEm45vcDifsWxbTty4y2oxZ7Z\/gImQXalRuf\/9D\/Dic88zzQ1B9JEFqPaiqIIIJFOyGx6akLSWC6EGmCiqhori5rga2TMuQjInSSJpw87OJh\/53MfY2d7i59\/\/Ea+cewVrNkjeR9Nkc4P7H3qAZ3\/xa7YGQ6AQET0YFVTATDDtWXMXnNwgnVNrrPUFUEQNNUfEcHNUE262rokHH3kvn\/zyJ3jhyb\/w+De+R6Jwx003E7VycDjDs\/Hpr32VJ3\/wBLdMp6xKS42OiNJLp+voSv0eykkxBZfBmNoWpNb+HApADBFHLZHMUTWSOYOUGbnz+S99lA889iCzKwc88a3HyTpkezTgzW+5mcO919ibH\/HQVz5FUqGee5W337TLbDHnqFtRakepLWgluWEmuCvJhZQMl9EUWXVQKgH9HkERSagY4omsziAlRinxyc88zAceexCAp3\/1DImGycaEjVHDweUFp9\/9Tt7\/6P34oOE3X\/8Ou8c20WjZ2w+6LlGiBxRSUQ1SdtyFlBTPgstwArmDAhIKoQgK4qAJUyeZk1Pi7rvfxIc\/\/r7rKWH\/4owbThzn5OldTp85xal7bmd8bEpE8MqPf8l4mCl1g0HTkZsKUqnR0nUroraogWpgbuTG8SQ4k03oChHSg4k+ugzHNaE4sj4AP\/PFR66fzAAf\/MLD\/GeJCM7\/8ilWl17j+G03sNzLtIdXmWqLWEUsqLWldkuEDjXBXEk5402D62RCKvR5BsVDSRhZnBxGViOj3HP3rZw8ufNfAP691FJ48Se\/4+CFFxmMlcHmiON33kK3N2b\/gqCyQmhBMlESIrWPsORYzlgzxCdbE0oB1gwZgoczEGOAMsBoqnDfe97yf8HMLu3x3A9\/zer1SwwbQKFdzJm\/3uKyYrTZUNvSnz0GKglZy6XuWB6gzRC\/cWdI1wW1QA1FQ1GMFELCGITSFOGO24\/9TyCL\/Tl\/\/dUznP\/982RpGQ5qnzoqRAt1adAoeahEUkxiLVNCTbGU0dwgqYE8xO\/abZgftayWhVVXKaVSakVCkKhYEUyEY9uj6yAOZwvOvXCes396ifPP\/p0mWkZeiFRwKlkroQEWsOpzpaQgeeAmmAmaEpIHkAxyhtyAD\/BHt\/\/B4VFlNmvZP6zMuuBgCfMVHLWw6oTSwbe\/+V0WhwuuvrbP4eV9cikkConKQCtD6xinYDqorEYVJkEKYWC9zZDSoh5YNqwGbWsYE9qloYPE3pURLQPkwTPHYjpIHB31VsktE+JUnJBEwamamW7vcPnKHiF9wnU1jt2ww3x2SDZj99g2SSplvs8kw\/FxcNN24a53nuJw7wIvX7jKbLGg5Jatm0\/yi5\/+lrMXlkwHld3dCcs2+M1zh8jG1k5oyogalhLeDBA1PDd4ylhquO2Wk5w8dRopLYFyfGvCfBXcuLvL4mBOVLjj9tvYHA95+rd\/4MadKdvjhlSXvO2ut7K4eBYtC5aXzrE17rjj7hFXL8y4dGGfyRBcOo7f9zDzP\/8MufezX4pmY0pXYTCe4KlB1RFzkidEjGFOnDl1gvlRS+kKt5\/Y5vzFK+zvH3Jic8w4ZxbzJYlgeXjE9qgh5kdsD5ydyYBGO+rhHtLO2RxV7jyzRTOGl556iclQaLxjeOIEebqJF4zZfAGWWB0cIHIIaO+FojfgKsqFC+eRUqFUnoqgWyygFrIZFhClYrWQ6L3xKGUmyZm4s9kkRklwLYwyzI5a7n3HlFevKPVyx3QIk6v\/4K0ffBd+5dzfWLUt6plaKt4M4Y1\/CATwlFBVJIKogUYgEWitSNddN\/i1XeJiXL34MoM8wEXY3Jhyw3QLj8p8vs\/2dMIfn3f+eW7Ixb0jzr5+xDAHja74UPcqcuzNd0YthW61orZL0niChFBWR2hq+nRQOzwPAHrPDWgNFEHimofuvbhGIFRMBFfBBZRKNkM16LoWobA7cTYHxuVFb3Mbh\/tOw78Ak6pNn\/7nMikAAAAASUVORK5CYII=\u0022 data-src=\u0022https:\/\/avris.it\/image\/avris-graphql-bundle_big.png\u0022 alt=\u0022Avris GraphqlBundle\u0022 class=\u0022border\u0022 width=\u0022900\u0022 height=\u0022600\u0022\u003E\u003C\/span\u003E\n                \n            \u003C\/figure\u003E\u003C\/p\u003E\n\u003Cp\u003ESimplify Graphql configuration using plain methods with typehints and annotations.\u003C\/p\u003E\n\u003Cp\u003EThis bundle is a wrapper on \u003Ccode\u003Ewebonyx\/graphql-php\u003C\/code\u003E.\u003C\/p\u003E\n\u003Ch3\u003EDisclaimer\u003C\/h3\u003E\n\u003Cp\u003EI\u2019m new to GraphQL, currently writing my first project using it.\nI\u2019m sure that many things are missing from the bundle and many assumptions I made are wrong,\nso please be understanding, and if possible help out with a pull request.\u003C\/p\u003E\n\u003Ch3\u003EInstalation\u003C\/h3\u003E\n\u003Cpre\u003E\u003Ccode class=\u0022hljs bash border\u0022\u003E$ composer require avris\/graphql-bundle\n\u003C\/code\u003E\u003C\/pre\u003E\n\u003Cp\u003EThen add a route:\u003C\/p\u003E\n\u003Cpre\u003E\u003Ccode class=\u0022hljs yaml border\u0022\u003E\u003Cspan class=\u0022hljs-attr\u0022\u003Eavris_graphql_main:\u003C\/span\u003E\n    \u003Cspan class=\u0022hljs-attr\u0022\u003Epath:\u003C\/span\u003E \u003Cspan class=\u0022hljs-string\u0022\u003E\u0027\/graph\u0027\u003C\/span\u003E\n    \u003Cspan class=\u0022hljs-attr\u0022\u003Econtroller:\u003C\/span\u003E \u003Cspan class=\u0022hljs-string\u0022\u003EAvris\\GraphqlBundle\\Controller\\GraphqlController::main\u003C\/span\u003E\n\u003C\/code\u003E\u003C\/pre\u003E\n\u003Ch3\u003EExample\u003C\/h3\u003E\n\u003Cp\u003ELet\u2019s say you have the following type in your app:\u003C\/p\u003E\n\u003Cpre\u003E\u003Ccode class=\u0022hljs php border\u0022\u003E\u003Cspan class=\u0022hljs-meta\u0022\u003E\u0026lt;?php\u003C\/span\u003E\n\n\u003Cspan class=\u0022hljs-keyword\u0022\u003Enamespace\u003C\/span\u003E \u003Cspan class=\u0022hljs-title\u0022\u003EApp\u003C\/span\u003E\\\u003Cspan class=\u0022hljs-title\u0022\u003EEntity\u003C\/span\u003E;\n\n\u003Cspan class=\u0022hljs-keyword\u0022\u003Efinal\u003C\/span\u003E \u003Cspan class=\u0022hljs-class\u0022\u003E\u003Cspan class=\u0022hljs-keyword\u0022\u003Eclass\u003C\/span\u003E \u003Cspan class=\u0022hljs-title\u0022\u003EUser\u003C\/span\u003E\n\u003C\/span\u003E{\n    \u003Cspan class=\u0022hljs-comment\u0022\u003E\/\/ properties, constructor, etc.\u003C\/span\u003E\n\n    \u003Cspan class=\u0022hljs-keyword\u0022\u003Eprivate\u003C\/span\u003E \u003Cspan class=\u0022hljs-keyword\u0022\u003Estatic\u003C\/span\u003E $type = \u003Cspan class=\u0022hljs-keyword\u0022\u003Enull\u003C\/span\u003E;\n\n    \u003Cspan class=\u0022hljs-keyword\u0022\u003Efinal\u003C\/span\u003E \u003Cspan class=\u0022hljs-keyword\u0022\u003Epublic\u003C\/span\u003E \u003Cspan class=\u0022hljs-keyword\u0022\u003Estatic\u003C\/span\u003E \u003Cspan class=\u0022hljs-function\u0022\u003E\u003Cspan class=\u0022hljs-keyword\u0022\u003Efunction\u003C\/span\u003E \u003Cspan class=\u0022hljs-title\u0022\u003Etype\u003C\/span\u003E\u003Cspan class=\u0022hljs-params\u0022\u003E()\u003C\/span\u003E: \u003Cspan class=\u0022hljs-title\u0022\u003EObjectType\u003C\/span\u003E\n    \u003C\/span\u003E{\n        \u003Cspan class=\u0022hljs-keyword\u0022\u003Ereturn\u003C\/span\u003E \u003Cspan class=\u0022hljs-keyword\u0022\u003Estatic\u003C\/span\u003E::$type ?: \u003Cspan class=\u0022hljs-keyword\u0022\u003Estatic\u003C\/span\u003E::$type = \u003Cspan class=\u0022hljs-keyword\u0022\u003Estatic\u003C\/span\u003E::buildType();\n    }\n\n    \u003Cspan class=\u0022hljs-keyword\u0022\u003Eprivate\u003C\/span\u003E \u003Cspan class=\u0022hljs-keyword\u0022\u003Estatic\u003C\/span\u003E \u003Cspan class=\u0022hljs-function\u0022\u003E\u003Cspan class=\u0022hljs-keyword\u0022\u003Efunction\u003C\/span\u003E \u003Cspan class=\u0022hljs-title\u0022\u003EbuildType\u003C\/span\u003E\u003Cspan class=\u0022hljs-params\u0022\u003E()\u003C\/span\u003E: \u003Cspan class=\u0022hljs-title\u0022\u003EObjectType\u003C\/span\u003E\n    \u003C\/span\u003E{\n        \u003Cspan class=\u0022hljs-keyword\u0022\u003Ereturn\u003C\/span\u003E \u003Cspan class=\u0022hljs-keyword\u0022\u003Enew\u003C\/span\u003E ObjectType([\n            \u003Cspan class=\u0022hljs-string\u0022\u003E\u0027name\u0027\u003C\/span\u003E =\u0026gt; \u003Cspan class=\u0022hljs-string\u0022\u003E\u0027User\u0027\u003C\/span\u003E,\n            \u003Cspan class=\u0022hljs-string\u0022\u003E\u0027fields\u0027\u003C\/span\u003E =\u0026gt; [\n                \u003Cspan class=\u0022hljs-string\u0022\u003E\u0027id\u0027\u003C\/span\u003E =\u0026gt; [\n                    \u003Cspan class=\u0022hljs-string\u0022\u003E\u0027type\u0027\u003C\/span\u003E =\u0026gt; Type::id(),\n                    \u003Cspan class=\u0022hljs-string\u0022\u003E\u0027resolve\u0027\u003C\/span\u003E =\u0026gt; \u003Cspan class=\u0022hljs-function\u0022\u003E\u003Cspan class=\u0022hljs-keyword\u0022\u003Efunction\u003C\/span\u003E \u003Cspan class=\u0022hljs-params\u0022\u003E(User $user)\u003C\/span\u003E \u003C\/span\u003E{\n                        \u003Cspan class=\u0022hljs-keyword\u0022\u003Ereturn\u003C\/span\u003E $user-\u0026gt;getId();\n                    },\n                ],\n                \u003Cspan class=\u0022hljs-string\u0022\u003E\u0027email\u0027\u003C\/span\u003E =\u0026gt; [\n                    \u003Cspan class=\u0022hljs-string\u0022\u003E\u0027type\u0027\u003C\/span\u003E =\u0026gt; Type::string(),\n                    \u003Cspan class=\u0022hljs-string\u0022\u003E\u0027resolve\u0027\u003C\/span\u003E =\u0026gt; \u003Cspan class=\u0022hljs-function\u0022\u003E\u003Cspan class=\u0022hljs-keyword\u0022\u003Efunction\u003C\/span\u003E \u003Cspan class=\u0022hljs-params\u0022\u003E(User $user)\u003C\/span\u003E \u003C\/span\u003E{\n                        \u003Cspan class=\u0022hljs-keyword\u0022\u003Ereturn\u003C\/span\u003E $user-\u0026gt;getEmail();\n                    },\n                ],\n            ],\n        ]);\n    }\n\n    \u003Cspan class=\u0022hljs-keyword\u0022\u003Epublic\u003C\/span\u003E \u003Cspan class=\u0022hljs-function\u0022\u003E\u003Cspan class=\u0022hljs-keyword\u0022\u003Efunction\u003C\/span\u003E \u003Cspan class=\u0022hljs-title\u0022\u003EgetId\u003C\/span\u003E\u003Cspan class=\u0022hljs-params\u0022\u003E()\u003C\/span\u003E: \u003Cspan class=\u0022hljs-title\u0022\u003Estring\u003C\/span\u003E\n    \u003C\/span\u003E{\n        \u003Cspan class=\u0022hljs-keyword\u0022\u003Ereturn\u003C\/span\u003E \u003Cspan class=\u0022hljs-keyword\u0022\u003E$this\u003C\/span\u003E-\u0026gt;id;\n    }\n\n    \u003Cspan class=\u0022hljs-keyword\u0022\u003Epublic\u003C\/span\u003E \u003Cspan class=\u0022hljs-function\u0022\u003E\u003Cspan class=\u0022hljs-keyword\u0022\u003Efunction\u003C\/span\u003E \u003Cspan class=\u0022hljs-title\u0022\u003EgetEmail\u003C\/span\u003E\u003Cspan class=\u0022hljs-params\u0022\u003E()\u003C\/span\u003E: \u003Cspan class=\u0022hljs-title\u0022\u003Estring\u003C\/span\u003E\n    \u003C\/span\u003E{\n        \u003Cspan class=\u0022hljs-keyword\u0022\u003Ereturn\u003C\/span\u003E \u003Cspan class=\u0022hljs-keyword\u0022\u003E$this\u003C\/span\u003E-\u0026gt;email;\n    }\n}\n\u003C\/code\u003E\u003C\/pre\u003E\n\u003Cp\u003EAnd the following GraphQL schema:\u003C\/p\u003E\n\u003Cpre\u003E\u003Ccode class=\u0022hljs php border\u0022\u003E\u003Cspan class=\u0022hljs-keyword\u0022\u003Enew\u003C\/span\u003E Schema([\n    \u003Cspan class=\u0022hljs-string\u0022\u003E\u0027query\u0027\u003C\/span\u003E =\u0026gt; \u003Cspan class=\u0022hljs-keyword\u0022\u003Enew\u003C\/span\u003E ObjectType([\n        \u003Cspan class=\u0022hljs-string\u0022\u003E\u0027name\u0027\u003C\/span\u003E =\u0026gt; \u003Cspan class=\u0022hljs-string\u0022\u003E\u0027Query\u0027\u003C\/span\u003E,\n        \u003Cspan class=\u0022hljs-string\u0022\u003E\u0027fields\u0027\u003C\/span\u003E =\u0026gt; [\n            \u003Cspan class=\u0022hljs-string\u0022\u003E\u0027hello\u0027\u003C\/span\u003E =\u0026gt; [\n                \u003Cspan class=\u0022hljs-string\u0022\u003E\u0027type\u0027\u003C\/span\u003E =\u0026gt; Type::string(),\n                \u003Cspan class=\u0022hljs-string\u0022\u003E\u0027resolve\u0027\u003C\/span\u003E =\u0026gt; \u003Cspan class=\u0022hljs-function\u0022\u003E\u003Cspan class=\u0022hljs-keyword\u0022\u003Efunction\u003C\/span\u003E \u003Cspan class=\u0022hljs-params\u0022\u003E()\u003C\/span\u003E \u003C\/span\u003E{\n                    \u003Cspan class=\u0022hljs-keyword\u0022\u003Ereturn\u003C\/span\u003E \u003Cspan class=\u0022hljs-string\u0022\u003E\u0027GraphQL API\u0027\u003C\/span\u003E;\n                }\n            ],\n            \u003Cspan class=\u0022hljs-string\u0022\u003E\u0027user\u0027\u003C\/span\u003E =\u0026gt; [\n                \u003Cspan class=\u0022hljs-string\u0022\u003E\u0027type\u0027\u003C\/span\u003E =\u0026gt; User::type(),\n                \u003Cspan class=\u0022hljs-string\u0022\u003E\u0027args\u0027\u003C\/span\u003E =\u0026gt; [\n                    \u003Cspan class=\u0022hljs-string\u0022\u003E\u0027id\u0027\u003C\/span\u003E =\u0026gt; [\u003Cspan class=\u0022hljs-string\u0022\u003E\u0027type\u0027\u003C\/span\u003E =\u0026gt; Type::nonNull(Type::id())],\n                ],\n                \u003Cspan class=\u0022hljs-string\u0022\u003E\u0027resolve\u0027\u003C\/span\u003E =\u0026gt; \u003Cspan class=\u0022hljs-keyword\u0022\u003E$this\u003C\/span\u003E-\u0026gt;accessControl-\u0026gt;guard(\u003Cspan class=\u0022hljs-function\u0022\u003E\u003Cspan class=\u0022hljs-keyword\u0022\u003Efunction\u003C\/span\u003E \u003Cspan class=\u0022hljs-params\u0022\u003E($root, $args)\u003C\/span\u003E \u003C\/span\u003E{\n                    \u003Cspan class=\u0022hljs-keyword\u0022\u003Ereturn\u003C\/span\u003E \u003Cspan class=\u0022hljs-keyword\u0022\u003E$this\u003C\/span\u003E-\u0026gt;repository-\u0026gt;find($args[\u003Cspan class=\u0022hljs-string\u0022\u003E\u0027id\u0027\u003C\/span\u003E]);\n                }, \u003Cspan class=\u0022hljs-string\u0022\u003E\u0027ROLE_ADMIN\u0027\u003C\/span\u003E),\n            ],\n            \u003Cspan class=\u0022hljs-string\u0022\u003E\u0027currentUser\u0027\u003C\/span\u003E =\u0026gt; [\n                \u003Cspan class=\u0022hljs-string\u0022\u003E\u0027type\u0027\u003C\/span\u003E =\u0026gt; User::type(),\n                \u003Cspan class=\u0022hljs-string\u0022\u003E\u0027resolve\u0027\u003C\/span\u003E =\u0026gt; \u003Cspan class=\u0022hljs-function\u0022\u003E\u003Cspan class=\u0022hljs-keyword\u0022\u003Efunction\u003C\/span\u003E \u003Cspan class=\u0022hljs-params\u0022\u003E($root, $args)\u003C\/span\u003E \u003C\/span\u003E{\n                    $user = \u003Cspan class=\u0022hljs-keyword\u0022\u003E$this\u003C\/span\u003E-\u0026gt;tokenStorage-\u0026gt;getToken()-\u0026gt;getUser();\n\n                    \u003Cspan class=\u0022hljs-keyword\u0022\u003Ereturn\u003C\/span\u003E $user \u003Cspan class=\u0022hljs-keyword\u0022\u003Einstanceof\u003C\/span\u003E User ? $user : \u003Cspan class=\u0022hljs-keyword\u0022\u003Enull\u003C\/span\u003E;\n                },\n            ],\n            \u003Cspan class=\u0022hljs-string\u0022\u003E\u0027jwt\u0027\u003C\/span\u003E =\u0026gt; [\n                \u003Cspan class=\u0022hljs-string\u0022\u003E\u0027type\u0027\u003C\/span\u003E =\u0026gt; Type::string(),\n                \u003Cspan class=\u0022hljs-string\u0022\u003E\u0027args\u0027\u003C\/span\u003E =\u0026gt; [\n                    \u003Cspan class=\u0022hljs-string\u0022\u003E\u0027login\u0027\u003C\/span\u003E =\u0026gt; Type::nonNull(Type::string()),\n                    \u003Cspan class=\u0022hljs-string\u0022\u003E\u0027password\u0027\u003C\/span\u003E =\u0026gt; Type::nonNull(Type::string()),\n                ],\n                \u003Cspan class=\u0022hljs-string\u0022\u003E\u0027resolve\u0027\u003C\/span\u003E =\u0026gt; \u003Cspan class=\u0022hljs-function\u0022\u003E\u003Cspan class=\u0022hljs-keyword\u0022\u003Efunction\u003C\/span\u003E \u003Cspan class=\u0022hljs-params\u0022\u003E($root, $args)\u003C\/span\u003E \u003C\/span\u003E{\n                    $user = \u003Cspan class=\u0022hljs-keyword\u0022\u003E$this\u003C\/span\u003E-\u0026gt;repository-\u0026gt;findOneBy([\u003Cspan class=\u0022hljs-string\u0022\u003E\u0027email\u0027\u003C\/span\u003E =\u0026gt; $args[\u003Cspan class=\u0022hljs-string\u0022\u003E\u0027login\u0027\u003C\/span\u003E]]);\n\n                    \u003Cspan class=\u0022hljs-keyword\u0022\u003Eif\u003C\/span\u003E (!$user || !\u003Cspan class=\u0022hljs-keyword\u0022\u003E$this\u003C\/span\u003E-\u0026gt;encoder-\u0026gt;isPasswordValid($user, $args[\u003Cspan class=\u0022hljs-string\u0022\u003E\u0027password\u0027\u003C\/span\u003E])) {\n                        \u003Cspan class=\u0022hljs-keyword\u0022\u003Ereturn\u003C\/span\u003E \u003Cspan class=\u0022hljs-keyword\u0022\u003Enull\u003C\/span\u003E;\n                    }\n\n                    \u003Cspan class=\u0022hljs-keyword\u0022\u003Ereturn\u003C\/span\u003E (string) \u003Cspan class=\u0022hljs-keyword\u0022\u003E$this\u003C\/span\u003E-\u0026gt;jwtManager-\u0026gt;issue($user);\n                },\n            ]\n        ],\n    ]),\n    \u003Cspan class=\u0022hljs-string\u0022\u003E\u0027mutation\u0027\u003C\/span\u003E =\u0026gt; \u003Cspan class=\u0022hljs-keyword\u0022\u003Enew\u003C\/span\u003E ObjectType([\n        \u003Cspan class=\u0022hljs-string\u0022\u003E\u0027name\u0027\u003C\/span\u003E =\u0026gt; \u003Cspan class=\u0022hljs-string\u0022\u003E\u0027Mutation\u0027\u003C\/span\u003E,\n        \u003Cspan class=\u0022hljs-string\u0022\u003E\u0027fields\u0027\u003C\/span\u003E =\u0026gt; [\n            \u003Cspan class=\u0022hljs-string\u0022\u003E\u0027userRegistered\u0027\u003C\/span\u003E =\u0026gt; [\n                \u003Cspan class=\u0022hljs-string\u0022\u003E\u0027type\u0027\u003C\/span\u003E =\u0026gt; User::type(),\n                \u003Cspan class=\u0022hljs-string\u0022\u003E\u0027args\u0027\u003C\/span\u003E =\u0026gt; [\n                    \u003Cspan class=\u0022hljs-string\u0022\u003E\u0027email\u0027\u003C\/span\u003E =\u0026gt; Type::nonNull(Type::string()),\n                    \u003Cspan class=\u0022hljs-string\u0022\u003E\u0027password\u0027\u003C\/span\u003E =\u0026gt; Type::nonNull(Type::string()),\n                ],\n                \u003Cspan class=\u0022hljs-string\u0022\u003E\u0027resolve\u0027\u003C\/span\u003E =\u0026gt; \u003Cspan class=\u0022hljs-function\u0022\u003E\u003Cspan class=\u0022hljs-keyword\u0022\u003Efunction\u003C\/span\u003E \u003Cspan class=\u0022hljs-params\u0022\u003E($root, $args)\u003C\/span\u003E \u003C\/span\u003E{\n                    \u003Cspan class=\u0022hljs-keyword\u0022\u003Ereturn\u003C\/span\u003E \u003Cspan class=\u0022hljs-keyword\u0022\u003E$this\u003C\/span\u003E-\u0026gt;eventDispatcher-\u0026gt;dispatch(\u003Cspan class=\u0022hljs-keyword\u0022\u003Enew\u003C\/span\u003E UserRegisteredEvent($args[\u003Cspan class=\u0022hljs-string\u0022\u003E\u0027email\u0027\u003C\/span\u003E], $args[\u003Cspan class=\u0022hljs-string\u0022\u003E\u0027password\u0027\u003C\/span\u003E]));\n                },\n            ]\n        ],\n    ]),\n]);\n\u003C\/code\u003E\u003C\/pre\u003E\n\u003Cp\u003EUsing this bundle, you can rewrite the entity\/type like this:\u003C\/p\u003E\n\u003Cpre\u003E\u003Ccode class=\u0022hljs php border\u0022\u003E\u003Cspan class=\u0022hljs-meta\u0022\u003E\u0026lt;?php\u003C\/span\u003E\n\n\u003Cspan class=\u0022hljs-keyword\u0022\u003Enamespace\u003C\/span\u003E \u003Cspan class=\u0022hljs-title\u0022\u003EApp\u003C\/span\u003E\\\u003Cspan class=\u0022hljs-title\u0022\u003EEntity\u003C\/span\u003E;\n\n\u003Cspan class=\u0022hljs-keyword\u0022\u003Euse\u003C\/span\u003E \u003Cspan class=\u0022hljs-title\u0022\u003EAvris\u003C\/span\u003E\\\u003Cspan class=\u0022hljs-title\u0022\u003EGraphqlBundle\u003C\/span\u003E\\\u003Cspan class=\u0022hljs-title\u0022\u003EAnnotation\u003C\/span\u003E \u003Cspan class=\u0022hljs-title\u0022\u003Eas\u003C\/span\u003E \u003Cspan class=\u0022hljs-title\u0022\u003EGraphql\u003C\/span\u003E;\n\n\u003Cspan class=\u0022hljs-comment\u0022\u003E\/**\n * \u003Cspan class=\u0022hljs-doctag\u0022\u003E@Graphql\u003C\/span\u003E\\Type\n *\/\u003C\/span\u003E\n\u003Cspan class=\u0022hljs-keyword\u0022\u003Efinal\u003C\/span\u003E \u003Cspan class=\u0022hljs-class\u0022\u003E\u003Cspan class=\u0022hljs-keyword\u0022\u003Eclass\u003C\/span\u003E \u003Cspan class=\u0022hljs-title\u0022\u003EUser\u003C\/span\u003E\n\u003C\/span\u003E{\n    \u003Cspan class=\u0022hljs-comment\u0022\u003E\/\/ properties, constructor, etc.\u003C\/span\u003E\n\n    \u003Cspan class=\u0022hljs-comment\u0022\u003E\/**\n     * \u003Cspan class=\u0022hljs-doctag\u0022\u003E@Graphql\u003C\/span\u003E\\Query\n     *\/\u003C\/span\u003E\n    \u003Cspan class=\u0022hljs-keyword\u0022\u003Epublic\u003C\/span\u003E \u003Cspan class=\u0022hljs-function\u0022\u003E\u003Cspan class=\u0022hljs-keyword\u0022\u003Efunction\u003C\/span\u003E \u003Cspan class=\u0022hljs-title\u0022\u003EgetId\u003C\/span\u003E\u003Cspan class=\u0022hljs-params\u0022\u003E()\u003C\/span\u003E: \u003Cspan class=\u0022hljs-title\u0022\u003Estring\u003C\/span\u003E\n    \u003C\/span\u003E{\n        \u003Cspan class=\u0022hljs-keyword\u0022\u003Ereturn\u003C\/span\u003E \u003Cspan class=\u0022hljs-keyword\u0022\u003E$this\u003C\/span\u003E-\u0026gt;id;\n    }\n\n    \u003Cspan class=\u0022hljs-comment\u0022\u003E\/**\n     * \u003Cspan class=\u0022hljs-doctag\u0022\u003E@Graphql\u003C\/span\u003E\\Query\n     *\/\u003C\/span\u003E\n    \u003Cspan class=\u0022hljs-keyword\u0022\u003Epublic\u003C\/span\u003E \u003Cspan class=\u0022hljs-function\u0022\u003E\u003Cspan class=\u0022hljs-keyword\u0022\u003Efunction\u003C\/span\u003E \u003Cspan class=\u0022hljs-title\u0022\u003EgetEmail\u003C\/span\u003E\u003Cspan class=\u0022hljs-params\u0022\u003E()\u003C\/span\u003E: \u003Cspan class=\u0022hljs-title\u0022\u003Estring\u003C\/span\u003E\n    \u003C\/span\u003E{\n        \u003Cspan class=\u0022hljs-keyword\u0022\u003Ereturn\u003C\/span\u003E \u003Cspan class=\u0022hljs-keyword\u0022\u003E$this\u003C\/span\u003E-\u0026gt;email;\n    }\n}\n\u003C\/code\u003E\u003C\/pre\u003E\n\u003Cp\u003EAnd your schema\/controllers like this:\u003C\/p\u003E\n\u003Cpre\u003E\u003Ccode class=\u0022hljs php border\u0022\u003E\u003Cspan class=\u0022hljs-meta\u0022\u003E\u0026lt;?php\u003C\/span\u003E\n\n\u003Cspan class=\u0022hljs-keyword\u0022\u003Enamespace\u003C\/span\u003E \u003Cspan class=\u0022hljs-title\u0022\u003EApp\u003C\/span\u003E\\\u003Cspan class=\u0022hljs-title\u0022\u003EController\u003C\/span\u003E;\n\n\u003Cspan class=\u0022hljs-keyword\u0022\u003Euse\u003C\/span\u003E \u003Cspan class=\u0022hljs-title\u0022\u003EAvris\u003C\/span\u003E\\\u003Cspan class=\u0022hljs-title\u0022\u003EGraphqlBundle\u003C\/span\u003E\\\u003Cspan class=\u0022hljs-title\u0022\u003EAnnotation\u003C\/span\u003E \u003Cspan class=\u0022hljs-title\u0022\u003Eas\u003C\/span\u003E \u003Cspan class=\u0022hljs-title\u0022\u003EGraphql\u003C\/span\u003E;\n\u003Cspan class=\u0022hljs-keyword\u0022\u003Euse\u003C\/span\u003E \u003Cspan class=\u0022hljs-title\u0022\u003ESymfony\u003C\/span\u003E\\\u003Cspan class=\u0022hljs-title\u0022\u003EBundle\u003C\/span\u003E\\\u003Cspan class=\u0022hljs-title\u0022\u003EFrameworkBundle\u003C\/span\u003E\\\u003Cspan class=\u0022hljs-title\u0022\u003EController\u003C\/span\u003E\\\u003Cspan class=\u0022hljs-title\u0022\u003EAbstractController\u003C\/span\u003E;\n\n\u003Cspan class=\u0022hljs-keyword\u0022\u003Efinal\u003C\/span\u003E \u003Cspan class=\u0022hljs-class\u0022\u003E\u003Cspan class=\u0022hljs-keyword\u0022\u003Eclass\u003C\/span\u003E \u003Cspan class=\u0022hljs-title\u0022\u003EHomeController\u003C\/span\u003E \u003Cspan class=\u0022hljs-keyword\u0022\u003Eextends\u003C\/span\u003E \u003Cspan class=\u0022hljs-title\u0022\u003EAbstractController\u003C\/span\u003E\n\u003C\/span\u003E{\n    \u003Cspan class=\u0022hljs-comment\u0022\u003E\/**\n     * \u003Cspan class=\u0022hljs-doctag\u0022\u003E@Graphql\u003C\/span\u003E\\Query\n     *\/\u003C\/span\u003E\n    \u003Cspan class=\u0022hljs-keyword\u0022\u003Epublic\u003C\/span\u003E \u003Cspan class=\u0022hljs-function\u0022\u003E\u003Cspan class=\u0022hljs-keyword\u0022\u003Efunction\u003C\/span\u003E \u003Cspan class=\u0022hljs-title\u0022\u003Ehello\u003C\/span\u003E\u003Cspan class=\u0022hljs-params\u0022\u003E()\u003C\/span\u003E: \u003Cspan class=\u0022hljs-title\u0022\u003Estring\u003C\/span\u003E\n    \u003C\/span\u003E{\n        \u003Cspan class=\u0022hljs-keyword\u0022\u003Ereturn\u003C\/span\u003E \u003Cspan class=\u0022hljs-string\u0022\u003E\u0027GraphQL API\u0027\u003C\/span\u003E;\n    }\n}\n\u003C\/code\u003E\u003C\/pre\u003E\n\u003Cp\u003Eand:\u003C\/p\u003E\n\u003Cpre\u003E\u003Ccode class=\u0022hljs php border\u0022\u003E\u003Cspan class=\u0022hljs-meta\u0022\u003E\u0026lt;?php\u003C\/span\u003E\n\n\u003Cspan class=\u0022hljs-keyword\u0022\u003Enamespace\u003C\/span\u003E \u003Cspan class=\u0022hljs-title\u0022\u003EApp\u003C\/span\u003E\\\u003Cspan class=\u0022hljs-title\u0022\u003EController\u003C\/span\u003E;\n\n\u003Cspan class=\u0022hljs-keyword\u0022\u003Euse\u003C\/span\u003E \u003Cspan class=\u0022hljs-title\u0022\u003EAvris\u003C\/span\u003E\\\u003Cspan class=\u0022hljs-title\u0022\u003EGraphqlBundle\u003C\/span\u003E\\\u003Cspan class=\u0022hljs-title\u0022\u003EAnnotation\u003C\/span\u003E \u003Cspan class=\u0022hljs-title\u0022\u003Eas\u003C\/span\u003E \u003Cspan class=\u0022hljs-title\u0022\u003EGraphql\u003C\/span\u003E;\n\u003Cspan class=\u0022hljs-keyword\u0022\u003Euse\u003C\/span\u003E \u003Cspan class=\u0022hljs-title\u0022\u003EApp\u003C\/span\u003E\\\u003Cspan class=\u0022hljs-title\u0022\u003EEntity\u003C\/span\u003E\\\u003Cspan class=\u0022hljs-title\u0022\u003EUser\u003C\/span\u003E;\n\u003Cspan class=\u0022hljs-keyword\u0022\u003Euse\u003C\/span\u003E \u003Cspan class=\u0022hljs-title\u0022\u003EApp\u003C\/span\u003E\\\u003Cspan class=\u0022hljs-title\u0022\u003EEvents\u003C\/span\u003E\\\u003Cspan class=\u0022hljs-title\u0022\u003EUserRegistered\u003C\/span\u003E;\n\n\u003Cspan class=\u0022hljs-keyword\u0022\u003Efinal\u003C\/span\u003E \u003Cspan class=\u0022hljs-class\u0022\u003E\u003Cspan class=\u0022hljs-keyword\u0022\u003Eclass\u003C\/span\u003E \u003Cspan class=\u0022hljs-title\u0022\u003EUserController\u003C\/span\u003E \u003Cspan class=\u0022hljs-keyword\u0022\u003Eextends\u003C\/span\u003E \u003Cspan class=\u0022hljs-title\u0022\u003EBaseController\u003C\/span\u003E\n\u003C\/span\u003E{\n    \u003Cspan class=\u0022hljs-comment\u0022\u003E\/\/ dependecies...\u003C\/span\u003E\n\n    \u003Cspan class=\u0022hljs-comment\u0022\u003E\/**\n     * \u003Cspan class=\u0022hljs-doctag\u0022\u003E@Graphql\u003C\/span\u003E\\Query\n     * \u003Cspan class=\u0022hljs-doctag\u0022\u003E@Graphql\u003C\/span\u003E\\Security(\u0022ROLE_ADMIN\u0022)\n     * \u003Cspan class=\u0022hljs-doctag\u0022\u003E@Graphql\u003C\/span\u003E\\ParamType(\u0022id\u0022, var=\u0022id\u0022)\n     *\/\u003C\/span\u003E\n    \u003Cspan class=\u0022hljs-keyword\u0022\u003Epublic\u003C\/span\u003E \u003Cspan class=\u0022hljs-function\u0022\u003E\u003Cspan class=\u0022hljs-keyword\u0022\u003Efunction\u003C\/span\u003E \u003Cspan class=\u0022hljs-title\u0022\u003Euser\u003C\/span\u003E\u003Cspan class=\u0022hljs-params\u0022\u003E(string $id)\u003C\/span\u003E: ?\u003Cspan class=\u0022hljs-title\u0022\u003EUser\u003C\/span\u003E\n    \u003C\/span\u003E{\n        \u003Cspan class=\u0022hljs-keyword\u0022\u003Ereturn\u003C\/span\u003E \u003Cspan class=\u0022hljs-keyword\u0022\u003E$this\u003C\/span\u003E-\u0026gt;repository-\u0026gt;find($id);\n    }\n\n    \u003Cspan class=\u0022hljs-comment\u0022\u003E\/**\n     * \u003Cspan class=\u0022hljs-doctag\u0022\u003E@Graphql\u003C\/span\u003E\\Query\n     *\/\u003C\/span\u003E\n    \u003Cspan class=\u0022hljs-keyword\u0022\u003Epublic\u003C\/span\u003E \u003Cspan class=\u0022hljs-function\u0022\u003E\u003Cspan class=\u0022hljs-keyword\u0022\u003Efunction\u003C\/span\u003E \u003Cspan class=\u0022hljs-title\u0022\u003EcurrentUser\u003C\/span\u003E\u003Cspan class=\u0022hljs-params\u0022\u003E()\u003C\/span\u003E: ?\u003Cspan class=\u0022hljs-title\u0022\u003EUser\u003C\/span\u003E\n    \u003C\/span\u003E{\n        $user = \u003Cspan class=\u0022hljs-keyword\u0022\u003E$this\u003C\/span\u003E-\u0026gt;tokenStorage-\u0026gt;getToken()-\u0026gt;getUser();\n\n        \u003Cspan class=\u0022hljs-keyword\u0022\u003Ereturn\u003C\/span\u003E $user \u003Cspan class=\u0022hljs-keyword\u0022\u003Einstanceof\u003C\/span\u003E User ? $user : \u003Cspan class=\u0022hljs-keyword\u0022\u003Enull\u003C\/span\u003E;\n    }\n\n    \u003Cspan class=\u0022hljs-comment\u0022\u003E\/**\n     * \u003Cspan class=\u0022hljs-doctag\u0022\u003E@Graphql\u003C\/span\u003E\\Query\n     *\/\u003C\/span\u003E\n    \u003Cspan class=\u0022hljs-keyword\u0022\u003Epublic\u003C\/span\u003E \u003Cspan class=\u0022hljs-function\u0022\u003E\u003Cspan class=\u0022hljs-keyword\u0022\u003Efunction\u003C\/span\u003E \u003Cspan class=\u0022hljs-title\u0022\u003Ejwt\u003C\/span\u003E\u003Cspan class=\u0022hljs-params\u0022\u003E(string $login, string $password)\u003C\/span\u003E: ?\u003Cspan class=\u0022hljs-title\u0022\u003Estring\u003C\/span\u003E\n    \u003C\/span\u003E{\n        $user = \u003Cspan class=\u0022hljs-keyword\u0022\u003E$this\u003C\/span\u003E-\u0026gt;repository-\u0026gt;findOneBy([\u003Cspan class=\u0022hljs-string\u0022\u003E\u0027email\u0027\u003C\/span\u003E =\u0026gt; $login]);\n\n        \u003Cspan class=\u0022hljs-keyword\u0022\u003Eif\u003C\/span\u003E (!$user || !\u003Cspan class=\u0022hljs-keyword\u0022\u003E$this\u003C\/span\u003E-\u0026gt;encoder-\u0026gt;isPasswordValid($user, $password)) {\n            \u003Cspan class=\u0022hljs-keyword\u0022\u003Ereturn\u003C\/span\u003E \u003Cspan class=\u0022hljs-keyword\u0022\u003Enull\u003C\/span\u003E;\n        }\n\n        \u003Cspan class=\u0022hljs-keyword\u0022\u003Ereturn\u003C\/span\u003E (string) \u003Cspan class=\u0022hljs-keyword\u0022\u003E$this\u003C\/span\u003E-\u0026gt;jwtManager-\u0026gt;issue($user);\n    }\n\n    \u003Cspan class=\u0022hljs-comment\u0022\u003E\/**\n     * \u003Cspan class=\u0022hljs-doctag\u0022\u003E@Graphql\u003C\/span\u003E\\Query(\u0022mutation\u0022)\n     *\/\u003C\/span\u003E\n    \u003Cspan class=\u0022hljs-keyword\u0022\u003Epublic\u003C\/span\u003E \u003Cspan class=\u0022hljs-function\u0022\u003E\u003Cspan class=\u0022hljs-keyword\u0022\u003Efunction\u003C\/span\u003E \u003Cspan class=\u0022hljs-title\u0022\u003EuserRegistered\u003C\/span\u003E\u003Cspan class=\u0022hljs-params\u0022\u003E(string $email, string $password)\u003C\/span\u003E: \u003Cspan class=\u0022hljs-title\u0022\u003EUser\u003C\/span\u003E\n    \u003C\/span\u003E{\n        \u003Cspan class=\u0022hljs-keyword\u0022\u003Ereturn\u003C\/span\u003E \u003Cspan class=\u0022hljs-keyword\u0022\u003E$this\u003C\/span\u003E-\u0026gt;eventDispatcher-\u0026gt;dispatch(\u003Cspan class=\u0022hljs-keyword\u0022\u003Enew\u003C\/span\u003E UserRegisteredEvent($email, $password));\n    }\n}\n\u003C\/code\u003E\u003C\/pre\u003E\n\u003Cp\u003EThe bundle will parse all the classes in \u003Ccode\u003Esrc\/Controller\u003C\/code\u003E and \u003Ccode\u003Esrc\/Entity\u003C\/code\u003E\n(that list can be configured in the config key \u003Ccode\u003Eavris_graphql.load\u003C\/code\u003E)\nlooking for the \u003Ccode\u003EGraphql\u003C\/code\u003E annotations.\u003C\/p\u003E\n\u003Cp\u003EAll parameters of a query-method, as well as its return type have to be typehinted.\nSupported built-in types are \u003Ccode\u003Estring\u003C\/code\u003E, \u003Ccode\u003Ebool\u003C\/code\u003E, \u003Ccode\u003Eint\u003C\/code\u003E and \u003Ccode\u003Efloat\u003C\/code\u003E.\nYou can also typehint any type you registered with \u003Ccode\u003E@Graphql\\Type\u003C\/code\u003E.\u003C\/p\u003E\n\u003Cp\u003EAdditionally, you can use \u003Ccode\u003Eid\u003C\/code\u003E, list (\u003Ccode\u003Eint[]\u003C\/code\u003E) and union (\u003Ccode\u003Eint|float\u003C\/code\u003E),\nbut for that you need an \u003Ccode\u003E@Graph\\ParamType\u003C\/code\u003E or \u003Ccode\u003E@Graph\\ReturnType\u003C\/code\u003E annotation for that.\u003C\/p\u003E\u003Csvg xmlns=\u0022http:\/\/www.w3.org\/2000\/svg\u0022 style=\u0022display: none;\u0022\u003E\u003C\/svg\u003E","tags":["bundle","graphql","php","symfony"],"hasMore":true,"image":"https:\/\/avris.it\/image\/avris-graphql-bundle_small.png","introLite":"\u003Cfigure\u003E\u003Ca href=\u0022https:\/\/avris.it\/image\/avris-graphql-bundle_big.png\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Cimg src=\u0022https:\/\/avris.it\/image\/avris-graphql-bundle_mini.png\u0022 alt=\u0022Avris GraphqlBundle\u0022 width=\u0022240\u0022 height=\u0022160\u0022 loading=\u0022lazy\u0022\u003E\u003C\/a\u003E\u003C\/figure\u003E\u003C\/p\u003E\n\u003Cp\u003ESimplify Graphql configuration using plain methods with typehints and annotations.\u003C\/p\u003E\n\u003Cp\u003EThis bundle is a wrapper on \u003Ccode\u003Ewebonyx\/graphql-php\u003C\/code\u003E.\u003C\/p\u003E","contentLite":"\u003Cfigure\u003E\u003Ca href=\u0022https:\/\/avris.it\/image\/avris-graphql-bundle_big.png\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Cimg src=\u0022https:\/\/avris.it\/image\/avris-graphql-bundle_mini.png\u0022 alt=\u0022Avris GraphqlBundle\u0022 width=\u0022240\u0022 height=\u0022160\u0022 loading=\u0022lazy\u0022\u003E\u003C\/a\u003E\u003C\/figure\u003E\u003C\/p\u003E\n\u003Cp\u003ESimplify Graphql configuration using plain methods with typehints and annotations.\u003C\/p\u003E\n\u003Cp\u003EThis bundle is a wrapper on \u003Ccode\u003Ewebonyx\/graphql-php\u003C\/code\u003E.\u003C\/p\u003E\n\u003Ch3\u003EDisclaimer\u003C\/h3\u003E\n\u003Cp\u003EI\u2019m new to GraphQL, currently writing my first project using it.\nI\u2019m sure that many things are missing from the bundle and many assumptions I made are wrong,\nso please be understanding, and if possible help out with a pull request.\u003C\/p\u003E\n\u003Ch3\u003EInstalation\u003C\/h3\u003E\n\u003Cpre\u003E\u003Ccode class=\u0022language-bash\u0022\u003E$ composer require avris\/graphql-bundle\u003C\/code\u003E\u003C\/pre\u003E\n\u003Cp\u003EThen add a route:\u003C\/p\u003E\n\u003Cpre\u003E\u003Ccode class=\u0022language-yaml\u0022\u003Eavris_graphql_main:\n    path: \u0027\/graph\u0027\n    controller: Avris\\GraphqlBundle\\Controller\\GraphqlController::main\u003C\/code\u003E\u003C\/pre\u003E\n\u003Ch3\u003EExample\u003C\/h3\u003E\n\u003Cp\u003ELet\u2019s say you have the following type in your app:\u003C\/p\u003E\n\u003Cpre\u003E\u003Ccode class=\u0022language-php\u0022\u003E\u0026lt;?php\n\nnamespace App\\Entity;\n\nfinal class User\n{\n    \/\/ properties, constructor, etc.\n\n    private static $type = null;\n\n    final public static function type(): ObjectType\n    {\n        return static::$type ?: static::$type = static::buildType();\n    }\n\n    private static function buildType(): ObjectType\n    {\n        return new ObjectType([\n            \u0027name\u0027 =\u0026gt; \u0027User\u0027,\n            \u0027fields\u0027 =\u0026gt; [\n                \u0027id\u0027 =\u0026gt; [\n                    \u0027type\u0027 =\u0026gt; Type::id(),\n                    \u0027resolve\u0027 =\u0026gt; function (User $user) {\n                        return $user-\u0026gt;getId();\n                    },\n                ],\n                \u0027email\u0027 =\u0026gt; [\n                    \u0027type\u0027 =\u0026gt; Type::string(),\n                    \u0027resolve\u0027 =\u0026gt; function (User $user) {\n                        return $user-\u0026gt;getEmail();\n                    },\n                ],\n            ],\n        ]);\n    }\n\n    public function getId(): string\n    {\n        return $this-\u0026gt;id;\n    }\n\n    public function getEmail(): string\n    {\n        return $this-\u0026gt;email;\n    }\n}\u003C\/code\u003E\u003C\/pre\u003E\n\u003Cp\u003EAnd the following GraphQL schema:\u003C\/p\u003E\n\u003Cpre\u003E\u003Ccode class=\u0022language-php\u0022\u003Enew Schema([\n    \u0027query\u0027 =\u0026gt; new ObjectType([\n        \u0027name\u0027 =\u0026gt; \u0027Query\u0027,\n        \u0027fields\u0027 =\u0026gt; [\n            \u0027hello\u0027 =\u0026gt; [\n                \u0027type\u0027 =\u0026gt; Type::string(),\n                \u0027resolve\u0027 =\u0026gt; function () {\n                    return \u0027GraphQL API\u0027;\n                }\n            ],\n            \u0027user\u0027 =\u0026gt; [\n                \u0027type\u0027 =\u0026gt; User::type(),\n                \u0027args\u0027 =\u0026gt; [\n                    \u0027id\u0027 =\u0026gt; [\u0027type\u0027 =\u0026gt; Type::nonNull(Type::id())],\n                ],\n                \u0027resolve\u0027 =\u0026gt; $this-\u0026gt;accessControl-\u0026gt;guard(function ($root, $args) {\n                    return $this-\u0026gt;repository-\u0026gt;find($args[\u0027id\u0027]);\n                }, \u0027ROLE_ADMIN\u0027),\n            ],\n            \u0027currentUser\u0027 =\u0026gt; [\n                \u0027type\u0027 =\u0026gt; User::type(),\n                \u0027resolve\u0027 =\u0026gt; function ($root, $args) {\n                    $user = $this-\u0026gt;tokenStorage-\u0026gt;getToken()-\u0026gt;getUser();\n\n                    return $user instanceof User ? $user : null;\n                },\n            ],\n            \u0027jwt\u0027 =\u0026gt; [\n                \u0027type\u0027 =\u0026gt; Type::string(),\n                \u0027args\u0027 =\u0026gt; [\n                    \u0027login\u0027 =\u0026gt; Type::nonNull(Type::string()),\n                    \u0027password\u0027 =\u0026gt; Type::nonNull(Type::string()),\n                ],\n                \u0027resolve\u0027 =\u0026gt; function ($root, $args) {\n                    $user = $this-\u0026gt;repository-\u0026gt;findOneBy([\u0027email\u0027 =\u0026gt; $args[\u0027login\u0027]]);\n\n                    if (!$user || !$this-\u0026gt;encoder-\u0026gt;isPasswordValid($user, $args[\u0027password\u0027])) {\n                        return null;\n                    }\n\n                    return (string) $this-\u0026gt;jwtManager-\u0026gt;issue($user);\n                },\n            ]\n        ],\n    ]),\n    \u0027mutation\u0027 =\u0026gt; new ObjectType([\n        \u0027name\u0027 =\u0026gt; \u0027Mutation\u0027,\n        \u0027fields\u0027 =\u0026gt; [\n            \u0027userRegistered\u0027 =\u0026gt; [\n                \u0027type\u0027 =\u0026gt; User::type(),\n                \u0027args\u0027 =\u0026gt; [\n                    \u0027email\u0027 =\u0026gt; Type::nonNull(Type::string()),\n                    \u0027password\u0027 =\u0026gt; Type::nonNull(Type::string()),\n                ],\n                \u0027resolve\u0027 =\u0026gt; function ($root, $args) {\n                    return $this-\u0026gt;eventDispatcher-\u0026gt;dispatch(new UserRegisteredEvent($args[\u0027email\u0027], $args[\u0027password\u0027]));\n                },\n            ]\n        ],\n    ]),\n]);\u003C\/code\u003E\u003C\/pre\u003E\n\u003Cp\u003EUsing this bundle, you can rewrite the entity\/type like this:\u003C\/p\u003E\n\u003Cpre\u003E\u003Ccode class=\u0022language-php\u0022\u003E\u0026lt;?php\n\nnamespace App\\Entity;\n\nuse Avris\\GraphqlBundle\\Annotation as Graphql;\n\n\/**\n * @Graphql\\Type\n *\/\nfinal class User\n{\n    \/\/ properties, constructor, etc.\n\n    \/**\n     * @Graphql\\Query\n     *\/\n    public function getId(): string\n    {\n        return $this-\u0026gt;id;\n    }\n\n    \/**\n     * @Graphql\\Query\n     *\/\n    public function getEmail(): string\n    {\n        return $this-\u0026gt;email;\n    }\n}\u003C\/code\u003E\u003C\/pre\u003E\n\u003Cp\u003EAnd your schema\/controllers like this:\u003C\/p\u003E\n\u003Cpre\u003E\u003Ccode class=\u0022language-php\u0022\u003E\u0026lt;?php\n\nnamespace App\\Controller;\n\nuse Avris\\GraphqlBundle\\Annotation as Graphql;\nuse Symfony\\Bundle\\FrameworkBundle\\Controller\\AbstractController;\n\nfinal class HomeController extends AbstractController\n{\n    \/**\n     * @Graphql\\Query\n     *\/\n    public function hello(): string\n    {\n        return \u0027GraphQL API\u0027;\n    }\n}\u003C\/code\u003E\u003C\/pre\u003E\n\u003Cp\u003Eand:\u003C\/p\u003E\n\u003Cpre\u003E\u003Ccode class=\u0022language-php\u0022\u003E\u0026lt;?php\n\nnamespace App\\Controller;\n\nuse Avris\\GraphqlBundle\\Annotation as Graphql;\nuse App\\Entity\\User;\nuse App\\Events\\UserRegistered;\n\nfinal class UserController extends BaseController\n{\n    \/\/ dependecies...\n\n    \/**\n     * @Graphql\\Query\n     * @Graphql\\Security(\u0022ROLE_ADMIN\u0022)\n     * @Graphql\\ParamType(\u0022id\u0022, var=\u0022id\u0022)\n     *\/\n    public function user(string $id): ?User\n    {\n        return $this-\u0026gt;repository-\u0026gt;find($id);\n    }\n\n    \/**\n     * @Graphql\\Query\n     *\/\n    public function currentUser(): ?User\n    {\n        $user = $this-\u0026gt;tokenStorage-\u0026gt;getToken()-\u0026gt;getUser();\n\n        return $user instanceof User ? $user : null;\n    }\n\n    \/**\n     * @Graphql\\Query\n     *\/\n    public function jwt(string $login, string $password): ?string\n    {\n        $user = $this-\u0026gt;repository-\u0026gt;findOneBy([\u0027email\u0027 =\u0026gt; $login]);\n\n        if (!$user || !$this-\u0026gt;encoder-\u0026gt;isPasswordValid($user, $password)) {\n            return null;\n        }\n\n        return (string) $this-\u0026gt;jwtManager-\u0026gt;issue($user);\n    }\n\n    \/**\n     * @Graphql\\Query(\u0022mutation\u0022)\n     *\/\n    public function userRegistered(string $email, string $password): User\n    {\n        return $this-\u0026gt;eventDispatcher-\u0026gt;dispatch(new UserRegisteredEvent($email, $password));\n    }\n}\u003C\/code\u003E\u003C\/pre\u003E\n\u003Cp\u003EThe bundle will parse all the classes in \u003Ccode\u003Esrc\/Controller\u003C\/code\u003E and \u003Ccode\u003Esrc\/Entity\u003C\/code\u003E\n(that list can be configured in the config key \u003Ccode\u003Eavris_graphql.load\u003C\/code\u003E)\nlooking for the \u003Ccode\u003EGraphql\u003C\/code\u003E annotations.\u003C\/p\u003E\n\u003Cp\u003EAll parameters of a query-method, as well as its return type have to be typehinted.\nSupported built-in types are \u003Ccode\u003Estring\u003C\/code\u003E, \u003Ccode\u003Ebool\u003C\/code\u003E, \u003Ccode\u003Eint\u003C\/code\u003E and \u003Ccode\u003Efloat\u003C\/code\u003E.\nYou can also typehint any type you registered with \u003Ccode\u003E@Graphql\\Type\u003C\/code\u003E.\u003C\/p\u003E\n\u003Cp\u003EAdditionally, you can use \u003Ccode\u003Eid\u003C\/code\u003E, list (\u003Ccode\u003Eint[]\u003C\/code\u003E) and union (\u003Ccode\u003Eint|float\u003C\/code\u003E),\nbut for that you need an \u003Ccode\u003E@Graph\\ParamType\u003C\/code\u003E or \u003Ccode\u003E@Graph\\ReturnType\u003C\/code\u003E annotation for that.\u003C\/p\u003E","words":680,"readTime":3,"lang":"en"}}},"blog\/technology\/the-non-magic-of-autowiring":{"key":"blog\/technology\/the-non-magic-of-autowiring","type":"article","published":true,"meta":{"createdAt":"2017-09-01T22:58:27+02:00","publishedAt":"2017-09-05T20:00:00+02:00","group":null,"category":"blog","subcategory":"technology","slug":"the-non-magic-of-autowiring"},"content":{"en":{"slug":"the-non-magic-of-autowiring","title":"The non-magic of autowiring","intro":"\u003Cp\u003EWhen I first heard the term \u201cAutowiring\u201d, I thought it sounds exciting. But when I learned more or less what is it about, I got pretty sceptical of the idea. Too much \u003Cem\u003Emagic\u003C\/em\u003E, too much implied information... However, when I finally used it for the first time... Gosh I wish I could never define services manually again!\u003C\/p\u003E\u003Csvg xmlns=\u0022http:\/\/www.w3.org\/2000\/svg\u0022 style=\u0022display: none;\u0022\u003E\u003C\/svg\u003E","content":"\u003Cp\u003EWhen I first heard the term \u201cAutowiring\u201d, I thought it sounds exciting. But when I learned more or less what is it about, I got pretty sceptical of the idea. Too much \u003Cem\u003Emagic\u003C\/em\u003E, too much implied information... However, when I finally used it for the first time... Gosh I wish I could never define services manually again!\u003C\/p\u003E\n\u003Cp\u003E\u003Ca href=\u0022https:\/\/en.wikipedia.org\/wiki\/Dependency_injection\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-link\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E Dependency Injection Container\u003C\/a\u003E is definitely my favourite design pattern \u2013 so elegant, simple and flexible!\u003C\/p\u003E\n\u003Cp\u003EIt comes with one inconvenience though: you basically need to code the same thing twice. If your service requires some dependency, it cannot just \u003Cem\u003Etake\u003C\/em\u003E it or just \u003Cem\u003Ecreate\u003C\/em\u003E it. Instead, it should \u003Cem\u003Eexpect\u003C\/em\u003E its dependencies, while the container \u003Cem\u003Eprovides\u003C\/em\u003E them from the outside. When you want to add a new dependency, you need to both add it in the class and in some external service definition. This doesn\u2019t look like much effort, but when you\u2019re intensively playing around with your services, it all adds up. I didn\u2019t even realise, how annoying that process is, until I no longer had to follow it.\u003C\/p\u003E\n\u003Cp\u003EWhen I started a fresh project recently, using the latest version of \u003Ca href=\u0022https:\/\/symfony.com\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-link\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E Symfony\u003C\/a\u003E after over a year of working almost exclusively with \u003Ca href=\u0022https:\/\/phalconphp.com\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-link\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E Phalcon\u003C\/a\u003E and \u003Ca href=\u0022https:\/\/micrus.avris.it\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-link\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E Micrus\u003C\/a\u003E, I had already forgotten about those two new features of Symfony: autowiring and autoconfiguration. I remembered by accident.\u003C\/p\u003E\n\u003Cp\u003EI needed a \u003Ca href=\u0022https:\/\/symfony.com\/doc\/current\/templating\/twig_extension.html\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-link\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E Twig extension\u003C\/a\u003E, so I quickly created one: simple class, extending \u003Ccode\u003E\\Twig_Extension\u003C\/code\u003E, expecting some other service in its constructor, providing some filter in \u003Ccode\u003EgetFilters()\u003C\/code\u003E. I refreshed the tab in the browser and immediately realised I\u2019m gonna see an exception \u2013 in the end, I forgot to tag this class as a \u003Ccode\u003Etwig.extension\u003C\/code\u003E, I forgot to provide the dependencies, it has to fail! But no, \u003Cstrong\u003Eit just worked\u003C\/strong\u003E!\u003C\/p\u003E\n\u003Cp\u003EThe idea behind \u003Cstrong\u003Eautowiring\u003C\/strong\u003E is pretty simple: if a service requires an instance of \u003Ccode\u003EAppBundle\\Api\\CmsService\u003C\/code\u003E, and your DI container happens to have a service called \u003Ccode\u003EAppBundle\\Api\\CmsService\u003C\/code\u003E, which is of type \u003Ccode\u003EAppBundle\\Api\\CmsService\u003C\/code\u003E, then it\u2019s pretty safe to assume, that\u2019s the one you want.\u003C\/p\u003E\n\u003Cp\u003EIdeally, you should depend on abstractions, interfaces. For instance when you have multiple cache adapters, all implementing \u003Ccode\u003EPsr\\Cache\\CacheItemPoolInterface\u003C\/code\u003E, your services should depend on \u003Ccode\u003EPsr\\Cache\\CacheItemPoolInterface\u003C\/code\u003E, not on any specific implementation. This way you can always switch for instance from \u003Ccode\u003EFilesystemAdapter\u003C\/code\u003E to \u003Ccode\u003ERedisAdapter\u003C\/code\u003E without any trouble.\u003C\/p\u003E\n\u003Cp\u003EBut if you have more than one implementation of an interface, how does the autowired container know, which one to use? You tell it, by creating an alias:\u003C\/p\u003E\n\u003Cpre\u003E\u003Ccode class=\u0022hljs yaml border\u0022\u003E\u003Cspan class=\u0022hljs-string\u0022\u003EPsr\\Cache\\CacheItemPoolInterface:\u003C\/span\u003E \u003Cspan class=\u0022hljs-string\u0022\u003E\u0027@Symfony\\Component\\Cache\\Adapter\u0027\u003C\/span\u003E\n\u003C\/code\u003E\u003C\/pre\u003E\n\u003Cp\u003EAnd what about the scalars and arrays? If my service expects \u003Ccode\u003Estring $baseUrl\u003C\/code\u003E, how does the container know \u003Cem\u003Ethat\u003C\/em\u003E? Of course it doesn\u2019t, I need to specify it myself:\u003C\/p\u003E\n\u003Cpre\u003E\u003Ccode class=\u0022hljs yaml border\u0022\u003E\u003Cspan class=\u0022hljs-string\u0022\u003EAppBundle\\Service\\ExternalSerive:\u003C\/span\u003E\n    \u003Cspan class=\u0022hljs-attr\u0022\u003Earguments:\u003C\/span\u003E\n        \u003Cspan class=\u0022hljs-string\u0022\u003E$baseUsr:\u003C\/span\u003E \u003Cspan class=\u0022hljs-string\u0022\u003E\u0027https:\/\/api.external.org\/\u0027\u003C\/span\u003E\n\u003C\/code\u003E\u003C\/pre\u003E\n\u003Cp\u003EYou can do the same thing for services as well. For instance when all of them should use some generic logger, except for one, which requires something more specific, just overwrite its \u003Ccode\u003Earguments.$logger\u003C\/code\u003E with the other one.\u003C\/p\u003E\n\u003Cp\u003EPretty simple, right? The idea behind \u003Cstrong\u003Eautoconfiguration\u003C\/strong\u003E is even simpler. You (or libraries, like Twig) can define that all the services which are an instance of \u003Ccode\u003EFoo\u003C\/code\u003E should automatically receive some specific config, for instance a tag. That\u2019s why I didn\u2019t have to register my Twig extension.\u003C\/p\u003E\n\u003Cp\u003EMain concern one might have about autowiring is that, although pretty simple, it sure is time-consuming. Should I sacrifice my website\u2019s performance for the developer\u2019s convenience? Of course not! Symfony\u2019s container is compiled, so autowiring has absolutely no overhead on production!\u003C\/p\u003E\n\u003Cp\u003EAlso, Symfony Container has a concept of public and private services. Public ones you can just fetch from the container wherever you wish. Private ones can only be injected into other services \u2013 if they aren\u2019t used, they get removed from the container completely.\u003C\/p\u003E\n\u003Cp\u003EAutowiring is amazing. Simple, but effective. It makes the development faster, especially in the early phase. It prevents you from repeating yourself and maintaining a lengthy \u003Ccode\u003Eservices.yml\u003C\/code\u003E file full of information noise. And, although magical, it\u2019s not magic!\u003C\/p\u003E\u003Csvg xmlns=\u0022http:\/\/www.w3.org\/2000\/svg\u0022 style=\u0022display: none;\u0022\u003E\u003C\/svg\u003E","tags":["autoconfiguration","autowiring","config","container","dependency injection","php","service","symfony"],"hasMore":true,"image":null,"introLite":"\u003Cp\u003EWhen I first heard the term \u201cAutowiring\u201d, I thought it sounds exciting. But when I learned more or less what is it about, I got pretty sceptical of the idea. Too much \u003Cem\u003Emagic\u003C\/em\u003E, too much implied information... However, when I finally used it for the first time... Gosh I wish I could never define services manually again!\u003C\/p\u003E","contentLite":"\u003Cp\u003EWhen I first heard the term \u201cAutowiring\u201d, I thought it sounds exciting. But when I learned more or less what is it about, I got pretty sceptical of the idea. Too much \u003Cem\u003Emagic\u003C\/em\u003E, too much implied information... However, when I finally used it for the first time... Gosh I wish I could never define services manually again!\u003C\/p\u003E\n\u003Cp\u003E\u003Ca href=\u0022https:\/\/en.wikipedia.org\/wiki\/Dependency_injection\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E Dependency Injection Container\u003C\/a\u003E is definitely my favourite design pattern \u2013 so elegant, simple and flexible!\u003C\/p\u003E\n\u003Cp\u003EIt comes with one inconvenience though: you basically need to code the same thing twice. If your service requires some dependency, it cannot just \u003Cem\u003Etake\u003C\/em\u003E it or just \u003Cem\u003Ecreate\u003C\/em\u003E it. Instead, it should \u003Cem\u003Eexpect\u003C\/em\u003E its dependencies, while the container \u003Cem\u003Eprovides\u003C\/em\u003E them from the outside. When you want to add a new dependency, you need to both add it in the class and in some external service definition. This doesn\u2019t look like much effort, but when you\u2019re intensively playing around with your services, it all adds up. I didn\u2019t even realise, how annoying that process is, until I no longer had to follow it.\u003C\/p\u003E\n\u003Cp\u003EWhen I started a fresh project recently, using the latest version of \u003Ca href=\u0022https:\/\/symfony.com\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E Symfony\u003C\/a\u003E after over a year of working almost exclusively with \u003Ca href=\u0022https:\/\/phalconphp.com\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E Phalcon\u003C\/a\u003E and \u003Ca href=\u0022https:\/\/micrus.avris.it\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E Micrus\u003C\/a\u003E, I had already forgotten about those two new features of Symfony: autowiring and autoconfiguration. I remembered by accident.\u003C\/p\u003E\n\u003Cp\u003EI needed a \u003Ca href=\u0022https:\/\/symfony.com\/doc\/current\/templating\/twig_extension.html\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E Twig extension\u003C\/a\u003E, so I quickly created one: simple class, extending \u003Ccode\u003E\\Twig_Extension\u003C\/code\u003E, expecting some other service in its constructor, providing some filter in \u003Ccode\u003EgetFilters()\u003C\/code\u003E. I refreshed the tab in the browser and immediately realised I\u2019m gonna see an exception \u2013 in the end, I forgot to tag this class as a \u003Ccode\u003Etwig.extension\u003C\/code\u003E, I forgot to provide the dependencies, it has to fail! But no, \u003Cstrong\u003Eit just worked\u003C\/strong\u003E!\u003C\/p\u003E\n\u003Cp\u003EThe idea behind \u003Cstrong\u003Eautowiring\u003C\/strong\u003E is pretty simple: if a service requires an instance of \u003Ccode\u003EAppBundle\\Api\\CmsService\u003C\/code\u003E, and your DI container happens to have a service called \u003Ccode\u003EAppBundle\\Api\\CmsService\u003C\/code\u003E, which is of type \u003Ccode\u003EAppBundle\\Api\\CmsService\u003C\/code\u003E, then it\u2019s pretty safe to assume, that\u2019s the one you want.\u003C\/p\u003E\n\u003Cp\u003EIdeally, you should depend on abstractions, interfaces. For instance when you have multiple cache adapters, all implementing \u003Ccode\u003EPsr\\Cache\\CacheItemPoolInterface\u003C\/code\u003E, your services should depend on \u003Ccode\u003EPsr\\Cache\\CacheItemPoolInterface\u003C\/code\u003E, not on any specific implementation. This way you can always switch for instance from \u003Ccode\u003EFilesystemAdapter\u003C\/code\u003E to \u003Ccode\u003ERedisAdapter\u003C\/code\u003E without any trouble.\u003C\/p\u003E\n\u003Cp\u003EBut if you have more than one implementation of an interface, how does the autowired container know, which one to use? You tell it, by creating an alias:\u003C\/p\u003E\n\u003Cpre\u003E\u003Ccode class=\u0022language-yaml\u0022\u003EPsr\\Cache\\CacheItemPoolInterface: \u0027@Symfony\\Component\\Cache\\Adapter\u0027\u003C\/code\u003E\u003C\/pre\u003E\n\u003Cp\u003EAnd what about the scalars and arrays? If my service expects \u003Ccode\u003Estring $baseUrl\u003C\/code\u003E, how does the container know \u003Cem\u003Ethat\u003C\/em\u003E? Of course it doesn\u2019t, I need to specify it myself:\u003C\/p\u003E\n\u003Cpre\u003E\u003Ccode class=\u0022language-yaml\u0022\u003EAppBundle\\Service\\ExternalSerive:\n    arguments:\n        $baseUsr: \u0027https:\/\/api.external.org\/\u0027\u003C\/code\u003E\u003C\/pre\u003E\n\u003Cp\u003EYou can do the same thing for services as well. For instance when all of them should use some generic logger, except for one, which requires something more specific, just overwrite its \u003Ccode\u003Earguments.$logger\u003C\/code\u003E with the other one.\u003C\/p\u003E\n\u003Cp\u003EPretty simple, right? The idea behind \u003Cstrong\u003Eautoconfiguration\u003C\/strong\u003E is even simpler. You (or libraries, like Twig) can define that all the services which are an instance of \u003Ccode\u003EFoo\u003C\/code\u003E should automatically receive some specific config, for instance a tag. That\u2019s why I didn\u2019t have to register my Twig extension.\u003C\/p\u003E\n\u003Cp\u003EMain concern one might have about autowiring is that, although pretty simple, it sure is time-consuming. Should I sacrifice my website\u2019s performance for the developer\u2019s convenience? Of course not! Symfony\u2019s container is compiled, so autowiring has absolutely no overhead on production!\u003C\/p\u003E\n\u003Cp\u003EAlso, Symfony Container has a concept of public and private services. Public ones you can just fetch from the container wherever you wish. Private ones can only be injected into other services \u2013 if they aren\u2019t used, they get removed from the container completely.\u003C\/p\u003E\n\u003Cp\u003EAutowiring is amazing. Simple, but effective. It makes the development faster, especially in the early phase. It prevents you from repeating yourself and maintaining a lengthy \u003Ccode\u003Eservices.yml\u003C\/code\u003E file full of information noise. And, although magical, it\u2019s not magic!\u003C\/p\u003E","words":680,"readTime":3,"lang":"en"}}}}}