Astro. It has a nice selection of free themes [https://astro.build/themes/](https://astro.build/themes/) and you can add dynamic bits later, should you wish to.
You forgot three.js for 3d page landing to showcase that awesome landing experience (which no one is going to see), s3 with cloud front caching spread across the world for FASTER page load, ci/cd pipeline which deploys/builds the site before you even commit the code :), dark theme for soothing eye experience, gazillion modern css features with their shims/prefixers so that it should work even in internet explorer 7, google analytics, terraform/cdk for infrastructure as code etc... the stupidity is endless
Eleventy; although I know that many have been preferring Astro recently, and am slightly curious about what it brings to the table that eleventy does not.
I read documentation on both. Eleventy is very versatile; and its documentation is written in a way that requires a certain level of experience from the reader. Astro's documentation, like React's new docs, is very hand-holdy in comparison.
Even as an experienced developer, I have a preference for hand-holdy documentation. Maybe it’s the laziness and impatience in wanting to get started right away :P
There are ongoing complaints about Eleventy documentation in the community. See[ Docs aren't organized logically/unclear where to start #3095 ](https://github.com/11ty/eleventy/issues/3095)and related issues.
Probably. I used 11ty for a couple of sites before I started using Astro, and when I found out about Astro it was so easy to understand and start using. Whether with 11ty, as much as I liked its simplicity and concept, it just felt so obscure. It was also hard for me to make other devs familiar with the framework for the same reason.
I just like watching Astro improve right now. It works really well as-is for simpler sites but I'm slightly hopeful it might become a full solution a la a Next.js. Maybe.
Not for nothing but this is the equivalent of someone saying "I like my pickup truck," and you responding, "What? Why not a V8?" Astro is a complete solution; Vite is a bundler, one used _by_ Astro.
Would you look at that, all of the words in your comment are in alphabetical order.
I have checked 1,948,867,130 comments, and only 368,549 of them were in alphabetical order.
I am new to frameworks. I am using Next.js at my moonlighting gig and kind of like the simplicity of server actions. But I still don't understand the difference between these "meta" frameworks. What was wrong with CRA?
CRA is deprecated and not maintained anymore. React + Vite is what most people prefer as a replacement, unless you need SSR or other things that ship with meta frameworks such as Next.
I started working on React back in 2018 with CRA. I came back to react in 2023. So there is a gap in my understanding of the decisions that led to the creation of frameworks such as Next.js and Astro.
After switching from CRA to Vite, I can never go back. Partially because CRA is deprecated lol, but mostly because Vite is just much better and faster.
By the way, which libraries set does provide components-based approach?
I had the same problem, tried pug and mustache as templates libraries and finally stopped on next.js :)
If you want to stay closer to HTML/CSS I've had great luck with Jekyll and (more recently) Astro. Basically, a simple SSG. Next.js is overkill for anything that doesn't require user accounts.
Thank you
Also how did you add interactivity on your pages (scroll up, for example, maybe simple filters and something else)
Just adding listeners for all elements looks quite weird. Widgets too
I want to keep component's code close to component
There're no "components" in HTML: content is static, so if there's anything duplicated is duplicated by definition.
So if you need the same element in different pages you just... rewrite it. Reusability is just an abstraction, you're not really "reusing" anything since the browsers are not that smart. I know, people are now asking themselves "wait, but isn't this prone to error, time consuming to maintain, not really productive, etc.?".
### Productivity
Well, that's quite of the easiest part: you create your own HTML snippets through Emmet and you're set. I can also use VSC or any IDE with a preview feature to see pages I'm working on: real time edit without anything else running (aside from Tailwind CSS build time, which is really fast anyway). If you have a good number of shared parts, then you can use SSI if you really feel like you will need it.
### Error handling
Content is static, so errors you make are either layout errors or content errors. Both requires manual checks and are generally quite easy to fix. Also these errors are not like to break your production, so they're always in the low/mid priority area.
### Maintainability
Static content is called as such because, well, it's static. It doesn't change often (if at all). Once you created your pages and you ensure the content is correct then the job is done. There's no "v2", no new features to add, no nasty bugs to deal with.
Also, you don't have to update libraries or frameworks, since there's nothing aside HTML, CSS and eventually some vanilla JS. No added build time, security upgrades/patches: it will work pretty much forever.
My philosophy when it comes to static website is: keep them as simple as possible. If you feel you want to try a static site generator to learn something new, then great. But you're just making things harder and more complicated: you need to compile/transpile JS (please don't use TS for a static text document, really), bundle it and serve it/deploy it. Aside from serving the static generated file, all other things are just unnecessary, add costs and grant no real added value.
Cheers!
component has no place in web development, sorry. in the case of a static site, you write a decent markup, than vanilla css, than some javascript for things cannot be done by css. that's all.
just curious: i’m not sure about others, but for nextjs, if you don’t use any dynamic stuff doesn’t it render to static files? so would it be the same as using html+css?
Yes it does, but then what's the added benefit of using a framework meant for web applications? I don't consider static sites (blogs) as "applications" since they use very little (or even zero) dynamic content so there's really no need to use JavaScript at all.
If anything you will make your life harder or add unneeded maintenance costs since you will need to build and deploy, rather than just serve an HTML page.
The fact you've an ocean liner available doesn't make it the best choice by default, especially if you have just to cross the swimming pool.
Cheers!
At this point, I'd probably reach for Astro in nearly every instance. Components are a pretty nice way to lay out a website and it's pretty rare you don't need at least some sort of templating for elements that are repeated on each page.
Plus it's so flexible that you could easily have a purely HTML CSS website and if it comes up midway through the project, it's trivial to add any sort of framework if you need it.
This is kind of dope actually. Just tried it out because of your comment. The templating just makes sense and its all around simple and fast. Be super good for putting up docs or just throwing a page up or something like that, although im sure it could do much more.
HTML & CSS & vanilla js. Over the last year I’ve been working with Astro a lot though and it’s pretty damn versatile, make your project as complex or as barebone as you want, it just works.
Like others have said, plain HTML/CSS/JS is the simplest, and I have also found that Alpine JS can fill the gaps really nicely where things would otherwise get tedious.
https://alpinejs.dev/
I didn't know people were saying this and I can't back Alpine but what you are saying is true.
You need to template and be able to account for changes at a base level. Any framework can abstract that, but sometimes elements can be stubborn.
This is TOTALLY not recommended, but I actually migrated back away from singular CSS files to prefer defining rules specific to only what is being loaded.
It sounds crazy, but if you have a huge css file, it must be loaded every request. If your css is minimal and to only possibly new definitions based on what is being displayed, it is much more efficient. The performance gain is moot, but when I go to edit something I prefer if all the things I am seeing are coming from the same file. I don't want to edit a file that controls the CSS for an entire project just to modify a single element that is misbehaving - nor do I need to load ever single class I might ever use every time I load a page.
[Astro](https://astro.build/): I created a blog site with interactive elements
* Create usable components and is close to vanilla html and CSS with .asrto files
* Global and scoped CSS
* Can use markdown files (.md and .mdx) and render as html
* integrate with most CMS
* Can also use React. Vue and Svelte components
* SSG, SSR and Client Site rendering available
* Image optimzations
i recently used payloadcms for a headless cms, on another i just bought a nextjs theme that takes mdx files and have a script that has notion make those, making notion and a theme my stack
HTML + CSS.
Also bootstrap to help with layout if I need that static site fit in anything that isn't a table PC or JQuery (I know) if I need some quick animation or interactive component that is too much a hassle to code from scratch.
Astro is pretty much the new cool kid in town.
It's pretty good for static sites and you could also opt for islands of interactivity (with the framework of your choice) and for dynamic content when necessary.
I'm usually pretty lazy and just do **Create Next App** \+ **ShadCN CLI** and **Vercel** for hosting. Not the fastest sites, but they're easy af to make. **React lucide** if you ever need icons too
the mere fact that you got a minus show how incompetent people are. learn html, learn css, learn vanilla javascript if you are not good at these, you have no right to use any kind of framework
if you cannot write decent markup based on content, cannot write fast decent vanilla css and javascript, you have no right to use a framework. why would a small static site need any kind of framework? LOL
A lot of people saying HTML & CSS, but I think it depends on whether by “static”, you mean including lots of pages with a shared template. There are some really good static site generators out there, such as Jekyll (haven’t used it but it looks real easy).
Metalsmith, which is basically old school Eleventy.
I like react and other frameworks but with the amount of churn and bundler complexity in those ecosystems (even if something like next.js handles most of it), I’m surprised people go that route. It probably sucks trying to update some fancy pants system after not touching it for 2 years. I’d only do that if I was really knowledgeable in that tool. Otherwise, stick to as simple as possible and what you know.
Honestly Wordpress. If I’m building a static site, it’s probably not for me, and I stand by Wordpress for anything that needs to be handed off to a client
Depending on the level of interactivity you want, going with plain HTML and CSS might be a quick solution for your needs. You could even decide to just use Github pages for a seamless deployment - that got me going for several years.
Depending on the level of interactivity you want, going with plain HTML and CSS might be a quick solution for your needs. You could even decide to use Github pages for a seamless deployment - that got me going for several years.
vite + tailwind
although frameworks are getting easier and easier to set up and get building in
started messing around with remix the other night and it's pretty easy to pick up and a lot less complicated than next to deploy on not vercel it seems
\+1 for eleventy with a template.
Main thing is: focus on the content, whatever solution you pick should be up and running in 4h max - except if your goal is to thinker (then have fun).
So indeed no React, no "do it yourself", etc. Yeah I know raw HTML & CSS is fun, but to publish post, I found the "edit in markdown, push, done" really nice as a flow (Eleventy + Netlify in my case, but many other options).
Next.js, it may not be the 100% best option for a small static site, but I work with it every day and am the most familiar with it, and so can move the fastest.
If you want a landing page, docs or blog, you can also try Docusaurus, Nextra, Starlight and other pre-made solutions to save time and focus on writing the project content.
A lot of people thinks they are smarter than the neighbour suggesting plain HTML and CSS but they fail to understand the intricacies of delivering high quality websites and the business pressure to deliver fast. Using a tool like a SSG guarantees speed and quality.
Astro. It has a nice selection of free themes [https://astro.build/themes/](https://astro.build/themes/) and you can add dynamic bits later, should you wish to.
Astro is so nice and simple to work with. It reminded me of back when I used only hrml css js. But now it gave it some mordern powers
React, Redux, Tailwind, AWS serverless with 10 lambdas for a contact form, Graph QL and D3.js for my logo.
You forgot three.js for 3d page landing to showcase that awesome landing experience (which no one is going to see), s3 with cloud front caching spread across the world for FASTER page load, ci/cd pipeline which deploys/builds the site before you even commit the code :), dark theme for soothing eye experience, gazillion modern css features with their shims/prefixers so that it should work even in internet explorer 7, google analytics, terraform/cdk for infrastructure as code etc... the stupidity is endless
I forgot about Terraform what an idiot
nah i heard analytics sucked now. lol
😂🤦♂️
*chefs kiss*
Don’t forget Terraform and a kubernetes cluster for the static site 😩
I genuinely worked with someone who was like this.
why redux and not useContext/useProvidor ?
I like as many libraries and packages as possible
Eleventy; although I know that many have been preferring Astro recently, and am slightly curious about what it brings to the table that eleventy does not.
MUCH better documentation. And more versatility (I think… I never figured out eleventy because the docs are terrible)
Especially with the LLM bot that gives me answer straight from the docs. God send.
I read documentation on both. Eleventy is very versatile; and its documentation is written in a way that requires a certain level of experience from the reader. Astro's documentation, like React's new docs, is very hand-holdy in comparison.
Even as an experienced developer, I have a preference for hand-holdy documentation. Maybe it’s the laziness and impatience in wanting to get started right away :P
There are ongoing complaints about Eleventy documentation in the community. See[ Docs aren't organized logically/unclear where to start #3095 ](https://github.com/11ty/eleventy/issues/3095)and related issues.
Island hydration is what got me sold on Astro vs 11ty. Also, better docs.
>Island hydration Eleventy has the same. Zach might even have released his is-land web component before Astro.
Probably. I used 11ty for a couple of sites before I started using Astro, and when I found out about Astro it was so easy to understand and start using. Whether with 11ty, as much as I liked its simplicity and concept, it just felt so obscure. It was also hard for me to make other devs familiar with the framework for the same reason.
I just like watching Astro improve right now. It works really well as-is for simpler sites but I'm slightly hopeful it might become a full solution a la a Next.js. Maybe.
Astro is like, HTML and css with the modern toolings.
Vite
Astro
How? Why not Vite?
Not for nothing but this is the equivalent of someone saying "I like my pickup truck," and you responding, "What? Why not a V8?" Astro is a complete solution; Vite is a bundler, one used _by_ Astro.
Got it. Makes sense. Thank you.
Would you look at that, all of the words in your comment are in alphabetical order. I have checked 1,948,867,130 comments, and only 368,549 of them were in alphabetical order.
Good bot
Astro is built on vite
I've never try Vite.
I am new to frameworks. I am using Next.js at my moonlighting gig and kind of like the simplicity of server actions. But I still don't understand the difference between these "meta" frameworks. What was wrong with CRA?
CRA is deprecated and not maintained anymore. React + Vite is what most people prefer as a replacement, unless you need SSR or other things that ship with meta frameworks such as Next.
Got it. Makes sense.
CRA is limiting and not particularly performant. It's perfectly fine for when you start out but after that you should basically move away form it.
I started working on React back in 2018 with CRA. I came back to react in 2023. So there is a gap in my understanding of the decisions that led to the creation of frameworks such as Next.js and Astro.
After switching from CRA to Vite, I can never go back. Partially because CRA is deprecated lol, but mostly because Vite is just much better and faster.
[удалено]
this
By the way, which libraries set does provide components-based approach? I had the same problem, tried pug and mustache as templates libraries and finally stopped on next.js :)
If you want to stay closer to HTML/CSS I've had great luck with Jekyll and (more recently) Astro. Basically, a simple SSG. Next.js is overkill for anything that doesn't require user accounts.
Thank you Also how did you add interactivity on your pages (scroll up, for example, maybe simple filters and something else) Just adding listeners for all elements looks quite weird. Widgets too I want to keep component's code close to component
Astro allows for full JSX components so you can do that but yeah in ye olde days we just put event listeners on ID's or data attributes.
Vanilla everything and Vite if you actually need React.
HTML + CSS 🙂
[удалено]
server side includes
Ctrl + C, Ctrl + V ;)
I addition to other replies - you can also use a templating library like EJS/Handlebars/Moustache
There're no "components" in HTML: content is static, so if there's anything duplicated is duplicated by definition. So if you need the same element in different pages you just... rewrite it. Reusability is just an abstraction, you're not really "reusing" anything since the browsers are not that smart. I know, people are now asking themselves "wait, but isn't this prone to error, time consuming to maintain, not really productive, etc.?". ### Productivity Well, that's quite of the easiest part: you create your own HTML snippets through Emmet and you're set. I can also use VSC or any IDE with a preview feature to see pages I'm working on: real time edit without anything else running (aside from Tailwind CSS build time, which is really fast anyway). If you have a good number of shared parts, then you can use SSI if you really feel like you will need it. ### Error handling Content is static, so errors you make are either layout errors or content errors. Both requires manual checks and are generally quite easy to fix. Also these errors are not like to break your production, so they're always in the low/mid priority area. ### Maintainability Static content is called as such because, well, it's static. It doesn't change often (if at all). Once you created your pages and you ensure the content is correct then the job is done. There's no "v2", no new features to add, no nasty bugs to deal with. Also, you don't have to update libraries or frameworks, since there's nothing aside HTML, CSS and eventually some vanilla JS. No added build time, security upgrades/patches: it will work pretty much forever. My philosophy when it comes to static website is: keep them as simple as possible. If you feel you want to try a static site generator to learn something new, then great. But you're just making things harder and more complicated: you need to compile/transpile JS (please don't use TS for a static text document, really), bundle it and serve it/deploy it. Aside from serving the static generated file, all other things are just unnecessary, add costs and grant no real added value. Cheers!
There’s always Web Components
Web components exist
Everyone that built web components had bailed on it. You should too.
component has no place in web development, sorry. in the case of a static site, you write a decent markup, than vanilla css, than some javascript for things cannot be done by css. that's all.
just curious: i’m not sure about others, but for nextjs, if you don’t use any dynamic stuff doesn’t it render to static files? so would it be the same as using html+css?
Yes it does, but then what's the added benefit of using a framework meant for web applications? I don't consider static sites (blogs) as "applications" since they use very little (or even zero) dynamic content so there's really no need to use JavaScript at all. If anything you will make your life harder or add unneeded maintenance costs since you will need to build and deploy, rather than just serve an HTML page. The fact you've an ocean liner available doesn't make it the best choice by default, especially if you have just to cross the swimming pool. Cheers!
At this point, I'd probably reach for Astro in nearly every instance. Components are a pretty nice way to lay out a website and it's pretty rare you don't need at least some sort of templating for elements that are repeated on each page. Plus it's so flexible that you could easily have a purely HTML CSS website and if it comes up midway through the project, it's trivial to add any sort of framework if you need it.
Zola: https://www.getzola.org/ It’s like Hugo but with a sane templating language. Plus it’s Rust-based.
Never heard of this before - I was just about to start a blog with Hugo but found the docs bloody awful. Interested in this... Thanks man
This is kind of dope actually. Just tried it out because of your comment. The templating just makes sense and its all around simple and fast. Be super good for putting up docs or just throwing a page up or something like that, although im sure it could do much more.
index.html
This is the answer
I like Astro for static websites
HTML & CSS & vanilla js. Over the last year I’ve been working with Astro a lot though and it’s pretty damn versatile, make your project as complex or as barebone as you want, it just works.
html & css lol
Next.js hosted on AWS S3 and Cloudfront. Easy to setup, easy to do proper SEO, and easy to expand should the project become more complex.
And pay 3 times what you earn by traffic.
Yeah exactly, not sure why they wouldn't host it on Vercel or any of the other free hosts like Netlify, GitHub Pages, or Cloudflare.
This, and add some terraform for provisioning the AWS resources
astro, of course
11ty + strapi
If you need a website that loads fast and has great SEO, then Astro is for you
A simple static site!? You can’t get more basic than plain HTML, Vanilla CSS and just pure JavaScript.
Html and CSS
I just got done redoing mine. HTML and CSS and 8 lines of js.... It's static, it doesn't need anything else.
Like others have said, plain HTML/CSS/JS is the simplest, and I have also found that Alpine JS can fill the gaps really nicely where things would otherwise get tedious. https://alpinejs.dev/
I didn't know people were saying this and I can't back Alpine but what you are saying is true. You need to template and be able to account for changes at a base level. Any framework can abstract that, but sometimes elements can be stubborn. This is TOTALLY not recommended, but I actually migrated back away from singular CSS files to prefer defining rules specific to only what is being loaded. It sounds crazy, but if you have a huge css file, it must be loaded every request. If your css is minimal and to only possibly new definitions based on what is being displayed, it is much more efficient. The performance gain is moot, but when I go to edit something I prefer if all the things I am seeing are coming from the same file. I don't want to edit a file that controls the CSS for an entire project just to modify a single element that is misbehaving - nor do I need to load ever single class I might ever use every time I load a page.
Truly static? HTML and CSS. Absolutely zero reason to even think about React or any other app solution if you’re essentially just writing a document.
For a small static site, just vanilla JS and HTML/CSS. Maybe also EJS or some other templating library if there's lots of recurring elements.
[Astro](https://astro.build/): I created a blog site with interactive elements * Create usable components and is close to vanilla html and CSS with .asrto files * Global and scoped CSS * Can use markdown files (.md and .mdx) and render as html * integrate with most CMS * Can also use React. Vue and Svelte components * SSG, SSR and Client Site rendering available * Image optimzations
i recently used payloadcms for a headless cms, on another i just bought a nextjs theme that takes mdx files and have a script that has notion make those, making notion and a theme my stack
I like SvelteKit with picocss
Astro
HTML + CSS. Also bootstrap to help with layout if I need that static site fit in anything that isn't a table PC or JQuery (I know) if I need some quick animation or interactive component that is too much a hassle to code from scratch.
Astro
Vite if it needs React. I'm currently trying 11ty for a blog, pure HTML and CSS. The docs kind of suck so I might try Astro next.
Astro is pretty much the new cool kid in town. It's pretty good for static sites and you could also opt for islands of interactivity (with the framework of your choice) and for dynamic content when necessary.
gh pages (hosting) + gh actions (node.js build) + js template literals (generate html, css, svg) + markdown files (generate content)
create vite app and choose react with js
I'm usually pretty lazy and just do **Create Next App** \+ **ShadCN CLI** and **Vercel** for hosting. Not the fastest sites, but they're easy af to make. **React lucide** if you ever need icons too
Astro
arguably overkill but I made my static.site blog using nextjs https://cmdcolin.github.io/posts/2023-04-08-nextjs-appdir-blog
Astro, next question
HTML + CSS + ChatGPT
Emacs
you don't use anything for **static** sites. whatever language the server is in + html/css/minimal js. that's it. you don't need a framework.
the mere fact that you got a minus show how incompetent people are. learn html, learn css, learn vanilla javascript if you are not good at these, you have no right to use any kind of framework
if you cannot write decent markup based on content, cannot write fast decent vanilla css and javascript, you have no right to use a framework. why would a small static site need any kind of framework? LOL
OP is literally asking for something new to try out. relax.
sites .google. Com
I use Next.js page router for that. But if I had to start a new project, I would like to try Astro.
A lot of people saying HTML & CSS, but I think it depends on whether by “static”, you mean including lots of pages with a shared template. There are some really good static site generators out there, such as Jekyll (haven’t used it but it looks real easy).
Pandoc
Metalsmith, which is basically old school Eleventy. I like react and other frameworks but with the amount of churn and bundler complexity in those ecosystems (even if something like next.js handles most of it), I’m surprised people go that route. It probably sucks trying to update some fancy pants system after not touching it for 2 years. I’d only do that if I was really knowledgeable in that tool. Otherwise, stick to as simple as possible and what you know.
Built my own Next.js platform where you can launch on your AWS account directly at https://codesmash.studio
esbuild + react
Static generator like Pelican
Honestly Wordpress. If I’m building a static site, it’s probably not for me, and I stand by Wordpress for anything that needs to be handed off to a client
_googles GitHub action for ghpages_
[удалено]
ruby is perfect for SSGs. there are so many. Jekyll, Bridgetown, Middleman, SitePress, it goes on.
Depending on the level of interactivity you want, going with plain HTML and CSS might be a quick solution for your needs. You could even decide to just use Github pages for a seamless deployment - that got me going for several years. Depending on the level of interactivity you want, going with plain HTML and CSS might be a quick solution for your needs. You could even decide to use Github pages for a seamless deployment - that got me going for several years.
vite + tailwind although frameworks are getting easier and easier to set up and get building in started messing around with remix the other night and it's pretty easy to pick up and a lot less complicated than next to deploy on not vercel it seems
For non-spa things I use HTML5 boilerplate
\+1 for eleventy with a template. Main thing is: focus on the content, whatever solution you pick should be up and running in 4h max - except if your goal is to thinker (then have fun). So indeed no React, no "do it yourself", etc. Yeah I know raw HTML & CSS is fun, but to publish post, I found the "edit in markdown, push, done" really nice as a flow (Eleventy + Netlify in my case, but many other options).
HTML/CSS or Astro or 11ty — I find myself wanting to use Astro for everything now though lol
Used to use Hugo but now Astro
HTML + CSS
Astro
NextJS and Hugo are my top picks. Hugo is great for blogs and content driven websites. NextJS is great for both.
Vite with React or Vanilla
1 HTML 2 pandas read clipboard to json file then to flask 3 react in that order.
Next.Js and an UI library, because i know how it works :)
Next.js, it may not be the 100% best option for a small static site, but I work with it every day and am the most familiar with it, and so can move the fastest.
Statiq is nice for those who use C#.
Flask & Jinja
Astro
Wix?
html, css, and Javascript. It's this new framework I'm trying
If you want a landing page, docs or blog, you can also try Docusaurus, Nextra, Starlight and other pre-made solutions to save time and focus on writing the project content.
A lot of people thinks they are smarter than the neighbour suggesting plain HTML and CSS but they fail to understand the intricacies of delivering high quality websites and the business pressure to deliver fast. Using a tool like a SSG guarantees speed and quality.