 Yeah, I'm Adam. I'm ComCom chairperson and I run the website redesign project. I work at LinkedIn full-time as I just offer on the design system over there. Hi, I'm Jeremy. I'm with the build graphic there, Microsoft. I do a lot of things about trying to do more. Cool. I can give a little bit of a quick brain dump because a lot of us have context here for website redesign, but I'll kind of talk about where we've been, where we're going, what plan is, what's next. So started a year ago now with us trying to figure out what a website redesign might look like. I really wish I could share because started out with a couple of medium posts. For me, this epic line, you can go find it. Do we have like a chat? We grab an issue for us to go and so I can drop links for y'all to open. Let's go over to the Node.js slash website redesign repo and we're going to pop into issue, just closed it, unfortunately. We're going to go open to issue 155 website redesign. I'll drop links in there so that we can all look at stuff together. Lou of sharing. So it started out on medium, a good chunk of time ago. 155. Yeah. With this kind of epic length article I posted a while back called redesigning Node.js part one. So I did kind of just a competitive analysis of a whole bunch of other websites. It's similarly in the space. So this was a member in Scala and the Go website. It's kind of picking what's good, what's bad, like what we didn't like. And from that kind of came up with an information architecture idea for how we can improve the current website, went through and reviewed all the current content, stuck it into place. There was a lot of conversation online with the existing website team and with a whole bunch of new folks talking about information architecture and just making sure that all the content fits into there. And then from there put together a vision board with a whole bunch of linkages dropped in the issue as well. It's just kind of like a scaffolding of how the website's going to look. A few questions like is the site going to be blue? Is it going to look? No. It's just for structure and like information structure. And then we wanted to start getting started on building something. I made a few technical choices and had the pleasure of working with Miles, who kind of deal with Google to get us the domain nojs.dev. We spun up a new dedicated code repo. So the repo that you're all looking in right now is the website redesign repo. There is also nojs.dev, which is the kind of code repository. Let's talk about unifying the two, but often to keep them separate. Website redesign is kind of the admin repo. And nojs.dev is the code repo. But nojs.dev is the home of nojs.dev. You all go there. You'll see a page that looks very, very similar to the learn page on the vision board. So there was a requirement for launching .dev domain as part of the official domain launch that Google was doing. There was a requirement that you have to have some kind of content up there. That is not just a copy or a redirect of some other content. It's definitely testing. They're not projecting might as well. Yeah, so we needed to get some content up there. So we kind of took the layout of this wireframe, turned it into the site you see at nojs.dev. If you go take a look at the repo, it's a Gatsby site. It's a single page, got a split app. It's an awesome framework for building documentation and kind of pulling in content from a whole slew of different sources. And I'm missing. Right. We have a wonderful co-worker of mine at LinkedIn who's a developer turned designer. He works on the design systems team with us. He's been hacking away on New Look and Feel since he got involved a little bit ago. He's finally wrapping up his last project ended. So he's been dropping design board updates in the website redesign meeting issues that have popped up. We opted not to have the last meeting. Parts because the cloud summit was in transit. But if you look at the last meeting issue that is open in there, there is a gift that he posted of his latest work that he couldn't hack away on. So we're going to have full fidelity mocks soon from him. But there's a lot of work that needs to happen in the meantime. We have a site that's up and running. We have a site that deploys automatically when you merge into master, which is awesome. But we kind of have to start thinking about how to wire up data for the rest of the parts. I think as far as IA goes, we have a good direction to work with here. And there's some pretty well scoped out sections of the site to start tackling next. I was hoping to take this session to focus on, you know, make some technical decisions around how we're going to move forward with the API docs page, the releases page, all of this. And maybe start actually opening. Found a great issues that we can give you out and treat as kind of like a different planning session for the next few months. We have before we, I guess, dive into all that. Anything else folks want to bring up before we get into nitty gritty? Questions, comments, ideas? Well, there's always a system on the site that chairs the board. That's a good question. I think the hope is once we get content parity, we will approach the website team is aware of this and like when needed, we'll approach the website team and propose essentially switching over the site. So the hope is the content that's currently on Node.js.dev will move over to .org. And then we get to have a phone conversation of what do we do with the .dev domain now? Like, do we just make it a miracle of .org? Or is it, you know, maybe something else? You can give people a business practice. Yeah, so do me. But I think that's still a long time now. Yeah. So my guess would be that's not going to happen for a while. Oh, yeah. That's not going to happen. Oh, no, for a while. For a while. Yeah. But yeah, that's the hope is what we're doing here will become the new site. Yeah. We work pretty hard to like go and track down a whole bunch of lead pages on the main site and figure out what we didn't need anymore or what we had to include. But it doesn't make sense when we're foundation. Well, we can love to dive in and actually start talking about some of this. Nady Grady. Well, one thing I want to say is that we have two people who are from like, how about products or do you form the technical products of GSE and related products? Do you have any questions or concerns specifically? Other than you two. One thing that might be. It is. It's a lot more I want on this, this learn page. Like right now it's just, we have an amazing donation from Flavio Copes for getting started guys. It's a lot more like advanced content. I want to get in there. And there's actually a lot of guys currently buried on the node, the current node site that would be good to figure out what it did in. I can't go delete those images. The header images. Yes. We really don't. Yeah. No, they don't. Are they in there still? They're there. Yeah. Go for it. Can I ask you a question? What's the function of. What's the, so eventually the node. No. Yes. Dad would supply. Potentially the new. No. They've never found out the whole website. Or once it reaches feature parody or whatever that was hearing. So the. The content that will be. That is on. That will be basically transferred out of transfer. Yeah. So it'll be. It'll replace it. Yeah. The current content. And that domain will probably be. From the teeny bit. But then. Once that's done, we can figure out what to do. So my, my main question is. So what is the goal currently of. Up in the jazz debt site. Is it a playground to experiment with new. New things or whatever. Or is it a place for. I see the learn page prominently featured. Exclusively featured. Yeah. Yeah. So the, the. Domain. It's kind of like a staging site where we can. Get it out in the world. Get feedback. Keep it a writing on it. I guess my question is mostly is it. Is the goal of the website design to get. A modern architecture setup. Or the site. Or is it to. Provide something. I would say. Yeah. Yeah. So it's a, it's a ground up rebuilt. Of the current site. And have a reimagining of a lot of the content. So the current site does not have any. Getting started resources. How to learn note. How do I install the damn thing beyond downloading a binary. Like. So there's, there's a lot of content. In these cases that aren't. Met by just the API docs. And just the big old download button. And. We're. With the learning pages currently in there, we're getting closer. But there's. So much more content. You can fit in there. Including. You know, I am. I am in SRE. How do I prop up? No. In production. Yeah. Yeah. Yeah. Yeah. Yeah. Yeah. Yeah. Yeah. Yeah. Yeah. So. Yeah. Yeah. Yeah. Yeah, yeah. Yeah. So what you see, how do I prop up note in production? I'm doing for analysis on my, on my server. How do I, you know, inspect under the hood to see what's going on? You know, these, these advance guides and third, there are a few floating around on the current. We'll put that on. They call it on the site, the advanced guides. That's like. But it's really just kind of that. Right. Yeah. It's just kind of a hot podge of what. deep in the technical side just decided that they want to write. I mean it's it's also three years of technical debt in a product of website that was a temporary that website was temporary and it has not been temporary to permit. I'd really love to actually make a conscious effort to tell a story with the documentation that we write now and you know think about as somebody coming to the site with this use case how do we introduce them from zero to the most advanced use case so they can get up to speed and what they need as fast as possible instead of just relying on kind of somebody has this top mind they're going to write an article about it because it just meant a feature and then forget about it. It's actually quite hard to find the guides on the current website. Is that a knowledge base stuff? That's a knowledge base yeah yeah they're old some of them are outdated a lot of what you could use in TLC. So that's that's kind of the hope for the learn page. You'll actually see on the the Envision Board that the learn page does in fact have two different sections like this is right now just quick start advanced guides on there and I believe on the actual the just that dev site itself it actually we can look two sections like that quick start and getting started but you can imagine and this might include some interactive interaction changes like how you view all the articles and everything but you can imagine that there's a there's a section for like SREs or process introspection. So there's a whole bunch of different stories we can tell for different types of users coming in to learn and actually give this pretty comprehensive overview. So that's a section just AP or just documentation of content learn page content is a pretty large need still like we have enough there that like if we got everything else on the site switched over and like I have content parody like I'd feel pretty comfortable switching it over with the content that's there right now just the basic getting started stuff but we can make it a lot better. So something I really wanted this site to enable was to let people manage documentation where they think it should live. So like this thing will is gonna start showing API docs and some point API docs should not live outside of the core because nobody will update them if they don't live. Nobody will also want us to do that. Yeah because I mean that would that would not be tenable. So this site has this prerequisite of it has to be able to pull content from across the project stitch it together like I don't I don't want the community page I don't want that content living outside of Hong Kong. So the nice thing about Gatsby is you can kind of set a dependency on anything and it's also saying it stitches it together. So yeah API docs are kind of a special little beast because we all this stuff also needs to get translated. So we're working with the admin group to figure out how like what they're what they're published for a code looks like what type of artifact they put up there for us and then how we can adjust that again and rebuild it. So this there's a lot of outstanding work there we're kind of waiting on ice and then to get there by plan in order we had a good session yesterday. We can figure out how that's gonna work but we also get to figure out how we are not blocked by that in the meantime. So like for the API docs specifically right now every version of every JSON parsed file in the API docs folder just living currently deployed on.org. So for like first pass integration we can hit that up like it's an API. Just go fetch the JSON as we need it and render it on the page how we see fit. So there's like baseline work in the site right now to integrate API docs just you know we don't have a holy clutch design yet for it but there's a lot of data work just to get the hand thing hooked up. I'd love to see I think a good strategy for the first approach here is like we always bake in the latest release into the site itself. Gatsby server side renders for initial page render and stuff you can navigate through when it's set up but it would be nice if those like the current LTS API docs were baked in the site so like we get that per-benefit that it's always loaded. Google sees it as just an ecstatic page when it renders but then if you like go look at historical documentation we can have that hosted somewhere ended up like an API so it's not part of the bundle. We don't have to bake in every single version into the SBA. You could also theoretically build a secondary SBA that does that. That's how we do it at LinkedIn is every version of our app it's deployed separately and literally hit up the documentation and it's supported a different version of that probably that's I think that's a little overly complicated for the node site so those technical decisions to make around how we design that and how we wire all the data together that is non-trivial and we can do without a high fidelity design in the meantime. Similar Western Action 1 used to releases right yeah I really want to figure out a good way to take a look at the Envision board. There's that entire releases section now pretty commonly displayed with that you know extra download options and hopefully a better communication model for the release process. It's kind of hard for new users to drop the release flow and I love, Ember does the best job describing their release process that I've seen so far. These illustrations reach release line and give you a pretty nice illustrative guide of how that all works. I'd love to make that. Yeah I'd love to make that for the node the node site as well. Something similar. A little less cutesy but equally clear but we have a similar to the API docs like we have data integration needs for releases as well. I had kind of envisioned that below the top three LTS currently download options at top and this kind of like small description of the release process description down below. Yeah I know right? It's like the best release documentation I've seen. Yeah like it makes something that's pretty dense like approachable from any level. It's no reason why it has to be dense. Down below the Envision is kind of like infinite scroll searchable. This table exists else around the node site. It's just varied if you want to find all the different versions. Also similarly posted in a giant JSON wall I'm pretty sure. So ground.org. It's readable for every release. Is that right? Yeah like there's data work to be done to pull this in and like lay out the page for that setup. So this is another vertical of work where we can we can start integrating data and getting functionality in there without a final design to work off of like if we just kind of code to the wireframe. Yeah but there's kind of that outstanding question of this is having these JSON files just sitting out on server. I mean I could go up like is that the ideal way to do it? There's a better way to integrate that information. I think it works well for the first pass but is it better? Is there something better that we could work with with build or release working groups that can have a tighter integration then? Yeah one of the issues I want to discuss is about the discoverability. So the kind of issues which we search in that usually stack overflow comes in the top then even the node.js slash node issue repo comes up but not necessarily the APA documentation the green website or the node.dev. So is it because the the kind of topic that is being searched is not present over there or should we have had some kind of yeah should we add some semantic capability in the website? I don't know but my experience is that discoverability is is a little bit low on both the websites. Yeah my home should be at the chicken and egg problem like it's not a it's not a resource that people link people to like if you're if you're looking for help with a node issue that's not just that I'm looking up a method that I need to know then you're gonna you're not gonna link to the node website and link to stack overflow or are they doing GitHub issue and so Google knows like this is not a resource but if we if we turn the site into a resource that that people want to use all the sides of it enough that that type of the search engine discoverability problem will like to change. Yeah well of course trying to keep the best practices for all the metadata for search engines to crawl it and everything but I mean so right now like a part of that is our you know if you run a like house test on the docs that you got docs it the SEO element is 85 which is like a warning effectively like you need to do better and Google they said like that's a very serious thing to them it's like if you're not doing well you're not going to get ranked well get up as well stack overflow as well so if we want to be ranked well we have to be improving for that and as far as I know there's never been any kind of search engine optimization or like auditing of certain elements inside of the API docs to help improve that so you know I think Gatsby does a lot out of the box yeah and then there's minor tweaks that we can make like basically one person could go and get us to 100 which is very nice and that should theoretically just give us a flatter improvement on that and then you know once that's done I definitely think there are individuals at Google who are doing jobs in your background doing a lot of work with Google and SEO right now I we could ask them if they're willing to come in like sure use our docs is a way to you know a case study for your work and I don't doubt that they would be willing to take that on because it's a high impact thing so help them succeed and help us succeed can we have a search box in one of these websites which is basically doing a custom search with some yeah semantic capability there's actually I'd love to kind of pick your brain a little bit about how we can improve the format of API docs long term because right now it's it's all in it's it's somewhat structured data right but there's the probably better ways to document it than just in markdown files you kind of manually keep up the date with the code I know there's their services like Agolia yeah they would be more than willing to give us their service for free probably as well I mean there's just a Gatsby has a great ecosystem around it yeah so they actually they're going to have a plug in for Gatsby which we just added adds you know API docs code search on the site so it should be fairly straightforward um but I uh um but that it doesn't um we can we can build a tool much like the kind of the standout I found for API docs and the sites I compared was the Scala documentation um where it's all you can um you know it's kind of what you'd expect of an API docs page everything's very uh uh broke uh library oh never mind I had a ugly this shit where did this go um what was it Scala I don't remember screenshots in the article um anyway it's all it's all broken up uh quite beautifully and you're able to search by by method or property or okay and actually you can see inputs and outputs it'll tell you how it relates to all the other modules um part of that's an information protector issue yeah so one of the things I'm most curious about because this is something that my my work specifically wants me to help you guys read so you have you know to utilize me on part of for content creation or whatever it's probably the best way I can help with this because we're going to be creating content on getting started yeah you know etc but um so I see several you know please correct me if I'm wrong I'm making a bunch of assumptions here with everything but I see several different tracks on which things are moving and you know trying to figure out where the blockers are and where I could help you know remove some of those sounds like you know there's the technology of actually building this thing you know which goes slow or whatever design which I'll kind of love them with the technology because some of these people are working closely together to on the tech on the wireframe and building it out there's the content side of it which is obviously creating the content you want to see and then final one is likely because of how disparate all this is and how it would be drawing content from different committees different information architecture essentially in terms of you have all the content everybody produces it but to different formats and standards you know technical debt to fix all that essentially so I'm like that's one thing that I look at as if like if we could figure out a format to make it play nice with SEO and everything and a markdown format or whatever then I can you know independent of what y'all are doing I can run on creating content or tweaking the using content into the format etc so where are you like where are your blockers currently with things um there's there's three different three different blockers right now um one is on the content side like you said like we can always improve content um depending on where on the site you're looking at you're going to probably edit the content differently in its API box it's going to be a no core production markdown files um if it's learn page docs I'm currently lives in website redesign and pointed literally I think it's called the documentation folder right there it's all just marked down holds in it's like a they were front and little blob it tells it how to this way on the I'm gonna learn page um yeah um presumably like releases page and what we just did a hard-coded page in the description of it in the documentation repo um but it'll pull in data to show the the historical information so we have we have kind of the content side of it which um yeah needs needs some TLC um there's a specifically you mean getting that into a like edit it into a good format or um there's just gaps because with this gas in the API box it sounds like it would need to get massaged into a format that would be playing well at the site yeah you know I see that as like that's somebody some of the technical committee or some of the yeah um that's the I think that's the second type of blocker we have is we need to integrate with stuff from there to get to get parity yeah um so the the second section where we need we need a lot of work to be done it's just like we need API docs we need releases information um we need uh integration with like uh uh past uh you know we have a whole user story section on the foundation side probably going away that we'd love to get onto the site where we host that information um so there's like that those data integrations of pulling in new content and just getting basic parity and then there's kind of the lower level infrastructural work like we need a way to uh like we're working on the it to no problem right now but I just opened an issue this morning um like we need to get an itinerary like a helper library for for Gatsby install like take one make sure it works with json point it at the thing and it'll work um so there's there's like the the core infrastructure the site itself there's a kind of a three areas I see where we need to kind of drive forward and if all three are in a good place we'll be able to put the switch and turn the site on um and probably the the place where the most work can be done right now is the application content and the integrations um so like just to unlock the pipes for getting the docs in that work just has to be done for that I also think that like I what do what do we I know this is like not sure if you're right what do we want to get out of the session what's the goal here yeah so my um something that in other it sounds like we're all kind of level set that like that the kind of the goals of what we're trying to do long term um I I would at least personally find value and kind of treating this like it's like a spring time so like let's actually deep dive into how to coordinate the iDocs let's get the project board set up let's make a bunch of tickets for that although we can drive against over the next month or so to get it built out um and then we can you know treat the treat our regular meetings like like uh jagged meetings that's what it means um so we can we can take that approach we're really sitting here making tickets planning work um we can keep talking about you know arbitrary visions for the future and like you know or I think that'll have you know that's my concrete impact yeah we can do that for a very long time um so yeah that was kind of my vision was um the spring planning model was make a bunch of tickets um ends at 10 30 get 10 minutes okay that's gonna happen um yeah I'm willing to work through the coffee right yeah sit here I'd like I'd like to get a bunch of issues make a few things out of things okay yeah I'll be in here making issues um for at least how I see how technical work should go and we can keep talking offline about integration there but um I'd love to keep using you as a resource for we haven't thought about the releases page a lot um and I want to make sure that that's done done well and done right yeah I can um yeah what type of content you'd like to see on there and then we can get our our designer and documentation both to make it something that's digestible yeah that'd be great um yeah but look out for issues online and we'll keep having a way okay um I mean is anyone here who's not already involved interested in getting more involved with this yeah I'm peripherally involved and interested in getting more involved um those of you who are not interested in getting more involved uh if you there are people who you think would like to get involved in the project uh in some way it might be a good way to help them get involved um right now it's a lot of engineering work that just needs to be done um especially if they're better at going through doing like self-guided stuff like basically you can come into this repo and do whatever you need to and like whatever you feel is right and it'll probably end up landing as long as it's not like because it's not a big deal um so you know that's a that's a thing and if you know people who are willing they're able to do that then it would be awesome to help I'm happy to help us with that any any front-end devs who are the ones to get the answers yeah and the stuff is saying who cares what no docs like yeah it's just it's a lot of front-end building right now we just have to get the code out there um so it's a great opportunity for for new front-end devs to just get into the accepted projects do we have anything else we want to chat about or we can call it earlier go get extra coffee I'll be hanging out in here making tickets so yep we've done over here for a little bit thank you so much yeah yeah I don't got it