We're sorry but this page doesn't work properly without JavaScript enabled. Please enable it to continue.
Feedback

A Volto story: building a website by prototyping

00:00

Formale Metadaten

Titel
A Volto story: building a website by prototyping
Serientitel
Anzahl der Teile
50
Autor
Lizenz
CC-Namensnennung 3.0 Deutschland:
Sie dürfen das Werk bzw. den Inhalt zu jedem legalen Zweck nutzen, verändern und in unveränderter oder veränderter Form vervielfältigen, verbreiten und öffentlich zugänglich machen, sofern Sie den Namen des Autors/Rechteinhabers in der von ihm festgelegten Weise nennen.
Identifikatoren
Herausgeber
Erscheinungsjahr
Sprache
Produktionsjahr2019

Inhaltliche Metadaten

Fachgebiet
Genre
Abstract
I'll tell my experience building a website on Volto using create-volto-app creating a site theme and some tiles. We'll discover the whole development process I followed and the patterns I found very convenient for developers and PMs. We'll also see what the user can expect in editing.
EbeneExpertensystemPunktwolkeBeschreibungskomplexitätSystemprogrammierungFormation <Mathematik>Spannungsmessung <Mechanik>Projektive EbeneJSONXMLComputeranimationBesprechung/Interview
SoftwareentwicklerEbeneGebäude <Mathematik>Content ManagementSchätzungWeb SiteRahmenproblemComputersicherheitDatenverwaltungQuellcodeDämpfungInhalt <Mathematik>SoftwareentwicklerCodep-BlockErwartungswertGüte der AnpassungTexteditorMereologieBestimmtheitsmaßVersionsverwaltungVerschlingungKartesische KoordinatenTropfenBitJensen-MaßWeb SiteComputersicherheitMultiplikationsoperatorAuswahlaxiomTurnier <Mathematik>HochdruckSystemaufrufProjektive EbeneInterface <Schaltung>Prozess <Informatik>DatenverwaltungRahmenproblemKlon <Mathematik>RechenschieberXMLComputeranimation
Gebäude <Mathematik>EbeneGesetz <Mathematik>ProgrammiergerätWechselseitige InformationContent ManagementDatenverwaltungComputersicherheitProzess <Informatik>PrototypingIterationGraphfärbungVariableGreen-FunktionVerschlingungCanadian Mathematical SocietyTexteditorInhalt <Mathematik>p-BlockTesselationFormale SemantikWellenpaketMultiplikationsoperatorFormation <Mathematik>MereologieRückkopplungWeb-SeiteWeb SiteProzess <Informatik>PunktGesetz <Mathematik>DatenverwaltungKonfigurationsraumSoftwareentwicklerBestimmtheitsmaßIterationComputersicherheitDatenfeldVersionsverwaltungRahmenproblemPaarvergleichBildverstehenBildgebendes VerfahrenComputerspielInterface <Schaltung>MAPCASE <Informatik>Elektronische PublikationInformationsspeicherungXML
Prozess <Informatik>VerschlingungTexteditorStichprobenumfangFormale SemantikJensen-MaßBenutzerbeteiligungp-BlockVersionsverwaltungBildgebendes VerfahrenDefaultPrototypingProjektive EbeneDigitale PhotographieWinkelAggregatzustandRadikal <Mathematik>FunktionalElektronischer ProgrammführerBestimmtheitsmaßImplementierungVariableSoftwareentwicklerElektronische PublikationWeb SiteCodeBitSpannungsmessung <Mechanik>Besprechung/Interview
Web SiteTaskp-BlockHilfesystemSoftwareentwicklerRechter WinkelElectronic GovernmentGarbentheorieBestimmtheitsmaßGüte der AnpassungWellenpaketKonfigurationsraumProdukt <Mathematik>MultiplikationsoperatorElektronische PublikationZentrische StreckungTermPerfekte GruppeProfil <Aerodynamik>Mobiles InternetMetropolitan area networkPunktAuswahlaxiomVersionsverwaltungProjektive EbenePerspektiveAutomatische HandlungsplanungIntranetTropfenWasserdampftafelQuaderGrenzschichtablösungProzess <Informatik>TOEFehlermeldungBesprechung/Interview
BeschreibungskomplexitätSystemprogrammierungAbstraktionsebeneVideokonferenzFormation <Mathematik>JSONXMLComputeranimation
Transkript: Englisch(automatisch erzeugt)
thank you so hello everybody thanks to be here tomorrow that is morning today
I'm gonna talk about Volto because I had a little project and I want to try Volto on a real project so I am this person but you know it yeah and I have
also a pint a ball Python so yeah I am Python developer with a Python yeah okay my story is a really common story because I am a front-end developer but
it is applyable to any developer and I had a side project no time do you know this story so I had several opportunities I had a static website but it wasn't
viable because I had editors to manage contents so it was not very regular website but the teaming was even a small 10 this was a really big for me
because I had no time really it was like a okay I I have to do it in a night or two or three night and it's more so I know there is a tournament like WordPress yeah but you know I'm here so I want I don't I don't want to
use that so let's try Volto yeah so my talk is gonna be on the choices I
made and about my experience trying it person comes about it the opportunity to try new stuff because we want we all want to try new stuff Volto is an interesting project I look into this print but I never had the opportunity to
try in a real project and because I have I had a small website to create it was the opportunity to try because it's a small website it has a cool UI rack
base so it's funny to develop the interface the whole team created is nice for users it is continually updating which is a really nice stuff
because when you create a project and you don't have the time to maintaining it the idea you have the opportunity to update it and have new features and stuff it was comfortable for me and it uses Plona CMS behind which I love and
there are cons to because I had no experience with building a website on it and so I had no time but I have to invest some time of my night
developing nights to try and learn how to build a new site with it and no clear idea on estimating because I had no time and I had to invest that time in the code and try it because so I had no clear idea on when I will
finish and yeah I hadn't in my mind I would like to talk about this in this conference and I'm doing it but the website I finished like a week ago in
my mind I would have like the link on the on this slide and ha it is published no it is so it is continually updating that is a cons to because it is changing and the first version is next to be released I guess I hope it is
good and so you have to maintain your application because it is changing a bit like I had I tried with your create wall top and using the alpha version something was broken I don't know why so I'm using currently using the
three version so it is cons but it's not a lot negative you have to know it is too maintainable and the docs I know I have the whole team here and so
sorry guys but the docs are missing it is a community issue not yours yeah there are docs but not complete and for blocks for example I had some trouble and I had to try to code again and again or inspecting the source code
of Volto so what what what were the expectation of the project simple a small website nothing nothing complex I I wouldn't have problems in design or
content about strange behavior about content no nothing documents and news nothing more no you ever famous so I decided to start with but the naga it
is a cool UI and good base so I wanted to create a design Anita adapting the blocks and other stuff so really a lean process and I wanted
user management from clone and its security which is a nice plus so the start and it picks great wall top and it's done almost I had worked in website I was using Docker behind to try the teaming part of development and so
yeah that's working I had a website next I was alone in my project and the only developer on it and I had only the editors who were busy to create
contents so which development process I could follow the the path I followed is that from plain Volto website from scratch I I created access for for
editors and I teach them to create basic contents so they started to to create stuff documents news they played around with blocks and they
were starting figuring out what the what they expected from the website from the design so from contents editor was trying the UI the interfaces and the blocks that were available and the teaming I wanted to start from from the
contents itself because when you create a design it's often you carry stuff for I don't know that part that the user maybe can can use in the
site but in this case it was really controlled because few contents and I am in the team that is creating contents so I was to focus on what the what the what what was there really needed yeah we had some content
some pages and other stuff I customized the logo that is a bad version at the store got see what they can do with Volto and and we discussed the design and the layout of the the pages and other stuff it is a
really good approach because when you talk about layout with with editors which didn't style studied nothing about the design or something it is not easy to explain what you are doing or what you expect you can write it down
using a live website and and say okay you can do this and customize this part in on these ways they had a clear vision of what they can expect from the
website so it's starting time yeah what about this Volto uses semantic I hope you follow the trainings or the Robert talked about yesterday so with
pasta Naga and semantic UI underlying you can create a site team which is compiled by custom variables and custom pieces of style sheet so one common
approach is to ignore the variables because they are like that it's a plenty of variables so many people I heard they they ignore it add custom
side sheets but I wanted to try the new don't do it and yeah there are very quite a lot of variables I created a file with which added the basic
semantic UI variables from Grobbles and I took the variables from Boston Aga so I added the full stack of variables okay I customized the colors and other stuff it was like this okay it is pasta Naga yeah but I have the
links in green okay so the editors were starting to see colors and other stuff I was customizing at okay yeah it's we're going in that way cool so
the custom styles for blocks and other content after that we discussed on the the real design of the website so the custom blocks if needed yeah it
is not correct I add a new tile with an image background and the title the main title the content but it's simple you know I like the image tile block sorry again that it after this I I want to add other blocks and other
custom styles from inline stuff or other things and the website is now
ready but not published yet I'm sorry so concludes in my conclusions I want to summarize my thought nice dev experience because we react developers can enjoy developing and it is funny life reload under stuff we are super
handy and semantic UI teaming is well quite comfy pasta Naga semantic it use a good base from starting and design and the teaming engine engine I
started appreciated because it is complex in the first time you see it because what because at the variables and the three levels so timing but it is a good way to do it that the teaming editors UX from my pillows
from the contents it is very nice and people are super happy and they see cool things while they creating it the UI is cool so it's really super happy they had some experience with other CMS or websites they're created and in
the comparison they're really really happy good point underlying Iowa I had pronounced a mess with users management and permissions and security which is a part I really considered and I happy with it and last
part is I tried to deploy it and the doctor were not in like the first page yeah but there is there are dogs about it and pm2 is really a cool
package I never tried before but it's really cool and works fine but the configuration is done in the doctor and I launched it and yeah so by
conclusion the process I followed is by prototyping because I showed a new block or the new stuff on the team part I had some feedback from my users from my editors I went by iterations on it it is really really lean and in the
conclusion I had like a week of work about only during the night it is a good but I'm happy I didn't waste time so do we have any questions
okay it's good to see I also look at the last month's like oh maybe I've
got some small website where I can try things one thing that that was when I looking through all the photo stuff if one basic functionality I missed there okay let's wait a while I'll have to look into it is when you add images you can only upload them I think in photo 3 and you cannot link to existing web
images already in the website yeah did your editors also notice that did you have a small workaround until I mean it was going to be solved in photo 4 but did you get small things like that like oh there's something not there and I'll have a quick workaround in the prototype oh well I didn't work on the
default code for this project I I only I only say to my editors do this and this and do not do that because yeah in the link process I had to on future
development surely world will be more stable and there are a lot of feature pending from reviews or finish in the work so what I can say is that
although is you know user-friendly for sure if you have any suggestion open an issue after that in my experience it had not a bit that the thing about me
which is for example the other son the editors didn't notice that so it was not a problem okay I tried to sample up making sample up before half years ago
so I can't find you I my question is how to how to find a body of the customer at seeming customized I can't find you a sample for example the
storybooks or something is so I can't I can't find the example for the customized for the seeming yeah the base teaming engine examples are in
semantic UI documentation and first of all you have the docs about the react implementation of it in volt docs I don't remember if there is something
about it but for sure you can try you can find the the team folder in which there are the team is available and in there you can expect the variables because there is a file named variables first I want to say sorry
for the sorry state of the documentation but going to improve and we are going to stress that out during the sprints and if there's anybody that
is interested and also in helping we are out of hands I mean we're short on hands and and we are happy to have it regarding something what you mentioned about the how to upgrade to pull to four we are maintaining an upgrade guide in the documentation it's perfect the same that way that we are doing in
API so if you really want to try out alpha and I both of four alpha nine which is the latest release version go there and and you'll see all these steps that you should follow to migrate your existing go to both okay perfect thank you any other questions if you could name like three things
that you would like to see from like your your experience like being documented what would that be
there are really few few documentation about blocks for example the first thing anything like can you name three oh yeah I was think about it so the blocks
I don't know that because I am to the development deployment work the climate is a good thing we can we have it but we should move it in on the door and the data dogs and many people already many people are asking me yeah
it's cool it is a cool project and it's working fine but how I can how can I grow the website and a project like a big project and would be quite website
with several section in blown with development really big solutions many people can see how to do it with Volto I don't have the answer now because I
didn't write you probably have the answer because I know you did it so probably some example in the documentation could be the way to do
so yeah regarding scaling I don't see any problem at all to be honest and we have like to realize projects right now going on one like one intranet like solution for like up to 10,000 users and another like really high profile government website and I I don't expect we will like have to deliver
that by the end of the year and I don't expect anything like to happen in terms of scaling because so far like scaling went really well with with Volto right and regarding the other like two points for the deployment did you saw like the crappy like poor man's version for the pm2 that I uploaded
like two weeks ago did you use that or I guess not okay yeah there's something and if anybody like wants to like pick up that at the sprint that would be great because like we're I basically shared like just the the
nginx and Apache configuration that we use and the pm2 config file that's it right but without like much explanations so if anybody wants to like polish that that would be great all the things that we need are there and we are using that in production and regarding the blocks we have
documentation now for that already how to do that and like one of like we tried that out with our two interns last week actually and we like gave them the task to create blocks on their own without like help from me or Victor or anybody else and they succeeded like within like I don't know
like an hour or so they like they came back to me and say yeah we're done with our block and I was like what yeah so we are getting there but like especially like if you're new to Volto like please come to the sprint and help us like documenting those things because we're already knee-deep into Volto right and we don't see like we don't have a good perspective on new
things and how to explain that right like everybody here in the room can do way better drop documenting this stuff and we have everything here and we are happy to share everything that we have but we have to definitely improve the documentation right yeah really important so greetings people so stay tuned about the docs of mobile about Volto and my person cons just changed
so I they have removed two cons perfect useful to yeah the goods the goods choice okay what's it to be more specific how to build blocks now it's documented in the in the trainer that I gave so it hands-on training
that documentation should go also into the main Volto documentation so one of the tasks that is to be done and I plan to do it during this plane is to transfer those documentation okay that's what you wrote down yes how to do blocks in both of four oh nice I think we have time for one last
question hi good morning I will be very quick as more a question to the Volto team I have a wish also another wish maybe is possible to convince
customers to apply Volto and to go with it maybe to add references to project that are running so still we have not so much but all what we have somewhere on the docks or whatever I think will be a good start also for
Volto to use thank you we're out of time I'm sorry you'll have to pick it up later but thank you very much Nicola thank you