WEBVTT 00:00.000 --> 00:14.000 So, the next two talks will be presented by Josie and Michael, and so it's going to be 00:14.000 --> 00:19.000 how hard is it to bring a professional level sustainable advance CMS to the market, 00:19.000 --> 00:23.000 as well as rethinking the web CMS and finding the excitement. 00:23.000 --> 00:28.000 These two talks are expected to be around 15 minutes each, and we will do a break just in 00:28.000 --> 00:33.000 the minute. Thank you. 00:33.000 --> 00:36.000 Hello. 00:36.000 --> 00:44.000 I'm Vanu. I'm Josie. Michael, we along with our in-office and out-of-office team make-up 00:44.000 --> 00:54.000 bite studios. It's a interactive studio dedicated to libraries and public institutions. 00:54.000 --> 01:01.000 And so, when we create a project, we have a scope of course, but we also immediately start 01:01.000 --> 01:07.000 thinking about what we don't want to do, and we create a manifesto around that. 01:07.000 --> 01:12.000 That includes data rules, which basically, like, we want to see it any given time, 01:12.000 --> 01:16.000 a visual of all the data, and any time that we can see a relationship. 01:16.000 --> 01:20.000 So, you've seen something like SQL Pro to edit, manage data. 01:20.000 --> 01:26.000 We want to be able to export it easily to switch databases entirely with a reusing post-gressor 01:26.000 --> 01:33.000 MySQL. We like it to be pretty much equal. We want to do the database to be simple. 01:33.000 --> 01:36.000 We don't want to use stored procedures and forced relationships. 01:36.000 --> 01:38.000 We'll do that on the software side. 01:38.000 --> 01:45.000 We use denormalized data whenever we can versus extra tables, which turns out to be hard to do, 01:45.000 --> 01:48.000 but then it saves a lot of time in trouble. 01:48.000 --> 01:51.000 Or, I'm just too far. 01:51.000 --> 01:55.000 When we're talking about build rules, we make large projects. 01:55.000 --> 01:59.000 We want to make them as quickly and efficiently as possible. 01:59.000 --> 02:07.000 We've learned that SAS, or less, something like a trans-coded, in this case scripts. 02:07.000 --> 02:11.000 We don't want to use that because it requires this process to do it. 02:11.000 --> 02:14.000 Type script doesn't give us magical powers. It's cool. 02:14.000 --> 02:17.000 It's nice, but can we do it in JavaScript? No. 02:17.000 --> 02:19.000 Let's just go ahead and skip that. 02:19.000 --> 02:24.000 Test-driven development is another kind of area where we think for a smaller project. 02:24.000 --> 02:27.000 It's not really worth it. We want to test it in different ways. 02:27.000 --> 02:32.000 A whole idea of a build step of running to NPM, run dev, or whatever. 02:32.000 --> 02:34.000 We don't even do that. 02:34.000 --> 02:37.000 We can skip so many of these parts. 02:37.000 --> 02:42.000 But what it does mean is then we can use tools, frameworks, and the, like, 02:42.000 --> 02:45.000 that actually work with this system. 02:45.000 --> 02:48.000 And that part saves us a ton of time. 02:48.000 --> 02:51.000 And it causes problems, no doubt. 02:51.000 --> 02:54.000 But we found lots of good solutions to them. 02:54.000 --> 02:58.000 Functionality-wise, of course, just like any standard project, 02:58.000 --> 03:00.000 you want to have like cool, new tech. 03:00.000 --> 03:03.000 You want to have the billing system set up right away. 03:03.000 --> 03:05.000 You can have live everything. 03:05.000 --> 03:08.000 And the reality is, that's all coming. 03:08.000 --> 03:13.000 If this project takes off, we're probably going to rebuild the entire project, 03:13.000 --> 03:17.000 maybe even in a different language, as it grows in two or three years. 03:17.000 --> 03:22.000 So why do we want to imagine trying to build and force all of this into the current? 03:22.000 --> 03:28.000 It's kind of like imagining this is a smaller project until the time it gets big. 03:28.000 --> 03:31.000 And that's just kind of part of the manifesto. 03:31.000 --> 03:35.000 We think about things like simply dark mode. 03:35.000 --> 03:37.000 Of course, you have to have dark mode. 03:37.000 --> 03:39.000 At least Ryan thinks so. 03:39.000 --> 03:40.000 And we love it. 03:40.000 --> 03:43.000 And then we have a builder mode and we have a super admin mode. 03:43.000 --> 03:45.000 And every time you do an interface, interface change, 03:45.000 --> 03:50.000 you now have two times, two times, two ways that you have to test it against. 03:50.000 --> 03:53.000 And you multiply how many of the different modes you have. 03:53.000 --> 03:56.000 We try to think about that and try to keep things to a minimum. 03:56.000 --> 03:58.000 We kept dark mode. 03:58.000 --> 04:03.000 So the parts of a web application. 04:03.000 --> 04:06.000 I'm just going to start by explaining kind of probably what you already know. 04:06.000 --> 04:08.000 If you're here, so I'm going to do it real quick. 04:08.000 --> 04:14.000 And then Josie's going to get into specifically how a content management system is built. 04:14.000 --> 04:18.000 Of course, you define the CI and CD. 04:18.000 --> 04:22.000 You basically want to make a system where you can do proofs of concept. 04:22.000 --> 04:23.000 You can do data backups. 04:23.000 --> 04:25.000 You can publish into a stream. 04:26.000 --> 04:29.000 You can back one up if something really falls apart. 04:29.000 --> 04:33.000 Of course, there's interfaces like what kind of front-end you want to use. 04:33.000 --> 04:36.000 What kind of component library is design systems. 04:36.000 --> 04:40.000 When you think about the application, you want to think at some point or another about things like 04:40.000 --> 04:41.000 the indexing. 04:41.000 --> 04:42.000 What goes over what? 04:42.000 --> 04:45.000 Because at some point you're going to find that didn't work out. 04:45.000 --> 04:48.000 And of course, the data interfaces graph QL. 04:48.000 --> 04:49.000 They're rest. 04:49.000 --> 04:50.000 Whatever you want to do with that. 04:50.000 --> 04:54.000 If we want to have other finest parts to it, of course, 04:54.000 --> 04:58.000 there's user accounts and all the things that go with that. 04:58.000 --> 05:01.000 And performance-wise, we want to know when things are going slow. 05:01.000 --> 05:04.000 We want to know when things are actually areas. 05:04.000 --> 05:07.000 So we have a decent system for tracking all of that. 05:07.000 --> 05:10.000 A whole bunch of puzzle pieces we threw in the air. 05:10.000 --> 05:13.000 Just for fun, which Josie will explain. 05:13.000 --> 05:18.000 As a content management system is thought of as similar to web application. 05:18.000 --> 05:21.000 But there are quite a few things actually set at the part. 05:21.000 --> 05:22.000 It's run through some that we have. 05:22.000 --> 05:28.000 There's page management where you can edit and view the page content and elements. 05:28.000 --> 05:32.000 Navigation management to understand hierarchical data. 05:32.000 --> 05:37.000 Digital asset manager where you can upload and organize any files to your website. 05:37.000 --> 05:43.000 Buckets to view any content on any or all pages. 05:43.000 --> 05:47.000 Data sources to supply the data across the whole site. 05:47.000 --> 05:52.000 Thames for if you want to edit a color or font just in a single click. 05:52.000 --> 05:55.000 Settings for small changes. 05:55.000 --> 06:01.000 Admin accounts to control who can edit or change or look at anything across the site. 06:01.000 --> 06:05.000 Search in Texas to create context for searches. 06:05.000 --> 06:12.000 And dashboards and special tools to view information in an understandable and useful way. 06:12.000 --> 06:18.000 So create a clear image of what a content management system is. 06:18.000 --> 06:22.000 And so for the content management we created. 06:22.000 --> 06:24.000 We started it in 2020. 06:24.000 --> 06:28.000 You'll see in the next talk why we bothered to do this and why we didn't just use 06:28.000 --> 06:30.000 Rouple or Wordpress or whatever. 06:30.000 --> 06:35.000 The idea in 2020 we had some months off to think about what we want to do 06:35.000 --> 06:36.000 Achieve next. 06:36.000 --> 06:39.000 So we started thinking through kind of this whole process. 06:39.000 --> 06:43.000 At first we were just really kind of creating proofs of concept. 06:43.000 --> 06:47.000 Between being a good way to create a connection to let's say. 06:47.000 --> 06:52.000 The data all the information architecture scheme modeling etc. 06:52.000 --> 06:58.000 2021 we wanted to start importing live sites as quickly as possible. 06:58.000 --> 07:02.000 So we take some of our regular client sites all libraries. 07:02.000 --> 07:06.000 Import the data and find a way to put real data on a real screen. 07:06.000 --> 07:09.000 If it's all fake data or alarm. 07:09.000 --> 07:13.000 It is going to be really hard to tell what works or how it works. 07:13.000 --> 07:15.000 And so we did that pretty early. 07:15.000 --> 07:18.000 Creating of course the APIs we do. 07:18.000 --> 07:21.000 We should do internal documentation more. 07:21.000 --> 07:23.000 We sometimes fail. 07:23.000 --> 07:26.000 And then of course the branding and build system. 07:26.000 --> 07:30.000 In 2022 we put our first production site live. 07:30.000 --> 07:33.000 So it took a couple of years to get to that point. 07:33.000 --> 07:38.000 We continued building site tools and issues system. 07:38.000 --> 07:41.000 All the other fun things that you would imagine. 07:41.000 --> 07:42.000 And this is the start. 07:42.000 --> 07:46.000 We always knew this is going to be a closed and open source product. 07:46.000 --> 07:50.000 So we wanted to have a standalone which is the open source. 07:50.000 --> 07:55.000 And we wanted to build the first part and then start finding a way to have one code base. 07:55.000 --> 08:02.000 That we can manage and use and that exports to the standalone version which becomes open source version. 08:03.000 --> 08:06.000 In 2023 we put the website out. 08:06.000 --> 08:09.000 We came up with a series of functional testing. 08:09.000 --> 08:14.000 Since we don't do unit tests and things like that we do want to have a decent way to test. 08:14.000 --> 08:19.000 And the consistent way it's a functional testing and interfaces for that became really worthwhile. 08:19.000 --> 08:25.000 Joe's going to be talking about the whole sign up process as a case in point of one of these things. 08:25.000 --> 08:29.000 Last year we put up a third and fourth site. 08:29.000 --> 08:33.000 We worked a lot more on documentation, new tools. 08:33.000 --> 08:38.000 And a big key thing is we found the export systems. 08:38.000 --> 08:40.000 We want to export my SQL. 08:40.000 --> 08:46.000 That creates a one amount of headache if we want to take sites data and put them all into one. 08:46.000 --> 08:49.000 And then be able to take any given site and pull it back out. 08:49.000 --> 08:52.000 There wasn't a data system that worked like that. 08:52.000 --> 09:01.000 So we ended up creating yes, a 17th standard of group CSVs or some, I don't know what the G stands for. 09:01.000 --> 09:05.000 But the idea of merging CSVs that we can have higher agricultural data, 09:05.000 --> 09:12.000 we can have relational data all built into the CSV and any given part is still just basically a CSV. 09:12.000 --> 09:14.000 Lots of stuff to do next year. 09:14.000 --> 09:15.000 The open source this year. 09:15.000 --> 09:17.000 Oh no, this is fair. 09:17.000 --> 09:20.000 And more stuff to do next year. 09:20.000 --> 09:23.000 It's been a wild ride. 09:23.000 --> 09:27.000 So the sign up is an easy part of the wild ride. 09:27.000 --> 09:32.000 It's an important part of it because our librarians actually need to be able to make a website. 09:32.000 --> 09:37.000 Make their configs, add administration accounts, create their site maps, load up their branch data, 09:37.000 --> 09:40.000 hours, choose a theme on and on. 09:40.000 --> 09:42.000 The process itself. 09:42.000 --> 09:46.000 I mean, it took a month for like the original wire framing design process. 09:46.000 --> 09:51.000 And actually building the original outcome was a month. 09:51.000 --> 09:55.000 Testing and doing the sign up and API creating that was two months. 09:55.000 --> 09:59.000 And actual testing and tuning of it was another month. 09:59.000 --> 10:01.000 Plus all the scope expansion. 10:01.000 --> 10:02.000 Sorry. 10:02.000 --> 10:03.000 inevitable. 10:03.000 --> 10:05.000 The sign up itself. 10:05.000 --> 10:08.000 We stir off simple with basic information. 10:08.000 --> 10:10.000 Information about the library. 10:10.000 --> 10:14.000 If they have multiple branches, but in that information what their hours are, 10:15.000 --> 10:16.000 library features. 10:16.000 --> 10:21.000 Like if they want to add blogs, spaces, booklets, anything to their website. 10:21.000 --> 10:28.000 As well as global site tags for the actual to take your content with across the site. 10:28.000 --> 10:30.000 Site map themes. 10:30.000 --> 10:36.000 We have three of them originally preset, but librarians can then go and reorder, 10:36.000 --> 10:41.000 rename, delete, add their own to make their own fully custom site map. 10:42.000 --> 10:45.000 And in the end, library gets a website. 10:45.000 --> 10:46.000 They're happy. 10:46.000 --> 10:49.000 And we're happy as a result. 10:49.000 --> 10:51.000 That's where how to build. 10:51.000 --> 10:55.000 And so the whole talk is about how difficult is it to do. 10:55.000 --> 10:59.000 So I guess time and people would be the way to think about it. 10:59.000 --> 11:02.000 It's easy to reinvent the wheel. 11:02.000 --> 11:05.000 It also gives you some options. 11:05.000 --> 11:08.000 A lot of ways to redo things entirely. 11:08.000 --> 11:13.000 So the sign up as we talked about it's five months. 11:13.000 --> 11:19.000 The digital asset manager, which is like a file manager that has a lot of digital asset manager material, 11:19.000 --> 11:21.000 is six months. 11:21.000 --> 11:27.000 And I should say this was one person, one person, and you that built it. 11:27.000 --> 11:30.000 So five months for one person in average. 11:30.000 --> 11:33.000 This was two people for six months. 11:33.000 --> 11:35.000 This is three of us. 11:35.000 --> 11:42.000 And it took a year just to come up with a really solid way to make the front end work and solve all the problems. 11:42.000 --> 11:45.000 Data editors because there's so many each one has a different layout. 11:45.000 --> 11:47.000 And we wanted to have a generalized system. 11:47.000 --> 11:50.000 So it's really easy to switch to spreadsheet motors, 11:50.000 --> 11:56.000 which to data or tiles view can ban whatever modes, 16 months. 11:56.000 --> 12:02.000 However, the real advantage of this is when you want to do something quick and that would be a lot of work. 12:02.000 --> 12:06.000 And another system, something like a branch match map, 12:06.000 --> 12:11.000 or we want to have a non Google map because we're trying to eliminate Google from library sites. 12:11.000 --> 12:15.000 And have just a system where you point and click where the different branches are. 12:15.000 --> 12:18.000 That whole thing took less than a half a day. 12:18.000 --> 12:20.000 And it's usable in any data source. 12:20.000 --> 12:26.000 And so that we can keep adding new ideas that are all essentially plugins. 12:26.000 --> 12:29.000 And in the end, being able to fulfill any client requests, 12:29.000 --> 12:33.000 there are no limitations to the templating, the backend. 12:33.000 --> 12:39.000 Because we control it, we will never ever say, oh, well, the content management won't allow us to do that. 12:39.000 --> 12:43.000 Well, if we do, it would be our fault because it's our content management. 12:43.000 --> 12:48.000 It really lets experimentation be a big solid idea. 12:48.000 --> 12:52.000 And I feel experimentation and content management is what we need next. 12:53.000 --> 12:57.000 So no denying making the content management system is difficult, 12:57.000 --> 12:59.000 but it's worth it in the end. 12:59.000 --> 13:02.000 So we persist. 13:03.000 --> 13:12.000 Any questions on the session? 13:18.000 --> 13:20.000 Yeah, so sorry. 13:20.000 --> 13:22.000 What is your content management system called? 13:22.000 --> 13:24.000 And when do I find out more about it? 13:24.000 --> 13:26.000 I didn't want to make this a sales pitch. 13:26.000 --> 13:28.000 So we kind of hit it. 13:28.000 --> 13:31.000 If you go to the bite dev fast time, you learn a little bit more. 13:31.000 --> 13:35.000 But it's called Kalata, C-O-L-L-A-T-A.