Neocities.org

This is kind of dry, but the exercises in here are pretty challenging: https://eloquentjavascript.net/

what are you trying to accomplish?

@kazuhisa thing is I'm not sure how to describe it, if I could I'd be searching for stuff online myself (lol) I'd describe it like a one-pager where when you click on something, the content gets replaced by another and so on?

no idea how to call it so I guess I'm just looking for masterposts for now!

js is very arcane to me, so i fake this single-page website effect often (take a look at my shrine of waste source for example). https://john-doe.neocities.org/ does something similar too. for js you could look at https://kool.tools/speculations/ 's source code?

I see what you mean. yeah there are a couple ways to skin that cat. some people pull out whole JS frameworks for that – https://developer.mozilla.org/en-US/docs/Glossary/SPA

@kool.tools is an effective way to go about it, and how I would probably do it. just a bunch of hidden elements that you unhide with a click. the "SPA" category implies the content /isn't/ on the page, and instead "fetched" or loaded in real time. i.e. you load the page, then the page sends a request to a server to get your blog posts, and then render the blog posts. kool.tools has all the content, just hides/unhides

if you want to learn js indepth then sticking with pure javascript is a good idea. if you're more focused on building your site, then there are "mini" frameworks that get the boilerplate done for you (i.e. click here to unshow/show this element). there's alpinejs and then petite-vue as examples: https://alpinejs.dev/ https://github.com/vuejs/petite-vue

personally I would choose petite-vue because it feels cleaner, but alpinejs doesn't have the baggage of "vue" – which is a framework that is an SPA, and can be confusing. writing out functions to hide/unhide stuff won't be too terrible either. really just depends on your goals. @kool.tools is a great example to work off of, sounds like it fits your use case

the whole alpinejs and petite-vue stuff is a little ironic though; as its predecessor was jquery https://en.wikipedia.org/wiki/JQuery - it shows that, although we can achieve everything we need in vanilla js without jquery (https://youmightnotneedjquery.com/ and type in "hide") – there are advantages in "bundling" the js, organize it. js is painful all around tbqh

hope i'm not adding to the noise, but as @solfo said you might not need JS to do the one-pager thing. consider this a fallback in case you decide not to use JS https://github.com/you-dont-need/You-Dont-Need-JavaScript