HACKER Q&A
📣 dr_atom

What technology to chose for a web app in 2020?


TL;DR: What front end technology should an inexperienced web developer team of two pick when starting a new project?

My startup is developing a web app that is very visualization-heavy. Since I have a background in machine learning and Python the prototype is based on plot.ly's dash. Changing the prototype has become more and more difficult and there are some aspects of dash that I'm not very happy with:

Poor separation of front end and back end code, Mix of Python and JS/HTML/CSS, No support for mobile, Difficult to extend (e.g. integrating maps was painful)

The bottom line is, it all feels like we have reached the limits of our current technology stack and we should start from scratch with more suitable technology.

So I went out to see how web apps are done "properly" in 2020. Separating front end and back end is a very obvious first step. The back end technology is also very easy to pick. But the technologies and trends regarding front end are just overwhelming for me. I've read/watched multiple guides on the topic (e.g. https://youtu.be/0pThnRneDjw) and they all present multiple areas (UI, CSS, transpiler, database, etc.) from which one library/framework/etc. must be chosen.

I'm looking for a as-small-as-possible subset of these technologies that is strong in the following areas: Maintainability: This is the number one priority. The code must be easy to change, extend and debug. Extensibility: Plays well with new libraries/technologies. Easy to learn. Good solution for the long term

Some technologies that caught my eye are: TypeScript, vue.js, chart.js, GraphQL. But I have very little confidence in my choices. Can you help me navigate this space?


  👤 laurentl Accepted Answer ✓
The answer to this question is almost always: "the stack you're most comfortable with".

In your case, given that you have (apparently) a strong Python background, you should try to see how far you can go with Django and some vanilla js. If your front-end doesn't absolutely have to be a SPA, you'll be up and running and productive much more quickly with a fairly simple (server-side logic and page generation) and user-friendly (Django) stack. No need to jump into node, npm, etc.

If you want or need to get more fancy with the front-end, vue.js is relatively easy to pick-up, fairly future-proof (as another poster pointed out, vue and React are the two main choices), and can be included fractionally in your existing pages without a complete overhaul.


👤 Raed667
My go to stack is some combination of: TypeScript, React, Emotion (for styling), material-ui (component library), Next, Express (REST), chart.js, konva.js

But that's mostly because I have been using these tools over-and-over. So don't worry about it and build something first.


👤 caseyscottmckay
Spring Boot or Flask (backend) with React (frontend) and Postgresql/Elasticsearch (persistence).

👤 schappim
The folks at Shopify, Basecamp and Hey are all showing that if you care about developer ergonomics, you can still develop in Rails.

👤 rasulkireev
If you are looking to ship, then do not separate the backend and frontend too much. I'd pick Django for the backend and "sprinkle" some javascript (vanilla or stimulusjs or alpinejs) on top of the html.

The trouble of of separating frontend from backend fully is just not worth it, in my opinion.


👤 ulisesrmzroche
There’s nothing wrong with the tech you list at the bottom. They’re all solid choices right now. I think you can go ahead and start writing production code right now.

Python/Node is a very popular enterprise stack, similar in mindshare to Java/Node.

I think it’s going to be Vue vs React for a while


👤 satvikpendem
TypeScript, React and some charting library. create-react-app has the TS and React part, you just need to add the charts. With CRA, you don't really have to worry about the transpiler and so on, you just write npm run start.

👤 runawaybottle
Go with React and a charting library like Nivo. Write wrappers around Nivo so you can switch out Nivo with something else that might handle particular charts better. Don’t marry a charting library. Pick a small Redux alternative for global state management (haven’t tried Recoil, but maybe Recoil?). That will hopefully keep your frontend light and away from an industrial (too big to ever refactor, too intertwined to ever pull things out or change paradigms) codebase.

Your backend can be anything that serves up a rest api. Otherwise go graphql.


👤 thirtythree
Angular for the frontend makes the most sense to me. React and Svelte are good but you need to bring in a lot more supporting libraries for more complex libraries.

👤 atsushin
GraphQL, as far as I know, has been gaining immense popularity as of late. I've never used it in a professional capacity, but its great in that you can shape the types of API responses returned from a single endpoint -- very different from how REST does things. The ecosystem is growing pretty quick too, I've been enjoying playing around with Hasura which can generate a GraphQL API from a PostgreSQL DB you point it to.

👤 gauchojs
Since I'm doing several parts of the stack, this year I went full Typescript...

👤 1ba9115454
https://github.com/yewstack/yew

Rust web framework generating webassembly apps.

Possible stack could be

yew -> grpc -> rust backend.


👤 mrsareen
Svelte.js (svelte.dev) would be my recommendation for frontend.

👤 lol636363
You can keep backend in Django and switch frontend to Vuejs