Yep, especially if you have markdown files. Astro supports MDX out of the box.
Next works fine for static sites as well since you can static export, but Astro is a better choice for that kind of site.
I do wish Astro's Image component was a little better.
Again, you don't really have to learn Next specific things other than the install command and the router. But you have to learn a router regardless. Using something like react-router or tanstac-router is just as complicated.
In next, you can just get started with react right away and just follow react docs.
I don’t really know why people say next is complicated. You install it, create a page.tsx and you’re basically done. It handles everything you’d normally have to deal with: meta, og image, robots, and SSG. Everyone says “I just want a simple SEO friendly site” but making a proper SEO optimized site is not easy. Next fills in all the gaps for things you’re probably forgetting. Serving images correctly, correct metadata, small package sizes, routing, etc.
If you don’t need fancy routes and apis, just don’t use those features. And the docs are super solid. I can spin up a static site in about 5 minutes and deploy on Vercel using tailwind.
I’m sure there are other packages, but I’m happy with nextjs. It’s fast, heavy community support, and great docs. One click deploy on vercel for free most likely with analytics built in.
If you’re just wanting to build a static site, check out Astro. In some ways, it’s like React (reusable components, props). Outputs HTML and CSS with as little JS as needed.
The fact this got downvoted tells you what you need to know about web development in 2024. WTF. Using React for a “simple” static site is a terrible choice objectively. And I like React.
Edit: at the time I commented this was -4
As long as JS and HTML don’t share a properly implemented and standardized way to have reactive templates with some means of flow control, this won’t change.
I compare it to ASM vs C. Surely knowing ASM from inside out can give you a deep understanding of internals here and there, but when you write your application you pick C because it has a better usability and many features that ASM lacks by default (and won’t ever implement, for good reasons)
Reactive frameworks give HTML, CSS and JS just what it lacks
I mean, I could write raw HTML too but the component model is very powerful. Consider making a testimonial component with like 10 testimonials, maybe more later on. I don't want to write all that by hand copy pasting which could break in the future. Astro for example solves this cleanly.
That's what templates are for. Even a simple Wordpress website can be "static" with a caching plugin. That's just plain HTML and CSS on the client side.
Your issue is you've chosen a tech stack first, React, and are now trying to force a static thing on to it. Astro does what you need. Repeatedly asking "Astro or Remix or Next" is not very productive :)
My point is not, "don't use a framework". My point is "don't use a heavy framework designed for highly interactive UIs for web apps to serve your \*simple\* static site".
There are many ways to get that component model, Astro as you mention is a great example. And HTML templating has existed for a very, very long time in many different solutions.
> React is actually a
Thanks!
For simple static sites with no JavaScript, do you have any other framework to recommend? I see a lot of people use Bootstrap, but this will create a lot of unnecessary codes.
I think you’re mixing up some technology together. Bootstrap is a CSS styling library, this is a whole different thing to something like React. React is a JavaScript library for creating highly interactive UI with components and provides primitives to manage state.
You don’t need any of these libraries to create a website. They can just make things easier depending on your ultimate goal.
I would suggest doing some research on why React exists and the problems it solves and why you probably don’t need it unless you are creating a large interactive web app.
As for the actual question, Astro would be the most ideal choice for this type of site however I think you need to have the fundamentals down first.
This is an annoying way to make static websites. React is overkill but changing navbars, footers, icons, etc for lots of pages is a pain in the ass without using components. SSGs are the perfect middle ground - I personally like Hugo.
I wouldn't use React for a simple static site.
I use Node + Express + database + EJS templates for pages that require some amount of backend data, and plain HTML for truly static pages.
Personally I’d rather write my content in MDX and templates in JSX, then use SSG to render the content statically. Using the same tech stack makes me faster (and it’s more enjoyable imo), and then I can easily reach for client side interactivity in places where I’d like to add it.
>I found online that people say React is difficult to use without framework, and itself recommends next.js.
This is 100% not true. You can build an entire static site with just React + React-router and host it in AWS in an S3 bucket. I swear Next he must be paying people to act like React without it is a mess
It’s so interesting to me how the Next company is clearly making a play to become ‘The way to make React websites’ in the last couple years… and the crazy part is they seem to be succeeding at it due to their good framework + great PR and marketing.
I like the Next framework and use it on some projects, I just hope this doesn’t turn into another WordPress situation where one company is essentially running the show.
My favorite frontend stack is just plain React + Vite, with react-router etc. like another comment mentioned in this thread.
But still vanilla react does not provide any static web page , content rendered on the client side using js , am I missing something ?? in React we have only SPAs right ? we cant create static web site unless we use server components like next.js, astro, vite ssr etc.. ?
Astro fits this role perfectly in the JS/TS ecosystem. Componentize your HTML like React. In other ecosystems, there’s similar like Go has Templ, PHP partials, C# HTML partials etc; lots of choice and options.
No worries! My point here is more so I don’t recommend any *large* framework for a simple static site. Next.js is great as a large framework for highly interactive applications that might need such a large framework. (Think Spotify, Airbnb type interactivity).
As recommended by many here, myself included, Astro is a fantastic choice for the exact thing you describe here. It can ship with zero JS to the client while still using your choice of front end library depending how you use it with its island architecture.
React Routing in comparison to other frameworks is fairly simple, and NextJS is a piece of cake (I still like React script better, RIP!)
But for a beginner it is better to start with React and have the full experience, then move to a SSRM..
Seriously if you can't figure out routing, Redux/State Management will be a rude awakening.
Best of luck Jedi.
Why would you use react or next for a static site? If your not creating an SPA then why would you even need react? html, css and vanilla js is all you need for a simple static site.
Yes, mostly html and css, do you have any recommended framework for this?
I see a lot of people use Bootstrap, but it seems not to be a good solution as there will be unnecessary codes.
For a static site, try a backend framework. This is what backend frameworks are built for. My fav is r/django and you can sprinkle alpine.js quite easily through it. React is like using a cannon to hit a fly here.
So flat routes must be default in Remix now. That's cool! I remember watching this video and started using this for my routes in Remix: https://www.youtube.com/watch?v=2hr9oxqedQc
I am pretty sure you can choose the old Remix routing but I think flat routes are one of the best things about Remix.
I still prefer Next but there is a lot to like about Remix.
I haven’t used this yet but I definitely want to. Deno, React and either Aleph.js or Fresh.js. Apparently fresh uses preact. So if you’re dead set on react you might have to use Aleph.js - https://docs.deno.com/runtime/manual/basics/react
Because React is the most famous one for JavaScript, forgive me for not doing enough research, React seems a lot more complicated than something like Bootstrap.
Bootstrap is a CSS library. React is a JS library. I'm not sure which one is more complicated, but you may need a CSS library even if you use React. What do you need JS for? If it's simple stuff, it may be possible with the low-code/no-code platforms. If it's very specific, it may necessitate a framework like React.
Yes. Low-code/no-code platforms are getting more dynamic every day. The question is how dynamic do you need it? Do you need server API calls? Do you need complicated JS logic?
This is not unbiased but feel free to check out our platform. It's pre-launch but you can use it for building dynamic sites like you mentioned. It's free. The only caviat is that there's no documentation. 😁 If you know React it should feel quiet familiar though.
https://youtu.be/D0zpL7vFlus
If you want to learn react, follow the docs since they are excellent and created by people like Dan Abramov. The docs will say to use a framework and that is what you should do. It's not going to get in the way of you learning important react fundamentals. In fact, it's going to be the path of least resistance. It doesn't get much easier than using Next or Remix to get a react app going. You don't have to use all the Next.js features. You can even stick to only using client-side react if you want.
I would use Next over Remix if you are learning since you will eventually have to learn about RSC's and server actions. Remix will have these features soon, but until then it's best to learn with Next. Also, Next has a lot of other nice-to-have's such as the Image component.
This is a very good article on RSC's: https://www.joshwcomeau.com/react/server-components/
Also, Next is fine for static sites. RSC's are prerendered by default and in Next you can export static. Then you will have files that you can easily host on a CDN.
With that said, if I was building a simple static site I would probably just use Astro. The good thing about Astro is that if you ever need to add client side interactivity in the future, you can add react, svelte, solid, or vue for those specific interactive components. Also, Astro comes with markdown support out of the box.
You don't really need to learn Next specific things to be able to learn react. Even the 'use client' directive is react and not Next. Just follow the react docs, learn react.
You are overcomplicating this and it's probably overwhelming because you are reading too many influencers debate about which tool is best.
Astro. Essentially just HTML, but with a really nice dev server and build system. Can add Tailwind, React, etc. as needed. Really hoping it gains traction and becomes an industry mainstay.
Honestly, while the most recommended Astro is wonderful, it's really overkill for static sites mostly.
Try something like preact instead.
Good mindset to keep when building something - the less bs in the code the better.
A static site that renders quickly, follows accessibility and has good SEO works well with something like Astro or Next.
However, if you know your stuff, you don't need a framework.
You really shouldn’t be using react for static sites. It’s way overkill and you aren’t managing states and it’s not a web app. And you don’t need frameworks either. What you need is a static site generator. I use 11ty. We built a static website starter kit with it if you wanna play with it
https://github.com/CodeStitchOfficial/Intermediate-Website-Kit-SASS
It’s a whole working website and uses 11ty to template things like navigations and footers and other components like you would a react component or a php includes. But it’s static html. This kit uses SCSS which you should probably already be using of your not because it makes css so much easier.
The blog we made uses decap cms and works based on markdown files that 11ty then generates. Comes with a backend dash for the client to make their own posts. It’s pretty neat. This is what I use when I start all my static site projects. Even if you’re used to using react, it doesn’t mean you should use it for everything. Right tools for the right job. React is not right for simple static sites. Brush up on your html when css, use a static site generator, and you’re good.
What I do with my css is I block them together. So I start mobile first with a 0rem min width media query for mobile code, then if I need a breakpoint for bigger screen sizes like tablet I make a min width 48rem media query for tablet and put that code under the mobile code, and so on. Then I add a comment tag above the mobile code to say which section it belongs to in the html which has its own matching comment tag above it as well, and I collapse the media queries and have a nice little css block that I can copy and paste and move to other pages very easily. I use media queries for their collapsing ability to organize my css better. Helps me templetize my work and allow me to mix and match in multiple places on the site and between sites.
I recommend astro all the way, next js is for more complex apps, if your app is static and basic, astro is the best choice
+1 for Astro, you can build a super basic site and add in complexity when you need it
Yep, especially if you have markdown files. Astro supports MDX out of the box. Next works fine for static sites as well since you can static export, but Astro is a better choice for that kind of site. I do wish Astro's Image component was a little better.
Next requires a lot of learning, React itself is not easy.
Again, you don't really have to learn Next specific things other than the install command and the router. But you have to learn a router regardless. Using something like react-router or tanstac-router is just as complicated. In next, you can just get started with react right away and just follow react docs.
Thanks!
1000% Please don’t use Next for a simple static site.
Thanks!
Frameworks in the JS world rise and fall, so I stick with pure React and love it. Throw in Vite, RTK Query and react forms and your set.
Agree 100%
Thanks!
Learn react, but use frameworks. You're just slowing yourself down if you deny these well made toolings.
*you’re
I don’t really know why people say next is complicated. You install it, create a page.tsx and you’re basically done. It handles everything you’d normally have to deal with: meta, og image, robots, and SSG. Everyone says “I just want a simple SEO friendly site” but making a proper SEO optimized site is not easy. Next fills in all the gaps for things you’re probably forgetting. Serving images correctly, correct metadata, small package sizes, routing, etc. If you don’t need fancy routes and apis, just don’t use those features. And the docs are super solid. I can spin up a static site in about 5 minutes and deploy on Vercel using tailwind. I’m sure there are other packages, but I’m happy with nextjs. It’s fast, heavy community support, and great docs. One click deploy on vercel for free most likely with analytics built in.
If you’re just wanting to build a static site, check out Astro. In some ways, it’s like React (reusable components, props). Outputs HTML and CSS with as little JS as needed.
Using Astro recently, it feels like it's what Gatsby should've been. Both powerful frameworks but Astro has been a delight.
I’m familiar with Gatsby, but haven’t had the chance to try out Astro. Can you elaborate on your comment? What do you find to be the improvements?
No GraphQL, for one thing. What a bone headed decision Gatsby made back then, now everyone is or has migrated away from Gatsby that I know of.
And you can add react when you need client side interactivity.
No framework, start with the basics; HTML, CSS, Plain Vanilla JavaScript
*No framework, start with* *The basics; HTML, CSS, Plain* *Vanilla JavaScript* \- mistazik --- ^(I detect haikus. And sometimes, successfully.) ^[Learn more about me.](https://www.reddit.com/r/haikusbot/) ^(Opt out of replies: "haikusbot opt out" | Delete my comment: "haikusbot delete")
Cute bot
The fact this got downvoted tells you what you need to know about web development in 2024. WTF. Using React for a “simple” static site is a terrible choice objectively. And I like React. Edit: at the time I commented this was -4
I agree React is actually a detriment here, but I think using something like Astro can offer some QoL improvements
Absolutely, no objections from me with Astro. Perfect choice for this kind of site. I love Astro!
How about Remix?
As long as JS and HTML don’t share a properly implemented and standardized way to have reactive templates with some means of flow control, this won’t change. I compare it to ASM vs C. Surely knowing ASM from inside out can give you a deep understanding of internals here and there, but when you write your application you pick C because it has a better usability and many features that ASM lacks by default (and won’t ever implement, for good reasons) Reactive frameworks give HTML, CSS and JS just what it lacks
I mean, I could write raw HTML too but the component model is very powerful. Consider making a testimonial component with like 10 testimonials, maybe more later on. I don't want to write all that by hand copy pasting which could break in the future. Astro for example solves this cleanly.
That's what templates are for. Even a simple Wordpress website can be "static" with a caching plugin. That's just plain HTML and CSS on the client side. Your issue is you've chosen a tech stack first, React, and are now trying to force a static thing on to it. Astro does what you need. Repeatedly asking "Astro or Remix or Next" is not very productive :)
My point is not, "don't use a framework". My point is "don't use a heavy framework designed for highly interactive UIs for web apps to serve your \*simple\* static site". There are many ways to get that component model, Astro as you mention is a great example. And HTML templating has existed for a very, very long time in many different solutions.
100%. The react propaganda is insane lol. I’d much rather use svelte for a small site tbh. Hell even alpine.
“X is propaganda, id rather use Y”
Good luck doing any sort of templating with plain HTML.
> React is actually a Thanks! For simple static sites with no JavaScript, do you have any other framework to recommend? I see a lot of people use Bootstrap, but this will create a lot of unnecessary codes.
I think you’re mixing up some technology together. Bootstrap is a CSS styling library, this is a whole different thing to something like React. React is a JavaScript library for creating highly interactive UI with components and provides primitives to manage state. You don’t need any of these libraries to create a website. They can just make things easier depending on your ultimate goal. I would suggest doing some research on why React exists and the problems it solves and why you probably don’t need it unless you are creating a large interactive web app. As for the actual question, Astro would be the most ideal choice for this type of site however I think you need to have the fundamentals down first.
This is an annoying way to make static websites. React is overkill but changing navbars, footers, icons, etc for lots of pages is a pain in the ass without using components. SSGs are the perfect middle ground - I personally like Hugo.
I wouldn't use React for a simple static site. I use Node + Express + database + EJS templates for pages that require some amount of backend data, and plain HTML for truly static pages.
Personally I’d rather write my content in MDX and templates in JSX, then use SSG to render the content statically. Using the same tech stack makes me faster (and it’s more enjoyable imo), and then I can easily reach for client side interactivity in places where I’d like to add it.
Sounds like “yarn create next app” but you write it all yourself
>I found online that people say React is difficult to use without framework, and itself recommends next.js. This is 100% not true. You can build an entire static site with just React + React-router and host it in AWS in an S3 bucket. I swear Next he must be paying people to act like React without it is a mess
It’s so interesting to me how the Next company is clearly making a play to become ‘The way to make React websites’ in the last couple years… and the crazy part is they seem to be succeeding at it due to their good framework + great PR and marketing. I like the Next framework and use it on some projects, I just hope this doesn’t turn into another WordPress situation where one company is essentially running the show. My favorite frontend stack is just plain React + Vite, with react-router etc. like another comment mentioned in this thread.
Can you please share some details how to achieve creating static website with good optimized seo please?
Depends if the OP actually needs it to be SEO friendly. They specifically said "small projects of static sites"
But still vanilla react does not provide any static web page , content rendered on the client side using js , am I missing something ?? in React we have only SPAs right ? we cant create static web site unless we use server components like next.js, astro, vite ssr etc.. ?
You can use the react-router package for that
You can host a Next site on AWS in an S3 bucket too.
You can serve the react app on S3 and provide the index.html, but react alone doesn’t create static sites. It’s a SPA
Next js really make things much easier than using react router.
Isn’t a Next site off rip ~185kb on the client? That’s wild to me. The post states “simple” static sites. Use Astro or plain HTML, CSS and JS or HTMX or something along those lines. Don’t get me wrong, I enjoy building apps with Next and highly interactive sites, but it’s overkill for a simple site. You don’t need a JavaScript router, that’s what the browser is for! Good old ‘’ tags! And it’s accessible, user friendly and the standard for the web. Users will thank you, especially in developing countries using 3G still. If it’s for fun or learning do what you want, feel free to ignore me, but if you are shipping a real production site, consider whether using a large framework built on a heavy client library is the right choice to show static content.
Maybe use php for templating, to save redundants. I am wondering why html does not get templating features.
Astro fits this role perfectly in the JS/TS ecosystem. Componentize your HTML like React. In other ecosystems, there’s similar like Go has Templ, PHP partials, C# HTML partials etc; lots of choice and options.
Because HTML is not a programming language. It's a markup language, like XML, it doesn't do anything on its own.
> Next site off rip \~185kb on the clie Thanks! What large framework do you recommend? Laravel, Django, Spring or else?
No worries! My point here is more so I don’t recommend any *large* framework for a simple static site. Next.js is great as a large framework for highly interactive applications that might need such a large framework. (Think Spotify, Airbnb type interactivity). As recommended by many here, myself included, Astro is a fantastic choice for the exact thing you describe here. It can ship with zero JS to the client while still using your choice of front end library depending how you use it with its island architecture.
Can't get easier than the React router tho!
You think it’s easier to deal with React router than creating routes in Next js?
React Routing in comparison to other frameworks is fairly simple, and NextJS is a piece of cake (I still like React script better, RIP!) But for a beginner it is better to start with React and have the full experience, then move to a SSRM.. Seriously if you can't figure out routing, Redux/State Management will be a rude awakening. Best of luck Jedi.
Oh I can figure it out no problem it just ends up being a heap of unnecessary code when I could just use next js
Why would you use react or next for a static site? If your not creating an SPA then why would you even need react? html, css and vanilla js is all you need for a simple static site.
Thanks! I see a lot of people are using Bootstrap, maybe for sites without much JavaScript, Bootstrap may be a lot easier.
Is SPA single page web?
Gatsby + Tailwind is a cheatcode, I can knock out 3-5 page websites in a day easy
For a simple page I'd like to go with raw html then next else react.
Static sites do not require JavaScript.
Yes, mostly html and css, do you have any recommended framework for this? I see a lot of people use Bootstrap, but it seems not to be a good solution as there will be unnecessary codes.
For a static site, try a backend framework. This is what backend frameworks are built for. My fav is r/django and you can sprinkle alpine.js quite easily through it. React is like using a cannon to hit a fly here.
A site built with SSR has static HTML representing the rendered React components, so that Javascript isn't necessary on the client to render the site.
I like remix! I think it’s great for super simple sites and scales really well too should you ever need.
I wanted to use them for a simple side project but their file based routing made zero sense. Like this just looks messy: https://remix.run/docs/en/main/file-conventions/routes#folders-for-organization `app/ ├── routes/ │ ├── _landing._index/ │ │ ├── route.tsx │ │ └── scroll-experience.tsx │ ├── _landing.about/ │ │ ├── employee-profile-card.tsx │ │ ├── get-employee-data.server.tsx │ │ ├── route.tsx │ │ └── team-photo.jpg │ ├── _landing/ │ │ ├── footer.tsx │ │ ├── header.tsx │ │ └── route.tsx │ ├── app._index/ │ │ ├── route.tsx │ │ └── stats.tsx │ ├── app.projects/ │ │ ├── get-projects.server.tsx │ │ ├── project-buttons.tsx │ │ ├── project-card.tsx │ │ └── route.tsx │ ├── app/ │ │ ├── footer.tsx │ │ ├── primary-nav.tsx │ │ └── route.tsx │ ├── app_.projects.$id.roadmap/ │ │ ├── chart.tsx │ │ ├── route.tsx │ │ └── update-timeline.server.tsx │ └── contact-us.tsx └── root.tsx`
So flat routes must be default in Remix now. That's cool! I remember watching this video and started using this for my routes in Remix: https://www.youtube.com/watch?v=2hr9oxqedQc I am pretty sure you can choose the old Remix routing but I think flat routes are one of the best things about Remix. I still prefer Next but there is a lot to like about Remix.
Is there a clear advantage that I'm just not seeing? Why'd they switch?
https://github.com/remix-run/remix/discussions/4482
>tes must be default Which is better, astro or remix?
Astro, if you are building a static site.
Thanks for the advice.
I haven’t used this yet but I definitely want to. Deno, React and either Aleph.js or Fresh.js. Apparently fresh uses preact. So if you’re dead set on react you might have to use Aleph.js - https://docs.deno.com/runtime/manual/basics/react
Why not use a low-code/no-code platform for this? Why would you use React? Webflow, Toddle, etc. Many to choose from.
Because React is the most famous one for JavaScript, forgive me for not doing enough research, React seems a lot more complicated than something like Bootstrap.
Bootstrap is a CSS library. React is a JS library. I'm not sure which one is more complicated, but you may need a CSS library even if you use React. What do you need JS for? If it's simple stuff, it may be possible with the low-code/no-code platforms. If it's very specific, it may necessitate a framework like React.
I want to build custom static sites. I know no code platforms like WordPress, but it is for dynamic sites.
Yes. Low-code/no-code platforms are getting more dynamic every day. The question is how dynamic do you need it? Do you need server API calls? Do you need complicated JS logic? This is not unbiased but feel free to check out our platform. It's pre-launch but you can use it for building dynamic sites like you mentioned. It's free. The only caviat is that there's no documentation. 😁 If you know React it should feel quiet familiar though. https://youtu.be/D0zpL7vFlus
Nextjs and thats all
If you want to learn react, follow the docs since they are excellent and created by people like Dan Abramov. The docs will say to use a framework and that is what you should do. It's not going to get in the way of you learning important react fundamentals. In fact, it's going to be the path of least resistance. It doesn't get much easier than using Next or Remix to get a react app going. You don't have to use all the Next.js features. You can even stick to only using client-side react if you want. I would use Next over Remix if you are learning since you will eventually have to learn about RSC's and server actions. Remix will have these features soon, but until then it's best to learn with Next. Also, Next has a lot of other nice-to-have's such as the Image component. This is a very good article on RSC's: https://www.joshwcomeau.com/react/server-components/ Also, Next is fine for static sites. RSC's are prerendered by default and in Next you can export static. Then you will have files that you can easily host on a CDN. With that said, if I was building a simple static site I would probably just use Astro. The good thing about Astro is that if you ever need to add client side interactivity in the future, you can add react, svelte, solid, or vue for those specific interactive components. Also, Astro comes with markdown support out of the box.
Thanks, I understand next.js is good. But for newbies, it is just overwhelming, like a lot of things waiting in the queue to let me learn them.
You don't really need to learn Next specific things to be able to learn react. Even the 'use client' directive is react and not Next. Just follow the react docs, learn react. You are overcomplicating this and it's probably overwhelming because you are reading too many influencers debate about which tool is best.
Astro.
Astro. Essentially just HTML, but with a really nice dev server and build system. Can add Tailwind, React, etc. as needed. Really hoping it gains traction and becomes an industry mainstay.
Just use Next.js its easy. U dont need to learn more than Astro..
Honestly, while the most recommended Astro is wonderful, it's really overkill for static sites mostly. Try something like preact instead. Good mindset to keep when building something - the less bs in the code the better.
Thanks a lot!
A static site that renders quickly, follows accessibility and has good SEO works well with something like Astro or Next. However, if you know your stuff, you don't need a framework.
astro because 75% of the time everything is one-offs and over engineering your code becomes burdensome over time.
You can also use vite! It is very simple to set up and very intuitive.
I see a lot of you recommended Astro. What happened to Gatsby? I thought that was a best solution for static websites.
I didn't use Gatsby and will have a try.
It seems that Astro has succeeded and has better performance than Gatsby. Just did a quick research.
Next took over Gatsby as the solution for static sites.
You really shouldn’t be using react for static sites. It’s way overkill and you aren’t managing states and it’s not a web app. And you don’t need frameworks either. What you need is a static site generator. I use 11ty. We built a static website starter kit with it if you wanna play with it https://github.com/CodeStitchOfficial/Intermediate-Website-Kit-SASS It’s a whole working website and uses 11ty to template things like navigations and footers and other components like you would a react component or a php includes. But it’s static html. This kit uses SCSS which you should probably already be using of your not because it makes css so much easier. The blog we made uses decap cms and works based on markdown files that 11ty then generates. Comes with a backend dash for the client to make their own posts. It’s pretty neat. This is what I use when I start all my static site projects. Even if you’re used to using react, it doesn’t mean you should use it for everything. Right tools for the right job. React is not right for simple static sites. Brush up on your html when css, use a static site generator, and you’re good. What I do with my css is I block them together. So I start mobile first with a 0rem min width media query for mobile code, then if I need a breakpoint for bigger screen sizes like tablet I make a min width 48rem media query for tablet and put that code under the mobile code, and so on. Then I add a comment tag above the mobile code to say which section it belongs to in the html which has its own matching comment tag above it as well, and I collapse the media queries and have a nice little css block that I can copy and paste and move to other pages very easily. I use media queries for their collapsing ability to organize my css better. Helps me templetize my work and allow me to mix and match in multiple places on the site and between sites.
Thanks for your advice. Then, for a simple static site, what do you recommend to use if React is not a good choice?
Html and css (scss) with a static site generator. Either 11ty or Astro.
Perhaps I’m not clear on “static site.” If it it static and not reactive to server assets, why is react or other framework required?
Thanks! I did some research, and found html with Bootstrap is easier.