I built kind of prototype/proof-of-concept project: multiple .scss/.js/.html files in several subdirectories with package.json on top and Parcel (see parceljs.org) to generate one HTML page with correct links to .css/.js and other stuff. This prototype works - with one command I get working and correct HTML page, with all design/layout/functional elements I want.
Now I want to build a site having about 30 pages with navigation bar/menu etc., with all the elements like in this prototype.
Probably I will use Jekyll to build this site.
Probably these 30 pages will be created based on data in the some _data/*.yml file: Jekyll is good for this.
The question is: how to bring together 2 different worlds:
-world where you can edit .scss .js files to improve layout, to have some advanced JS functionality
-world where you build large site using “large building blocks”: I mean Jekyll world.
I mean: should it be a “Jekyll layout” or “Jekyll theme” or Jekyll-something-else?
you can’t output pages from data files, but you can use data inside a file. It would be nice if you could create pages on the fly with a data file but you can’t.
As for how to combine stuff, hard to say. You can use other things with jekyll, for instance I used to use gulp to handle images, js and css, this made jekyll slightly faster but it did make things a little more complicated. I stopped doing that after a while.
I’m not sure what you mean by advanced js functionality - if you mean like react then just use react and skip jekyll. Jekyll works fine with vanilla js and you could export the data file to a json file and then have js do something fancy with it but really if you want a reactive site then just use a react framework like next.js. Next.js can do everything jekyll can do and a lot more, though it is considerably more complicated.
With jekyll you can already have a world where you can edit scss and js files and you can build a large site. If it is all static content like a blog or a marketing site it works quite well.
Not sure what you mean by too big - I run pretty small sites off it just cause I like the way it works. Maybe hosting is more of an issue, I don’t mind paying vercel $20 per month but you can also use AWS Amplify I think and that is practically free though when I tried it a couple years ago it was stuck on an even older version of next. I would imagine by now it works on the most current version.
It sounds like you are already using node and npm and all that, not much difference with next.
11ty is a lot like jekyll, never used it. I hear a lot about Astro but have never used it either, sounds cool though.
Actually I am a backend developer.
So, I can write SOME Javascript, some isolated frontend functionality (have to google a lot, to use AI assistant… all possible tricks…).
Somehow it works. Uff )))
Therefore I avoid like the plague to deal with big JS frameworks: and Next.js is such a monster-framework capable to do everything and bring you coffee ))
So I am looking at small, isolated tools (and, it seems, 11ty is just a static site generator: NOT a framework)
And hosting: it should be just set of files in the filesystem, nothing else. Lot of options to host this.
I believe everything you want to do then can be put together with jekyll, scss, and js. Jekyll, in this case, would replace Parcel. At least for me it looks like they kind of serve the same purpose. Jekyll handles scss well and the correct links, so it is fine, and also with a simple bundle exec jekyll build or bundle exec jekyll serve you can get your final site up and running.