OK. Thanks, Michael, for the introduction. And hello, everyone. I am Nilesh. And I'm here to talk about the newly added feature called Create Volto App, or you could say Volto Ads Library also. So before that, first of all,

I would like to thank to the community for giving me this opportunity to present my talk here. So as this was, this is my first international talk. So yeah. Thank you, Plone Foundation. And OK, hello. So I've been working into Google Summer of Quotes

this year with Plone Foundation. And it all started with Breeze, actually. Yeah. So it went well. So why I have chosen React?

Because React has a very good ecosystem, of course. And we have many benefits of using React as a front end. It has a simpler declarative model.

So we can just reuse the components. And of course, it's easy to learn and implement. And it has the great developer tools. And of course, the ecosystem is nicer, actually. So OK, React is OK. Everyone know React? What is React? But this is a big concept coming out of Plone React or Volto.

So it was before called as Plone React. Now it's named as Volto. It's same, but names are different. But now it's called Volto. So everyone knows that many talks have completed. So it's a React-based front end, which comes fully with the power of Plone REST API.

So these are the key features of Volto. It uses the semantic theme, a newly designed semantic theme called Pasternaga. And it's incredibly fast, of course. Now I'll come to that later. And of course, the no configuration needed,

that is actually the command line which I have developed. So this is the photo. OK, the problem, I'll discuss the problem that was early is we are having Volto before also, Plone React before also. But it doesn't act like a library.

OK, so right now, we are having a library as a library. But before, it doesn't act like a library. So we were having this file structure of the Volto before. So what the user have to do is they just have to clone that Volto repo. And they have that structure, that very big code

structure, which they do not have to deal with necessary. So this is the code structure before. So these are the complications which we were having before. A complex directory structure, we need to clone the configuration that is main

and that the compilation time also. These are actually for persons which are having not good configuration laptops, maybe like me. So the compilation times are very more. And it takes also the bundle sizes are also more.

So I think we need some help. So we have just decided to make it as a library so that people can just import features from them into their boilerplate. And they can just override the components. I'll come to that. So of course, we need to do something.

So we just introduced a new feature in Volto that we will create a Volto as a library. So we have decided, yeah, we can build it as a feature. We can create either a dependency to other boilerplate that we really want to use.

So we create as a package. So what are the benefits that we'll get as a library that, OK, all of the work should be done in one command only. So we have a command, CLI. So we can do in one command only.

And it initializes the boilerplate. It gives us all the directory structure what we want. And we just do yarn, start, and just we are having our development server running. And we are calling the code directly from Volto library. What we are doing is just import dash dash everything

from at the right, plon, plon, react, that library. So decreased, yeah, compilation times are also decreased. And the big thing is we are able to override the components. And I think that already Rob has given training how to override this. So we are having the customization folder. And we have to match the directory

as the same Volto has for the overriding the components. And so this was my story, actually. When I started, I didn't know how to start, actually, how to manage these, how to make something as a library.

So at the time, there was no show method. So I contacted. They just initialized. And this is started. They just give me the directions. Oh, we have to do this and all. And this is a feature list which are to be implemented in making it as a library and a CLI tool.

So first, we have to implement the scripts that we need to start the server. We have the production build. And the internationalization scripts. The boilerplate code are the code which we have as our output. So that is output code. I'll show you. And the Skyfold tool, of course, the CLI.

So this is the CLI create-volto app. So it's available as NPM package. So we just install NPM, install global create-volto app, and then use it by create-volto app, anything, any app name. You should follow the NPM conventions.

OK, so the code structure, if I show. So this is the internal code structure of a CLI that create-volto app. And how do it start?

By means, this is the binary directory. So we just type here create-volto app. So this will call that bin create-volto script file. So we can have any name here, which is what we want. And in that bin file, we just start whatever we want to do, that we require these.

And we require create-volto app packages. We just install packages there. So these are the packages that are all defined in utilities folder. So we just install packages there. These are the installation of packages

and install the messages, all the messages which we are having. So these are the code files. And after that, so let me show you the demo of it,

how create-volto app works. So we just type create-volto app.

Create, any app name you want, let's say, or anyway.

It does actually creating an app, CLI, and installing that clone-volto as a library. So installing, it copies all the boilerplate to your repo

and installing it at finish, just in no time.

So this is the ready directory after creating a Volto app. So we are having these. These are the scripts we are having if we just use Yarn start for making our development server running. We have a build script to build our files in static.

And we have test files to create a test in just DOM environment. And we also have a start production script that will start our server in production. And we have the internalization scripts also. So if we check every folder in it,

then it is actually, these are the locales in it, that internationalization locales. And these are the public files. And these are the source files, actually. These are the main components in which we are calling everything from the main clone reactor. So for example, if we have client, so this is the,

we are calling this from our library, clone-volto library. So this is the, we are importing client and we are calling them from that library only. So we'll see that in the main library, we are having the main library.

There we are calling from that boilerplate.

We are calling everything from that starter. So we don't need to copy all of this to our boilerplate, as it is a development file. So it is always needed in development mode. So the user doesn't need it. So we are simply calling it from the library only. So that is actually the value of a create-volto app

or making anything as a library that we are not dealing with any unused code, you know, that code. So that is a main advantage. So demo I have given already.

Let me start this over for you. So this is the app. If I use Yarn start, we just start the server with the development mode. Yarn start.

So it's now starting the server directly in the development mode. So we do not need to, you know, it's so fast, actually. You look at it, it's so fast. It's like, you know, it works like a charm. And before, we had a developer, Webpack server, Webpack development server, which also works,

but it takes a little more time than this. So that started the server, and we just have it on localhost, our own. So we just have start the server, and we are having our Volto running.

So we just log in, and we can use it. Back in, it not start. And I would like to thank my mentors, Victor, Rob,

and Timo for giving me this opportunity to finish this. Victor has, so Victor has helped me to, you know, initialize the things, and started that Volto project, and Rob has helped me to, you know,

in the middle summer, that for starting that scripts parts and all the boilerplate part, and Timo has also helped me to make my proposal, made my proposal, yeah. So any questions, thank you.

Any?