Ask HN: How do I make a website in 2023?
89 comments
Depends what you are actually trying to build. If it is not too complex you can get pretty far with just HTML, JS/jQuery and CSS.
If your goal is to build a complex single page app then you will do fine with React, Angular or Vue. All of these have a learning curve made more complex by the compilation stages required to get it to the browser, but the documentation made by the developers should be enough to get started.
If you want to become competent without having to waste time tracking down blog posts or Stack Overflow answers for specific questions, go and buy a Udemy course for the particular library you want to use. All of the big ones have good courses that will take you from zero to making your own application. It should give you a strong foundation. The courses are inexpensive if you wait for a sale day. There are often a couple every month.
Finally, I think this is where ChatGPT really shines. It is a great tool for exploring new libraries and solving all the small problems you run into along the way. Imagine all the questions you would want to ask on Stack Overflow but they would get downvoted, you can ask those questions to ChatGPT. Stuff like how do I make a checkbox, why does this piece of state not update like I expect it to, how do I display my components in certain routes, show it your webpack file and ask why your application is not starting, etc.
If your goal is to build a complex single page app then you will do fine with React, Angular or Vue. All of these have a learning curve made more complex by the compilation stages required to get it to the browser, but the documentation made by the developers should be enough to get started.
If you want to become competent without having to waste time tracking down blog posts or Stack Overflow answers for specific questions, go and buy a Udemy course for the particular library you want to use. All of the big ones have good courses that will take you from zero to making your own application. It should give you a strong foundation. The courses are inexpensive if you wait for a sale day. There are often a couple every month.
Finally, I think this is where ChatGPT really shines. It is a great tool for exploring new libraries and solving all the small problems you run into along the way. Imagine all the questions you would want to ask on Stack Overflow but they would get downvoted, you can ask those questions to ChatGPT. Stuff like how do I make a checkbox, why does this piece of state not update like I expect it to, how do I display my components in certain routes, show it your webpack file and ask why your application is not starting, etc.
You can include vue with a cdn script tag, no build required. No reason for jQuery anymore.
Man, how much fun was it when it was just html, perl, or php and a db or txt file. It’s all a nightmare now… all the abstractions are lovely and all, but, have they really really improved anything that much? I’d take late 90s internet over todays version anytime!
I make relevant figures by providing clients with just that as a solo dev.
My favorite story is the client that came to me after a superstar dev made them a one pager with Vue, Atomic design and so on. Name a framework buzzword, and that onepager had it.
The client was desperate because the superstar Dev billed them 15k and then disappeared because his pre-booked hours where depleted and he didn't have any more capacity.
I rewrote the entire site in HTML + CSS + Javascript (all static) in 3 days in order to be live. Then I just turned everything into a simple custom Wordpress Theme so that they could change this or that image and text in a backend they knew.
Charged the client 5k (cheap for them, fair for me for a 4-day max project) and they were happy and thankful beyond any possible imagination.
I am not a superstar dev, I don't know all the frameworks, but I know how to structure content thanks to my larger professional background in media. I strongly believe that interpreting and guiding a client's wishes and goals is more important than what you build with.
If anything, "latest and shiniest" or "exaggerated abstraction" is almost never good for mid-size business with regular needs. That's a massive market with a lot of value to go around.
My favorite story is the client that came to me after a superstar dev made them a one pager with Vue, Atomic design and so on. Name a framework buzzword, and that onepager had it.
The client was desperate because the superstar Dev billed them 15k and then disappeared because his pre-booked hours where depleted and he didn't have any more capacity.
I rewrote the entire site in HTML + CSS + Javascript (all static) in 3 days in order to be live. Then I just turned everything into a simple custom Wordpress Theme so that they could change this or that image and text in a backend they knew.
Charged the client 5k (cheap for them, fair for me for a 4-day max project) and they were happy and thankful beyond any possible imagination.
I am not a superstar dev, I don't know all the frameworks, but I know how to structure content thanks to my larger professional background in media. I strongly believe that interpreting and guiding a client's wishes and goals is more important than what you build with.
If anything, "latest and shiniest" or "exaggerated abstraction" is almost never good for mid-size business with regular needs. That's a massive market with a lot of value to go around.
I am content with silimar projects and happy clients.
What's stopping you from doing these things? You can still write a php file and upload it to any hoster and it'll work.
"What's stopping you from doing these things?"
Exactly this!
My personal website is pure html and css on a custom backend. I do not find the combination lacking.
Exactly this!
My personal website is pure html and css on a custom backend. I do not find the combination lacking.
https://shanebellone.com this one?
Usually the only thing stopping people to just use a simple, proven tools is other developers looking down at you because you're not using the latest shiny thing.
PHP is only "simple" and "proven" in that it has proven countless times that it is simply terrible at everything.
The worst developers (as in bad practices, poor code quality, communication problems, zero care for product and just focus on tech, and extreme over or under engineering solutions) that I've found in my 20 year career also happened to be the ones blaming their tools instead of looking at their own practices, skills and beliefs.
Not saying this is the case because I don't know you, but that's been the common theme for a long time.
It's like hearing a carpenter complaining their hammer is just not good and nobody should use hammers and they should instead use a screwdriver because everyone knows how bad and outdated hammers are.
Not saying this is the case because I don't know you, but that's been the common theme for a long time.
It's like hearing a carpenter complaining their hammer is just not good and nobody should use hammers and they should instead use a screwdriver because everyone knows how bad and outdated hammers are.
It's not terrible at making it easy to find good people working on it and making money.
And yet somehow it handily powers over 75% of websites today.[1]
[1]: https://w3techs.com/technologies/history_overview/programmin...
[1]: https://w3techs.com/technologies/history_overview/programmin...
I am not a big fan of PHP, but I remember generating CSS with it. Everybody found that _completely unacceptable_. Now most tools generate CSS in JS and mix structure and styling, and behaviour (using components). Fashion definitely has a strong influence on devs.
It’s a cultural thing, I don’t mean it literally. The web is cooked now, I have nothing to do with it except some comments on HN. I now work in arts and crafts and have all but rejected technology, I am glad I was there for the golden era!
the dream of the 90's is alive at big sky software:
https://htmx.org
https://htmx.org
There's almost as many ways to make a modern website in 2023 as there are developers of modern websites. You'll find plenty of opinions in here, and I of course have my own :)
You can still write websites using the technologies you're familiar with, such as Rails. If your goal is to get something out the door, then I'd suggest you pick something that feels familiar and comfortable, or will hold your attention, and is good enough for the job.
No matter what you choose, there's going to be pro's and con's. That's not to say that each choice is equally good -- some options are on balance worse than others, and the optimal choice also depends on the nature of your project. But chasing the optimal choice can cause delays. I've personally been guilty of swapping a key part of my stack (the website part) half-way through a project, just because I wanted to do it a different way (for that project though, it did not matter).
With that out of the way, my bias: I strongly suggest you pick postgres for your database, which is a favourite on HN for good reason.
You can still write websites using the technologies you're familiar with, such as Rails. If your goal is to get something out the door, then I'd suggest you pick something that feels familiar and comfortable, or will hold your attention, and is good enough for the job.
No matter what you choose, there's going to be pro's and con's. That's not to say that each choice is equally good -- some options are on balance worse than others, and the optimal choice also depends on the nature of your project. But chasing the optimal choice can cause delays. I've personally been guilty of swapping a key part of my stack (the website part) half-way through a project, just because I wanted to do it a different way (for that project though, it did not matter).
With that out of the way, my bias: I strongly suggest you pick postgres for your database, which is a favourite on HN for good reason.
I think you should pick Rails.
It now has by default support for Hotwire -> https://hotwired.dev and it also comes by default with support for importmaps (so you will not even need to install nodejs) and it works with Tailwind.
Here is one command to generate your project:
``` rails new myproject --css tailwind --database postgresql -T main ```
and then you can just start it with
``` bin/dev ```
I think it offers out of the box a very good experience with very few dependencies to install.
You will have:
- Hotwire -> you can make with just a few html attributes very good UI (like independently updating parts of the page without refreshing the page) + Stimulus controllers if you want to write JS for various small tasks.
- PostgreSQL as DB
- ActiveStorage -> upload files to most known clouds
- You can add Devise gem and have all you need to user auth
I recommend using RubyMine as an editor to have full support for go-to definition until deep down to each gem. VSCode with Shopify LSP is also a good combination.
I am not sure what web app you are trying to create, but before reaching to SPA please think if you really need SPA.
It now has by default support for Hotwire -> https://hotwired.dev and it also comes by default with support for importmaps (so you will not even need to install nodejs) and it works with Tailwind.
Here is one command to generate your project:
``` rails new myproject --css tailwind --database postgresql -T main ```
and then you can just start it with
``` bin/dev ```
I think it offers out of the box a very good experience with very few dependencies to install.
You will have:
- Hotwire -> you can make with just a few html attributes very good UI (like independently updating parts of the page without refreshing the page) + Stimulus controllers if you want to write JS for various small tasks.
- PostgreSQL as DB
- ActiveStorage -> upload files to most known clouds
- You can add Devise gem and have all you need to user auth
I recommend using RubyMine as an editor to have full support for go-to definition until deep down to each gem. VSCode with Shopify LSP is also a good combination.
I am not sure what web app you are trying to create, but before reaching to SPA please think if you really need SPA.
THIS.
The same applies if you pick Laravel, in my opinion.
The same applies if you pick Laravel, in my opinion.
Look at htmx, i find the approach refreshing and elegant. May not be a fit for you, and does not address styling but it's an interesting, powerful technology.
https://htmx.org/
Nice essays too: https://htmx.org/essays/
Some useful explanation videos using Django backend: https://m.youtube.com/playlist?list=PL-2EBeDYMIbRByZ8GXhcnQS...
https://htmx.org/
Nice essays too: https://htmx.org/essays/
Some useful explanation videos using Django backend: https://m.youtube.com/playlist?list=PL-2EBeDYMIbRByZ8GXhcnQS...
This.
I usually go with Django + Tailwind and htmx. Most projects don’t need React imo, htmx provides just enough interactivity.
You are allowed to use rails and jquery. (You usually won’t even need jquery anymore)
That said, I recommend trying the SvelteKit tutorial and seeing if you like working with it. If nothing else it’ll let you skip a lot of that framework-analysis paralysis. https://learn.svelte.dev/tutorial/welcome-to-svelte
That said, I recommend trying the SvelteKit tutorial and seeing if you like working with it. If nothing else it’ll let you skip a lot of that framework-analysis paralysis. https://learn.svelte.dev/tutorial/welcome-to-svelte
[deleted]
Next.js has a very good developer experience, and there's lots of tutorials and documentation on it. With that said, there's nothing wrong with picking Rails. It's not as popular as the JS frameworks anymore, but it's arguably much better in many ways.
JS suggestions: Sveltekit, Next.js, Remix Server-side suggestions: Rails, Phoenix, Django, Laravel
JS suggestions: Sveltekit, Next.js, Remix Server-side suggestions: Rails, Phoenix, Django, Laravel
Next.js does indeed have those positives, but it steers you towards paid services (prisma and vercel)
For backend, flask is still around, or Django if you want to go bigger. PHP is usable these days, especially with Laravel. Golang also has lots of options.
For frontend, vanilla JS and modern CSS go a long way. Reactivity is something you can build yourself if needed (https://news.ycombinator.com/item?id=35937464, among other examples).
Though for CSS I'd like to know if there's a slightly less outdated alternative to Spectre: Something that ships a sane default design (and not just unstyled components), but isn't a giant mess like Bootstrap.
For frontend, vanilla JS and modern CSS go a long way. Reactivity is something you can build yourself if needed (https://news.ycombinator.com/item?id=35937464, among other examples).
Though for CSS I'd like to know if there's a slightly less outdated alternative to Spectre: Something that ships a sane default design (and not just unstyled components), but isn't a giant mess like Bootstrap.
This is my Flask+Vue boilerplate: https://github.com/void4/lazyweb/
You do not mention what kind of web site : portfolio ? the next google ?
You can get a web site quickly by asking https://durable.co to IA-write it. You will get a non-descript, not "this is really me" web presence.
If you are looking for a challenge you can try to belong to the http://1mb.club you can even aim for the https://1kb.club/
You can get a web site quickly by asking https://durable.co to IA-write it. You will get a non-descript, not "this is really me" web presence.
If you are looking for a challenge you can try to belong to the http://1mb.club you can even aim for the https://1kb.club/
It's simple. Just take the hydraulic react redux emulator, and attach it to the transdimensional photon nodejs emitter. Bam! New website.
But seriously, nerds these days don't make it easy. Pretty sure they revel in the complexity. The nicest simple stack I've found is this:
1. FastAPI backend - this is almost really good for getting a simple backend running. Some downsides:
- some astonishments, bugs: [1] [2]
- it's coupled with Pydantic, which can get confusing because you end up with basically two sets of models if you use an ORM: your ORM "actual models" and then your Pydantic validation models. Just got a little confusing. I'd rather avoid Pydantic and ORM's completely.
- uvicorn? gunicorn? unicorn? WSGI? who?
- it's python, so you'll have to deal with cringe and blue-pilled dependency management, among other things
2. Vanilla HTML, CSS, and JS - nice thing about FastAPI is you can be flexible with how you implement the frontend. I've used it to make everything from simple SPA's using vanilla web components to traditional templated SSR sites, and mixes therein.
[1] https://github.com/tiangolo/fastapi/issues/2872
[2] https://github.com/tiangolo/fastapi/discussions/3970
But seriously, nerds these days don't make it easy. Pretty sure they revel in the complexity. The nicest simple stack I've found is this:
1. FastAPI backend - this is almost really good for getting a simple backend running. Some downsides:
- some astonishments, bugs: [1] [2]
- it's coupled with Pydantic, which can get confusing because you end up with basically two sets of models if you use an ORM: your ORM "actual models" and then your Pydantic validation models. Just got a little confusing. I'd rather avoid Pydantic and ORM's completely.
- uvicorn? gunicorn? unicorn? WSGI? who?
- it's python, so you'll have to deal with cringe and blue-pilled dependency management, among other things
2. Vanilla HTML, CSS, and JS - nice thing about FastAPI is you can be flexible with how you implement the frontend. I've used it to make everything from simple SPA's using vanilla web components to traditional templated SSR sites, and mixes therein.
[1] https://github.com/tiangolo/fastapi/issues/2872
[2] https://github.com/tiangolo/fastapi/discussions/3970
If you are doing it alone then you don't need any of these. Go for simple HTML, JS, CSS and PHP server side.
The popular solutions you find online are for Enterprise. Where different teams maintain the same site and no one "owns" any part of the code.
The popular solutions you find online are for Enterprise. Where different teams maintain the same site and no one "owns" any part of the code.
Reactivity libraries are really useful, though. But the number of available options is a bit overwhelming.
All you need is html, js, css. Don't fall for the over-engineering meme. And a backend framework if you need a backend.
I have been years frustrated with this question. In the old days I used to do web2py for my simple crud projects. That included lots of boilerplate code, creating a crud form was very simple (if I recall correctly, one row of code if you were happy with the data model defaults). Then came mobile and responsive designs and a couple of frustrating things with web2py that I don't recall anymore. And I started looking for alternatives. Everything I have looked seems to be a sh*tload of manual writing for simple crud forms or dependent on trusting some random boilerplate repo in github to stay future proof. To date I have not found a reasonable framework that would let me build simple responsive crud apps easily. (As a very much not professional web dev, that is)
Luckily, though, then ChatGPT came. You can just ask GPT to generate the flask backend and forms using bootstrap.
Luckily, though, then ChatGPT came. You can just ask GPT to generate the flask backend and forms using bootstrap.
I know React ecosystem has a bad rep but IMO, if you are willing to learn React, Next.js + Vercel is the fastest way to go from zero to deployed.
Vercel can get bit expensive if you get high traffic but that's one of the better problems to have. Their free tier is generous enough to get started.
Vercel can get bit expensive if you get high traffic but that's one of the better problems to have. Their free tier is generous enough to get started.
It's hard if you follow every trend and what every "influencer" suggests on Twitter.
Just pick Laravel or Rails and you have right there everything you need with great and cohesive documentation and plenty of books, courses and years of proven success, third party extensions and a great ecosystem. Although it might not work if your intention is to do some CV padding instead of actually building something.
Now, if you want Next.js server components with GraphQL and Prisma through trpc and isomorphic JavaScript running on the edge deployed on docker on top of kubernetes.... then yes, it could be difficult, specially if you've not been around here for some time.
Just pick Laravel or Rails and you have right there everything you need with great and cohesive documentation and plenty of books, courses and years of proven success, third party extensions and a great ecosystem. Although it might not work if your intention is to do some CV padding instead of actually building something.
Now, if you want Next.js server components with GraphQL and Prisma through trpc and isomorphic JavaScript running on the edge deployed on docker on top of kubernetes.... then yes, it could be difficult, specially if you've not been around here for some time.
[deleted]
You can still run LAMP stack on something like Digital Ocean. There are even pre-built droplets.
Personally, I build webapps in Go now. I make heavy use of the HTML templating package, and then just use vanilla HTML, CSS, and JS on the front end. Database in PostgreSQL or MySQL.
That will build a binary that you can run locally, and when you're ready to deploy you just drop that and your template files on a VPS. Very easy to migrate this stack to a cloud architecture as you scale, e.g. on App Engine.
The tech debt I have on this stack right now is still running with the Gorilla Toolkit project which has been shuttered.
Personally, I build webapps in Go now. I make heavy use of the HTML templating package, and then just use vanilla HTML, CSS, and JS on the front end. Database in PostgreSQL or MySQL.
That will build a binary that you can run locally, and when you're ready to deploy you just drop that and your template files on a VPS. Very easy to migrate this stack to a cloud architecture as you scale, e.g. on App Engine.
The tech debt I have on this stack right now is still running with the Gorilla Toolkit project which has been shuttered.
NextJS is the most plug and play option nowdays. It's not really Next + React as React is part of Next really.
It's a NodeJS framework so it is also your backend, no need for anything separate. The DB is up to you but you can get a hosted mongoDB or postgres pretty easily.
I would not bother with tailwind, good ol' CSS is good enough.
But really, NextJS, hosted on vercel (maker of nextJS) that give you CI / CD out of the box, you can create each page like you would in a PHP application, and also API routes in a similar fashion (one file = one route).
I would not bother with tailwind, good ol' CSS is good enough.
But really, NextJS, hosted on vercel (maker of nextJS) that give you CI / CD out of the box, you can create each page like you would in a PHP application, and also API routes in a similar fashion (one file = one route).
Or just do what you used to do, its not that much different only if you jump on the hype train frameworks.
The answers to this question put together as a whole are the reason why the question exists at all:
- HTML/JS/CSS
- Rails/jquery
- Sveltekit
- Flask/Django/Laravel/Golang + JS/CSS
- ASP.NET + vue.js/Blazor
- Nexts.js / Rails
- Cockroach/Netlify for DB
- Phoenix
- React
Let's face it, there's no consensus.
- HTML/JS/CSS
- Rails/jquery
- Sveltekit
- Flask/Django/Laravel/Golang + JS/CSS
- ASP.NET + vue.js/Blazor
- Nexts.js / Rails
- Cockroach/Netlify for DB
- Phoenix
- React
Let's face it, there's no consensus.
Ha ha, this indeed. But how to form consensus?
Consensus might be imposed (e.g. a monopoly situation) which does not seem to apply yet (thankfully).
Consensus might also emerge if independent entities realize that they might benefit greatly from it (e.g. accelerating the maturity of consensus approaches, reducing costs etc.).
So far we can empirically state the obvious (that centrifugal forces are stronger than consensus forming forces). Whether the future will look like the past is anybody's guess.
Consensus might be imposed (e.g. a monopoly situation) which does not seem to apply yet (thankfully).
Consensus might also emerge if independent entities realize that they might benefit greatly from it (e.g. accelerating the maturity of consensus approaches, reducing costs etc.).
So far we can empirically state the obvious (that centrifugal forces are stronger than consensus forming forces). Whether the future will look like the past is anybody's guess.
Are you making this project specifically to learn new things and modern tools and workflows? Or are you trying to build a product?
If it's the latter, just build your standard dynamic monolithic web app using boring technology that you know. If it doesn't need to be dynamic, even better, build your standard static site.
You can always add dynamism and frontend frameworks on top of it to meet your and your users' needs, and you can always add the new shiny library or framework you want to try out, too.
If it's the former, go on https://hn.algolia.com and search for this same question, as it's been asked in a variety of different contexts with a variety of different answers that can help you decide exactly what modern technologies are right for what you're trying to accomplish. I bring it up not to say that this question is redundant or anything, but just as an aside if you don't know about it and want to see what others have said about it in the past.
My suggestion when choosing between new technologies is to just go with whatever has the most community support and momentum. There tend to be less less headaches, problems and road blocks on the well-trodden paths.
If it's the latter, just build your standard dynamic monolithic web app using boring technology that you know. If it doesn't need to be dynamic, even better, build your standard static site.
You can always add dynamism and frontend frameworks on top of it to meet your and your users' needs, and you can always add the new shiny library or framework you want to try out, too.
If it's the former, go on https://hn.algolia.com and search for this same question, as it's been asked in a variety of different contexts with a variety of different answers that can help you decide exactly what modern technologies are right for what you're trying to accomplish. I bring it up not to say that this question is redundant or anything, but just as an aside if you don't know about it and want to see what others have said about it in the past.
My suggestion when choosing between new technologies is to just go with whatever has the most community support and momentum. There tend to be less less headaches, problems and road blocks on the well-trodden paths.
I recommend you see how far you can get with ASP.NET.
That’ll keep you in the realm of “making a website” and away from “learning the entire Node.js stack from first principles.”
You could add (non-compiled) Vue.js templates to it which is more akin to jQuery, or try Blazor (ASP.NET that runs both on the client and on the server.)
Neither of these are particularly well recognized as the typical path, but they will do the job if your intent is to build a functional website.
That’ll keep you in the realm of “making a website” and away from “learning the entire Node.js stack from first principles.”
You could add (non-compiled) Vue.js templates to it which is more akin to jQuery, or try Blazor (ASP.NET that runs both on the client and on the server.)
Neither of these are particularly well recognized as the typical path, but they will do the job if your intent is to build a functional website.
I use rails, with some turbo/stimulus.js if I need it. Often I don't need any JS. And I can get something built in a few days or weeks at most.
I can recommend Kirby (https://getkirby.com/), a flat file PHP CMS. It’s fast, has a panel to update data and can be hosted on any basically any PHP host. Just use the quite simple PHP-templates and add CSS & JS like you already know how to do. No need to complicate things.
Just go with rails and whatever you feel comfortable with in the frontend (jquery or react, or whatever). Ignore what's modern.
Configure a PHP environment on your windows, mac or linux machine
Create index.php and put your content.
Link Jquery and Bootstrap/Bulma/Skeleton css framework
Start with the basics stuff and slowly increment, until you have a working prototype.
Start with the default PHP server: php -S localhost:8000
PHP is object oriented and have a ton of libraries for everything imaginable.
Create index.php and put your content.
Link Jquery and Bootstrap/Bulma/Skeleton css framework
Start with the basics stuff and slowly increment, until you have a working prototype.
Start with the default PHP server: php -S localhost:8000
PHP is object oriented and have a ton of libraries for everything imaginable.
What do you actually want to build? Without knowing that, the suggestions people are making are shots in the dark.
If you're already familiar with RoR then it seems quite a sensible choice to me to just go with that. Working in a modern Rails codebase can be insanely productive and is probably a bit more polished and stable than a modern JS/TS codebase (oh you haven't touched your codebase in a few months? Here are 7 major version changes across 3 frameworks none of which are compatible with one another).
For the frontend I highly recommend Svelte as it's dead simple to get started with and the learning curve is quite mellow. If you don't want to mix programming languages in your codebase, SvelteKit is a good option, but it can be quite finicky to setup and to get working according to your tastes if your tastes stray too far from the SvelteKit happy path.
For the frontend I highly recommend Svelte as it's dead simple to get started with and the learning curve is quite mellow. If you don't want to mix programming languages in your codebase, SvelteKit is a good option, but it can be quite finicky to setup and to get working according to your tastes if your tastes stray too far from the SvelteKit happy path.
Funnily enough a lot server side options like Rails and PHP with Laravel are having a resurgence in popularity. Like other people have said, there are a million different options, which is partly the problem in the world of JS.
I would just go with what you know already and find the easiest way forward. Lots of SaaS companies like Shopify and ConvertKit work on Rails so why not just re-fresh your knowledge there instead of learning the latest JS library? Ask ChatGPT to fill in gaps of your knowledge. I've also heard good things about Rails Casts and I've just gone to their site and the Pro content is now all free!
Basically, the best programming language is the one you know best.
I would just go with what you know already and find the easiest way forward. Lots of SaaS companies like Shopify and ConvertKit work on Rails so why not just re-fresh your knowledge there instead of learning the latest JS library? Ask ChatGPT to fill in gaps of your knowledge. I've also heard good things about Rails Casts and I've just gone to their site and the Pro content is now all free!
Basically, the best programming language is the one you know best.
HTML and CSS + jQuery or vanilla js is still great. You can use PHP to load headers and footers if the site is large. This is for a normal website with basic functionality. You don't need any framework. There's nothing wrong with using FTP to upload your files. Put your stylesheets in one file for desktop size and one file for mobile size, maybe one for dark mode as well.
I set up Apache to treat HTML files the same as PHP files and then I can mix however I please and development is super easy and clean.
I set up Apache to treat HTML files the same as PHP files and then I can mix however I please and development is super easy and clean.
I've been doing a lot of web dev for the past few years and have used angular, react, and vue in production within the last year.
My recommendations:
- Vue+vuetify is my preference for frontend framework. None of them are perfect but I think Vue is the simplest. Tailwind is nice for prototyping but doesn't scale well , I always end up ditching it after a few weeks
- Typescript on both frontend and backend (to easily share code & interfaces and get nice IDE goodies in VSCode). I like NestJS or just plain express.
- Avoid ORMs, I like Kysely for Postgres
- You can easily spin up a database (RDS), frontend (CloudFront), and backend (Lambda is easiest) within the free tier on AWS.
My recommendations:
- Vue+vuetify is my preference for frontend framework. None of them are perfect but I think Vue is the simplest. Tailwind is nice for prototyping but doesn't scale well , I always end up ditching it after a few weeks
- Typescript on both frontend and backend (to easily share code & interfaces and get nice IDE goodies in VSCode). I like NestJS or just plain express.
- Avoid ORMs, I like Kysely for Postgres
- You can easily spin up a database (RDS), frontend (CloudFront), and backend (Lambda is easiest) within the free tier on AWS.
Curious why tailwind isn't scaling for you. Vue + Tailwind + Supabase + Vercel is working great for my projects.
To answer your specific question about where to store data - use Cockroach DB. Where do you plan to host? I'd recommend Netlify - it has good support for Next and integrates well with Cockroach DB.
I still write basic HTML, styled using any of a number of simple classless CSS templates, like Pico [0].
[0] https://picocss.com/
[0] https://picocss.com/
That question is very generic, so I'll give a sadly boring and generic answer.
Two options here:
a) You want to learn. Pick whatever fancies you. Do it, but don't expect the end result to be perfect, because you're going to make mistakes, which is part of learning. There is no turn-key "best practice" checklist that would result in learning and not making mistakes.
b) You want to achieve some real and concrete project. That something is by and large independent of the tech you'll be using, as long as that tech stack satisfies the project requirements. Pick the one you're most confortable with and that satisfies said requirements. Do it. Focus on the project goal. Make it work, make it right, make it fast. Ship it. You'll have enough on your hands with the project itself that you don't want to lose your way down tech rabbit holes.
Doing a) and b) together has a high chance of blowing up in your face.
Side project? You probably won't have much time/energy for it, so focus is key. Make peace with the fact that project goal is either a) or b).
If a): This is a sandbox. Try stuff, compare options, tear it apart, _throw it away_. Using the project idea as a mere guideline, a "how could I do this or that" impetus, you're at liberty of hacking around, comparing and whatnot without fear nor constraint. Embrace the malleable nature of sand.
If b): You know Rails? Go with Rails. React is fine in front of Rails (heck, erb/slim backend rendering is fine even in most cases). Define "modern": is it _really_ about the tech, or about the UI/UX? Sick of these thousand JS/CSS bundlers and Rails trying too hard to integrate with an alien world? Keep it simple, emit JS/CSS and stuff it in `public` for Rails to serve. No fancy live reload? So what, big deal. fswatch+xdg-open/open get you 99% of the way. It's static in production anyway. Resist fancy, go for simple and useful. Achieve the project by yourself, which is a learning in itself.
In both cases, avoid choice paralysis. Trying to do a) and b) at the same time only amplifies it. Make a choice, decide what are you gonna do, how you're gonna do it. Just decide and move forward, sidestep the paradox of choice. Just do it. There is no perfect unicorn anyway.
Two options here:
a) You want to learn. Pick whatever fancies you. Do it, but don't expect the end result to be perfect, because you're going to make mistakes, which is part of learning. There is no turn-key "best practice" checklist that would result in learning and not making mistakes.
b) You want to achieve some real and concrete project. That something is by and large independent of the tech you'll be using, as long as that tech stack satisfies the project requirements. Pick the one you're most confortable with and that satisfies said requirements. Do it. Focus on the project goal. Make it work, make it right, make it fast. Ship it. You'll have enough on your hands with the project itself that you don't want to lose your way down tech rabbit holes.
Doing a) and b) together has a high chance of blowing up in your face.
Side project? You probably won't have much time/energy for it, so focus is key. Make peace with the fact that project goal is either a) or b).
If a): This is a sandbox. Try stuff, compare options, tear it apart, _throw it away_. Using the project idea as a mere guideline, a "how could I do this or that" impetus, you're at liberty of hacking around, comparing and whatnot without fear nor constraint. Embrace the malleable nature of sand.
If b): You know Rails? Go with Rails. React is fine in front of Rails (heck, erb/slim backend rendering is fine even in most cases). Define "modern": is it _really_ about the tech, or about the UI/UX? Sick of these thousand JS/CSS bundlers and Rails trying too hard to integrate with an alien world? Keep it simple, emit JS/CSS and stuff it in `public` for Rails to serve. No fancy live reload? So what, big deal. fswatch+xdg-open/open get you 99% of the way. It's static in production anyway. Resist fancy, go for simple and useful. Achieve the project by yourself, which is a learning in itself.
In both cases, avoid choice paralysis. Trying to do a) and b) at the same time only amplifies it. Make a choice, decide what are you gonna do, how you're gonna do it. Just decide and move forward, sidestep the paradox of choice. Just do it. There is no perfect unicorn anyway.
I think React, combined with one of the backend frameworks are well-suited for your use-case.
Back when I was first starting out, React was new and now they've ironed out a lot of the kinks/bugs we faced. It is a solid framework of choice for any frontend-related work.
On the backend, you can't go wrong with Django. Or any of the Python-backend frameworks like Flask. You'll have to learn the intricacies of the frameworks to implement a decent app.!
Good luck.:)
Back when I was first starting out, React was new and now they've ironed out a lot of the kinks/bugs we faced. It is a solid framework of choice for any frontend-related work.
On the backend, you can't go wrong with Django. Or any of the Python-backend frameworks like Flask. You'll have to learn the intricacies of the frameworks to implement a decent app.!
Good luck.:)
Astro - https://astro.build/
Is probably the fastest thing you can use with extremely sensible defaults and that you can use alongside most web frameworks.
I've been using React for 6 years but this has changed my view of what is possible. You can write React/Vue and have it compiled statically or keep the component's interactivity.
It's the tool I had been looking for for years.
Is probably the fastest thing you can use with extremely sensible defaults and that you can use alongside most web frameworks.
I've been using React for 6 years but this has changed my view of what is possible. You can write React/Vue and have it compiled statically or keep the component's interactivity.
It's the tool I had been looking for for years.
>Leverage Astro's unique zero-JS frontend architecture to unlock higher conversion rates with better SEO.
I don't know Astro, and I'm sure other frameworks write similar stuff on their landing pages, but this state of web design just makes me puke.
I don't know Astro, and I'm sure other frameworks write similar stuff on their landing pages, but this state of web design just makes me puke.
Me too. It’s absurd
A few other options to put on the table.
A CMS like Webflow or Ghost have a theme system and are pretty powerful and flexible.
Static site generators like Gatsby and Hugo can take away some of the busy work and decisions.
A headless CMS like Strapi can handle your backend.
These are all viable low code alternatives and flexible enough for most sites nowadays.
For anything interactive and CRUD based, I still haven’t found anything faster than Rails, and I’ve been through them all.
A CMS like Webflow or Ghost have a theme system and are pretty powerful and flexible.
Static site generators like Gatsby and Hugo can take away some of the busy work and decisions.
A headless CMS like Strapi can handle your backend.
These are all viable low code alternatives and flexible enough for most sites nowadays.
For anything interactive and CRUD based, I still haven’t found anything faster than Rails, and I’ve been through them all.
I think your question is too broad.
As soon as you restrict yourself to a specific stack, you'll be able to find out by researching via the web.
As soon as you restrict yourself to a specific stack, you'll be able to find out by researching via the web.
Depends on the project. I have a website that is a made of MD files (I'm using a static site generator) and it's fast and cheap to mantain (free).
For complex things like if you need DB or something else depends on your knowledge.. I'd go for Rust for the API and Bulma.io for the Frontend.
For JS only next.js and Tailwind looks like a good bet but no clue.
For complex things like if you need DB or something else depends on your knowledge.. I'd go for Rust for the API and Bulma.io for the Frontend.
For JS only next.js and Tailwind looks like a good bet but no clue.
So my best experience over the past year in the front end world (React only), has been with Vite using the react-typescript template. You get to use es modules (modern js) without any trouble and typescript just works.
For css, I usually don’t bother with any advanced framework, I commonly go with mui, but you can just do css files or css in js.
For css, I usually don’t bother with any advanced framework, I commonly go with mui, but you can just do css files or css in js.
Don't overthink it. HTML, CSS, JavaScript, and Bootstrap for consistent look-and-feel and theming.
If it's not an app itself, you probably don't need a framework such as React for a website and you don't need to precompile and bundle CSS either for most simple website use cases.
If it's not an app itself, you probably don't need a framework such as React for a website and you don't need to precompile and bundle CSS either for most simple website use cases.
It's not about what you use, but the fact that you actually use it. I would grab whatever you feel an inclination towards.. be it Nextjs, Rails, PHP, etc.
The only thing that matters is that you do-- so pick whatever gets you off HN and into your editor of choice :)
The only thing that matters is that you do-- so pick whatever gets you off HN and into your editor of choice :)
I am trying to learn how to build React apps with ChatGPT following the TDD method. Building a todo app is just one single prompt. ChatGPT is pretty good at coming up with test cases given a set of requirements. For the backend, I'm thinking of Supabase.
If you're already looking at Next.js + Tailwind but unsure about what to use for the DB, I'd recommend checking out the T3 stack [1].
It uses tRPC [2] for type-safe API calls and Prisma [3] for your DB. There's lots of content out there teaching how to use this stack to build sophisticated apps (e.g. this in-depth tutorial teaching how to build a social media app [4]).
Disclaimer: I work at Prisma and am also a huge fan of type-safety, so T3 is basically my dream stack.
[1] https://create.t3.gg/
[2] https://trpc.io/
[3] https://www.prisma.io/
[4] https://www.youtube.com/watch?v=jqVm5_G1ZEE&ab_channel=WebDe...
It uses tRPC [2] for type-safe API calls and Prisma [3] for your DB. There's lots of content out there teaching how to use this stack to build sophisticated apps (e.g. this in-depth tutorial teaching how to build a social media app [4]).
Disclaimer: I work at Prisma and am also a huge fan of type-safety, so T3 is basically my dream stack.
[1] https://create.t3.gg/
[2] https://trpc.io/
[3] https://www.prisma.io/
[4] https://www.youtube.com/watch?v=jqVm5_G1ZEE&ab_channel=WebDe...
Why do you need user authentication, data model and user state, what is that part doing?
> ”How do I make a website in 2023?”
The same way you have in previous years… using the tools you are familiar with.
Don’t waste time on shiny new tech, it’s a huge time investment.
But, if you enjoy the process of learning it, then go dive into some new stacks!
The same way you have in previous years… using the tools you are familiar with.
Don’t waste time on shiny new tech, it’s a huge time investment.
But, if you enjoy the process of learning it, then go dive into some new stacks!
My suggestion is to use a static site generator like Hugo, which is easy to setup and uses markdown for everything. If you like the CSS side of things, you might like Astro, which is also a static site generator.
You might wanna have a look at Phoenix Framework
https://www.phoenixframework.org/
https://www.phoenixframework.org/
[deleted]
Fastest way I make a quick single page info site today:
Sveltekit on Vercel, with a Cloudflare Worker wrapped around the Notion API. It even updates live
Sveltekit on Vercel, with a Cloudflare Worker wrapped around the Notion API. It even updates live
Maybe you should try https://svelte.dev/ for js part.
my current go-to stack for webdev is svelte on the frontend with a golang api on postgres database. Deploy behind an openresty ( nginx's fork ) server.
Usually quite performant, easy on cloud resources and even fun to work with... ( also "modern" enough so i would not have to explain to others what a perl-cgi script is )
A few posts here mention static site generators.
Which one(s) are being used (or avoided?)
People actually still make websites from scratch? Why not just use a CMS. I think rather than focus on actual content, techies just want to tinker with the code. It's like building/restoring a vintage car rather than just buying a Prius when all you want to do is go from point A to B.
Markdown for content & vanillaJS/jQuery at max. Go crazy with themeing!
cljs and reagent. my setup is this:
https://github.com/nathants/aws-gocljs
https://github.com/nathants/aws-gocljs
[deleted]
[deleted]
vercel, nextjs, regular JS, react
FastAPI + a random template
Next will work fine.
I just had an idea for a side project and I want to make a modern website. I spent the last 20 hours trying to figure out what the best practices are now. Everything should've gotten easier, right? It has been 10 years after all.
But I'm totally lost. 4 layers of bundlers. Two layers of language abstractions. CSS frameworks that need to be compiled!? Several more layers of database abstractions and services that I have no idea what they do by looking at their landing pages.
My requirements are pretty simple. I want it to work on all devices and look good. I need some user authentication and user state, but nothing complex. The data model is relatively simple, but it needs to be stored somewhere, local storage is not enough.
From all my research, my best bet right now seems to be next.js + React + Tailwind because that combination seems to be relatively popular and well-documented with good editor integrations. Not sure what to use for the database/backend though. I also looked at htmx but don't really like the idea of templating html snippets on the server without great editor integration.
So, how do I actually make a modern website? Is it really this hard?
(I'm aware there have been similar threads the past year, but they're already a year old, which is an eternity in JS world)