 Yeah, so I'm working with Drupal since 2011 and it's been around for 10 years that I did lots of Drupal projects and this is kind of my first presentation in Drupal Meetups and all. I've done lots of Meetups in India and also Drupal in Asia, I was part of that. Recently I figured out something about the static site and I had a thought that we might look into that, so I'm happy to present on that. I'm starting my screen share first, let me know. Okay, so today I'll be discussing about the static sites in terms of landscape with Drupal only because I'm a Drupal guy and I love to do with the Drupal but sometimes it happens that we need the static sites and we still want to use the Drupal as in it's easy to manage and things and all. So let's start with the Drupal static site. So today's agenda, like it's a small presentation only, it will take around 10 to 15 minutes and this is what I'm going to discuss in this presentation and first thing what is static site generators. Then we'll talk about the benefits, limitation, what we can do, what we cannot do, then there are a couple of options available as in static site generator, I'll let you know about the few of them. Then we will going to discuss the Tom that is Drupal static site generator that is absolutely created for Drupal only and we'll see to the architecture module and I'll also show you how to create, show you how to create a static site using Tom on local and how to post on Netlify and all. There are some work around for the if you use the static site, you cannot use your form and search. So there are some work around that can be possible with the static site as well. So I'll also show you those things. Okay, so first thing I would like to say this what is static site generator. Before that, everyone know what exactly the static site, static site is just an stml, there's nothing, no server, no backend, no language, nothing specific, just a simple stml. Go to create an file with the dot stml extension and it will work on server without any backend language. So, in initial era, we normally have the static site using the simple code with the stml CSS, then we used to have a JS. There are lots of framework right now. They have only JS. So you can create multiple kind of site using those framework. But again, for the static site generator, it will give you the same exact kind of site with the stml CSS and JS. There's no need to run on any language. It's not a language dependent. So you don't need to worry about any Java, .NET, PHP, nothing else, just a simple files. It can be served from any server or any CDN specific, you can say. So, there are popular options available. These are Jackal, Gatsby, Quonsilium, Tom. So Jackal is based on Ruby. It's a liquid templating engine they are using. So, in terms of Jackal, you need to understand what exactly how to create the project on Ruby and how to use the liquid templating. Gatsby also a React platform. And Gatsby also provide, like you can also use these things with Drupal as well with the liquid templating and all. There are modules available. So you can also create your site using the Gatsby and Drupal as a backend as a JSON provider. And on top of that, you can create your static site using Gatsby. There are a couple of GitHub wrapper, you can look into that. Again, the third option, Quonsilium, it is quite a good option right now because if you have a site and you just want to provide a static site and using the Quonsilium, you can export the site as in production already. And it will, in a Drupal as a backend, you can push any content changes onto the Quonsilium, it will automatically appear on your production site. And the final one on my list is Tom, that I will discuss more in a detail. So Tom is also a Drupal specific model. It's only worked with Drupal. It's Drupal 8 module is available. So any Drupal site, if you want to create a static site using that, you can use Tom on top of Drupal. So let's talk about the benefits and the limitations about static sites. The first thing, it's very simple. If you don't need to have any PHP or MySQL, no server-side requirements, you can host it anywhere. And in GitHub pages, Netlify, no need for the caching mechanism. There are only a steamer file and most of the hosting provider automatically compresses those steamer files, so you don't need to worry about the caching, burnage, map gas, anything at all. So it's quite faster, no backend processing at server end, so all the files and you can also use the CDN to multiple places and it will just quite faster than the other CMS, you can say. Safer, in terms of security update and all, we can see there are lots of security updates coming every second we call. Anytime you can see there are lots of security updates coming on and if you are using any CMS or in your site, you definitely need to update all the codes so that every time you need to redeploy the production with a security update. No database required, no database optimization, nothing else, so you don't need to worry about those things as well. Let's talk about the some limitations. So the limitations, there are no user-related stuff. Everything is same for everyone, no authenticated user, nothing to log in actually. So if you need a simple static site, if you still want to use anything, any CMS or something like that, you can use multiple options to create static site and that will work for you. There are no forms in HTML, without any backend server configuration, you can't actually submit the form, but there are workarounds, we'll discuss more detail. And the final limitation is every change requires a deployment. If you want to change any content in the HTML, you definitely need to redeploy. So if you are talking about any CMS and all, you just need to log in and update or edit any content and it will work. But in case of a static site, every time you just need to redeploy stuff on the server. Okay, so with the static site, these are the benefit limitation we have. So still, if I'm going to create a static site and I really want to use Drupal, so as I mentioned, there are multiple options on top of Drupal that you can use, but I'm a Drupal guy, so I really love to use Drupal as a CMS for my backend so I can easily create content, I can easily create theme. And Drupal admin UI is quite helpful for me, so I can easily manage all the stuff with the Drupal. So let's suppose if we need to create a new site with the Drupal and we want a static site to be deployed on a production server, we can use Drupal plus Tom. So next step, I'll just provide you how to create a basic Tom application on a local host, then you can export the static content and just deploy on a production site. That will look as simple as that. So what exactly Tom? Tom is a static site generator, it will just a Drupal module that will work on a Drupal only. It just create a, just export all the content using the JSON and all, and whenever you want to create or update any content, you just need to run your local host again, login to Drupal, and it create, export the static content. And again, deploy to the production as simple as that. So as I already discussed these parts, like how exactly Tom will work, there are very quite good documentation available that if you want to use Tom, how exactly you can do that. So there are simple architecture of Tom, there's a multiple modules in Tom architecture, Tom static to create static site generation, Tom sync to generate the content and config automatically sync on the site. And Tom Netlify is a module available if you want to use Netlify as your hosting platform. You can use Tom with the Netlify and there's a web hook available. So whenever you push any content on your repo, it will automatically deploy with the GitHub web book to Netlify and the production site is automatically get updated. So I can show you the simple demo how you start with the Tom. So it's quite simple. These are the basic steps that I'm going to follow. So let's start with the demo itself. So this is my terminal. You can see my terminal, right? Yep. Yes. Okay. So let's start with a simple site with the Tom. So I'm just, there's a composer based installation available so you can directly install any Tom project with the Tom installed. So I start with one, I'm creating the project. It's a simple step using the composer. You can just create a project and it just install all the dependency required for the Tom and it's ready to go. So this project is created as a static site. I can show you that these are the simple files in the project itself. Next step is just install all the dependency using the composer install. Just take a minute. It's happening. I just want to know that I came across this particular stuff when I was working on a site and that is for department of like DFAT. I'm not sure the department name, but yeah, they want some static site and I want to create a static site. But I don't want to use the normal SDML and bootstrap initially. So I was looking at the option that how easily I can create a static site. So I came across these multiple options. Actually, I didn't use that, but yeah, still it's good. I can provide some glimpse that it's really easy to create a static site using this. So next step is just to install and initialize this Tom. This is simple dash command you can see. So when you do the Tom in it, it will provide you with installation profile you want to use. You can see the demo, minimal, standard, any profile you can use. Let's start with the standard first and then I'll show you the umami as well. DFAT was department of foreign affairs and trade. So the Tom initialized and now what we just need to do is just to run the server. So you can see your site is running. I'll come to this install. Your site is up and running using the Tom and you can see this is the server is running in the back end. Let's log in into Drupal first. So this is our Drupal site. And if I want to create a basic page, I can go to this and let's add a basic page to content. I can also provide any URL lilies. So this is how we normally do in a Drupal. Now I'm just creating static site using the Tom. When you run this command, it will generate the static site. And you can also preview using the command static Tom preview. And the site will available on this browser. So this is the estimate site running on your end. And this is the Drupal. When I change anything on this particular page, it will only apply on a static site when you export it again. So this is our basic page. You can see I'm going and updating this again. Drupal is updated. Still you can see the static site have the previous information available. Let's go and again, I'm going to build this. Static, it's running. You can see the static site is automatically updated with this. So as per the file structure, I can also show you how exactly the file structure will look like if you talk about the Tom. So in the Tom file structure, you can see this estimate. This is your exported production ready site. So you just need to copy this STML folder and upload it to your server. And it will serve as a normal STML site as simple as that. So in the particular, when you export it, you can also provide URI option. So the base URL for this particular site would be set as a production site. So whenever you export the content, just use the URI option along with the Drupal Thrust Tom static. And that particular URL will be your base URL for your site. So this is how Tom will work to create the static site on your local host. Now come again, let's talk about how you can upload or use the Netlify as a different hosting option. So this is how we do the basic setup using Tom. Now I'll come to the Netlify. There are good documentation available for the Netlify. If you go to the Tom.fi docs, there's a very good documentation available for everything. So this is the base. So it also provides you the link how to deploy. So you just click on that and Netlify will open. It will ask you for the GitHub or any other way to log in and you can create a site or deploy the site on a Netlify template. I'm just connecting to GitHub. I'm just creating a new site in a Netlify. As you can see, when you go to the Netlify, get your site in one minute ready. So this is how it will work. It really won't take more than one minute. So now your site is starting the build. The build is started on a Netlify. It will also provide you GitHub repository. If you click on this, the GitHub repository is available. Once this building is complete, you will see all the files available in your GitHub repo. So just look for the deployment. Once the deployment complete, you will see a domain from the Netlify. You can also set up your custom domain. Does Netlify mean that you don't have to do everything via the terminal like you showed us before? This is Netlify. They provide a template that you can use with the Tom integration. So you just need to deploy on Netlify. It will provide you GitHub repo automatically. So once the deployment complete, you will see all the files available. And then what we will do, we will again go into the terminal, clone the repo, start our server and all the configuration. Everything is automatically synced to Netlify. When we push to any new content changes we want to do, we will do that. I'll just show you in a minute how exactly we will do. Saying it's published, this is the application that you can see. Welcome to the site install. It's on Netlify app. If I go to this repository, everything is available here. Let's go clone this site. This is the master branch and you can see there are a readme file available that how exactly you need to start the process. So once you are on a local, after the repo, you have the repository on your local. Just go there and run this command. When you run this command, it will install the same site on your local as well. And if you want to change any content, add any content you can do using the Drupal UI and it will automatically export it and it will be available to push into your branch. So installation is complete. I'm running the server. So now this site is started on the local environment. So the same site that we have on our Netlify app, the same site is available here. So if I go to the next tab and log into Drupal. I'm just making a small change right now in the basic site settings. You can see I'll come to the site, install updated. If I go to here and get status, you can see this configuration is automatically available and it's modified. If I go and add this to my repo, I'm pushing this to the branch. And now let's take a look into this. Once I push to master branch, master branch is for the production on a Netlify. So you can see this commit is available here and it started building the site. Once this build is complete, we will see the updated site here. This is similar for the content as well. If I want to create a new content on the basic page and now see the status. You can see it's automatically exported these new content and path layers as a JSON file. Now I can push these and data into my GitHub and that will automatically available in Netlify application. So it's building right now. I think it should be published. If you check this, you can see this is the updated content. So again, I'm pushing a new content inside this. This is as simple as that. Whenever you push anything, it will deploy on the site. So you can see the next thing is added basic page. Now it's building and then we will have a basic page one available. Once deployed, it's done. Still it's not found because the site is still building. Meanwhile, I can also show you one demo that I created for a Yamami theme. I also started with like there's one more option, installation profile along with the Drupal. So I created this Yamami theme with the Tom and you can say this is working. This is Drupal version. If I go to my terminal and export it again as a static site. So this is our static site I created using the Yamami theme. So you can see all the language everything is available in a static site as well. So multi-level is only used by these folder name. When you have the HTML site, you normally have the folders inside that you have a different HTML file. So similar to that, it exported in the same way. So using the URL, you will see these multi-level features available. Everything is working in the same way what we have in a Drupal. The only limitation is we can't use the login and contact form. You can't actually fill that and it won't work actually. So for these particular, we do have some work around. I'll show you. Let's see what happened to this page. You can see now we have this basic days available in our Netlify app. So this is as simple as that. You can easily push and create your content anytime on your local and just post it to Netlify. Or you can export as a static site and deploy to any production server as you need. This is kind of an architecture you can see. I already showed you in the demo how exactly this is working with the Netlify. Let's talk about more limitation in terms of a Drupal. In terms of a Drupal, these are the supported features you can see. There are like Alias, Redirect, Metatux, those are already working. Responsive images, layout builder, everything whatever we have as a Drupal. Those are still working with the static site as well. Limitations, we discuss about these are for anonymous user only. No forms, no search and search API. Multilingual can only be by path and domain. If you are going to export a static site or create a static type, you just need to use folder structure to make the multilingual. There are a few workarounds for the forms and all. There is a Netlify also provided form integration where you can use the JS to submit those forms on a Netlify. Actually, I didn't work out on those things because it was not my intention to use these integration. I was looking into things that how easily we can integrate. That's why I'm showing you. Even if you want to try, these are the options that you can try with your static site. There are Lamada forms that you can integrate. There is a Drupal module also available for the AWS Lamada, so you can use. The Lunar is also a JS-based search. Lunar.js you can use for the search feature. If you want to create any search functionality on a front-end side, you can use that. Any other thing like any JS framework you can use with your static site, it's easy to go. Anytime you can create or look into that. I think that's it. That's all I need to show. I hope I didn't bore you on that part. I'm happy to answer if I can do. This is a really rookie question again. I'm sorry, I apologize in advance. That sets up the framework for the Drupal structures that are needed for data migration to then go in. For a static site. You set up all the shells of the autonomy that's needed in that. And thereby creating the shell or the skeleton for the static site that is then ready for data migration at the next point. After what you've shown us. It's not exactly for the data migration. Let's suppose if you have a site, still want to continue, but you want to archive the CMS part of that. You just want a production site. In that scenario, you can definitely use this static site generator to create a static site from any CMS or something. That will work for a meanwhile. Again, you can migrate those data. And Tom also provide as in JSON structure of the content and all. So you can definitely use those exported content and can be utilized in any framework to import those. Awesome, thank you. Just a quick question. Did you run into any issues? In particular, or was it all smooth sailing? Actually, it was very smooth in terms of a normal generation and all. I tried with a different profile, different themes, and it was quite well. I'm getting the static site as I had in a Drupal theme. So if you change anything, if you can do with the Drupal quick template, if you have site is ready with you, you'll get the static site as usual. I might have a question too. It's Robert from WAGov. So from what I could tell, the CMS was updating the content, but then you had to do some sort of deployment for the content to reflect. How would that work with a big agency with hundreds of administrators? Is there a way of syncing the refresh so it was automatically updated or did you have to physically deploy once an hour or however it worked? So like static site is not for a big goal. If you have often changes in anything, you don't really need to use the static site. This is just for if you have a site and that will sit on it for a time being like, let's suppose you don't have anything to work, any updation or anything in a year or something like that. So in that scenario, you will use the static site, but it is not the case that when you often use or changes any content or adding new content, then it's not a right choice to have a static site anywhere. Thank you. Okay, thank you. I know we're looking at the product quant, so you've answered my question why quant over time. So thank you. Govind, I was going to ask you Govind, you started talking about Tom when you were looking at DFAT use case, and I might get this really wrong, but I think the DFAT, the static part of DFAT used the mini site module or something like that. Was it such that Tom didn't suit that because it was an enterprise grade or why use the mini site module? Is that because it was part of a bigger website in terms of DFAT? I'm just interested in that history. Yeah, yeah. So the mini site module is a different, altogether is a different part. It just serve inside the trooper. It's not a generator or something like that. You have a static site with you. You can use mini site module along with Drupal, and you can just upload your mini site, the HTML, the generated static site into the mini site module. It's not for a generation only. Tom is, along with, if you want to create a static site from Drupal, you need to use Tom. It's the difference. The mini site just serve the files. It's kind of a server inside the Drupal to serve the static sites. Yeah. Paul, if it helps, Paul, we had, in Galaxy MS, we had a customer which had multiple sites, and if I'm not wrong, because it's been a few months now, it was Cancer Australia. Like they had different sites for different cancers, sort of. And they were looking to consolidate that under a single site. So what they've done is the smaller sites, which were like only a few pages big, they would convert those to static sites, and then they would host them via the mini site module in one of the main sites. So basically what mini site does it, it allows you to host static websites within your Drupal website. So you have your content with Drupal, but then you want to host something which is like a simple static site. So that was one use case where it was used that way. Hope it helps. Thanks, that's good.