HN Explorer

Ask HN: What technology to chose for a web app in 2020?

14 points by dr_atom ↗ HN
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?

20 comments

[ 4.1 ms ] story [ 69.9 ms ] thread
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.

happppy
I am new in Node.js (only used express). Made some basic CRUD projects. I haven't given any interview or worked on Node.js in production. Can you please tell me what things are required to be considered a good Nodejs candidate? any libraries, concepts that I should look into? I would be very thankful to you.
Raed667
First of all, CRUD projects are great to start learning kudos!

As far as the node/express route I'd say you should learn about the `req` (request) and `res` (response) objects, what information they have and what you can do with them. It would be pretty helpful to learn about how express middlewares work (they allow you to put little pieces of logic that will validate/enhance/authenticate etc..)

Express isn't the only library outthere you don't need to learn them all but its good to know they exist (hapi, koa, ...)

For node I think it is important to know how to use promises, (async/await) and some basic system libraries (such as `fs`, `path`, `os`).

After that you should probably transition form JavaScript to TypeScript (most new project will start with TypeScript today, and older ones are migrating to it).

Check starter projects, you can find a bootstrapped node js project with almost any framework you can think of, use it if it makes your life easier and later learn how to make your own project from scratch to learn the basics.

Hope you enjoy your JS journey ;)

happppy
Thanks a lot. I am mainly doing same as you said, guess I am doing fine. I need to look into `fs`, `path`, and `os` though. I have just started working with TypeScript this year and really like it, also made a small starter project in TypeScript myself, took help from online tutorials.
[deleted]
(comment deleted)
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.
caseyscottmckay
Spring Boot or Flask (backend) with React (frontend) and Postgresql/Elasticsearch (persistence).
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.

Raed667
Redux is still a very valid choice. If you don't like the setup boilerplate, you can use the official toolkit which has very sane defaults.

https://redux-toolkit.js.org/

[dead] runawaybottle
What can I say, you can’t teach people taste.
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

mrsareen
Svelte.js (svelte.dev) would be my recommendation for frontend.
schappim
The folks at Shopify, Basecamp and Hey are all showing that if you care about developer ergonomics, you can still develop in Rails.
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.
gauchojs
Since I'm doing several parts of the stack, this year I went full Typescript...
laurentl
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.

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.
lol636363
You can keep backend in Django and switch frontend to Vuejs
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.